/*
* @Author: Sun Jijing
* @Date:   2024-10-08 10:35:14
* @Last Modified by:   Sun Jijing
* @Last Modified time: 2024-10-10 14:42:46
*/

.ywtc { width: 85px; }

* { box-sizing: border-box; }
body { background: #1a37b8; }

.zt_banner { overflow: hidden; }
.zt_banner img { display: block; width: 100%; }

.szjw_box { padding: 50px 0 80px; }
.szjw_left { background: #1146e9; padding: 20px; margin-bottom: 20px; display: flex; justify-content: space-between; }
.szjw_left a { display: flex; align-items: center; height: 103px; background: url(box_bg.png) center center no-repeat; padding: 0 35px 0 11px; line-height: 103px; width: 24%; border-radius: 10px; }
.szjw_left a img { vertical-align: middle; }
.szjw_left a span { display: table-cell; font-size: 24px; font-weight: bold; color: #1146e9; vertical-align: middle; line-height: normal; padding-left: 14px; }
.szjw_right { width: 100%; height: 569px; background: #1146e9; position: relative; overflow: hidden; }
.wrap-swiper.swiper-container { -width: 581px; height: 389px;  border-radius: 12px; margin: 40px 30px; }
.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide { width: 581px; height: 389px; background: #dbeffc; border-radius: 12px; padding: 26px 33px 0; }
.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide .nav { text-align: center; }
.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide .nav li { display: inline-block; width: 152px; height: 40px; border-radius: 20px; border: 1px solid #1146e9; cursor: pointer; font-size: 20px; color: #207df5; text-align: center; line-height: 40px; margin-right: 15px; transition: all .5s; }
.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide .nav li.on { background: #1146e9; color: #fff; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container { height: 279px; margin-top: 22px; border-radius: 12px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide { background: #fff; border-radius: 12px; width: 515px; height: 279px; padding: 32px 25px 0 10px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul { height: 216px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #1146e9 #f4f4f4; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li { margin-bottom: 18px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li:last-child { margin-bottom: 0; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li::before { content: ''; display: inline-block; width: 27px; height: 19px; background: url(list_icon.png) center center no-repeat; vertical-align: middle; margin-right: 4px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li a { display: inline-block; width: 90%; font-size: 16px; color: #333333; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li a:hover { color: #1146e9; }

.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::-webkit-scrollbar { width: 8px; height: 5px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::-webkit-scrollbar-track { background: #e8e8e8; border-radius: 2px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::-webkit-scrollbar-thumb { background: #1146e9; border-radius: 10px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::-webkit-scrollbar-thumb:hover { background: #999; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::-webkit-scrollbar-corner { background: #204754; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::scrollbar { width: 8px; height: 5px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::scrollbar-track { background: #e8e8e8; border-radius: 2px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::scrollbar-thumb { background: #1146e9; border-radius: 10px; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::scrollbar-thumb:hover { background: #999; }
.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul::scrollbar-corner { background: #204754; }

.wrapNav { position: absolute; bottom: 35px; width: 100%; text-align: center; }
.wrapNav li { width: 139px; height: 101px; display: inline-block; background: url(/bjsdxqrmzf/uiFramework/commonResource/image/2024112017040994889.png) center center no-repeat; font-size: 20px; font-weight: bold; color: #fff; text-align: center; padding-top: 25px; margin-right: 45px; cursor: pointer; transition: all .5s; }
.wrapNav li.on { background: url(/bjsdxqrmzf/uiFramework/commonResource/image/2024112017045599732.png) center center no-repeat; color: #2ef9ff; }
.wrapNav li:last-child { margin-right: 0; }

@media screen and (max-width: 1200px){
	.szjw_box { padding: 50px 0; }
	.szjw_left { width: 100%; float: none; background: none; padding: 0; height: auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
	.szjw_left a { display: inline-flex; background-size: 100% 100%; width: 48%; }

	.szjw_right { width: 100%; float: none; background: none; padding: 0; height: auto; }
	.wrap-swiper.swiper-container { margin: 0; }
	.wrapNav { position: static; }
}

@media screen and (max-width: 768px){
	.szjw_left a { width: 100%; height: auto; padding: 10px 20px; font-size: 18px; margin-bottom: 10px; }
	.szjw_left a img { height: 40px; }
	.szjw_left a span { font-size: 18px; }
	.wrap-swiper.swiper-container { height: auto; }
	.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide { padding: 10px; height: auto; }
	.wrap-swiper.swiper-container > .swiper-wrapper > .swiper-slide .nav li { width: auto; height: 32px; line-height: 32px; margin-right: 10px; padding: 0 10px; font-size: 16px; }
	.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container { margin-top: 20px; height: auto; }
	.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide { padding: 10px; height: auto; }
	.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul { height: auto; }
	.wrap-swiper > .swiper-wrapper > .swiper-slide .swiper-container .swiper-slide ul li { display: flex; }
	.wrapNav { display: flex; justify-content: space-between; }
	.wrapNav li { background-size: 100% auto; width: 24%; margin-right: 0; font-size: 18px; }
	.wrapNav li.on { background-size: 100% auto; }
}

@media screen and (max-width: 460px){
	.szjw_box { padding: 30px 0; }
}