.xiangqing {
    width: 100%;
    max-width: 1120px;
    margin: 0px auto;
    overflow: hidden;
    background-color: #0f1a2a;
}

@-webkit-keyframes jiang {
    0% {
        opacity: 0;
        margin-top: 0px;
    }

    100% {
        opacity: 1;
        margin-top: 10px;
    }
}

@keyframes jiang {
    0% {
        opacity: 0;
        margin-top: 0px;
    }

    100% {
        opacity: 1;
        margin-top: 10px;
    }
}


@-webkit-keyframes left {
    0% {
        opacity: 0;
        margin-left: 0px;
    }

    100% {
        opacity: 1;
        margin-left: 30px;
    }
}

@keyframes left {
    0% {
        opacity: 0;
        margin-left: 0px;
    }

    100% {
        opacity: 1;
        margin-left: 30px;
    }
}

@-webkit-keyframes right {
    0% {
        opacity: 0;
        margin-right: 0px;
    }

    100% {
        opacity: 1;
        margin-right: 30px;
    }
}

@keyframes right {
    0% {
        opacity: 0;
        margin-right: 0px;
    }

    100% {
        opacity: 1;
        margin-right: 30px;
    }
}

.head {
    width: 100%;
    height: 300px;
    position: relative !important;
    background-color: #003bd9;

}

.head div {
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-delay: 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 1;
    transition: all 0.3s;
    margin: 0px;

}

.zhong {
    position: absolute;
    left: 50% !important;
    -webkit-transform: translate(-50%, 0%) !important;
    -ms-transform: translate(-50%, 0%) !important;
    transform: translate(-50%, 0%) !important;
}

.anim {
    opacity: 0;
}

.head_01 {
    top: -30px;
    left: 0px;
    text-align: center;
    width: 100%;
    opacity: 0;
    animation-name: jiang;
    animation-delay: 0.6s !important;
    z-index: 999 !important;
}

.head_01 img {
    display: block;
    width: 100%;
}

.flow01 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow01 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow01 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow01main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow01_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow01_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow01_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow01_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow02 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow02 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow02 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow02main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow02_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow02_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow02_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow02_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow03 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow03 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow03 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow03main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow03_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow03_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow03_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow03_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow04 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow04 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow04 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow04main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow04_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow04_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow04_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow04_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow05 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow05 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow05 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow05main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow05_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow05_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow05_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow05_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow06 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow06 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow06 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow06main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow06_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow06_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow06_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow06_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow07 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow07 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow07 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow07main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow07_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow07_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow07_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow07_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow08 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow08 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow08 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow08main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow08_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow08_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow08_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow08_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow09 {
    width: 100%;
    height: 520px;
    position: relative !important;
    background-color: #003bd9;
}

.flow09 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow09 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow09main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow09_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow09_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow09_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow09_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow10 {
    width: 100%;
    height: 560px;
    position: relative !important;
    background-color: #003bd9;
}

.flow10 .anim-show {
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-delay: 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    margin: 0px;
    position: absolute;
    z-index: 99;
}

.flow10 .anim-show img {
    display: block;
    width: 100%;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow10main.anim-show {
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    animation-name: jiang;
    animation-delay: 0.8s !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.flow10_01.anim-show {
    top: 0px;
    left: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: left;
    animation-delay: 0.8s !important;
    align-items: flex-start;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow10_01.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}

.flow10_02.anim-show {
    top: 0px;
    right: 0px;
    width: calc((100% - 90px) / 2);
    text-align: center;
    animation-name: right;
    animation-delay: 0.8s !important;
    background: #aaabab;
    padding: 10px;
    box-sizing: border-box;
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 50px, 100% 100%, 0 100%);
}

.flow10_02.anim-show:hover {
    background: #da2127;
    cursor: pointer;
}