.all-banner{
    height: 34.8rem;
    position: relative;
    margin-bottom: 12rem;
    background-size: cover !important;
}
.all-banner::after{
    content: '';
    width: 100%;
    height: 82px;
    position: absolute;
    background: rgba(255, 255, 255, 0.8);
    top: 0;
    left: 0;
    backdrop-filter: blur(7px);
}
.about-banner::after{
    background: rgba(255, 255, 255, 0.5);
}
.all-banner::before{
    /* content: ''; */
    width: 100%;
    height: 100%;
    background: url(../img/about-bf.png) no-repeat bottom center;
    background-size: 75% auto;
    background-repeat-x: repeat;
    position: absolute;
    bottom: -5rem;
    left: 0;
    z-index: -1;
    background-position-x: -12vw;
    /* -webkit-animation: scroll 8s linear infinite; */
}
@-webkit-keyframes scroll{
    from{
        background-position-x: -28vw;
    }
    to{
        background-position-x: 70vw;
    }
}
.all-banner .content{
    position: relative;
    height: 100%;
}
.all-banner .banner-text{
    position: absolute;
    bottom: 5.5rem;
    text-align: right;
    color: white;
    right: 220px;
}
.all-banner h1{
    font-size: 40px;
    letter-spacing: 5px;
    position: relative;
    font-weight: 700;
    padding-left: 2.8rem;
    display: inline-block;
}
.all-banner h1::before{
    content: '';
    width: 11px;
    height: 2.4rem;
    background-color: white;
    position: absolute;
    top: 10px;
    left: 0;
}
.about-intro{
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 280px;
    padding-right: 280px;
    margin-bottom: 22rem;
    position: relative;
}
.about-intro p{
    margin-bottom: 3rem;
    font-size: 16px;
    line-height: 2.1rem;
    font-weight: 500;
}
/* .about-intro span.big-circle{
    transform: translateX(-50%);
} */
p strong{
    font-weight: 500;
    display: inline-block;
    margin-top: -4px;
    font-size: 22px;
    color: #008AD8;
    vertical-align: middle;
}
/* .circle-bg{
    position: relative;
    overflow: hidden;
}
.circle-bg::before{
    content: '';
    width: 100%;
    height: 50vw;
    background: url(../img/circle-bg.png) no-repeat center;
    background-size: contain;
    position: absolute;
    bottom: 0;
    right: 0;
} */
.about-mission h2{
    margin-bottom: 4rem;
    font-size: 26px;
    max-width: 1100px;
}
.about-mission>p{
    max-width: 51rem;
    margin: 0 auto;
    font-size: 18px;
    margin-bottom: 11rem;
    line-height: 2rem;
}
.about-mission{
    max-width: 1200px; 
    margin-bottom: 170px;
}
ul.mission-list li{
    flex-basis: 49%;
    position: relative;
    border: 8px solid #eaeff538;
    border-radius: 1.5rem;
    height: 180px;
    overflow: hidden;
    background: #eaeff538;
    margin-bottom: 1.2rem;
    transition: 0.7s all ease;
    transform-origin: right bottom;
    padding: 0 121px;
    box-shadow: 0 14px 65px #00000017;
    transform: translate(-100px,-100px);
    opacity: 0;
}
ul.mission-list li:nth-of-type(2){
    transform: translate(100px,-100px);
}
ul.mission-list li:nth-of-type(3){
    transform: translate(-100px,100px);
}
ul.mission-list li:nth-of-type(4){
    transform: translate(100px,100px);
}
ul.mission-list li.active{
    transform: translate(0px,0px);
    opacity: 1;
}
ul.mission-list li:nth-child(2){
    transform-origin: left bottom;
}
ul.mission-list li:nth-child(3){
    transform-origin: right top;
}
ul.mission-list li:nth-child(4){
    transform-origin: left top;
}
ul.mission-list li span{
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    background-size: cover !important;
    top: 0;
    left: 0;
    border-radius: 0.8rem;
    /* z-index: 1;
    opacity: .5; */
}
ul.mission-list li::before{
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(278.26deg, #008AD8 5%, #41B6D5 85.17%);
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 0.8rem;
    opacity: 0;
    transition: 0.3s all ease;
    z-index: 1;
}
ul.mission-list li p{
    position: relative;
    z-index: 2;
    font-size: 16px;
    transition: 0.3s all ease;
    font-weight: 600;
    line-height: 1.8rem;
    text-align: center;
}
/* ul.mission-list li:first-child p{ */
    /* color: white;
    font-size: 1.45rem;
    font-weight: 500; */
/* } */
/* ul.mission-list li:first-child{
    transform: scale(1.13) translateY(10px);
    border: 1.4rem solid #ffffff7d;
    background-color: #ffffff7d;
} */

/* ul.mission-list li:first-child::before {
    opacity: 0.7;
} */
ul.develop-list li span{
    display: inline-block;
    width: 100%;
    height: 12rem;
    background-size: contain !important;
    transition: 0.4s all ease;
}
/* ul.develop-list li:hover span{
    transform: perspective(4000px) rotateY(-180deg);
} */
ul.develop-list li:nth-child(2) span{
    transform: scale(1.25);
}
ul.develop-list li {
    margin: 0 5.5%;
    text-align: center;
    width: 20%;
}
ul.develop-list li p {
    color: #008AD8;
    font-size: 22px;
    margin-top: 0rem;
    font-weight: 500;
    line-height: 2rem;
}
ul.develop-list li:nth-of-type(2) p{
    padding: 0 10px;
}
ul.develop-list {
    margin: 4rem 0 8.5rem;
}
.about-develop>p{
    font-size: 22px;
    padding: 45px 18%;
    width: 95%;
    margin: 0 auto;
    line-height: 1.9rem;
    box-shadow: 0px 20px 60px #008ad8b8;
    border-radius: 2rem;
    background-color: #ffffffbd;
}
.page-template-about .all-bg{
    z-index: 1;
    pointer-events: none;
}
.about-develop span.circle2{
    bottom: -14rem;
    right: -11%;
}
.about-develop{
    margin-bottom: 16rem;
    position: relative;
}
span.circle2{
    width: 207px;
    height: 207px;
    border-radius: 50%;
    background-image: linear-gradient(to left top,#008AD8, #41B6D5);
    background-size: contain;
    position: absolute;
    bottom: -17.7rem;
    right: -12%;
    opacity: .3;
    transition: 1s all ease;
}
.swiper-team li{
    padding: 5rem 0 0;
    color: white;
}
.swiper-team li .fadeInDown{
    width: 33%;
    margin-right: 1%;
}
.swiper-team li .img{
    width: 100%;
    height: 385px;
    border-radius: 3.9rem;
    overflow: hidden;
    background-image: linear-gradient(to right top,#8B8B8B,#BFBFBF, #FEFEFE, #FEFEFE,#BFBFBF,#CBCBCB);
    box-shadow: 0 0 10px rgb(0, 0, 0,.05);
    margin-top: -7rem;
    transition: 1.2s all ease;
    margin-left: -1rem;
}
.swiper-team li .img span{
    background-size: cover !important;
}
.swiper-team li .mess{
    flex: 1;
}
.swiper-team li p.name{
    font-weight: 500;
    font-size: 26px;
    line-height: 50px;
    padding-bottom: 0.2rem;
    border-bottom: 3px solid #ffffff85;
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    flex-flow: wrap;
    column-gap: 30px;
}
.swiper-team li span.position{
    font-size: 17px;
    line-height: 34px;
    color: #E2F3FF;
    font-weight: normal;
    margin: 0 95px 0 30px;
    margin-left: unset;
}
.swiper-team li .mess>div>p{
    font-size: 17px;
    line-height: 1.7rem;
    margin-bottom: 1.5rem;
    text-align: justify;
}
.swiper-team li .mess>div>p strong{
    color: white;
    font-size: 17px;
    font-weight: 500;
    vertical-align: baseline;
}
.about-team h2{
    margin-bottom: 2rem;
}
.about-team h2.content.small{
    max-width: 1100px;
}
.swiper-team{
    overflow: hidden;
    padding: 7rem 0 0 2rem;
    max-width: 1200px;
}
.content.small{
    max-width: 1200px;
}
.about-team{
    position: relative;
    padding-bottom: 7.5rem;
    margin-bottom: 10rem;
    /* overflow: hidden; */
    padding-top: 7.5rem;
}
.about-team::before, .about-team span.bg{
    /* content: ''; */
    display: block;
    width: 1400px;
    height: 54%;
    background-image: linear-gradient(to left,#41B6D5,#008AD8);
    bottom: 7rem;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}
.about-team span.bg-white{
    /* content: ''; */
    display: block;
    width: 1435px;
    height: 49%;
    background: rgba(255, 255, 255, 0.4);
    bottom: 6rem;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}
.swiper-team .swiper-pagination .swiper-pagination-bullet{
    width: 19px;
    height: 19px;
    background: #A6CBEB;
    box-shadow: none;
}
.swiper-team .swiper-pagination .swiper-pagination-bullet-active{
    background-image: linear-gradient(to left top,#41B6D5, #323F5D);
}
.about-team span.big-circle{
    width: 578px;
    height: 578px;
    min-width: unset;
    min-height: unset;
    top: 7rem;
    right: 7%;
}
.about-content .about-intro span.big-circle{
    width: 1000px;
    height: 1000px;
    min-height: 1000px;
    min-width: 1000px;
    right: 105px;
    top: -27rem;
}
.about-content .about-intro span.big-circle:after{
    width: 260px;
    height: 260px;
    right: -3%;
    bottom: 3rem;
    opacity: 1;
}
.about-content .about-intro span.big-circle::before{
    width: 100px;
    height: 100px;
    bottom: 16.5rem;
    left: -2%;
    background-image: linear-gradient(197.96deg, #E2F3FF 5.04%, #228AEA 95.05%), linear-gradient(138.31deg, #E3F2FF 9.8%, #41B6D5 81.78%);;
}
.about-team span.circle2{
    width: 493px;
    height: 493px;
    bottom: -11.4rem;
    opacity: .5;
    right: unset;
    left: -12%;
    z-index: -1;
    background: linear-gradient(to right bottom,#8cc2f4ad,#8cc2f4);
    opacity: 1;
}
.about-global .map{
    position: relative;
    /* overflow-y: hidden; */
}
.about-global .content.small{
    max-width: 1100px;
}
.about-global img{
    max-width: 100%;
    width: 100%;
}
.about-global h2{
    margin-bottom: 3.5rem;
}
.about-global .content>p{
    color: #595959;
    padding-right: 9%;
    font-size: 17px;
    line-height: 2.2rem;
}
.about-global div.map-address>div{
    position: absolute;
    top: 14%;
    left: 8%;
    transition: 0.3s all ease;
}
.about-global div.map-address>div.malilan, .about-global div.map-address>div.malilan-1, .about-global div.map-address>div.maryland{
    top: 8%;
    left: 34%;
}
.about-global div.map-address>div.beijing, .about-global div.map-address>div.beijing-1, .about-global div.map-address>div.beijing-2{
    top: 12%;
    left: unset;
    right: 10%;
}
.about-global div.map-address>div.suzhou, .about-global div.map-address>div.suzhou-1, .about-global div.map-address>div.suzhou-2{
    top: 43.5%;
    left: unset;
    right: 28%;
}
.about-global div.map-address>div.guangzhou, .about-global div.map-address>div.guangzhou-1, .about-global div.map-address>div.guangzhou-2{
    top: 60%;
    left: unset;
    right: -3%;
}
.about-global div.map-address>div.shanghai, .about-global div.map-address>div.shanghai-1, .about-global div.map-address>div.shanghai-2{
    top: -10%;
    left: unset;
    right: -14.5%;
}
.about-global div.map-address>div>div{
    background: #ffffffcf;
    padding: 1rem 1.5rem;
    border-radius: 0.7rem;
    border: 5px solid #ffffff14;
    color: #397594;
    position: relative;
    transition: transform 0.45s cubic-bezier(0.34, 1.6, 0.7, 1);
    /* transform: scale(0); */
    opacity: 0.6;
    width: 250px;
}
.about-global div.map-address>div.active>div{
    /* transform: scale(1); */
    opacity: 1;
}
.about-global div.map-address>div.active:before{
    opacity: 1;
}
.about-global div.map-address>div.hide>div{
    /* transform: scale(0); */
    opacity: 0.6;
}
.about-global div.map-address>div.no-content>div{
    opacity: 0 !important;
    min-height: 167px;
    min-width: 269px;
    padding: 0;
    transform: scale(0) !important;
    visibility: hidden;
}
.about-global div.map-address>div.no-content:before{
    display: none;
}
.about-global div.map-address>div.hide:before{
    opacity: 0.6;
}
.about-global div.map-address>div::before{
    content: '';
    width: 104.5%;
    height: 107%;
    background-image: linear-gradient(to right top,#41b5d53b,#ffffff29);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
    border-radius: 1rem;
    transition: 0.3s all ease;
    opacity: 0;
    transform-origin: left top;
}
.about-global div.map-address>div>div p{
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 1.1rem;
    line-height: 20px;
}
.about-global div.map-address ul li{
    font-size: 12px;
    padding-left: 1rem;
    position: relative;
    margin-bottom: 0.5rem;
}
.about-global div.map-address ul li::before{
    content: '';
    width: 4px;
    height: 4px;
    background-color: #397594;
    border-radius: 50%;
    position: absolute;
    top: 7px;
    left: 2px;
}
.about-global div.map-address .jiujinshan span.name{
    transform: translate(90px,10px);
}
.about-global div.map-address span.name, span.join-address{
    background: #FF0244;
    color: white;
    border-radius: 10px;
    width: 81px;
    line-height: 25px;
    text-align: center;
    font-size: 12px;
    display: inline-block;
    margin-top: 1.5rem;
    margin-left: 0.4rem;
    position: absolute;
    box-shadow: 0 3px 5px rgb(0, 0, 0,.2);
}
.about-global div.map-address span.name::before, span.join-address::before{
    content: '';
    width: 6px;
    height: 6px;
    background-color: white;
    border: 3px solid #FF0244;
    border-radius: 50%;
    position: absolute;
    left: -1rem;
    top: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 3px 5px rgb(0, 0, 0,.2);
    opacity: 0;
}
span.join-address::before{
    opacity: 1;
}
.about-global div.map-address div.jiujinshan span.name::before{
    top: 78%;
}
.about-global div.map-address div.jiujinshan span.name::before{
    left: unset;
    right: -2rem;
}
.about-global div.map-address div.suzhou span.name::before{
    left: unset;
    right: -2.7rem; 
}
.about-global div.map-address>div:not(:first-child),.about-global div.map-address>div:not(:first-child) span.name,.about-global div.map-address>div.hide span.name{
    opacity: .7;
}
.about-global div.map-address>div.active ,.about-global div.map-address>div.active span.name{
    opacity: 1 !important;
}
.about-global div.map-address>div.beijing span.name{
    right: 0;
    margin-top: 0.8rem;
    transition: 0.3s all ease;
}
.about-global div.map-address>div.shanghai span.name{
    bottom: 0;
    left: -40%;
}
.about-global div.map-address>div.guangzhou span.name{
    top: -4.5rem;
    left: 1rem;
}
.about-global div.map-address>div.suzhou span.name{
    right: -7.5rem;
    top: -1.5rem;
}
.about-global{
    margin-bottom: 12rem
}
a.back{
    position: fixed;
    display: inline-block;
    width: 120px;
    line-height: 40px;
    font-size: 12px;
    color: #008AD8;
    border-radius: 12px;
    box-shadow: 0 6px 13px rgb(0 0 0 / 23%);
    bottom: 3rem;
    right: 13%;
    text-align: center;
    letter-spacing: 1px;
    padding-left: 30px;
    background: url(../img/top.svg) no-repeat center;
    background-size: 0.85rem;
    background-color: #fff;
    z-index: 99999;
    background-position-x: 1.4rem;
    transition: .3s all ease;
    font-weight: 500;
}
.month-select .month{
    margin-left: 5vw;
}
.month-select .month p{
    margin-right: 1vw;
    color: #397594;
    font-size: 19px;
}
.month-select .month div span{
    background: linear-gradient(#323F5D,#41B6D5);
    -webkit-background-clip: text;
    color: transparent;
    font-size: 24px;
    line-height: 50px;
    font-weight: 600;
    position: relative;
    padding-bottom: 1rem;
}
.month-select .month div span::before{
    content: '';
    background: linear-gradient(to right,#323f5dca,#41B6D5);
    opacity: .6;
    width: 100%;
    height: 2px;
    position: absolute;
    bottom: 1rem;
    left: 0;
}
.month-select .month div{
    position: relative;
}
.month-select .month ul.month-list{
    position: absolute;
    top: 3.8rem;
    left: 50%;
    transform: translateX(-50%);
    background-color: white;
    box-shadow: 0 3px 12px rgb(0 0 0 / 22%);
    border-radius: 1rem;
    z-index: 10;
    max-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    transition: 0.4s all ease;
    padding-left: 1rem;
}
.month-select .month ul.month-list.active{
    max-height: 16rem;
    padding: 1.8rem 1rem 1rem 1rem;
}
.month-select .month ul.month-list.active.have-scroll{
    padding-right: 0;
}
ul.month-list li{
    font-size: 19px;
    width: 6rem;
    text-align: center;
    cursor: pointer;
    transition: 0.2s all ease;
}
ul.month-list li+li{
    margin-top: 1rem;
}
div.about-experience ::-webkit-scrollbar {
	width: 17px;
	height: 2px;
}
div.about-experience ::-webkit-scrollbar-track,
div.about-experience ::-webkit-scrollbar-thumb {
	border-radius: 999px;
	border: 5px solid transparent;
}
div.about-experience ::-webkit-scrollbar-track {
	box-shadow: 1px 1px 5px transparent inset;
}
div.about-experience ::-webkit-scrollbar-thumb {
	min-height: 15px;
	background-clip: content-box;
	box-shadow: 0 0 0 5px #C4C4C4 inset;
}
div.about-experience ::-webkit-scrollbar-corner {
	background: transparent;
}
.about-experience{
    max-width: 1920px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
.about-experience::before{
    content: '';
    width: 35%;
    height: 100%;
    background: linear-gradient(to right,rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.35),rgba(255, 255, 255, 0.01));
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
      background: radial-gradient(at 30% 52%, rgba(255, 255, 255, 0.5) 30px, rgba(255, 255, 255, 0.35) 50%, rgba(255, 255, 255, 0.01) 70%);
}
.about-experience::after{
    content: '';
    width: 30%;
    height: 100%;
    background: linear-gradient(to right,rgba(255, 255, 255, 0.01), rgba(255, 255, 255, 0.35),rgba(255, 255, 255, 0.5));
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}
.swiper-experience{
    max-width: 1920px;
    margin: 0 auto;
    margin-top: 7rem;
    position: relative;
    padding: 0 14rem;
}
.swiper-experience::before{
    content: '';
    width: 100%;
    height: 2rem;
    background: url(../img/dotted.svg) no-repeat center;
    position: absolute;
    top: 55%;
    left: 0;
    transform: translateY(-12%);
    background-repeat: repeat-x;
}
.swiper-experience .swiper-slide .text{
    font-size: 22px;
    padding: 1.2rem;
    background: #E3F2FF;
    border-radius: 10px;
    width: 100%;
    display: inline-block;
}
.swiper-experience .swiper-slide .text p{
    font-size: 16px;
    margin-bottom: 0.4rem;
    line-height: 1.5rem;
}
.swiper-experience .swiper-slide .text p:last-of-type{
    margin-bottom: 0;
}
.swiper-experience .swiper-slide span.date{
    width: 100%;
    line-height: 36px;
    padding: 0 1.3rem;
    font-size: 20px;
    border-radius: 11px;
    margin-top: 0.5rem;
    color: white;
    display: block;
    box-shadow: 0px -10px 60px rgb(29 34 90 / 9%);
    background: linear-gradient(278.26deg, #008AD8 5%, #41B6D5 85.17%);
}
.swiper-experience .swiper-slide[data-swiper-row="1"]{
    margin-top: 8rem !important;
}
/* .swiper-experience .swiper-slide[data-swiper-row="1"][data-swiper-column="1"]{
    margin-left: -8rem;
} */
.swiper-experience span.circle4{
    width: 2.5rem;
    height: 2.5rem;
    top: 100%;
    right: unset;
    margin-top: 45px;
    display: inline-block;
}
.swiper-experience .swiper-slide::before {
    content: '';
    width: 2.5rem;
    height: 2.5rem;
    background: url(../img/arrow-linear.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    top: 100%;
    left: 0;
}
.opacity0{
    opacity: 0;
}
.swiper-experience .swiper-slide[data-swiper-row="1"]::before{
    bottom: 100%;
    top: unset;
    transform: rotate(-180deg);
}
.swiper-experience .swiper-slide[data-swiper-row="1"] span.circle4{
    bottom: 100%;
    top: unset;
    margin-top: 0;
    margin-bottom: 45px;
}
.swiper-experience .swiper-slide[data-swiper-row="1"] span.date{
    margin-top: 0;
}
.swiper-experience .swiper-slide[data-swiper-row="1"] .text{
    order: 3;
    margin-top: 0.5rem;
}
.swiper-experience .swiper-slide{
    display: flex;
    flex-wrap: wrap;
}
.swiper-experience .swiper-slide[data-swiper-row="0"]{
    transform: translateX(0rem);
    transition: all 0.5s ease;
    align-self: flex-end;
}
.swiper-experience .swiper-slide[data-swiper-row="1"] {
    transform: translateX(15rem);
    transition: all 0.5s ease;
    align-self: flex-start;
}
.about-content {
    position: relative;
}
.about-content span.big-circle{
    top: 18%;
}
.about-content span.big-circle:after{
    opacity: 0;
}
.all-bg{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: -1;
}
.all-bg::before{
    content: '';
    width: 152%;
    height: 100%;
    background: url(../img/all-banner.png) no-repeat center right;
    background-position-x: 160%;
    background-size: 120%;
    position: absolute;
    top: 1rem;
    left: -9%;
    transform: rotate(45deg) translateX(-50%);
    z-index: -1;
    opacity: .3;
}
.about-content .all-bg::before{
    opacity: .3;
    top: 15rem;
}
.about-develop.content{
    max-width: 1100px;
}
.about-experience .content{
    max-width: 1200px;
}