@font-face {
    font-family: MiSans;
    src: url("../fonts/xiaomi.ttf")
}

.common_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1
}

.zk1 {
    position: relative;
    z-index: 1;
    height: 50vw
}

.zk1 .wrap {
    text-align: center;
    margin: 11.6145833333vw auto 0
}

.zk1 .wrap .p1 {
    font-weight: 500;
    font-size: 1.4583333333vw;
    color: #EC6817;
    margin: 0 0 1.3541666667vw;
    font-family: MiSans
}

.zk1 .wrap .p2 {
    font-weight: bold;
    font-size: 2.5vw;
    color: #2A3248;
    margin: 0 0 1.3541666667vw;
    font-family: MiSans
}

.zk1 .wrap .p3 {
    font-weight: 400;
    font-size: 1.4583333333vw;
    color: #2A3248;
    font-family: MiSans
}

.zk2 {
    position: relative;
    z-index: 1;
    height: 50vw;
    background: #323A4D;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk2 .wrap {
    width: 89.5833333333vw;
    margin: auto
}

.zk2 .wrap .title {
    text-align: center
}

.zk2 .wrap .title .p1 {
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 1.3541666667vw
}

.zk2 .wrap .title .p2 {
    font-weight: 300;
    font-size: 1.25vw;
    color: rgba(255, 255, 255, 0.8)
}

.zk2 .wrap .content {
    display: flex;
    justify-content: space-between;
    margin: 4.1666666667vw 0 0 0
}

.zk2 .wrap .content .item {
    width: 42.7083333333vw;
    height: 27.0833333333vw;
    background: #252B3A;
    border-radius: 1.0416666667vw
}

.zk2 .wrap .content .item1 {
    padding: 1.8229166667vw 0 2.0833333333vw 2.65625vw
}

.zk2 .wrap .content .item1 .flex:last-child .list2 .dis .schedule {
    background: linear-gradient(-90deg, var(--color), rgba(255, 78, 0, 0.25))
}

.zk2 .wrap .content .item1 .flex:not(:last-child) {
    margin: 0 0 2.6041666667vw
}

.zk2 .wrap .content .item1 .flex .headline {
    font-family: MiSans;
    font-weight: 600;
    font-size: 1.4583333333vw;
    color: var(--color);
    opacity: 0.8
}

.zk2 .wrap .content .item1 .flex .list2 .dis .schedule {
    width: 26.1458333333vw;
    background: linear-gradient(-90deg, #36DF6B, rgba(54, 223, 107, 0.25));
    border-left: none
}

.zk2 .wrap .content .item1 .flex .list2 .dis p {
    color: var(--color)
}

.zk2 .wrap .content .item1 .flex .dis {
    display: flex;
    align-items: center;
    margin: .625vw 0 0
}

.zk2 .wrap .content .item1 .flex .dis .schedule {
    width: 13.5416666667vw;
    height: 2.0833333333vw;
    background: linear-gradient(-90deg, #323A4D, #242B3A);
    border-radius: .2604166667vw;
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin: 0 1.0416666667vw 0 0;
    transform-origin: left;
    transform: scaleX(0);
    transition: 1s all
}

.zk2 .wrap .content .item1 .flex .dis .schedule.aos-animate {
    transform: scaleX(1)
}

.zk2 .wrap .content .item1 .flex .dis p {
    font-weight: 400;
    font-size: 1.0416666667vw;
    color: rgba(240, 240, 245, 0.5)
}

.zk2 .wrap .content .item1 .flex .text {
    font-family: MiSans;
    font-weight: 400;
    font-size: .7291666667vw;
    color: rgba(240, 240, 245, 0.5);
    margin: .4166666667vw 0 0 0
}

.zk2 .wrap .content .item1 .flex .text.on {
    color: var(--color)
}

.zk2 .wrap .content .item2 {
    padding: 1.8229166667vw 3.8020833333vw 0 3.8020833333vw
}

.zk2 .wrap .content .item2 .p1 {
    text-align: center;
    font-family: MiSans;
    font-weight: 500;
    font-size: 1.3541666667vw;
    color: #FFFFFF;
    margin: 0 0 1.6666666667vw
}

.zk2 .wrap .content .item2 .img {
    width: 100%
}

.zk2 .wrap .content .item2 .img img {
    width: 100%
}

.zk3 {
    position: relative;
    z-index: 1;
    height: 50vw;
    background: #323A4D;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk3 .wrap {
    margin: auto
}

.zk3 .wrap .title {
    text-align: center
}

.zk3 .wrap .title .p1 {
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 1.3541666667vw
}

.zk3 .wrap .title .p2 {
    font-weight: 300;
    font-size: 1.25vw;
    color: rgba(255, 255, 255, 0.8)
}

.zk3 .wrap .content {
    display: flex;
    justify-content: center;
    margin: 2.34375vw 0 0 0
}

.zk3 .wrap .content img {
    width: 29.2708333333vw
}

.zk3 .wrap .content img:not(:last-child) {
    margin: 0 1.71875vw 0 0
}

.zk4 {
    height: 50vw;
    background: #272E3D;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk4 .wrap {
    width: 75vw;
    margin: auto
}

.zk4 .wrap .title {
    text-align: center;
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 4.7916666667vw
}

.zk4 .wrap .figure {
    display: flex;
    justify-content: center
}

.zk4 .wrap .figure.figure2 .item:not(:last-child) {
    margin: 0 5.4166666667vw 0 0
}

.zk4 .wrap .figure .item {
    text-align: center
}

.zk4 .wrap .figure .item:hover .img {
    transform: rotateY(360deg)
}

.zk4 .wrap .figure .item:not(:last-child) {
    margin: 0 8.5416666667vw 0 0
}

.zk4 .wrap .figure .item .img {
    width: 4.375vw;
    margin: 0 auto .8854166667vw;
    transition: 1s
}

.zk4 .wrap .figure .item .img img {
    width: 100%
}

.zk4 .wrap .figure .item .text {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.25vw
}

.zk4 .wrap .content {
    height: 20.8333333333vw;
    background: rgba(49, 57, 75, 0);
    box-shadow: inset 1px 1px 30px 0px #444c5e;
    border-radius: 1.0416666667vw;
    margin: 3.125vw 0 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 3.2291666667vw 0 4.1666666667vw
}

.zk4 .wrap .content.content2 {
    padding: 0 7.03125vw 0 6.40625vw
}

.zk4 .wrap .content .l {
    width: 26.1979166667vw
}

.zk4 .wrap .content .l .p1 {
    font-family: MiSans;
    font-weight: bold;
    font-size: 1.5625vw;
    color: #EC6815;
    margin: 0 0 1.5104166667vw
}

.zk4 .wrap .content .l .p2 {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.875vw
}

.zk4 .wrap .content .l .p3 {
    font-family: MiSans;
    font-weight: 400;
    font-size: .8333333333vw;
    color: #FFFFFF;
    opacity: 0.65;
    margin: 2.6041666667vw 0 0 0
}

.zk4 .wrap .content .l .p2_dis {
    display: flex;
    gap: 0 4.1666666667vw
}

.zk4 .wrap .content .l .p2_dis p {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.85
}

.zk4 .wrap .content .img {
    width: 33.75vw
}

.zk4 .wrap .content .img.img2 {
    width: 21.0416666667vw
}

.zk4 .wrap .content .img img {
    width: 100%
}

.zk5 {
    background: linear-gradient(45deg, #252B3A, #323A4D);
    height: 50vw;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk5 .wrap {
    width: 75vw
}

.zk5 .wrap .title {
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 3.8541666667vw;
    text-align: center
}

.zk5 .wrap .content {
    display: flex
}

.zk5 .wrap .content .l {
    width: 37.5vw;
    height: 33.3333333333vw;
    box-shadow: inset 1px 1px 30px 0px #444c5e;
    border-radius: 1.0416666667vw;
    padding: 2.8645833333vw 2.6041666667vw 0 2.6041666667vw;
    margin: 0 7.2916666667vw 0 0
}

.zk5 .wrap .content .l .l_list {
    padding: 0 0 3.125vw
}

.zk5 .wrap .content .l .l_list:first-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    margin: 0 0 3.1770833333vw
}

.zk5 .wrap .content .l .l_list h1 {
    font-family: MiSans;
    font-weight: bold;
    font-size: 1.5625vw;
    color: #EC6815;
    margin: 0 0 1.0416666667vw
}

.zk5 .wrap .content .l .l_list .text2 {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.8
}

.zk5 .wrap .content .l .l_list .text {
    display: flex
}

.zk5 .wrap .content .l .l_list .text .pick:not(:last-child) {
    margin: 0 1.3020833333vw 0 0
}

.zk5 .wrap .content .l .l_list .text .pick p {
    font-family: MiSans;
    font-weight: 500;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw
}

.zk5 .wrap .content .l .l_list .text .pick p span {
    display: inline;
    color: #CCCCCC
}

.zk5 .wrap .content .pic {
    margin-top: -1.0416666667vw;
    width: 26.71875vw
}

.zk5 .wrap .content .pic img {
    width: 100%
}

.zk6 {
    height: 50vw;
    background: #323A4D;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk6 .wrap {
    width: 72.9166666667vw;
    margin: auto
}

.zk6 .wrap .title {
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    text-align: center;
    margin: 0 0 5.1041666667vw
}

.zk6 .wrap .content {
    display: flex;
    justify-content: space-between
}

.zk6 .wrap .content .matter {
    width: 33.8541666667vw
}

.zk6 .wrap .content .matter .top h1 {
    font-family: MiSans;
    font-size: 1.5625vw;
    color: #EC6815;
    margin: 0 0 1.4583333333vw
}

.zk6 .wrap .content .matter .top .text {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.8
}

.zk6 .wrap .content .matter .top .text2 {
    display: flex;
    gap: 0 3.125vw
}

.zk6 .wrap .content .matter .top .text2 .list {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.8
}

.zk6 .wrap .content .matter .pic {
    margin: 3.6458333333vw 0 0 0;
    width: 100%;
    height: 16.6666666667vw;
    box-shadow: inset 1px 1px 30px 0px #444c5e;
    border-radius: 1.0416666667vw;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk6 .wrap .content .matter .pic img {
    width: 31.1458333333vw
}

.zk6 .wrap .content .matter .pic.pic2 img {
    width: 16.4583333333vw
}

.zk7 {
    height: 50vw;
    background: linear-gradient(90deg, #222835, #2E3547);
    display: flex;
    align-items: center;
    justify-content: center
}

.zk7 .wrap {
    width: 72.2395833333vw
}

.zk7 .wrap .title {
    font-family: MiSans;
    font-weight: bold;
    text-align: center;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 3.5416666667vw
}

.zk7 .wrap .flex {
    display: flex;
    justify-content: space-between;
    margin: 0 0 4.5833333333vw
}

.zk7 .wrap .flex .list {
    width: 32.96875vw
}

.zk7 .wrap .flex .list h1 {
    font-family: MiSans;
    font-size: 1.5625vw;
    color: #EC6815;
    margin: 0 0 1.4583333333vw
}

.zk7 .wrap .flex .list p {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.8
}

.zk7 .wrap .content {
    position: relative;
    z-index: 2;
    width: 54.21875vw;
    margin: auto
}

.zk7 .wrap .content .img {
    width: 100%;
    position: relative;
    left: .7291666667vw
}

.zk7 .wrap .content .circle {
    position: absolute;
    width: 39.375vw;
    height: 39.375vw;
    border-radius: 50%;
    box-shadow: inset 1px 1px 30px 0px #444c5e;
    left: 50%;
    transform: translateX(-50%);
    top: -2.7604166667vw;
    z-index: -1;
    clip-path: inset(0 0 44% 0)
}

.zk8 {
    height: 50vw;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center
}

.zk8 .wrap {
    width: 63.28125vw
}

.zk8 .wrap .t1 {
    margin: 0 0 0 1.3541666667vw
}

.zk8 .wrap .t1 .title {
    font-family: MiSans;
    font-weight: 400;
    font-size: 2.5vw;
    color: #FFFFFF;
    line-height: 3.3333333333vw;
    margin: 0 0 3.0208333333vw
}

.zk8 .wrap .t1 .text {
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF;
    line-height: 1.875vw;
    opacity: 0.8
}

.zk8 .wrap .t1 .text span {
    font-family: MiSans;
    font-size: 1.25vw;
    color: #E76932;
    font-weight: bold
}

.zk8 .wrap .t2 {
    display: flex;
    margin: 5.15625vw 0 0 0
}

.zk8 .wrap .t2 .item:not(:last-child) {
    margin: 0 .8333333333vw 0 0
}

.zk8 .wrap .t2 .item .img {
    width: 11.40625vw
}

.zk8 .wrap .t2 .item .img img {
    width: 100%
}

.zk8 .wrap .t2 .item .text {
    font-family: MiSans;
    font-weight: 400;
    font-size: .7291666667vw;
    color: #FFFFFF;
    line-height: 1.25vw;
    text-align: center
}

.zk9 {
    position: relative;
    height: 50vw;
    z-index: 3;
    display: flex;
    align-items: center
}

.zk9 .wrap {
    width: 83.6458333333vw;
    margin: auto
}

.zk9 .wrap .title {
    font-family: MiSans;
    font-weight: bold;
    font-size: 2.5vw;
    color: #FFFFFF;
    margin: 0 0 3.59375vw;
    text-align: center
}

.zk9 .wrap .content {
    display: grid;
    grid-template-columns:repeat(5, 1fr);
    gap: 1.8229166667vw 1.40625vw
}

.zk9 .wrap .content .item {
    width: 100%
}

.zk9 .wrap .content .item .img {
    width: 100%
}

.zk9 .wrap .content .item .img img {
    width: 100%
}

.zk9 .wrap .content .text {
    height: 2.34375vw;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: MiSans;
    font-weight: 400;
    font-size: .9375vw;
    color: #FFFFFF
}
