.tabs-title-box { width: 100%; height: 35px; box-sizing: border-box; border-bottom: 2px solid #ccc; display: flex; } .tabs-title-box .tabs-title-box-item { width: 110px; height: 35px; line-height: 20px; text-align: center; position: relative; display: inline-block; } .tabs-title-box .tabs-title-box-item a { color: #3397df; font-size: 20px; font-weight: bold; } .tabs-title-box .tabs-title-box-item.on a { color: #1c5fb0; } .tabs-title-box .tabs-title-box-item.on::after { content: ""; position: absolute; width: 100%; bottom: 0; left: 0; border-bottom: 3px solid #1c5fb0; } .index-main { width: 100%; background: no-repeat center center / cover; } /* .index-main-wrapper { width: 1200px; margin: 0 auto; } */ /*景区荣耀*/ .index-main-glory { width: 100%; height: 42px; /* background-color: #f7f7f7; */ margin-bottom: 10px; } .index-main-item6 { padding-bottom: 60px; width: 100%; background: no-repeat bottom center / 100%; } .index-main-item6 .index-main-item6-title { width: 1200px; margin: 0 auto 20px; display: flex; align-items: center; } .index-main-item6 .index-main-item6-title > img { margin-right: 16px; width: 22px; height: 16px; } .index-main-item6 .index-main-item6-title > a { font-size: 24px; font-weight: bold; color: #333; } .index-main-item6-wrapper { width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; } .index-main-item6 .index-main-item6-left { width: 376px; min-height: 100px; } .index-main-item6-left .index-main-item6-banner { width: 100%; height: 254px; } .index-main-item6 .index-main-item6-right { width: 800px; } .index-main-item6-right .index-main-item6-right-tabs { /* background-color: #ffffff; */ width: 100%; height: 40px; display: flex; } .index-main-item6-right-tabs .index-main-item6-right-tabs-item { flex: 1; display: flex; align-items: center; } .index-main-item6-right-tabs .index-main-item6-right-tabs-item-icon { width: 18px; height: 18px; text-align: center; line-height: 18px; } .index-main-item6-right .index-main-item6-right-con { width: 100%; height: 195px; padding: 10px 0; /* background-color: #fff; */ display: flex; flex-wrap: wrap; align-content: space-between; } .index-main-item6-right .index-main-item6-right-con-item { width: 50%; padding: 0 16px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; line-height: 1; } .index-main-item6-right-con-item:after { position: absolute; left: 4px; top: calc(50% - 1px); content: ""; width: 6px; height: 6px; background-color: #a5c8de; border-radius: 50%; } /* 图片 */ .index-main-item6-right .index-main-item6-right-item-img { width: calc(100% / 6); height: 90px; display: flex; justify-content: center; align-items: center; } .ariaskiptheme { margin-right: 20px; display: flex; flex-wrap: wrap; justify-content: center; } .index-main-item6-right-item-img p { width: 96px; overflow: hidden; white-space: nowrap; text-overflow: clip; font-size: 12px; color: #000; text-align: center; margin: 0 auto; } .index-main-item6-right-item-img img { object-fit: cover; } .index-main-item5 { width: 100%; margin-bottom: 10px; display: flex; justify-content: space-between; } .index-main-item5 .index-main-item5-left { width: 360px; /* background-color: #f7f7f7; */ margin-right: 10px; border-top: 3px solid #0082d4; } .index-main-item5 .index-main-item5-right { flex: 1; /* background-color: #f7f7f7; */ border-top: 3px solid #0082d4; } .index-main-item5-title { width: 100%; height: 40px; padding-left: 40px; box-sizing: border-box; line-height: 40px; } .index-main-item5 .tabs-content-box { width: 90%; min-height: 200px; box-sizing: border-box; margin: 0 5% 10px 5%; background-color: #fff; } .index-main-item5-sidebar-title { width: 100%; display: flex; text-align: center; margin-top: 10px; padding-top: 5px; overflow: hidden; } /* table-内容 */ .tabs-box-content-item { width: 100%; display: flex; text-align: center; align-items: center; position: relative; padding-left: 10px; box-sizing: border-box; } .tabs-box-content-item:after { content: ""; position: absolute; left: 0; top: calc(50% - 4px); border-top: 4px solid #ccc; border-left: 4px solid #ccc; border-bottom: 4px solid transparent; border-right: 4px solid transparent; transform: rotate(135deg); } .index-main-item5 .index-main-item5-content { width: 100%; padding: 0 20px; display: flex; flex-wrap: wrap; justify-content: space-between; box-sizing: border-box; } .index-main-item5 .index-main-item5-content-item { width: 400px; height: 77px; margin-bottom: 8px; background-color: #a5c8de; } /* 新导航模块 */ .index-main-item3 { width: 1200px; margin: 0 auto 20px; display: flex; justify-content: space-between; } .index-main-item3 .navs-box-item { border-radius: 5px; overflow: hidden; width: 380px; box-shadow: 0 0 10px 0 #e4e4e4; } .index-main-item3 .navs-box-item .navs-box-item-title { height: 66px; width: 100%; text-align: center; background: no-repeat center center / 100% 100%; } .index-main-item3 .navs-box-item .navs-box-item-title a { font-size: 22px; line-height: 66px; color: #fff; } .index-main-item3 .navs-box-item .navs-box-item-content { width: 100%; height: 260px; display: flex; flex-wrap: wrap; align-content: flex-start; } .navs-box-item-content.bg-1 { background: no-repeat center center / cover; } .navs-box-item-content.bg-2 { background: no-repeat center center / cover; } .navs-box-item-content.bg-3 { background: no-repeat center center / cover; } .navs-box-item-content .content-item { padding: 15px 0; width: 33%; text-align: center; height: 80px; cursor: pointer; color: #1c5fb0; } /* 互动交流布局调整 */ .navs-box-item-content.wrap-2 .content-item { width: 50%; } .navs-box-item-content .content-item .iconfont { display: block; font-size: 40px; margin-bottom: 5px; } .navs-box-item-content .content-item h4 { font-size: 14px; font-weight: normal; } .navs-box-item-content .content-item:hover { color: #9dc4f2; } /* 新专题专栏 */ .index-main-item4 { margin: 0 auto; width: 1200px; } .index-main-item4 .index-main-item4-title { margin-bottom: 10px; display: flex; align-items: center; } .index-main-item4 .index-main-item4-title > img { margin-right: 16px; width: 22px; height: 16px; } .index-main-item4 .index-main-item4-title a { font-size: 24px; font-weight: bold; color: #333; } .index-main-item4 .index-main-item4-title .btns { /* display: flex; */ margin-left: auto; } .index-main-item4 .index-main-item4-title .btns a { display: inline-block; background: #e6e6e6; width: 30px; height: 30px; margin-left: 15px; border-radius: 50%; text-align: center; line-height: 28px; cursor: pointer; } .index-main-item4 .index-main-item4-title .btns a > img { display: inline-block; height: 15px; width: 15px; } .index-main-item4 .index-main-item4-swiper ul { padding: 10px 0 !important; width: 1200px; height: 140px; /* overflow: hidden; */ zoom: 1; } .index-main-item4 .index-main-item4-swiper .swiper-item { margin-right: 15px; float: left; height: 120px; width: 288px; box-shadow: 0px 4px 8px 0px #56535312; } .index-main-item4 .index-main-item4-swiper .swiper-item a { display: block; height: 100%; width: 100%; } .index-main-item4 .index-main-item4-swiper .swiper-item a img { display: block; height: 90px; width: 100%; } .index-main-item4 .index-main-item4-swiper .swiper-item a h4 { padding: 0 5px; height: 30px; width: 100%; background-color: #fff; text-align: center; font-size: 14px; line-height: 30px; font-weight: normal; color: #333; /* 文字超出省略号 */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } .tabs-content-box-item { padding-left: 16px; width: 100%; box-sizing: border-box; position: relative; height: 35px; line-height: 35px; display: flex; justify-content: space-between; align-items: center; } .tabs-content-box-item a { width: 80%; overflow: hidden; display: block; text-overflow: ellipsis; white-space: nowrap; } .tabs-content-box-item span { font-size: 16px; color: #333; } .tabs-content-box-item::after { content: ""; position: absolute; left: 4px; top: 14px; width: 6px; height: 6px; background-color: #a5c8de; border-radius: 50%; } /* 中部轮播图 */ .index-main-item2 { width: 1200px; margin: 0 auto 25px; /* height: 120px; */ overflow: hidden; } .index-main-item2 .swiper-container { position: relative; } .index-main-item2 .swiper-container .btn { position: absolute; z-index: 999; top: 50%; transform: translatey(-50%); } .index-main-item2 .swiper-container .btn > img { cursor: pointer; width: 40px; } .index-main-item2 .swiper-container .prev { left: 5px; } .index-main-item2 .swiper-container .next { right: 5px; } .index-main-item1 { /* padding: 10px; */ /* background-color: #f7f7f7; */ box-sizing: border-box; display: flex; justify-content: space-between; width: 1200px; margin: 0 auto 20px; } .index-main-item1 .index-main-item1-left { width: 680px; height: 354px; /* margin-right: 15px; */ } .index-main-item1 .index-main-item1-right { width: 570px; height: 354px; } .index-main-item1 .index-main-item1-right-top { width: 100%; height: 271px; margin-bottom: 10px; } .index-main-item1 .index-main-item1-right-bottom { width: 100%; height: 73px; display: flex; justify-content: space-evenly; } /* 标题 */ .index-main-title { text-align: center; padding: 20px 0; width: 1200px; margin: 0 auto; /* background-color: #f7f7f7; */ } .index-main-title a { color: #1c5fb0; font-weight: bold; font-size: 26px; font-family: "microsoft yahei", "微软雅黑"; letter-spacing: 1px; } /* 公告 */ .index-main-notice { /* background-color: #f7f7f7; */ margin-bottom: 10px; display: flex; /* padding: 0 10px; */ box-sizing: border-box; padding-bottom: 15px; width: 1200px; margin: 0 auto; } .index-main-notice-announcement { width: 1000px; height: 25px; line-height: 25px; overflow: hidden; position: relative; } .index-main-notice-announcement ul { position: absolute; padding: 0; margin: 0; list-style: none; width: max-content; height: 25px; animation: move 100s linear infinite; } .index-main-notice-announcement ul:hover { animation-play-state: paused; } .index-main-notice-announcement li { float: left; margin-left: 10px; height: 25px; display: flex; align-items: center; } .index-main-notice-announcement li::before { content: ""; width: 8px; height: 8px; display: inline-block; background-color: #a5c8de; margin-right: 5px; line-height: 25px; border-radius: 50%; } @keyframes move { 0% { transform: translatex(0); } 100% { transform: translatex(-100%); } }