.j-offset-top { -webkit-transition: all 750ms; -o-transition: all 750ms; -moz-transition: all 750ms; transition: all 750ms; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); -o-transform: translateY(100px); transform: translateY(100px); opacity: 0; }
.j-offset-top.run { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; }
.flex {display: flex;display:-webkit-flex;justify-content: space-between;flex-wrap: wrap}
.linkedinView { font-family: 'SourceHanSansCN';}
@media (min-width: 1660px){.container{width:1630px;}}
.banner { width: 100%;}
.banner img { width: 100%;}

.title-box { width: 100%; text-align: center;}
.title-box .title { font-family: 'SourceHanSansCNBold'; font-size: 36px; line-height: 44px; font-weight: bold; color: #333333; line-height: 52px;}
.title-box .line { display: inline-block; margin-top: 27px; width: 52px; height: 6px; background: #0077C8;}
@media (max-width: 1260px) {
  .title-box .title { font-size: 30px; line-height: 36px;}
  .title-box .line { margin-top: 20px; width: 46px; height: 5px;}
}
@media (max-width: 992px) {
  .title-box .title { margin-top: 12px; font-size: 28px; line-height: 32px;}
}
@media (max-width: 768px) {
  .title-box .title { font-size: 22px; line-height: 28px;}
  .title-box .line { margin-top: 6px; width: 40px; height: 5px;}
}

.sec1 { padding: 95px 0 108px;}
.sec1 .cont { align-items: center; margin-top: 100px;}
.sec1 .cont .left { flex: 1;}
.sec1 .cont .left .tit { font-size: 30px;font-weight: 500;color: #0077C8; line-height: 52px;}
.sec1 .cont .left .list { margin-top: 55px;}
.sec1 .cont .left .list .item { display: flex; margin-bottom: 12px;}
.sec1 .cont .left .list .item:last-child { margin-bottom: 0;}
.sec1 .cont .left .list .item .bar { padding: 0 13px;  width: 0; height: 35px; background: linear-gradient(90deg, #0077C8 0%, #0098FF 100%); border-radius: 18px; font-size: 18px;  line-height: 35px;}
.sec1 .cont .left .list .item .bar span { color: #FFFFFF;}
.sec1 .cont .left .list .item>span { margin-left: 9px; font-size: 18px; color: #333333; line-height: 35px;}
.sec1 .cont .left .list .item:nth-child(1) .bar { animation: progressAnimation1 3s ease forwards; /*width: 220px;*/}
.sec1 .cont .left .list .item:nth-child(2) .bar { animation: progressAnimation2 3s ease forwards;}
.sec1 .cont .left .list .item:nth-child(3) .bar { animation: progressAnimation3 3s ease forwards;}
.sec1 .cont .left .list .item:nth-child(4) .bar { animation: progressAnimation4 3s ease forwards;}
@keyframes progressAnimation1 { 0% { width: 0; } 100% { width: 220px;} }
@keyframes progressAnimation2 { 0% { width: 0; } 100% { width: 290px;} }
@keyframes progressAnimation3 { 0% { width: 0; } 100% { width: 250px;} }
@keyframes progressAnimation4 { 0% { width: 0; } 100% { width: 92px;} }
.sec1 .cont .left .line { margin: 60px 0 41px; width: 80px; height: 2px; border: 2px solid #FF8F1C;}
.sec1 .cont .left .text1 { font-size: 20px; font-weight: 500; color: #0077C8; line-height: 34px;}
.sec1 .cont .left .text2 { margin-top: 12px; font-size: 18px; color: #666666; line-height: 35px;}
.sec1 .cont .right { width: 72.06%; margin-top: 15px; position: relative;}
.sec1 .cont .right .bg { width: 100%;}
.sec1 .cont .right .img { margin-top: -5px; width: 45.96%; position: absolute; left: 27%;}
.sec1 .cont .right .text { font-size: 24px; font-weight: 500; width: 45.96%; color: #0077C8; position: absolute; left: 27%; top: 59.58%; text-align: center;}
.sec1 .cont .right .item { position: absolute; z-index: 2; display: flex; align-items: center; height: 48px; background: rgba(255,255,255,0.54); border: 1px solid #FFFFFF; box-shadow: 0px 0px 7px 0px rgba(11,67,109,0.11); border-radius: 24px;}
.sec1 .cont .right .item .icon { display: inline-block; width: 59px; height: 100%; background: #FFFFFF; box-shadow: 0px 0px 7px 0px rgba(11,67,109,0.11); border-radius: 23px; font-size: 31px; color: #0077C8; line-height: 48px;}
.sec1 .cont .right .item span { padding: 0 30px 0 10px; font-size: 18px; font-family: SourceHanSansCN; font-weight: 400; color: #333333; line-height: 35px;}
.sec1 .cont .right .item:nth-child(1) { right: 61.71%; top: 10.47%;}
.sec1 .cont .right .item:nth-child(2) { left: 61.71%; top: 10.47%;}
.sec1 .cont .right .item:nth-child(3) { right: 70.98%; top: 29.59%;}
.sec1 .cont .right .item:nth-child(4) { left: 69.9%; top: 29.59%;}
.sec1 .cont .right .item:nth-child(5) { right: 65.19%; top: 50%;}
.sec1 .cont .right .item:nth-child(6) { left: 64.74%; top: 50%;}
.sec1 .cont .right .item:nth-child(7) { right: 59.62%; top: 73.34%;}
.sec1 .cont .right .item:nth-child(8) { left: 59.49%; top: 73.34%;}
@media (max-width: 1660px) {
  .sec1 .cont .left .tit { font-size: 28px; line-height: 48px;}
  .sec1 .cont .left .list { margin-top: 45px;}
  .sec1 .cont .left .line { margin: 50px 0 30px;}
  .sec1 .cont .left .text2 { font-size: 16px; line-height: 32px;}
}
@media (max-width: 1460px) {
  .sec1 .cont .left .tit { font-size: 24px; line-height: 34px;}
  .sec1 .cont .left .list { margin-top: 30px;}
  .sec1 .cont .left .list .item .bar {  height: 30px; font-size: 16px; line-height: 30px;}
  .sec1 .cont .left .list .item>span { line-height: 30px;}
  @keyframes progressAnimation1 { 0% { width: 0; } 100% { width: 200px;} }
  @keyframes progressAnimation2 { 0% { width: 0; } 100% { width: 270px;} }
  @keyframes progressAnimation3 { 0% { width: 0; } 100% { width: 230px;} }
  @keyframes progressAnimation4 { 0% { width: 0; } 100% { width: 72px;} }
  .sec1 .cont .left .list .item>span { font-size: 16px; }
  .sec1 .cont .left .line { margin: 40px 0 25px;}
  .sec1 .cont .right { width: 70%;}
}
@media (max-width: 1260px) {
  .sec1 { padding: 60px 0;}
  .sec1 .cont { margin-top: 50px;}
  .sec1 .cont .left .tit { font-size: 22px; line-height: 30px;}
  .sec1 .cont .left .list { margin-top: 20px;}
  .sec1 .cont .left .list .item .bar { padding: 0 10px; height: 25px; font-size: 14px; line-height: 25px;}
  .sec1 .cont .left .list .item>span { line-height: 30px;}
  @keyframes progressAnimation1 { 0% { width: 0; } 100% { width: 120px;} }
  @keyframes progressAnimation2 { 0% { width: 0; } 100% { width: 200px;} }
  @keyframes progressAnimation3 { 0% { width: 0; } 100% { width: 180px;} }
  @keyframes progressAnimation4 { 0% { width: 0; } 100% { width: 52px;} }
  .sec1 .cont .left .list .item>span { font-size: 14px; line-height: 25px;}
  .sec1 .cont .left .line { margin: 30px 0 20px;}
  .sec1 .cont .left .text1 { font-size: 18px; line-height: 24px;}
  .sec1 .cont .left .text2 { font-size: 14px; line-height: 20px;}
  .sec1 .cont .right { width: 68%;}
  .sec1 .cont .right .item { height: 40px; }
  .sec1 .cont .right .item .icon { width: 50px; border-radius: 20px; font-size: 26px; line-height: 40px;}
  .sec1 .cont .right .item:nth-child(4) { left: 68.9%;}
  .sec1 .cont .right .item span { font-size: 14px; line-height: 20px; padding: 0 20px 0 10px;}
}
@media (max-width: 992px) {
  .sec1 .cont .left .tit { font-size: 18px; line-height: 28px;}
  .sec1 .cont .left .list .item .bar { padding: 0 5px; font-size: 12px;}
  @keyframes progressAnimation1 { 0% { width: 0; } 100% { width: 90px;} }
  @keyframes progressAnimation2 { 0% { width: 0; } 100% { width: 160px;} }
  @keyframes progressAnimation3 { 0% { width: 0; } 100% { width: 140px;} }
  @keyframes progressAnimation4 { 0% { width: 0; } 100% { width: 40px;} }
  .sec1 .cont .left .line { margin: 20px 0 15px; width: 50px;}
  .sec1 .cont .left .text1 { font-size: 16px; line-height: 20px;}
  .sec1 .cont .left .text2 { font-size: 12px; line-height: 16px;}
  .sec1 .cont .right .item span { padding: 0 5px; font-size: 12px;}
  .sec1 .cont .right .item:nth-child(1) { right: 61.71%; top: 10.47%;}
  .sec1 .cont .right .item:nth-child(2) { left: 60.71%; top: 10.47%;}
  .sec1 .cont .right .item:nth-child(3) { right: 66.98%; top: 29.59%;}
  .sec1 .cont .right .item:nth-child(4) { left: 64.9%; top: 29.59%;}
  .sec1 .cont .right .item:nth-child(5) { right: 65.19%; top: 50%;}
  .sec1 .cont .right .item:nth-child(6) { left: 63.74%; top: 50%;}
  .sec1 .cont .right .item:nth-child(7) { right: 59.62%; top: 73.34%;}
  .sec1 .cont .right .item:nth-child(8) { left: 58.89%; top: 73.34%;}
}
@media (max-width: 768px) {
  .sec1 { padding: 30px 0;}
  .sec1 .cont { margin-top: 20px;}
  .sec1 .cont .left .line { width: 40px}
  .sec1 .cont .right { width: 100%;}
  .sec1 .cont .right .img { width: 60%; left: 20%; margin-top: -7%; margin-bottom: 20px}
  .sec1 .cont .right>div { display: flex; justify-content: space-between; flex-wrap: wrap;}
  .sec1 .cont .right .item { height: 36px; position: unset; width: 48%; margin-top: 15px;}
  .sec1 .cont .right .item .icon { width: 40px; font-size: 22px; line-height: 36px}
}

.sec2 { padding: 45px 0 80px; background: linear-gradient(180deg, #F8FAFF, #D0E2FF);}
.sec2 .cont { position: relative; margin-top: 73px; font-family: 'SourceHanSansCNMedium';}
.sec2 .cont .center { width: 35.95%; margin: 0 auto; padding-bottom: 29px; text-align: center; background: url(../img/linkedin/sec2-shadow.png) no-repeat; background-size: 100% 89%; background-position: center bottom;}
.sec2 .circle { background: linear-gradient(0deg, #0077C8 0%, #0098FF 100%); border-radius: 50%; position: relative;}
.sec2 .circle::before { content: ''; width: 10px; height: 10px; background: #0077C8; border-radius: 50%; position: absolute; left: -5px; top: 50%; margin-top: -5px;}
.sec2 .circle::after { content: ''; width: 10px; height: 10px; background: #0077C8; border-radius: 50%; position: absolute; right: -5px; top: 50%; margin-top: -5px;}
.sec2 .circle:hover { background: linear-gradient(0deg, #FF9D48 0%, #FE871F 100%);}
.sec2 .circle:hover::before { content: ''; background: #ED7800;}
.sec2 .circle:hover::after { content: ''; background: #ED7800;}
.sec2 .circle .line { border-bottom: 1px dashed #0077C8;}
.sec2 .circle .line i {  color: #0077C8;}
.sec2 .circle:hover .line { border-bottom: 1px dashed #ED7800;}
.sec2 .circle:hover .line i {  color: #ED7800;}
.sec2 .circle1 { width: 100%; height: 99px; padding: 7px 40px 13px; }
.sec2 .circle1 .line { width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; bottom: -20px;}
.sec2 .circle1 .line i { position: absolute; right: 0; top: 50%; margin-top: 2px;}
.sec2 .circle1 .border { width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, 0.44); border-radius: 50%; font-family: 'SourceHanSansCNMedium'; font-size: 30px; font-weight: 500; color: #FFFFFF; display: flex; justify-content: center; align-items: center; }
.sec2 .circle2 { width: 75.3%; height: 84px; padding: 7px 40px 13px; margin: 0 auto;}
.sec2 .circle2 .border { width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, 0.44); border-radius: 50%; font-family: 'SourceHanSansCNMedium'; font-size: 30px; font-weight: 500; color: #FFFFFF; display: flex; justify-content: center; align-items: center; }
.sec2 .circle2 .line { width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; bottom: -17px;}
.sec2 .circle2 .line i { position: absolute; left: 0; top: 50%; margin-top: 2px; transform: rotateY(180deg);}
.sec2 .circle3 { width: 60%; height: 77px; padding: 7px 40px 13px; margin: 0 auto;}
.sec2 .circle3 .border { width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, 0.44); border-radius: 50%; font-family: 'SourceHanSansCNMedium'; font-size: 30px; font-weight: 500; color: #FFFFFF; display: flex; justify-content: center; align-items: center; }
.sec2 .circle3 .line { width: 100%; height: 100%; border-radius: 50%; position: absolute; left: 0; bottom: -18px;}
.sec2 .circle3 .line i { position: absolute; right: 0; top: 50%; margin-top: 2px;}
.sec2 .arrow { width: 44px; height: auto;}
.sec2 .arrow1 { margin-top: 54px; margin-bottom: 20px;}
.sec2 .arrow2 { margin-top: 52px; margin-bottom: 28px;}
.sec2 .name { font-family: 'SourceHanSansCNMedium'; font-size: 30px; font-weight: 500; color: #0077C8; line-height: 52px; position: absolute; top: -30px; }
.sec2 .name1 { left: 23.5%;}
.sec2 .name2 { right: 23.5%;}
.sec2 .item { display: flex; position: absolute;}
.sec2 .item .text { font-size: 18px; color: #333333; line-height: 26px; margin-right: 33px;}
.sec2 .item .dline { border-top: 1px dashed #333333; margin-top: 13px;}
.sec2 .item .list { width: 292px; display: flex; flex-wrap: wrap;}
.sec2 .item .list p { margin-left: 5px; margin-right: 10px; padding-left: 10px; font-size: 20px; color: #333333; line-height: 26px; position: relative;}
.sec2 .item .list p:nth-of-type(3) { min-width: 50%;}
.sec2 .item .list p::before { content: ''; width: 5px; height: 5px; background: #0077C8; border-radius: 50%; position: absolute; left: 0; top: 11px;}
.sec2 .item .dline { flex: 1;}
.sec2 .item1 { width: 29%; position: absolute; left: 1.87%; top: 37px;}
.sec2 .item2 { width: 32.5%; position: absolute; left: 3%; top: 221px;}
.sec2 .item3 { width: 31.5%; position: absolute; left: 6.81%; bottom: 54px;}
.sec2 .item4 { width: 29%; position: absolute; right: 1.87%; top: 37px;}
.sec2 .item5 { width: 32.5%; position: absolute; right: 3%; top: 221px;}
.sec2 .item6 { width: 31.5%; position: absolute; right: 6.81%; top: 400px;}
@media (max-width: 1260px) {
  .sec2 { padding: 45px 0 60px;}
  .sec2 .cont { margin-top: 50px;}
  .sec2 .cont .center { width: 30%;}
  .sec2 .circle { padding: 7px 30px 13px;}
  .sec2 .circle::before { width: 8px; height: 8px; left: -4px;}
  .sec2 .circle::after { width: 8px; height: 8px; right: -4px;}
  .sec2 .circle .border { font-size: 24px;}
  .sec2 .circle1 { height: 79px;}
  .sec2 .circle2 { height: 67px;}
  .sec2 .circle3 { height: 61px;}
  .sec2 .name { font-size: 24px; line-height: 34px; top: -20px;}
  .sec2 .item .text { font-size: 16px; line-height: 24px;}
  .sec2 .item .list p { font-size: 16px; line-height: 24px;}
  .sec2 .arrow { width: 30px;}
  .sec2 .item .list { width: 250px;}
  .sec2 .circle .line i { font-size: 14px; margin-top: 5px;}
  .sec2 .arrow { margin-top: 40px; margin-bottom: 15px;}
  .sec2 .item1 { width: 32%; left: 1.87%; top: 27px;}
  .sec2 .item2 { width: 34.5%; left: 3%; top: 168px;}
  .sec2 .item3 { width: 33.5%; left: 6.81%; top: 298px;}
  .sec2 .item4 { width: 32%; right: 1%; top: 27px;}
  .sec2 .item5 { width: 35.5%; right: 2%; top: 168px;}
  .sec2 .item6 { width: 34.5%; right: 5%; top: 298px;}
}
@media (max-width: 992px) {
  .sec2 .circle { padding: 5px 20px 8px;}
  .sec2 .circle1 { height: 60px;}
  .sec2 .circle2 { height: 50px;}
  .sec2 .circle3 { height: 46px;}
  .sec2 .circle1 .line { bottom: -10px;}
  .sec2 .circle2 .line { bottom: -10px;}
  .sec2 .circle3 .line { bottom: -10px;}
  .sec2 .circle .border { font-size: 18px;}
  .sec2 .item .dline { margin-top: 9px;}
  .sec2 .name { font-size: 18px;}
  .sec2 .arrow { width: 20px;}
  .sec2 .item .list { width: 200px;}
  .sec2 .item .text { font-size: 12px; line-height: 16px; margin-right: 10px;}
  .sec2 .item .list p { font-size: 12px; line-height: 16px;}
  .sec2 .item .list p::before { top: 6px;}
  .sec2 .item1 { width: 32%; left: 1.87%; top: 19px;}
  .sec2 .item2 { width: 34.5%; left: 3%; top: 138px;}
  .sec2 .item3 { width: 32.5%; left: 6.81%; top: 250px;}
  .sec2 .item4 { width: 32%; right: 1%; top: 19px;}
  .sec2 .item5 { width: 35.5%; right: 2%; top: 138px;}
  .sec2 .item6 { width: 34.5%; right: 5%; top: 250px;}
}
@media (max-width: 768px) {
  .sec2 { padding: 30px 0;}
  .sec2 .cont .center { padding-bottom: 20px;}
  .sec2 .circle::before { width: 5px; height: 5px; left: -2px;}
  .sec2 .circle::after { width: 5px; height: 5px; right: -2px;}
  .sec2 .name { font-size: 14px;}
  .sec2 .circle { padding: 5px 10px 8px;}
  .sec2 .circle .border { font-size: 14px;}
  .sec2 .circle .line i { font-size: 12px;}
  .sec2 .circle1 { height: 50px;}
  .sec2 .circle2 { height: 40px;}
  .sec2 .circle3 { height: 36px;}
  .sec2 .arrow { width: 15px; margin-top: 25px; margin-bottom: 10px;}
  .sec2 .item .text { max-width: 60%; margin-right: 5px;}
  .sec2 .item .list { width: 100px;}
  .sec2 .item .list p { width: 100%;}
  .sec2 .item1 { width: 32%; left: 1.87%; top: 15px;}
  .sec2 .item2 { width: 34.5%; left: 3%; top: 101px;}
  .sec2 .item3 { width: 32.5%; left: 6.81%; top: 181px;}
  .sec2 .item4 { width: 32%; right: 1%; top: 15px;}
  .sec2 .item5 { width: 35.5%; right: 2%; top: 101px;}
  .sec2 .item6 { width: 34.5%; right: 5%; top: 181px;}
}

.sec3 { padding: 63px 0 110px; background: #F6F7FB;}
.sec3 .cont { margin-top: 75px; justify-content: flex-start;}
.sec3 .cont .navleft { margin-left: -80px; display: flex; flex-direction: column; align-items: flex-start; padding-top: 74px; padding-right: 99px;}
.sec3 .cont .navleft p { margin-bottom: 31px; padding: 0 10px; min-width: 165px; background: #0079D2; border-radius: 17px; font-size: 16px; color: #FFFFFF; line-height: 27px; text-align: center; display: flex; justify-content: center; align-items: center; cursor: pointer;}
.sec3 .cont .navleft p em { display: none; width: 11px; height: 11px; background: #FFFFFF; border-radius: 50%; margin-right: 22px;}
.sec3 .cont .navleft p.active { padding: 0 27px 0 10px; background: #FF8F1C; height: 33px; font-size: 20px; line-height: 33px;}
.sec3 .cont .navleft p.active em { display: inline-block; }
.sec3 .cont .swiper-wrap { flex: 1; height: 560px;}
.sec3 .cont .swiper-wrap .swiper { width: 100%; height: 100%;}
.sec3 .cont .swiper-wrap .swiper-slide { text-align: center; font-size: 18px; background: #F6F7FB; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: flex-start; align-items: flex-start;}
.sec3 .cont .slide-item { width: 100%; height: 100%; align-items: center;}
.sec3 .cont .left { text-align: left; padding-right: 40px;}
.sec3 .cont .left .tit { display: inline-block; padding: 5px 22px; background: #0079D2; border-radius: 21px; font-size: 30px; font-weight: 500; color: #FFFFFF; line-height: 32px;}
.sec3 .cont .left .stit { margin-top: 30px; font-family: 'SourceHanSansCNMedium'; font-size: 24px; font-weight: 500; color: #333333; line-height: 30px;}
.sec3 .cont .left .desc { margin-top: 20px; font-size: 18px; color: #666666; line-height: 35px;}
.sec3 .cont .right { flex: 1; text-align: right;}
.sec3 .cont .right img { max-width: 100%;}
.sec3 .cont .slide-item1 { height: auto;}
.sec3 .cont .slide-item2 .left { margin-top: -40px;}
.sec3 .cont .slide-item2 .right img { margin-right: -10%;}
.sec3 .cont .slide-item2 .list { margin-top: 36px;}
.sec3 .cont .slide-item2 .list .litem { display: flex; margin-bottom: 42px;}
.sec3 .cont .slide-item2 .list .litem img { width: 65px; height: 65px; margin-right: 17px;}
.sec3 .cont .slide-item2 .list .litem .text { flex: 1}
.sec3 .cont .slide-item2 .list .litem .text p { font-size: 24px; color: #333333; line-height: 30px;}
.sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(1) { font-family: 'SourceHanSansCNMedium';}
.sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(2) { margin-top: 14px; font-size: 18px; color: #666666; line-height: 22px;}
.sec3 .cont .slide-item5 .left { width: 52.92%;}
.sec3 .cont .slide-item5 .list { margin-top: 36px; display: flex; flex-wrap: wrap;}
.sec3 .cont .slide-item5 .list .litem { width: 40%; margin-bottom: 42px; text-align: center;}
.sec3 .cont .slide-item5 .list .litem img { width: 72px; height: 72px; margin-right: 17px;}
.sec3 .cont .slide-item5 .list .litem .text p { font-size: 18px; color: #333333; line-height: 22px;}
.sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(1) { margin-top: 24px; font-family: 'SourceHanSansCNMedium';}
.sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(2) { margin-top: 18px; color: #666666;}
.sec3 .cont .slide-item5 .list .litem:nth-of-type(2) { width: 60%;}
.sec3 .cont .slide-item5 .list .litem:nth-of-type(4) { width: 60%;}
@media (max-width: 1760px) {
  .sec3 .cont .navleft { margin-left: 0;}
}
@media (max-width: 1660px) {
  .sec3 .cont .navleft { padding-top: 50px;}
  .sec3 .cont .swiper-wrap { height: 500px;}
  .sec3 .cont .left .tit { font-size: 26px; line-height: 28px;}
  .sec3 .cont .left .stit { font-size: 20px;}
  .sec3 .cont .left .desc { font-size: 16px; line-height: 30px;}
  .sec3 .cont .slide-item2 .list .litem { margin-bottom: 30px;}
  .sec3 .cont .slide-item2 .list .litem img { width: 50px; height: 50px; margin-right: 12px;}
  .sec3 .cont .slide-item2 .list .litem .text p { font-size: 20px; line-height: 24px;}
  .sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(2) { margin-top: 10px; font-size: 16px; line-height: 20px;}
  .sec3 .cont .slide-item5 .list { margin-top: 30px;}
  .sec3 .cont .slide-item5 .list .litem { width: 50%; margin-bottom: 30px;}
  .sec3 .cont .slide-item5 .list .litem img { width: 60px; height: 60px; margin-right: 12px;}
  .sec3 .cont .slide-item5 .list .litem .text p { font-size: 16px; line-height: 20px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(1) { margin-top: 20px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(2) { margin-top: 15px;}
  .sec3 .cont .slide-item5 .list .litem:nth-of-type(2) { width: 50%;}
  .sec3 .cont .slide-item5 .list .litem:nth-of-type(4) { width: 50%;}
}
@media (max-width: 1460px) {
  .sec3 .cont .swiper-wrap { height: 450px;}
  .sec3 .cont .slide-item1 { height: 100%;}
  .sec3 .cont .left { padding-right: 20px;}
  .sec3 .cont .left .tit { font-size: 22px; line-height: 24px;}
  .sec3 .cont .left .stit { font-size: 18px;}
  .sec3 .cont .left .desc { font-size: 14px; line-height: 18px;}
  .sec3 .cont .slide-item2 .list .litem { margin-bottom: 25px;}
  .sec3 .cont .slide-item2 .list .litem img { margin-right: 12px;}
  .sec3 .cont .slide-item2 .list .litem .text p { font-size: 18px; line-height: 24px;}
  .sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(2) { margin-top: 10px; font-size: 14px; line-height: 20px;}
  .sec3 .cont .slide-item5 .list .litem .text p { font-size: 14px; line-height: 18px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(1) { margin-top: 15px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(2) { margin-top: 10px;}
}
@media (max-width: 1260px) {
  .sec3 { padding: 60px 0;}
  .sec3 .cont { margin-top: 50px;}
  .sec3 .cont .left .stit { font-size: 18px;}
  .sec3 .cont .left .desc { font-size: 14px; line-height: 24px;}
  .sec3 .cont .slide-item2 .list .litem { margin-bottom: 20px;}
  .sec3 .cont .slide-item2 .list .litem img { width: 40px; height: 40px; margin-right: 10px;}
  .sec3 .cont .slide-item2 .list .litem .text p { font-size: 18px; line-height: 24px;}
  .sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(2) { margin-top: 10px; font-size: 14px; line-height: 20px;}
  .sec3 .cont .slide-item5 .list .litem .text p { font-size: 14px; line-height: 18px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(1) { margin-top: 15px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(2) { margin-top: 10px;}
}
@media (max-width: 992px) {
  .sec3 .cont .swiper-wrap { height: 360px;}
  .sec3 .cont { margin-top: 30px;}
  .sec3 .cont .navleft { padding-right: 20px;}
  .sec3 .cont .navleft p { margin-bottom: 20px; min-width: 125px; height: 27px; border-radius: 17px; font-size: 14px;}
  .sec3 .cont .navleft p em { width: 8px; height: 8px; margin-right: 10px;}
  .sec3 .cont .navleft p.active { padding: 0 20px 0 10px;  height: 30px; font-size: 16px; line-height: 30px;}
  .sec3 .cont .left { max-width: 62%;}
  .sec3 .cont .left .tit { font-size: 16px; line-height: 18px;}
  .sec3 .cont .left .stit { margin-top: 20px; font-size: 16px;}
  .sec3 .cont .left .desc { margin-top: 10px; font-size: 12px; line-height: 18px;}
  .sec3 .cont .slide-item2 .list { margin-top: 25px;}
  .sec3 .cont .slide-item2 .list .litem .text p { font-size: 14px; line-height: 18px;}
  .sec3 .cont .slide-item2 .list .litem .text p:nth-of-type(2) { margin-top: 6px; font-size: 12px; line-height: 16px;}
  .sec3 .cont .slide-item5 .list { margin-top: 20px;}
  .sec3 .cont .slide-item5 .list .litem { margin-bottom: 15px;}
  .sec3 .cont .slide-item5 .list .litem img { width: 42px; height: 42px; margin-right: 10px;}
  .sec3 .cont .slide-item5 .list .litem .text p { margin-top: 5px; font-size: 12px; line-height: 16px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(1) { margin-top: 10px;}
  .sec3 .cont .slide-item5 .list .litem .text p:nth-of-type(2) { margin-top: 5px;}
}
@media (max-width: 768px) {
  .sec3 { padding: 30px 0;}
  .sec3 .cont .navleft { display: none;}
  .sec3 .cont .swiper-wrap { flex: unset; width: 100%; height: auto;}
  .sec3 .cont .swiper-wrap .swiper { height: auto;}
  .sec3 .cont .swiper-wrap .swiper-slide { height: auto !important;}
  .sec3 .cont .slide-item { flex-direction: column; padding-bottom: 20px;}
  .sec3 .cont .left { max-width: 100%; margin-bottom: 20px; width: 100% !important;}
  .sec3 .cont .right { flex: unset; width: 100%;}
  .sec3 .cont .slide-item2 .left { margin-top: 0;}
}

.sec4 { padding: 100px 0 143px; background: url(../img/linkedin/sec4-bg.png) 100%; background-size: cover; position: relative;}
.sec4::before { content: ''; width: 100%; height: 100%; background: rgba(0, 119, 200, 0.9); position: absolute; top: 0; left: 0; z-index: 1;}
.sec4>div { position: relative; z-index: 2;}
.sec4 .title-box .title { color: #ffffff;}
.sec4 .title-box .line { background: #ffffff;}
.sec4 .cont { margin-top: 81px; align-items: center;}
.sec4 .cont .item { width: 24.74%; padding: 57px 30px 60px; background: url(../img/linkedin/sec4-img1.png) no-repeat; background-size: 100% 100%;}
.sec4 .cont .item:hover { background: url(../img/linkedin/sec4-img2.png) no-repeat; background-size: 100% 100%;}
.sec4 .cont .item .name { font-size: 30px; font-weight: 500; color: #FFFFFF; line-height: 40px;}
.sec4 .cont .item .desc { margin-top: 28px; font-size: 18px; color: #FFFFFF; line-height: 35px;}
.sec4 .cont .item:hover .name { color: #0079D2;}
.sec4 .cont .item:hover .desc { color: #0079D2;}
.sec4 .cont .arrow { flex: 1; text-align: center;}
@media (max-width: 1660px) {
  .sec4 .cont .item { padding: 50px 25px;}
  .sec4 .cont .arrow img { width: 110px;}
}
@media (max-width: 1460px) {
  .sec4 .cont .item { padding: 50px 15px;}
  .sec4 .cont .item .name { font-size: 24px; line-height: 34px;}
  .sec4 .cont .item .desc { margin-top: 20px; font-size: 16px; line-height: 30px;}
  .sec4 .cont .arrow img { width: 90px;}
}
@media (max-width: 1260px) {
  .sec4 { padding: 90px 0;}
  .sec4 .cont { margin-top: 50px;}
  .sec4 .cont .item { padding: 40px 15px;}
  .sec4 .cont .item .name { font-size: 22px; line-height: 30px;}
  .sec4 .cont .item .desc { margin-top: 15px; font-size: 14px; line-height: 24px;}
  .sec4 .cont .arrow img { width: 65px;}
}
@media (max-width: 992px) {
  .sec4 { padding: 60px 0;}
  .sec4 .cont .item { padding: 30px 10px;}
  .sec4 .cont .item .name { font-size: 18px; line-height: 24px;}
  .sec4 .cont .item .desc { margin-top: 10px; font-size: 12px; line-height: 18px;}
}
@media (max-width: 768px) {
  .sec4 .cont { margin-top: 20px;}
  .sec4 .cont .item { width: 100%; padding: 50px 30px; margin-bottom: 15px;}
  .sec4 .cont .item:last-child { margin-bottom: 0;}
}

.sec5 { padding: 135px 0 140px 0;}
.sec5 .cont { margin-top: 100px;}
.sec5 .cont .item { flex: 1; text-align: center;}
.sec5 .cont .item .icon {margin: 0 auto; width: 135px; height: 135px; background: linear-gradient(0deg, #8FC1FE 0%, #D9EBFF 100%); border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 76px; color: #0079D2;}
.sec5 .cont .item .icon:hover { background: #FF8F1C; color: #ffffff;}
.sec5 .cont .item .img { margin: 0 auto; width: 135px; height: 135px; background-blend-mode: lighten; background-size: cover;}
.sec5 .cont .item img { filter: hue-rotate(90deg);}
.sec5 .cont .item .icon img { filter: hue-rotate(90deg);}
.sec5 .cont .item .step { margin-top: 23px; font-size: 18px; color: #666666; line-height: 1;}
.sec5 .cont .item .name { margin-top: 12px; font-size: 24px; font-weight: 500; color: #333333; line-height: 30px; white-space: nowrap;}
.sec5 .cont .arrow { margin-top: 52px;}
.sec5 .cont .icon-linkedin-bulb::before { display: inline-block; transform: rotateY(180deg);}
@media (max-width: 1660px) {
  .sec5 .cont .item .step { font-size: 16px;}
  .sec5 .cont .item .name { font-size: 20px;}
}
@media (max-width: 1460px) {
  .sec5 .cont .arrow img { width: 60px;}
}
@media (max-width: 1260px) {
  .sec5 { padding: 60px 0;}
  .sec5 .cont { margin-top: 40px;}
  .sec5 .cont .item .icon { width: 100px; height: 100px; font-size: 60px;}
  .sec5 .cont .item .step { margin-top: 20px; font-size: 14px;}
  .sec5 .cont .item .name { margin-top: 10px; font-size: 18px; line-height: 22px;}
  .sec5 .cont .arrow { margin-top: 42px;}
  .sec5 .cont .arrow img { width: 50px;}
}
@media (max-width: 992px) {
  .sec5 .cont .item .icon { width: 80px; height: 80px; font-size: 50px;}
  .sec5 .cont .item .step { margin-top: 15px; font-size: 12px;}
  .sec5 .cont .item .name { margin-top: 7px; font-size: 16px; line-height: 20px;}
  .sec5 .cont .arrow { margin-top: 32px;}
  .sec5 .cont .arrow img { width: 40px;}
}
@media (max-width: 768px) {
  .sec5 { padding: 30px 0;}
  .sec5 .cont { flex-direction: column; justify-content: flex-start; margin-top: 20px;}
  .sec5 .cont .item { display: flex; align-items: center;}
  .sec5 .cont .item .icon { margin: 0; margin-right: 10px; width: 50px; height: 50px; font-size: 30px;}
  .sec5 .cont .item .step { margin-top: 0; margin-right: 10px;}
  .sec5 .cont .item .name { margin-top: 0;}
  .sec5 .cont .arrow { margin: 15px 0; margin-left: 5px;}
  .sec5 .cont .arrow img { transform: rotate(90deg); }
}

.sec6 { padding-bottom: 151px;}
.sec6 .cont { margin-top: 102px; align-items: center;}
.sec6 .left { flex: 1; padding-right: 15px;}
.sec6 .left .list { padding-right: 15px;}
.sec6 .left .list .name { font-family: 'SourceHanSansCNMedium'; font-size: 30px; font-weight: 500; color: #333333; line-height: 40px;}
.sec6 .left .list .desc { margin-top: 22px; font-size: 18px; color: #666666; line-height: 35px;}
.sec6 .left .list .item+.item { margin-top: 85px;}
.sec6 .right { width: 50%; overflow: hidden;}
.sec6 .right img { width: 100%; transition: 0.3s;}
.sec6 .right img:hover { transform: scale(1.1);}
@media (max-width: 1660px) {
  .sec6 .left .list .item+.item { margin-top: 55px;}
  .sec6 .left .list .name { font-size: 28px; line-height: 38px;}
  .sec6 .left .list .desc { font-size: 16px; line-height: 32px;}
}
@media (max-width: 1460px) {
  .sec6 { padding-bottom: 120px;}
  .sec6 .left .list .item+.item { margin-top: 40px;}
  .sec6 .left .list .name { font-size: 24px; line-height: 34px;}
  .sec6 .left .list .desc { margin-top: 16px;}
}
@media (max-width: 1260px) {
  .sec6 { padding-bottom: 60px;}
  .sec6 .cont { margin-top: 50px;}
}
@media (max-width: 992px) {
  .sec6 .left .list .name { font-size: 18px; line-height: 24px;}
  .sec6 .left .list .desc { margin-top: 10px; font-size: 14px; line-height: 20px;}
  .sec6 .left .list .item+.item { margin-top: 20px;}
}
@media (max-width: 768px) {
  .sec6 { padding-bottom: 30px;}
  .sec6 .cont { margin-top: 20px;}
  .sec6 .left { width: 100%; flex: unset; padding-right: 0;}
  .sec6 .left .list .name { font-size: 16px; line-height: 22px;}
  .sec6 .left .list .desc { font-size: 12px; line-height: 18px;}
  .sec6 .left .list .item+.item { margin-top: 15px;}
  .sec6 .right { width: 100%;  margin-top: 15px;}
  .sec6 .right img:hover { transform: scale(1);}
}

.brand-form { padding: 111px 0; background: #0077C8; font-family: Microsoft YaHei;}
.brand-form .title { text-align: center;}
.brand-form .title p { margin-top: -44px; font-size: 48px; color: #FFFFFF; font-weight: normal;}
.brand-form .s-title { font-size: 16px; color: #FFFFFF; margin-top: 20px; text-align: center; line-height: 20px;}
.brand-form .form-box { margin-top: 40px; padding: 0 140px;}
.brand-form .form-box .item-box { flex: 1;}
.brand-form .form-box .item { border-bottom: 1px solid #FFFFFF; padding: 10px 0; margin-right: 20px;}
.brand-form .form-box .item img { float: left; margin-top: 6px; margin-right: 6px;}
.brand-form .form-box .item span { font-size: 16px; color: #FFFFFF; line-height: 30px;}
.brand-form .form-box .item input { width: calc(100% - 108px); font-size: 16px; color: #FFFFFF; line-height: 30px;}
.brand-form .form-box .btn { margin-left: 10px; display: inline-block; width: 141px;height: 52px;background: #FFFFFF;border-radius: 26px;font-size: 16px;color: #333333; line-height: 52px; text-align: center;}
.brand-form .form-box .btn:hover { opacity: 0.8;;}
@media (max-width: 1460px) {
  .brand-form .title img { width: 500px;}
  .brand-form .title p { margin-top: -32px; font-size: 40px; line-height: 46px;}
}
@media screen and (max-width: 1260px) {
  .brand-form { padding: 60px 0;}
  .brand-form .title img { width: 400px;}
  .brand-form .title p { margin-top: -32px; font-size: 30px; line-height: 36px;}
  .brand-form .form-box { padding: 0;}
  .brand-form .form-box .item { padding: 5px 0;}
  .brand-form .form-box .btn { width: 110px; height: 40px;line-height: 40px;}
}
@media screen and (max-width: 992px) {
  .brand-form { padding: 80px 0;}
  .brand-form .title img { width: 300px;}
  .brand-form .title p { margin-top: -25px; font-size: 28px; line-height: 34px;}
  .brand-form .form-box { margin-top: 30px;}
}
@media screen and (max-width: 767px) {
  .brand-form { padding: 50px 0;}
  .brand-form .title p { font-size: 24px; line-height: 30px;}
  .brand-form .s-title { font-size: 14px; margin-top: 15px;}
  .brand-form .form-box .item-box { flex: unset; width: 100%; margin-bottom: 10px;}
  .brand-form .form-box .item { width: 100%; margin-right: 0;}
  .brand-form .form-box .item img { width: 20px; height: auto;}
  .brand-form .form-box .item.item-email img { margin-top: 8px;}
  .brand-form .form-box .item span { font-size: 12px;}
  .brand-form .form-box .btn { display: block; width: 100%; margin-top: 20px; margin-left: 0; height: 36px; font-size: 14px;}
}

@font-face {
  font-family: 'SourceHanSansCN';
  src: url('../font/SourceHanSansCN-Regular.otf') format('opentype');
}
@font-face {
  font-family: 'SourceHanSansCNMedium';
  src: url('../font/SourceHanSansCN-Medium.otf') format('opentype');
}
@font-face {
  font-family: 'SourceHanSansCNBold';
  src: url('../font/SourceHanSansCN-Bold.otf') format('opentype');
}