@charset "utf-8";
/* CSS Document */

:root {
    --swiper-theme-color: #004bcc;
}


.footer {position: relative; z-index: 90; background: #0443af; padding: 60px 0; font-size: 20px; line-height: 38px; color: #fff; text-align: center; letter-spacing: calc(1em / 1000 * 50);}
.header {font-size: 0; position: relative; z-index: 90;}
.header img {width: 100%;}

.banner {font-size: 0; text-align: center; position: relative; z-index: 80;}
.banner a {display: block;}
.banner img {width: 1408px;}


.bg-group {position: relative;}
.bg-image {position: absolute; font-size: 0; z-index: -1; pointer-events: none;}
.bg-image img {max-width: 1920px;}


.classify-title {font-size: 0; text-align: center;}
.subtitle {width: 469px; height: 55px; background: url("../images/sub-title1.png") no-repeat; margin: 0 auto; box-sizing: border-box; display: flex; justify-content: center; align-items: center; font-size: 35px; line-height: 1; font-weight: bold; color: #282828;}
.subtitle.pure {background: url("../images/sub-title2.png") no-repeat; color: #fff; text-shadow: 2px 2px 3px rgba(0, 48, 123, 0.6);}
.g2-title {min-width: 215px; height: 58px; display: flex; align-items: center; font-size: 20px; line-height: 1; font-weight: bold; color: #fff; box-sizing: border-box; width: fit-content; padding: 0 100px 5px 30px; background: url("../images/g2-title1.png") no-repeat center / 100% 100%;}
.g2-title.pure {background: url("../images/g2-title2.png") no-repeat center / 100% 100%;}


.yee-button1 {width: 30px; height: 30px; background-size: 100% 100%; cursor: pointer;}
.yee-button1.swiper-button-disabled {opacity: 0.5;}
.yee-button1.prev {background-image: url("../images/button1-prev.png");}
.yee-button1.next {background-image: url("../images/button1-next.png");}

.yee-button2 {width: 60px; height: 60px; background-size: 100% 100%; cursor: pointer;}
.yee-button2.swiper-button-disabled {opacity: 0.5;}
.yee-button2.prev {background-image: url("../images/button2-prev.png");}
.yee-button2.next {background-image: url("../images/button2-next.png");}

.yee-button3 {width: 30px; height: 30px; background-size: 100% 100%; cursor: pointer;}
.yee-button3.swiper-button-disabled {opacity: 0.5;}
.yee-button3.prev {background-image: url("../images/button3-prev.png");}
.yee-button3.next {background-image: url("../images/button3-next.png");}

.yee-button4 {width: 50px; height: 50px; background-size: 100% 100%; cursor: pointer;}
.yee-button4.swiper-button-disabled {opacity: 0.5;}
.yee-button4.prev {background-image: url("../images/button4-prev.png");}
.yee-button4.next {background-image: url("../images/button4-next.png");}


.yee-button5 {width: 30px; height: 30px; background-size: 100% 100%; cursor: pointer;}
.yee-button5.swiper-button-disabled {opacity: 0.5;}
.yee-button5.prev {background-image: url("../images/button5-prev.png");}
.yee-button5.next {background-image: url("../images/button5-next.png");}





.md1 {width: 1200px; margin: 0 auto;}
.md1-head {width: 1200px; display: flex; align-items: center;}
.md1-image,
.md1-image .swiper-slide,
.md1-image .swiper-slide img {width: 712px; height: 400px;}
.md1-image .swiper-slide a {display: block;}
.md1-image {position: relative;}
.md1-image:before {content: ''; display: block; position: absolute; inset: 0; box-sizing: border-box; border: 2px solid #004bcc; z-index: 90; pointer-events: none;}
.md1-right {width: 488px;}
.md1-right:before,
.md1-right:after {content: ''; display: block; width: 24px; height: 30px; background: #0026cc;}
.md1-right:before {clip-path: polygon(0 0, 0% 100%, 100% 100%);}
.md1-right:after {clip-path: polygon(0 0, 0% 100%, 100% 0);}
.md1-menu {display: flex; height: 48px;}
.md1-menu .item {width: 179px; height: 40px; display: flex; justify-content: center; align-items: center; line-height: 1; text-align: center; box-sizing: border-box; background: #fff; border: 2px solid #004bcc; border-top: 0 none; border-radius: 0 0 18px 18px; margin-left: -2px; font-size: 20px; color: #282828; font-weight: bold; cursor: pointer; transition: height 0.3s;}
.md1-menu .item:first-child {width: 181px; margin-left: 0;}
.md1-menu .item.on {height: 48px; background: linear-gradient(#004bcc, #001dcc); border: 0 none; font-size: 22px; color: #fff; position: relative; z-index: 10;}

.md1-content {background: linear-gradient(to right, rgba(252, 241, 218, 0.5), #fcf1da);}
.md1-content,
.md1-content .swiper-slide {width: 488px; height: 340px;}
.md1-list {width: 400px; height: 100%; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; gap: 20px;}
.md1-list .item {width: 400px; height: auto; position: relative; padding-left: 15px; box-sizing: border-box;}
.md1-list .item:before {content: ''; display: block; width: 6px; height: 20px; background: #dd9835; position: absolute; left: 0; top: 4px;}
.md1-list .item .title {font-size: 18px; line-height: 27px; color: #232323; font-weight: bold;}
.md1-list .item .text {font-size: 16px; color: #232323; padding-top: 10px;}


.md2 {width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px;}
.md2 .group .head {font-size: 0;}
.md2 .group .head img {width: 100%;}
.md2 .group .image {position: relative;}
.md2 .group .image:before {content: ''; display: block; position: absolute; inset: 0; z-index: 20; box-sizing: border-box; border: 2px solid #3ec1fc; pointer-events: none;}
.md2 .group .image .box {font-size: 0;}
.md2 .group .image .box a {display: block;}
.md2 .group .image .box img {width: 100%; aspect-ratio: 376 / 212;}
.md2 .group .image .txt {width: 100%; height: 32px; box-sizing: border-box; padding: 0 1em; line-height: 32px; font-size: 16px; color: #fff; text-align: center; background: rgba(0, 0, 0, 0.6); position: absolute; left: 0; bottom: 0; z-index: 10;}
.md2 .group .list {display: grid; padding-top: 12px; gap: 5px;}
.md2 .group .list .item {display: flex; align-items: center; gap: 10px; height: 32px;}
.md2 .group .list .item:before {content: ''; display: block; width: 8px; height: 8px; background: #004bcc; border-radius: 50%;}
.md2 .group .list .item .title {flex: 1;}
.md2 .group .more {text-align: center; font-size: 15px; color: #004bcc; padding-top: 8px;}
.md2 .group .list .item {display: none;}
.md2 .group .list .item:nth-child(1),
.md2 .group .list .item:nth-child(2),
.md2 .group .list .item:nth-child(3) {display: flex;}
.md2 .group .list.show .item {display: flex;}




.md3 {height: 708px; background: url("../images/timeline.png") no-repeat center top / 1920px auto; position: relative;}
.md3-box {position: absolute; padding: 3px 0 0 30px;}
.md3-box .content {font-size: 17px; font-weight: bold; line-height: 23px; color: #4b4b4b; text-align: justify; letter-spacing: calc(1em / 1000 * 45);}
.md3-box .more {font-size: 12px; color: #004bcc; padding-top: 5px;}


.md4 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.md4-left {width: 500px;}
.md4-left-list {width: 100%; padding-top: 5px;}
.md4-left-list .item {padding: 15px 0; border-bottom: 2px solid #7099c1;}
.md4-left-list .item:first-child {padding-top: 0;}
.md4-left-list .item:last-child {padding-bottom: 0; border-bottom: 0 none;}
.md4-left-list .item .title {font-size: 20px; font-weight: bold; color: #282828;}
.md4-left-list .item .content {font-size: 16px; line-height: 27px; height: 54px; color: #282828; padding-top: 10px;}
.md4-left-bar {display: flex; justify-content: center; align-items: center; gap: 10px; padding-top: 10px;}
.md4-left-bar .swiper-pagination {
    --swiper-pagination-progressbar-size: 8px;
    --swiper-pagination-progressbar-bg-color: #8acaf9;
}
.md4-left-bar .swiper-pagination {position: static; left: auto; right: auto; top: auto; bottom: auto; width: 146px;}


.md4-right {width: 660px;}
.md4-right-swiper {width: 660px; height: 372px; box-shadow: 6px 6px 7px rgba(0, 48, 123, 0.7); position: relative;}
.md4-right-swiper:before {content: ''; display: block; box-sizing: border-box; inset: 0; position: absolute; z-index: 99; border: 3px solid #0018cc; pointer-events: none;}

.md4-right-swiper .yee-button2 {position: absolute; top: 50%; margin-top: -30px; z-index: 90;}
.md4-right-swiper .yee-button2.prev {left: 20px;}
.md4-right-swiper .yee-button2.next {right: 20px;}

.md4-right-swiper .swiper-slide {width: 660px; height: 372px; position: relative;}
.md4-right-swiper .swiper-slide .image {font-size: 0; width: 100%; height: 100%;}
.md4-right-swiper .swiper-slide .image a {display: block; width: 100%; height: 100%;}
.md4-right-swiper .swiper-slide .image img {width: 100%; height: 100%;}
.md4-right-swiper .swiper-slide .title {width: 100%; height: 50px; box-sizing: border-box; padding: 0 1em; font-size: 22px; line-height: 50px; text-align: center; color: #fff; background: rgba(0, 0, 0, 0.5); position: absolute; left: 0; bottom: 0; z-index: 10;}



.md5 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.md5-left {width: 654px;}
.md5-left-box {width: 654px; height: 368px; position: relative;}
.md5-left-box:after {content: ''; width: 360px; height: 198px; background: #f3bd51; position: absolute; right: -20px; bottom: -20px; opacity: 0.5;}
.md5-left-box .swiper,
.md5-left-box .swiper-slide {width: 654px; height: 368px;}
.md5-left-box .swiper-slide {position: relative;}
.md5-left-box .yee-button2 {position: absolute; top: 50%; margin-top: -30px; z-index: 90;}
.md5-left-box .yee-button2.prev {left: 20px;}
.md5-left-box .yee-button2.next {right: 20px;}
.md5-left-box .image {font-size: 0; position: relative; z-index: 2; box-shadow: 6px 6px 7px rgba(0, 48, 123, 0.7);}
.md5-left-box .image a {display: block;}
.md5-left-box .image img {width: 654px; height: 368px;}
.md5-left-box .title {width: 100%; height: 50px; line-height: 50px; text-align: center; font-size: 22px; color: #fff; background: rgba(0, 0, 0, 0.5); position: absolute; left: 0; bottom: 0; z-index: 5; padding: 0 1em; box-sizing: border-box;}

.md5-right {width: 504px;}
.md5-right-list {width: 100%;}
.md5-right-list .item {position: relative; padding: 0 0 24px 15px;}
.md5-right-list .item:before {content: ''; display: block; width: 6px; height: 24px; background: linear-gradient(#f4be51, #d78f2d); position: absolute; left: 0; top: 3px;}
.md5-right-list .item .title {font-size: 24px; font-weight: bold; color: #282828; line-height: 30px;}
.md5-right-list .item .content {font-size: 18px; color: #282828; line-height: 27px; height: 54px; padding-top: 10px;}


.md5-right-bar {display: flex; justify-content: center; align-items: center; gap: 10px;}
.md5-right-bar .swiper-pagination {
    --swiper-pagination-progressbar-size: 8px;
    --swiper-pagination-color: #d78f2d;
    --swiper-pagination-progressbar-bg-color: #dfd3a8;
}
.md5-right-bar .swiper-pagination {position: static; left: auto; right: auto; top: auto; bottom: auto; width: 146px;}



.md6 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.md6-left {width: 570px;}
.md6-left-list {display: grid; gap: 20px;}
.md6-left-list .item {display: block; width: 570px; height: 66px; position: relative;}
.md6-left-list .item .title,
.md6-left-list .item .default,
.md6-left-list .item .hover {position: absolute; inset: 0;}
.md6-left-list .item .default,
.md6-left-list .item .hover {font-size: 0;}
.md6-left-list .item .default img,
.md6-left-list .item .hover img {width: 100%; height: 100%; filter: drop-shadow(1px 1px 3px rgba(3, 38, 99, 0.5));}
.md6-left-list .item .default {display: block;}
.md6-left-list .item .hover {display: none;}

.md6-left-list .item .title {z-index: 10; box-sizing: border-box; line-height: 66px; padding: 0 30px; font-size: 20px; color: #282828;}
.md6-left-list .item:hover .title {color: #fff; font-weight: bold;}
.md6-left-list .item:hover .default {display: none;}
.md6-left-list .item:hover .hover {display: block;}

.md6-right {width: 580px;}

.md6-right-swiper {width: 580px; height: 238px; margin: 0 auto; padding-bottom: 30px;}
.md6-right-swiper .swiper-slide {height: 220px; background: #d2f4ff; margin-top: 18px; transition: margin-top 0.3s;}
.md6-right-swiper .swiper-slide-prev,
.md6-right-swiper .swiper-slide-next {position: relative; z-index: 10;}
.md6-right-swiper .swiper-slide .item {width: 100%; height: 100%; box-sizing: border-box; background: linear-gradient(#43b7d1, #004bcc); border-radius: 22px; padding: 2px; position: relative;}
.md6-right-swiper .swiper-slide .item .mask {display: block; position: absolute; inset: 0; z-index: 10; background: #d2f4ff; opacity: 0.4;}
.md6-right-swiper .swiper-slide .item .box {width: 100%; height: 100%; box-sizing: border-box; background: #fff; border-radius: 20px; padding: 3px;}
.md6-right-swiper .swiper-slide .item .border {width: 100%; height: 100%; box-sizing: border-box; border: 2px solid #6fc7f4; border-radius: 18px; padding: 8px;}
.md6-right-swiper .swiper-slide .item .image {width: 100%; font-size: 0;}
.md6-right-swiper .swiper-slide .item .image a {display: block;}
.md6-right-swiper .swiper-slide .item .image img {width: 100%; height: 112px; border-radius: 12px 12px 0 0;}
.md6-right-swiper .swiper-slide .item .title {padding: 6px 15px 0 15px; font-size: 16px; font-weight: bold; color: #282828; line-height: 20px; text-align: justify; -webkit-line-clamp: 3;}
.md6-right-swiper .swiper-slide .item .button {display: none; font-size: 0; position: absolute; left: 50%; margin-left: -18px; bottom: -12px;}
.md6-right-swiper .swiper-slide .item .button a {display: block;}
.md6-right-swiper .swiper-slide .item .button img {width: 36px; height: 36px; filter: drop-shadow(2px 1px 2px #c30d23);}


.md6-right-swiper .swiper-slide-active {position: relative; z-index: 20; margin-top: 0;}
.md6-right-swiper .swiper-slide-active .item .mask {display: none;}
.md6-right-swiper .swiper-slide-active .item .box {background: none;}
.md6-right-swiper .swiper-slide-active .item .border {border-color: #ffd696;}
.md6-right-swiper .swiper-slide-active .item .button {display: block;}
.md6-right-swiper .swiper-slide-active .item .title {color: #fff;}


.md6-right-image {width: 580px; height: 238px; font-size: 0; position: relative;}
.md6-right-image:before {content: ''; display: block; position: absolute; inset: 0; box-sizing: border-box; border: 2px solid #003da4; pointer-events: none; z-index: 2;}
.md6-right-image .swiper,
.md6-right-image .swiper-slide {width: 580px; height: 238px;}
.md6-right-image .swiper-slide {position: relative;}
.md6-right-image a {display: block; width: 100%; height: 100%;}
.md6-right-image img {width: 100%; height: 100%;}

.md6-right-image .yee-button2 {width: 40px; height: 40px; position: absolute; top: 50%; margin-top: -20px; z-index: 90;}
.md6-right-image .yee-button2.prev {left: 20px;}
.md6-right-image .yee-button2.next {right: 20px;}




.md7-right-bar {display: flex; justify-content: center; align-items: center; gap: 10px;}
.md7-right-bar .swiper-pagination {
    --swiper-pagination-progressbar-size: 8px;
    --swiper-pagination-color: #d78f2d;
    --swiper-pagination-progressbar-bg-color: #dfd3a8;
}
.md7-right-bar .swiper-pagination {position: static; left: auto; right: auto; top: auto; bottom: auto; width: 146px;}


.md8 {width: 100%;}
.md8-head {width: 1200px; margin: 0 auto;}
.md8-head-box {width: 100%; height: auto; display: flex; align-items: center; gap: 30px; box-sizing: border-box; padding-left: 80px;}
.md8-head-face {width: 337px; height: 336px; position: relative; box-sizing: border-box; padding: 34px 0 0 32px; background: url("../images/md8-face.png") no-repeat center / 100% 100%;}
.md8-head-image {font-size: 0;}
.md8-head-image img {width: 259px; height: 259px; border-radius: 50%;}
.md8-head-name {min-width: 134px; height: 32px; background: linear-gradient(to right, rgba(0, 75, 204, 0), #004bcc, #004bcc); text-align: right; font-size: 24px; font-weight: bold; color: #fff; line-height: 32px; position: absolute; right: 63px; bottom: 63px; box-sizing: border-box; padding: 0 20px;}
.md8-head-main {width: 640px;}
.md8-head-title {font-size: 20px; line-height: 32px; font-weight: bold; color: #282828;}
.md8-head-content {font-size: 18px; line-height: 30px; color: #282828;}
.md8-head-news {display: grid; gap: 20px; padding-top: 20px;}
.md8-head-news .item {position: relative; font-size: 18px; color: #282828; padding-left: 24px;}
.md8-head-news .item:before {content: ''; display: block; width: 10px; height: 10px; background: #004bcc; position: absolute; left: 0; top: 50%; margin-top: -5px;}


.md8-foot {display: flex; align-items: center; justify-content: center; gap: 30px;}
.md8-foot .swiper {width: 1200px; margin: 0;}
.md8-foot .swiper .swiper-slide .item {position: relative; cursor: pointer;}
.md8-foot .swiper .swiper-slide .item:after {content: ''; display: block; width: 100%; height: calc(100% - 93px); box-sizing: border-box; border: 2px solid #004bcc; position: absolute; left: 0; bottom: 0; opacity: 0; transition: opacity 0.3s;}
.md8-foot .swiper .swiper-slide .item .image {width: 186px; height: 186px; margin: 0 auto; border-radius: 50%; font-size: 0; box-sizing: border-box; border: 3px solid #004bcc; position: relative; z-index: 10;}
.md8-foot .swiper .swiper-slide .item .image img {width: 100%; height: 100%; border-radius: 50%;}
.md8-foot .swiper .swiper-slide .item .intro {text-align: center; padding: 15px 20px; position: relative; z-index: 10;}
.md8-foot .swiper .swiper-slide .item .intro .name {font-size: 20px; font-weight: bold; color: #282828;}
.md8-foot .swiper .swiper-slide .item .intro .mark {font-size: 18px; line-height: 24px; color: #282828; padding-top: 10px;}
.md8-foot .swiper .swiper-slide .item .intro .more {font-size: 15px; color: #004bcc; padding-top: 10px;}
.md8-foot .swiper .swiper-slide .item.on:after {opacity: 1;}


.md9 {width: 1082px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 36px; column-gap: 70px;}
.md9 .item {width: 506px; height: 212px; box-sizing: border-box; padding-left: 106px; position: relative;}
.md9 .item .image {font-size: 0; position: relative;}
.md9 .item .image:before {content: ''; display: block; width: 40%; height: 100%; position: absolute; left: 0; top: 0; background: linear-gradient(to right, #d2f4ff, rgba(210, 244, 255, 0)); z-index: 10; pointer-events: none;}
.md9 .item .image a {display: block;}
.md9 .item .image img {width: 400px; height: 212px;}
.md9 .item .box {width: 212px; height: 212px; position: absolute; left: 0; top: 0; z-index: 20;}
.md9 .item .box .bg-img {width: 100%; height: 100%; font-size: 0;}
.md9 .item .box .bg-img img {width: 100%; height: 100%; filter: drop-shadow(1px 1px 6px rgba(219, 149, 50, 0.9));}
.md9 .item .box .con {position: absolute; inset: 0; display: flex; flex-direction: column; gap: 5px; z-index: 10; justify-content: center; align-items: center; text-align: center; box-sizing: border-box; padding-top: 20px;}
.md9 .item .box .con .name {font-size: 24px; font-weight: bold; color: #282828;}
.md9 .item .box .con .mark {max-width: 7em; font-size: 18px; line-height: 28px; color: #282828;}
.md9 .item .box .con .more {font-size: 15px; line-height: 28px; color: #ac690f;}


.md10 {width: 1220px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; padding-left: 20px;}
.md10-left {width: 480px; background: #edfbff; box-shadow: 1px 1px 3px rgba(3, 38, 99, 0.6);}
.md10-left .image {font-size: 0;}
.md10-left .image a {display: block;}
.md10-left .image img {width: 100%; aspect-ratio: 480 / 270;}
.md10-left .intro {padding: 10px 30px;}
.md10-left .intro .title {font-size: 20px; font-weight: bold; color: #282828;}
.md10-left .intro .content {font-size: 14px; line-height: 23px; color: #282828; padding-top: 5px; -webkit-line-clamp: 3; text-align: justify; text-indent: 2em;}

.md10-right {width: 680px; padding: 0 10px 60px 10px; margin: 0 10px 0 0;}
.md10-right .swiper-pagination {
    --swiper-pagination-bullet-horizontal-gap: 10px;
    --swiper-pagination-bullet-size: 22px;
    --swiper-pagination-bullet-inactive-color: #004bcc;
}
.md10-right .swiper-pagination {font-size: 0;}
.md10-right-list {display: grid; gap: 25px;}
.md10-right-list .item {width: 100%; height: 66px; position: relative;}
.md10-right-list .item .title {width: 100%; height: 100%; position: relative; z-index: 10; font-size: 18px; color: #282828; font-weight: bold; line-height: 66px; box-sizing: border-box; padding: 0 30px;}
.md10-right-list .item .bg-img {position: absolute; inset: 0; font-size: 0;}
.md10-right-list .item .bg-img img {width: 100%; height: 100%; filter: drop-shadow(1px 1px 3px rgba(3, 38, 99, 0.5));}
.md10-right-list .item .bg-img.odd {display: block;}
.md10-right-list .item .bg-img.even {display: none;}

.md10-right-list .item:nth-child(even) .bg-img.odd {display: none;}
.md10-right-list .item:nth-child(even) .bg-img.even {display: block;}




.md11 {width: 1200px; margin: 0 auto; display: grid; gap: 60px;}
.md11 .group {display: flex; align-items: flex-start;}
.md11 .group .column {width: 50%;}
.md11 .group .box {position: relative;}
.md11 .group .box .image {font-size: 0;}
.md11 .group .box .image a {display: block;}
.md11 .group .box .image img {width: 100%; aspect-ratio: 600 / 338;}
.md11 .group .box .title {width: 100%; height: auto; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(0, 0, 0, 0.5); font-size: 20px; line-height: 32px; color: #fff; text-align: center; padding: 5px 1em; box-sizing: border-box;}
.md11 .group .list {padding: 30px 35px 0 35px; display: grid; gap: 15px;}
.md11 .group .list .item {position: relative; padding-left: 30px; font-size: 20px; color: #282828; line-height: 30px;}
.md11 .group .list .item:before {content: ''; display: block; width: 14px; height: 16px; position: absolute; left: 0; top: 50%; margin-top: -8px; background: #004bcc; clip-path: polygon(0 0, 0% 100%, 100% 50%);}
.md11 .group .more {text-align: center; font-size: 15px; color: #004bcc; line-height: 1; padding-top: 30px;}

.md11 .group:nth-child(even) .column:first-child {order: 1;}
.md11 .group:nth-child(even) .column:first-child .list {padding: 30px 50px 0 50px;}
.md11 .group:nth-child(even) .column:last-child {order: 0;}

.md11 .group .list .item {display: none;}
.md11 .group .list .item:nth-child(1),
.md11 .group .list .item:nth-child(2),
.md11 .group .list .item:nth-child(3),
.md11 .group .list .item:nth-child(4),
.md11 .group .list .item:nth-child(5) {display: block;}
.md11 .group .list.show .item {display: block;}



.md12 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.md12-left {width: 530px; margin: 0;}
.md12-left .swiper-pagination {
    --swiper-pagination-bullet-horizontal-gap: 5px;
    --swiper-pagination-bullet-size: 10px;
    --swiper-pagination-bullet-border-radius: 5px;
    --swiper-pagination-bullet-inactive-opacity: 1;
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-color: #03e5fb;
}
.md12-left .swiper-pagination {font-size: 0; bottom: 0;}
.md12-left .swiper-pagination .swiper-pagination-bullet {transition: width 0.3s;}
.md12-left .swiper-pagination .swiper-pagination-bullet-active {width: 40px;}
.md12-left-list {height: 354px;}
.md12-left-list .item {border-bottom: 2px dashed #20bafb; padding: 20px 0;}
.md12-left-list .item:first-child {padding-top: 0;}
.md12-left-list .item:last-child {border-bottom: 0 none;}
.md12-left-list .item .title {position: relative; padding: 0 15px 0 35px; font-size: 20px; line-height: 30px; height: 30px; color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);}
.md12-left-list .item .title:before {content: ''; display: block; width: 12px; height: 12px; border: 2px solid #fff; box-sizing: border-box; position: absolute; left: 15px; top: 50%; margin-top: -6px;}
.md12-right {width: 630px; position: relative; box-shadow: 1px 1px 3px rgba(1, 20, 93, 0.9);}
.md12-right .play {display: block; font-size: 0; width: 100px; height: 100px; position: absolute; left: 50%; margin-left: -50px; top: 50%; margin-top: -50px; z-index: 10; cursor: pointer; opacity: 0.8;}
.md12-right .play img {width: 100%; height: 100%;}
.md12-right .image {font-size: 0;}
.md12-right .image a {display: block;}
.md12-right .image img {width: 100%; aspect-ratio: 630 / 354;}


.md13 {display: grid; gap: 35px;}
.md13-head {display: grid; gap: 35px;}
.md13-head .row {display: flex; justify-content: center;}
.md13-head .row .group {display: flex; gap: 24px; align-items: center; padding-right: 120px;}
.md13-head .row:nth-child(even) .group {padding-right: 0; padding-left: 120px;}
.md13-head .item {width: 594px; height: 64px; background: linear-gradient(to right, #fff2d8, #ffca81); border-radius: 32px; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2); font-size: 20px; font-weight: bold; color: #282828; display: flex; justify-content: center; align-items: center; text-align: center; line-height: 1; box-sizing: border-box; border: 2px solid #f3bd51;}


.md13-foot {width: 1200px; height: 125px; margin: 0 auto; background: url("../images/md13-foot.png") no-repeat center / 100% 100%; font-size: 25px; font-weight: bold; color: #282828; line-height: 90px; text-align: center;}
.md13-foot {
    text-shadow: -2px -2px 0 #fff2d8,
    2px -2px 0 #fff2d8,
    -2px 2px 0 #fff2d8,
    2px 2px 0 #fff2d8,
    -2px 0 0 #fff2d8,
    2px 0 0 #fff2d8,
    0 -2px 0 #fff2d8,
    0 2px 0 #fff2d8;
}



.md14 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.md14-left {width: 630px; position: relative; box-shadow: 1px 1px 3px rgba(1, 20, 93, 0.9);}
.md14-left .image {font-size: 0;}
.md14-left .image a {display: block;}
.md14-left .image img {width: 100%; aspect-ratio: 630 / 354;}
.md14-left .title {width: 100%; height: auto; position: absolute; left: 0; bottom: 0; z-index: 10; box-sizing: border-box; background: rgba(0, 66, 180, 0.7); font-size: 22px; line-height: 34px; font-weight: bold; text-align: center; padding: 5px 1em; color: #fff;}

.md14-right {width: 540px;}
.md14-right .item {display: flex; align-items: flex-start; gap: 18px; font-size: 20px; line-height: 46px; color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);}
.md14-right .item:before {content: ''; display: block; width: 12px; height: 12px; border: 2px solid #00f0ff; box-sizing: border-box; margin-top: 17px; flex: none;}




.md15 {width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.md15-left {width: 920px; height: 518px; box-sizing: border-box; background: linear-gradient(#f3be51, #d8912f); padding: 10px;}
.md15-left .swiper {width: 900px; height: 498px;}
.md15-left .swiper-slide .box {width: 900px; height: 498px; position: relative;}
.md15-left .swiper-slide .box .image {font-size: 0; width: 100%; height: 100%;}
.md15-left .swiper-slide .box .image a {display: block; width: 100%; height: 100%;}
.md15-left .swiper-slide .box .image img {width: 100%; height: 100%;}
.md15-left .swiper-slide .box .play {display: block; width: 140px; height: 140px; font-size: 0; position: absolute; left: 50%; margin-left: -70px; top: 50%; margin-top: -70px; z-index: 20; opacity: 0.7;}
.md15-left .swiper-slide .box .title {width: 100%; height: 50px; line-height: 50px; text-align: center; font-size: 20px; font-weight: bold; color: #fff; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(40, 40, 40, 0.8);}


.md15-right {width: 270px; height: 518px; display: flex; flex-direction: column; gap: 9px;}
.md15-right .button {width: 100%; height: 14px; background: #ffe09f; display: flex; justify-content: center; align-items: center; font-size: 0; cursor: pointer;}
.md15-right .button img {width: 26px; height: 10px;}
.md15-right .button.swiper-button-disabled {pointer-events: none; opacity: 0.5;}
.md15-right .swiper {width: 270px; height: 472px;}
.md15-right .swiper .swiper-slide {width: 270px; height: 152px;}
.md15-right .swiper .swiper-slide .box {width: 100%; height: 100%; position: relative; cursor: pointer;}
.md15-right .swiper .swiper-slide .box .image {font-size: 0; width: 100%; height: 100%;}
.md15-right .swiper .swiper-slide .box .image img {width: 100%; height: 100%;}
.md15-right .swiper .swiper-slide .box .title {width: 100%; height: 36px; line-height: 36px; font-size: 16px; color: #fff; position: absolute; left: 0; bottom: 0; padding: 0 1em; box-sizing: border-box; z-index: 10; text-align: center;}
.md15-right .swiper .swiper-slide .box.on .title {display: flex; height: 100%; font-size: 18px; line-height: 28px; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.4);}




.md16 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.md16-left {width: 580px;}
.md16-left-title {width: 580px; height: 66px; position: relative;}
.md16-left-title .text {position: absolute; inset: 0; z-index: 10; display: flex; justify-content: center; align-items: center; font-size: 20px; color: #fff; font-weight: bold;}
.md16-left-title .image {font-size: 0; width: 100%; height: 100%;}
.md16-left-title .image img {width: 100%; height: 100%; filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5));}
.md16-left-list {width: auto;}
.md16-left-list .item {border-bottom: 2px dashed #6295d7; padding: 20px; display: flex; align-items: center; gap: 10px;}
.md16-left-list .item:before {content: ''; display: block; width: 12px; height: 12px; border: 2px solid #282828; box-sizing: border-box; flex: none;}
.md16-left-list .item .title {flex: 1; font-size: 20px; color: #282828; line-height: 32px;}
.md16-left-list .item:last-child {padding-bottom: 0; border-bottom: 0 none;}


.md16-right {width: 594px; height: 334px; margin: 0;}
.md16-right .swiper-pagination {width: auto; left: auto; right: 10px; bottom: 0; height: 38px; display: flex; align-items: center; gap: 6px;}
.md16-right .swiper-pagination .swiper-pagination-bullet {width: 14px; height: 14px; background: #fff; opacity: 0.4; border-radius: 0; margin: 0;}
.md16-right .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1;}
.md16-right .swiper-slide .box {width: 594px; height: 334px; position: relative;}
.md16-right .swiper-slide .box .image {font-size: 0; width: 100%; height: 100%;}
.md16-right .swiper-slide .box .image a {display: block; width: 100%; height: 100%;}
.md16-right .swiper-slide .box .image img {width: 100%; height: 100%;}
.md16-right .swiper-slide .box .play {display: block; width: 50px; height: 50px; font-size: 0; position: absolute; left: 24px; bottom: 60px; z-index: 20;}
.md16-right .swiper-slide .box .title {width: 100%; height: 38px; box-sizing: border-box; padding: 0 100px 0 24px; line-height: 38px; font-size: 18px; font-weight: bold; color: #fff; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(0, 66, 180, 0.7);}




.md17 {width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start;}
.md17-left {width: 650px; display: flex; align-items: flex-start; gap: 30px; flex-wrap: wrap;}
.md17-left .item {width: 310px; height: 170px; position: relative;}
.md17-left .item .image {font-size: 0; width: 100%; height: 100%;}
.md17-left .item .image a {display: block; width: 100%; height: 100%;}
.md17-left .item .image img {width: 100%; height: 100%;}
.md17-left .item .title {width: 100%; height: 30px; line-height: 30px; font-size: 16px; font-weight: bold; color: #fff; text-align: center; box-sizing: border-box; padding: 0 1em; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(0, 66, 180, 0.7);}


.md17-right {width: 510px;}
.md17-right-list {display: grid; gap: 24px;}
.md17-right-list .item {display: flex; align-items: center; gap: 12px;}
.md17-right-list .item:before {content: ''; display: block; width: 14px; height: 16px; background: #004bcc; clip-path: polygon(0 0, 0% 100%, 100% 50%);}
.md17-right-list .item .title {flex: 1; font-size: 20px; line-height: 24px; color: #282828;}
.md17-right-more {text-align: center; font-size: 15px; color: #004bcc; line-height: 1; padding-top: 30px;}

.md17-flip .md17-left {order: 1;}
.md17-flip .md17-right {order: 0;}

.md17-right-list .item {display: none;}
.md17-right-list .item:nth-child(1),
.md17-right-list .item:nth-child(2),
.md17-right-list .item:nth-child(3),
.md17-right-list.show .item {display: flex;}


.md18 {display: flex; justify-content: center; align-items: center; gap: 20px;}
.md18 .swiper {width: 1200px; margin: 0;}
.md18-list {width: 1200px; height: auto; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr);}
.md18-list .item {height: 226px;}
.md18-list .item .box {position: relative; width: 100%; height: 100%;}
.md18-list .item .box .image {font-size: 0; width: 100%; height: 100%;}
.md18-list .item .box .image a {display: block; width: 100%; height: 100%;}
.md18-list .item .box .image img {width: 100%; height: 100%;}
.md18-list .item .box .title {width: 100%; height: 36px; line-height: 36px; font-size: 20px; color: #fff; text-align: center; box-sizing: border-box; padding: 0 1em; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(0, 66, 180, 0.7);}
.md18-list .item .content {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center; font-size: 20px; font-weight: bold; color: #fff; line-height: 38px; text-shadow: 2px 2px 3px rgba(1, 20, 93, 0.8); background: linear-gradient(#004bcc, #377ffa, #004bcc);}



.md19 {display: flex; justify-content: center; align-items: center; gap: 10px;}
.md19 .swiper {width: 1200px; padding: 10px; margin: 0;}
.md19-list {display: grid; grid-template-columns: repeat(3, 1fr); row-gap: 25px; column-gap: 15px;}
.md19-list .item {height: 130px; border-radius: 50%; display: flex; justify-content: center; align-items: center; text-align: center; font-size: 20px; font-weight: bold; color: #282828; line-height: 38px; background: linear-gradient(to right bottom, #fff2d8, #ffca81); box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);}
.md19-list .item:nth-child(even) {background: linear-gradient(to right bottom, #50b7ff, #1567f4); color: #fff; text-shadow: 2px 2px 3px rgba(1, 20, 93, 0.8);}


.md20 {position: relative;}
.md20:after {content: ''; display: block; width: 100%; height: 350px; max-height: 100%; background: linear-gradient(rgba(32, 108, 228, 0), #206ce4); position: absolute; left: 0; bottom: 0;}
.md20-main {position: relative; z-index: 10;}


.md20-head {width: 940px; height: 530px; position: relative; margin: 0 auto;}
.md20-head:after {content: ''; width: 1030px; height: 438px; position: absolute; left: 50%; margin-left: -515px; top: 50%; margin-top: -219px; background: #aad8ff; border-radius: 16px;}
.md20-head-box {width: 100%; height: 100%; position: relative; z-index: 20;}
.md20-head-box:before {content: ''; position: absolute; inset: 0; box-sizing: border-box; border: 3px solid #377ffa; border-radius: 16px; pointer-events: none; z-index: 40;}
.md20-head-box .image {font-size: 0; width: 100%; height: 100%; border-radius: 16px; box-shadow: 0 9px 7px rgba(1, 20, 93, 0.4);}
.md20-head-box .image a {display: block; width: 100%; height: 100%;}
.md20-head-box .image img {width: 100%; height: 100%; border-radius: 16px;}
.md20-head-box .play {display: block; width: 90px; height: 90px; font-size: 0; position: absolute; left: 40px; bottom: 90px; z-index: 20;}
.md20-head-box .title {width: 100%; height: 53px; line-height: 50px; padding: 0 1em; box-sizing: border-box; font-size: 24px; font-weight: bold; color: #fff; position: absolute; left: 0; bottom: 0; z-index: 10; background: rgba(0, 0, 0, 0.4); text-align: center; border-radius: 0 0 16px 16px;}


.md20-foot {width: 1200px; margin: 0 auto;}
.md20-foot-list {display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 40px;}
.md20-foot-list .item {display: flex; align-items: center; gap: 10px;}
.md20-foot-list .item:before {content: ''; display: block; width: 14px; height: 14px; background: #fff; border-radius: 50%; flex: none;}
.md20-foot-list .item .title {flex: 1; font-size: 22px; line-height: 40px; color: #fff;}

.md20-foot-bar {display: flex; justify-content: center; align-items: center; gap: 10px;}
.md20-foot-bar .swiper-pagination {
    --swiper-pagination-progressbar-size: 8px;
    --swiper-pagination-color: #00e4ff;
    --swiper-pagination-progressbar-bg-color: #ffffff;
}
.md20-foot-bar .swiper-pagination {position: static; left: auto; right: auto; top: auto; bottom: auto; width: 146px;}




.toggle-list-button:before {content: '-查看更多-'; display: inline;}
.toggle-list-button:after {content: '-收起更多-'; display: none;}
.toggle-list-button.show:before {display: none;}
.toggle-list-button.show:after {display: inline;}