:root{
    --default-primary-color: #333333;
    --default-secondary-color: #777777;
    --primary-text-color: #333333;
    --secondary-text-color: #666666;
    --third-text-color: #999999;
    --decoration-text-color: #dddddd;
    --primary-bg-color: #333333;
    --secondary-bg-color: #666666;
    --decoration-bg-color: #eeeeee;
    --primary-color: rgba(0 199 115);
    --secondary-color: rgba(32 137 255);
    /* --primary-color: #00233f;
    --secondary-color: #de0000; */
    --decoration-color: #f7ba11;
    --primary-dark-color: #c73a0f;
    --primary-hover-color: #3789f3;
    --primary-light-hover-color: rgb(12, 113, 245, .12);
    --secondary-hover-color: #ff9e2f;
    --secondary-dark-color: #ec720e;
    --primary-text-color: #ffffff;
    --secondary-text-color: #111111;
    --primary-0t-color: rgba(0 199 115 / 0%);
    --primary-4t-color: rgba(0 199 115 / 4%);
    --primary-8t-color: rgba(0 199 115 / 8%);
    --primary-12t-color: rgba(0 199 115 / 12%);
    --primary-16t-color: rgba(0 199 115 / 16%);
    --primary-20t-color: rgba(0 199 115 / 20%);
    --primary-24t-color: rgba(0 199 115 / 24%);
    --primary-36t-color: rgba(0 199 115 / 36%);
    --primary-48t-color: rgba(0 199 115 / 48%);
    --primary-64t-color: rgba(0 199 115 / 64%);
    --primary-72t-color: rgba(0 199 115 / 72%);
    --primary-88t-color: rgba(0 199 115 / 88%);
    --primary-96t-color: rgba(0 199 115 / 96%);
    --secondary-4t-color: rgba(32 137 255 / 4%);
    --secondary-8t-color: rgba(32 137 255 / 8%);
    --secondary-12t-color: rgba(32 137 255 / 12%);
    --secondary-16t-color: rgba(32 137 255 / 16%);
    --secondary-20t-color: rgba(32 137 255 / 20%);
    --secondary-24t-color: rgba(32 137 255 / 24%);
    --secondary-36t-color: rgba(32 137 255 / 36%);
    --secondary-48t-color: rgba(32 137 255 / 48%);
    --secondary-64t-color: rgba(32 137 255 / 64%);
    --secondary-72t-color: rgba(32 137 255 / 72%);
    --secondary-88t-color: rgba(32 137 255 / 88%);
    --secondary-96t-color: rgba(32 137 255 / 96%);
    /* --primary-hover-color: #012a4a;
    --secondary-hover-color: #e42b2b; */
    }
    ::selection{
    color: #ffffff;
    background-color: var(--secondary-color);
    }
    *{ 
    margin: 0; 
    padding: 0;
    font-family: "PingFang SC", Tahoma, Arial, sans-serif, "微软雅黑", "Helvetica Neue", Helvetica;
    /* font-family: "Helvetica Neue",Helvetica,"PingFang SC",PingHei,STHeitiSC-Light,"Myriad Set Pro","Lucida Grande","microsoft yahei",SimHei,tahoma,Arial,Verdana,sans-serif; */
    list-style: none;
    box-sizing: border-box;
    }
    a{
    text-decoration: none;
    color: inherit;
    }
    a:visited{
    /* color: #333333; */
    }
    .clearfix::after{
    clear: both;
    display: block;
    content: "";
    }
    .l-1-out{
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    .l-2-out{
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .t-c{
    text-align: center;
    }
    .t-l{
    text-align: left;
    }
    .t-r{
    text-align: right;
    }
    .f-c-c{
    display: flex;
    justify-content: center;
    align-items: center;
    }
    .f-s-c{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    }
    .f-e-c{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    }
    .f-s-s{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    }
    .f-s-e{
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    }
    .f-c-s{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    }
    .f-e-s{
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    }
    .f-c-e{
    display: flex;
    justify-content: center;
    align-items: flex-end;
    }
    .f-b-c{
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    .f-b-s{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    }
    .f-b-e{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    }
    .f-row{
    flex-direction: row;
    }
    .f-col{
    flex-direction: column;
    }
    .f-wrap{
    flex-wrap: wrap;
    }
    .v-t{
    vertical-align: top;
    }
    .v-m{
    vertical-align: middle;
    }
    .v-b{
    vertical-align: bottom;
    }
    .h-o:hover{
    opacity: .9;
    transition: .25s ease-in-out;
    }
    .i-f:focus{
        border: 1px solid var(--primary-color);
        box-shadow: 0 0 0 3px var(--primary-20t-color);
    }
    .flex-normal{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .flex-between{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .flex-start{
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .flex-end{
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
    .flex-column{
        flex-direction: column;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .preload {
        -webkit-transition: none !important;
        -moz-transition: none !important;
        -ms-transition: none !important;
        -o-transition: none !important;
        transition: none !important;
    }
    .animated{
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    }
    .fadeInScale{
    -webkit-animation-name: fadeInScale;
    animation-name: fadeInScale;
    }
    @keyframes fadeInScale{
        0% {
            opacity: 0;
            -webkit-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
        }
        100% {
            opacity: 1;
            -webkit-transform: none;
            -ms-transform: none;
            transform: none;
        }
    }
    .fadeInUp{
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    }
    .w-1{width: 100%;}
    .w-2{width: 49%; margin-right: 2%;} .w-2:nth-child(2n){margin-right: 0;}
    .w-3{width: 32%; margin-right: 2%;} .w-3:nth-child(3n){margin-right: 0;}
    .w-4{width: 24%; margin-right: 1.3%;} .w-4:nth-child(4n){margin-right: 0;}
    .w-5{width: 19%; margin-right: 1%;} .w-5:nth-child(5n){margin-right: 0;}
    @keyframes fadeInUp{
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        -ms-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
    }
    .fadeInRight{
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    }
    @keyframes fadeInRight{
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        -ms-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
    }
    .fadeInLeft{
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    }
    @keyframes fadeInLeft{
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        -ms-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0);
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
    }
    @keyframes bounceAni{
        0% {
            transform: scale(1, 1);
        }
        25% {
            transform: scale(1.1, 0.9);
        }
        50% {
            transform: scale(0.9, 1.1);
        }
        75% {
            transform: scale(1.1, 0.9);
        }
        100% {
            transform: scale(1, 1);
        }
    }
    @keyframes bannerScroll{
        0% {
            transform: translateY(-8px);
            height: 8px;
        }
        50% {
            transform: translateY(8px);
            height: 10px;
        }
        100% {
            transform: translateY(-8px);
            height: 8px;
        }
        /* 0% {
            transform: translateY(0);
        }
        25% {
            transform: translateY(-8px);
        }
        50% {
            transform: translateY(0);
        }
        75% {
            transform: translateY(8px);
        }
        100% {
            transform: translateY(0);
        } */
    }