.bgImSie{
    background-image: var(--border-0-100)
}

.isBox_show{
    box-shadow: var(--boxShow-27)
}

@media only screen and (max-width: 768px) {
    .SmineWidth{
        white-space:nowrap;
        overflow-x: auto;
        scrollbar-width: none
    }

    .SmineWidth::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
        opacity: 0
    }
}

@media only screen and (min-width: 1280px) {
    .borderFilter{
        box-shadow:inset 0 -1px 1px #54c5f133,inset 0 1px 2px #ffffffb3;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px)
    }

    .borderFilter:hover {
        box-shadow: inset 0 -1px 1px #ffffffb3,inset 0 1px 2px #54c5f133;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px)
    }
}

@media only screen and (max-width: 1280px) {
    .isFrame .isFrame-item{
        width:32%
    }

    .isPlatform{
        gap: 53px
    }
}

@media only screen and (max-width: 1275px) {
    .isFrame{
        flex-wrap:wrap;
        align-content: stretch
    }

    .isFrame .isFrame-item{
        width: 100%;
        min-height: 120px;
        padding: 20px;
        background-color: transparent;
        border: none;
        border-radius: 0;
        -webkit-backdrop-filter: none;
        backdrop-filter: none
    }

    .isPlat{
        padding-top: 60px;
        padding-bottom: 60px
    }

    .isPlat .isPlatform{
        flex-direction: column;
        gap: 60px
    }

    .isPlat .isPlatform .isPlatform-item{
        height: 87px;
        text-align: center;
        font-size: 24px
    }

    .isPlat .isPlatform .isPlatform-item .isPlatform-item-text{
        font-size: 24px
    }
}

@media only screen and (max-width: 1130px) {
    .isPlatform{
        gap:35px
    }

    .isFrame{
        flex-wrap: wrap;
        align-content: stretch
    }

    .isFrame .isFrame-item{
        width: 100%;
        min-height: 120px;
        padding: 20px;
        background-color: transparent;
        border: none;
        border-radius: 0;
        -webkit-backdrop-filter: none;
        backdrop-filter: none
    }

    .isPlat .isPlatform{
        flex-direction: column;
        gap: 60px
    }

    .isPlat .isPlatform .isPlatform-item{
        height: 87px;
        text-align: center;
        font-size: 24px
    }

    .isPlat .isPlatform .isPlatform-item .isPlatform-item-text{
        font-size: 24px
    }
}

.liItem {
    cursor: pointer
}

@media only screen and (min-width: 1280px) {
    .liItem {
        transition:transform 1s;
        transform-origin: left top
    }

    .liItem:hover {
        transform: scale(1.07)
    }

    .notHovered.hovered-1.notHovered-2,.notHovered.hovered-1.notHovered-3 {
        transform: translate(30px,24px)
    }

    .notHovered.hovered-1.notHovered-4,.notHovered.hovered-1.notHovered-5 {
        transform: translateY(24px)
    }

    .notHovered.hovered-2.notHovered-3 {
        transform: translate(30px,24px)
    }

    .notHovered.hovered-2.notHovered-1,.notHovered.hovered-2.notHovered-4,.notHovered.hovered-2.notHovered-5,.notHovered.hovered-3.notHovered-1,.notHovered.hovered-3.notHovered-2,.notHovered.hovered-3.notHovered-4,.notHovered.hovered-3.notHovered-5 {
        transform: translateY(24px)
    }

    .notHovered.hovered-4.notHovered-5 {
        transform: translate(30px,24px)
    }

    .notHovered.hovered-5.notHovered-4 {
        transform: translateY(24px)
    }
}

@media only screen and (max-width: 767px) {
    .liItem {
        min-width:320px
    }

    .lastItem {
        display: none
    }

    .borderTop {
        border-top: none
    }
}

li {
    position: relative;
    overflow: hidden
}

li:first-child:before {
    content: "";
    position: absolute;
    left: 51%;
    top: 0;
    width: 12%;
    height: 100px;
    background: url("data:image/svg+xml,%3csvg%20width='131'%20height='67'%20viewBox='0%200%20131%2067'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Ellipse%206'%20opacity='0.6'%20filter='url(%23filter0_f_4963_86531)'%3e%3cellipse%20cx='65.1396'%20cy='19.2877'%20rx='69.9888'%20ry='29.9952'%20transform='rotate(30.6418%2065.1396%2019.2877)'%20fill='url(%23paint0_linear_4963_86531)'%20fill-opacity='0.15'/%3e%3cpath%20d='M123.205%2053.6847C121.525%2056.5205%20118.486%2058.613%20114.037%2059.7831C109.574%2060.957%20103.865%2061.1468%2097.2328%2060.2804C83.9786%2058.5488%2067.5346%2052.6639%2051.1261%2042.9437C34.7176%2033.2236%2021.6556%2021.6296%2013.7687%2010.8376C9.82238%205.43764%207.24576%200.33961%206.1307%20-4.139C5.01929%20-8.60296%205.39432%20-12.2735%207.07423%20-15.1093C8.75413%20-17.9451%2011.793%20-20.0376%2016.2419%20-21.2077C20.7055%20-22.3816%2026.4145%20-22.5714%2033.0464%20-21.705C46.3006%20-19.9734%2062.7446%20-14.0885%2079.153%20-4.36835C95.5615%205.35177%20108.624%2016.9458%20116.51%2027.7378C120.457%2033.1377%20123.033%2038.2358%20124.148%2042.7144C125.26%2047.1783%20124.885%2050.8488%20123.205%2053.6847Z'%20stroke='url(%23paint1_linear_4963_86531)'%20stroke-width='5'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_4963_86531'%20x='-0.00195312'%20y='-27.7432'%20width='130.283'%20height='94.0615'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='1.5'%20result='effect1_foregroundBlur_4963_86531'/%3e%3c/filter%3e%3clinearGradient%20id='paint0_linear_4963_86531'%20x1='65.1396'%20y1='-10.7075'%20x2='65.1396'%20y2='49.2829'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%2341A3E7'/%3e%3cstop%20offset='1'%20stop-color='%2341A3E7'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_4963_86531'%20x1='62.8643'%20y1='23.1615'%20x2='49.5483'%20y2='44.9087'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='white'%20stop-opacity='0'/%3e%3cstop%20offset='1'%20stop-color='%2341A3E7'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e") no-repeat top;
    background-size: 100% auto
}

li:first-child:after {
    content: "";
    position: absolute;
    right: 0;
    top: 68px;
    width: 55px;
    height: 200px;
    background: url("data:image/svg+xml,%3csvg%20width='46'%20height='73'%20viewBox='0%200%2046%2073'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20id='Ellipse%207'%20d='M62.0378%204.49018C63.408%205.70936%2064.3%207.64986%2064.4828%2010.4643C64.6665%2013.2939%2064.1117%2016.824%2062.7638%2020.861C60.0711%2028.9258%2054.3718%2038.5394%2046.2295%2047.6903C38.0873%2056.8411%2029.2015%2063.6194%2021.5043%2067.2314C17.6514%2069.0395%2014.2097%2070.0009%2011.378%2070.1474C8.56137%2070.293%206.53033%2069.6326%205.16012%2068.4134C3.78991%2067.1943%202.89786%2065.2538%202.7151%2062.4393C2.53137%2059.6098%203.08614%2056.0796%204.43404%2052.0426C7.12678%2043.9778%2012.8261%2034.3642%2020.9684%2025.2134C29.1106%2016.0625%2037.9964%209.28422%2045.6935%205.67218C49.5465%203.8641%2052.9882%202.90271%2055.8199%202.75625C58.6365%202.61058%2060.6676%203.271%2062.0378%204.49018Z'%20fill='url(%23paint0_linear_4963_86532)'%20fill-opacity='0.15'%20stroke='url(%23paint1_linear_4963_86532)'%20stroke-width='5'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_4963_86532'%20x1='19.1007'%20y1='23.5515'%20x2='48.0972'%20y2='49.3521'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23141414'/%3e%3cstop%20offset='1'%20stop-color='%23545454'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_4963_86532'%20x1='35.7776'%20y1='38.3758'%20x2='47.9416'%20y2='49.5219'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='white'%20stop-opacity='0'/%3e%3cstop%20offset='1'%20stop-color='%233B3B3B'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e") no-repeat top;
    background-size: 100% auto
}

li:last-child:before {
    content: "";
    position: absolute;
    left: 30px;
    top: 0;
    width: 90px;
    height: 100px;
    background: url("data:image/svg+xml,%3csvg%20width='81'%20height='70'%20viewBox='0%200%2081%2070'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20id='Ellipse%207'%20opacity='0.34'%20d='M7.22456%20-22.997C9.27337%20-24.5578%2012.1232%20-25.2109%2015.8159%20-24.7363C19.5236%20-24.2598%2023.8984%20-22.6602%2028.6763%20-19.9568C38.2235%20-14.5548%2048.9444%20-4.99248%2058.4638%207.50379C67.9832%2020.0001%2074.3549%2032.8755%2077.0274%2043.5146C78.3649%2048.8388%2078.7452%2053.4814%2078.22%2057.1825C77.6968%2060.8686%2076.3103%2063.4426%2074.2615%2065.0033C72.2127%2066.5641%2069.3629%2067.2172%2065.6702%2066.7426C61.9625%2066.2661%2057.5876%2064.6665%2052.8098%2061.9631C43.2625%2056.5611%2032.5416%2046.9988%2023.0222%2034.5025C13.5028%2022.0062%207.1311%209.13079%204.4586%20-1.50825C3.12116%20-6.83246%202.74079%20-11.4751%203.26607%20-15.1761C3.78923%20-18.8623%205.17575%20-21.4363%207.22456%20-22.997Z'%20fill='url(%23paint0_linear_4963_86543)'%20fill-opacity='0.15'%20stroke='url(%23paint1_linear_4963_86543)'%20stroke-width='5'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_4963_86543'%20x1='21.0335'%20y1='36.0175'%20x2='60.4525'%20y2='5.98884'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23141414'/%3e%3cstop%20offset='1'%20stop-color='%23545454'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_4963_86543'%20x1='43.6866'%20y1='18.7434'%20x2='60.6273'%20y2='6.22538'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='white'%20stop-opacity='0'/%3e%3cstop%20offset='1'%20stop-color='%233B3B3B'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e") no-repeat top;
    background-size: 100% auto
}

li:last-child:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100px;
    height: 70px;
    background: url("data:image/svg+xml,%3csvg%20width='100'%20height='54'%20viewBox='0%200%20100%2054'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20id='Ellipse%206'%20opacity='0.3'%20d='M120.502%2078.8269C118.823%2081.661%20115.786%2083.7523%20111.339%2084.9217C106.878%2086.095%20101.172%2086.2847%2094.5438%2085.4187C81.2964%2083.688%2064.8607%2077.8061%2048.4605%2068.0909C32.0603%2058.3756%2019.0049%2046.7875%2011.122%2036.001C7.17771%2030.6038%204.60246%2025.5084%203.48801%2021.0323C2.3772%2016.5707%202.75208%2012.9024%204.43093%2010.0683C6.10979%207.23428%209.14681%205.14298%2013.5933%203.97351C18.0544%202.80021%2023.7605%202.61055%2030.389%203.47653C43.6364%205.20723%2060.0721%2011.0892%2076.4723%2020.8044C92.8725%2030.5196%20105.928%2042.1077%20113.811%2052.8943C117.755%2058.2915%20120.33%2063.3868%20121.445%2067.863C122.556%2072.3245%20122.181%2075.9928%20120.502%2078.8269Z'%20fill='url(%23paint0_linear_4963_86224)'%20fill-opacity='0.15'%20stroke='url(%23paint1_linear_4963_86224)'%20stroke-width='5'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_4963_86224'%20x1='77.7465'%20y1='18.6535'%20x2='47.1863'%20y2='70.2418'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%2341A3E7'/%3e%3cstop%20offset='1'%20stop-color='%2341A3E7'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_4963_86224'%20x1='60.1923'%20y1='48.3195'%20x2='46.8828'%20y2='70.056'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='white'%20stop-opacity='0'/%3e%3cstop%20offset='1'%20stop-color='%2341A3E7'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e") no-repeat bottom;
    background-size: 100% auto
}



@media only screen and (max-width: 976px) {
    li:before,li:after {
        display:none
    }

    li {
        flex-direction: column-reverse
    }

    li>div {
        width: 100%;
        padding-left: 0!important
    }
}

.swiperSlide:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 380px;
    left: 0;
    bottom: 0;
    background: linear-gradient(180deg,#0000 30%,#000c);
    z-index: 0
}

ul li {
    position: relative
}

ul li:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 47px;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 0;
    background-image: var(--border-0-100);
    opacity: .7
}

ul li:last-child:before {
    width: 0
}

 .swiper-pagination {
    bottom: 20.8%!important
}

 .swiper-pagination .swiper-pagination-bullet {
    height: 12px;
    width: 12px;
    border: 1px solid #fff;
    border-radius: 50%;
    background: #fff0;
    opacity: 1;
    padding: 0;
    margin: 6px;
    position: relative
}

 .swiper-pagination .swiper-pagination-bullet:before {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    background: #fff3;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    opacity: 0
}

 .swiper-pagination .swiper-pagination-bullet-active {
    background: #fff;
    animation: background-9f3d5fdd 1.7s
}

 .swiper-pagination .swiper-pagination-bullet-active:before {
    opacity: 1;
    animation: opacity-9f3d5fdd 1.7s
}

@keyframes background-9f3d5fdd {
    0% {
        background: #fff0
    }

    to {
        background: #fff
    }
}

@keyframes opacity-9f3d5fdd {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.slideItem2 .slideCon {
    width: 80%
}

.slideItem2 .slideCon .title {
    font-size: 72px;
    line-height: 1.2;
    margin-bottom: 20px
}

.slideItem3 .slideCon {
    width: 59%
}

.slideItem3 .slideCon .title {
    font-size: 46px;
    line-height: 1.2;
    margin-bottom: 40px
}

.slideItem4 .slideCon {
    width: 67%
}

.slideItem4 .slideCon .title {
    font-size: 46px;
    line-height: 1.2;
    margin-bottom: 40px
}

@media only screen and (min-width: 1920px) {
    .slideItem3 .slideCon {
        width:45%
    }

    .slideItem4 .slideCon {
        width: 55%
    }
}

@media only screen and (max-width: 1548px) {
    .swiperSlide {
        height: 870px !important;;
    }

    .swiperSlide img,.swiperSlide video {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .slideCon {
        /* width:76%!important; */
    }
}

@media only screen and (max-width: 1280px) {
    .swiperSlide .slideCon .title {
        font-size:42px
    }

    .slideItem2 .slideCon .title {
        font-size: 50px;
        line-height: 1.2
    }

    .slideCon {
        width: 90%!important;
        }

    ul {
        flex-wrap: wrap;
        bottom: 6%
    }

    ul li {
        width: 50%;
        flex-shrink: 0
    }

    ul li:before {
        height: 25px;
        line-height: 1.2
    }

    ul li:nth-child(2n):before {
        width: 0
    }

    ul li:nth-child(1),ul li:nth-child(2) {
        margin-bottom: 15px;
    }

    ul li:nth-child(1),ul li:nth-child(3) {
        text-align: right
    }

    ul li:nth-child(2),ul li:nth-child(4) {
        text-align: left
    }
    .app-ul li{
        width: 100%;
    }

}

@media only screen and (max-width: 976px) {
    .swiperSlide .slideCon .title {
        font-size:32px;
        line-height: 1.2
    }

    .slideItem2 .slideCon .title {
        font-size: 42px;
        line-height: 1.2
    }

    ul li {
        font-size: 16px
    }

    ul li:nth-child(1),ul li:nth-child(3) {
        padding-right: 20px;
        padding-left: 10px
    }

    ul li:nth-child(2),ul li:nth-child(4) {
        padding-left: 20px;
        padding-right: 10px
    }
}

@media only screen and (max-width: 768px) {
    .swiperSlide .slideCon .title {
        font-size:26px;
        line-height: 1.2;
        letter-spacing: -.72px
    }

    .slideItem2 .slideCon .title {
        font-size: 32px;
        line-height: 1.2;
        letter-spacing: -.72px
    }

    .slideItem3 img,.slideItem4 img {
        -o-object-position: 68%;
        object-position: 68%
    }
}

@media only screen and (max-width: 480px) {
     .swiper-pagination {
        bottom:210px!important
    }

    ul {
        flex-direction: column;
        bottom: 30px
    }

    ul li {
        margin-bottom: 20px!important;
        font-size: 16px;
        padding: 0!important;
        width: 100%;
        text-align: center!important
    }

    ul li:before {
        width: 0
    }

    .swiperSlide .slideCon .title {
        font-size: 24px;
        line-height: 1.2;
        letter-spacing: -.72px
    }

    .slideItem2 .slideCon .title {
        font-size: 32px;
        line-height: 1.2;
        letter-spacing: -.72px
    }
}

.ourMission {
    letter-spacing: -.72px
}

.ourMission span {
    color: var(--brand-colors-500-default)
}

.accountsTextone span {
    color: var(--brand-colors-500-default);
    font-size: 24px;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: -.48px
}

@media only screen and (max-width: 1100px) and (min-width:768px) {
    .accountCard {
        margin:20px 20px 0
    }

    .accountCardBox {
        justify-content: center
    }
}

@media only screen and (min-width: 1100px) and (max-width:1280px) {
    .accountCard {
        margin:20px 20px 0
    }

    .accountCardBox {
        justify-content: center
    }
}

@media only screen and (max-width: 730px) {
    .accountCardBox {
        justify-content:center
    }

    .accountCard {
        margin: 20px 20px 0
    }
}



@media only screen and (max-width: 1100px) and (min-width: 420px) {
    .accoutsCard {
        margin-right:10px!important
    }
}

@media only screen and (max-width: 500px) {
    .accountCard {
        margin:20px 0 0!important
    }
}

@media only screen and (max-width: 420px) {
    .accoutsCard {
        width:100%
    }
}

.imgMark {
    position: absolute;
    top: -30px;
    left: -8.5vw;
    z-index: 2
}

@media only screen and (max-width: 1450px) {
    .imgMark {
        left:-5.5vw
    }
}

@media only screen and (max-width: 1280px) {
    .imgMark {
        position:absolute;
        top: 0;
        left: 0;
        z-index: 2;
        width: 90vw
    }

    .imgMark img {
        -o-object-fit: contain;
        object-fit: contain;
        transform: scale(1.4)
    }
}

@media only screen and (max-width: 976px) {
    .divbgBox {
        overflow:hidden
    }

    .imgMark img {
        transform: scale(1);
        translate: 0px 77px
    }
}

@media only screen and (max-width: 768px) {
    .imgMark img {
        transform:scale(2.4);
        translate: 70% 77px
    }
}

@media only screen and (max-width: 480px) {
    .imgMark img {
        transform:scale(2.4);
        translate: 70% 215px
    }
}

.divbgBox {
    background: url(/assets/theearthFooter-D7CkQt7h.jpg) no-repeat center;
    background-size: cover;
    position: relative
}

.divbgBox:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #0006;
    z-index: 0;
    border-radius: 20px;
    overflow: hidden
}

.bgBox {
    padding-top: 30px
}


.h2-animate .bgBox {
    animation: paddingTpp-47305137 1s forwards;
    animation-delay: 1.5s
}

.h2-animate h2 {
    animation: opacity-47305137 1s forwards;
    animation-delay: .5s
}

.h2-animate .tipBox {
    animation: opacity-47305137 1s forwards;
    animation-delay: 1.5s
}

@keyframes opacity-47305137 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes paddingTpp-47305137 {
    0% {
        padding-top: 30px
    }

    to {
        padding-top: 0
    }
}

.customImg1 {
    width: 332px;
    transform: scale(2.2);
    translate: -28%
}

@media only screen and (max-width: 1280px) {
    .customImg1 {
        transform:scale(1.5);
        translate: -18%
    }
}

@media only screen and (max-width: 976px) {
    .customImg1 {
        transform:scale(1.5);
        translate: 0
    }
}

.customImg2 {
    transform: scale(1.5);
    translate: 8px 6px;
    overflow: hidden
}

.divbgBox{
    background: url(../images/divbg-DAO71Xh_.jpg) no-repeat bottom right;
    background-size: cover
}

.borderChangeTransparency {
    transition: border-color 1s ease
}

.borderChangeTransparency:hover {
    border: 1px solid var(--white-248-249-8)
}
