#app {
	padding-bottom: 4rem;
}

#app>* {
	flex-shrink: 0;
}

header.search-header {
	background-color: #ff5800;
	width: calc(99.5% - 1rem);
	height: 2.72rem;
	min-height: 2.72rem;
	padding: 0.5rem;
	z-index: 114514;
	position: sticky;
	top: 0;
}

header.search-header>div.img-box.logo {
	width: 6.54rem;
	height: 2.13rem;
	min-height: 2.13rem;
	margin: auto 0;
}

header.search-header>div.search-input {
	padding: 0.35rem 0.5rem;
	margin-left: 0.5rem;
	border-radius: 5px;
	background-color: rgba(255, 255, 255, 1);
	z-index: 0;
}

header.search-header>div.search-input>img {
	width: 1rem;
}

header.search-header>div.search-input>input.search {
	background-color: initial;
	border: 0;
	color: #292b2c;
}

header.search-header>div.search-input>input.search::-webkit-search-cancel-button {
  	-webkit-appearance: none;
}

/* 针对 Chrome, Safari, Opera, Edge (旧版基于WebKit) */
header.search-header>div.search-input>input.search::-webkit-input-placeholder {
  color: #292b2c;
  opacity: 0.6;
}

/* 针对 Firefox 19+ */
header.search-header>div.search-input>input.search::-moz-placeholder {
  color: #292b2c;
  opacity: 0.6;
}

/* 针对 Internet Explorer 10-11 和 Edge (旧版) */
header.search-header>div.search-input>input.search:-ms-input-placeholder {
  color: #292b2c;
  opacity: 0.6;
}

/* 针对 Firefox 4-18 (非常旧的版本) */
header.search-header>div.search-input>input.search:-moz-placeholder {
  color: #292b2c;
  opacity: 0.6;
}

header.search-header>div.search-input>input.search::placeholder {
  color: #292b2c;
  opacity: 0.6;
}

header.search-header>div.search-input>button {
	color: #FFFFFF;
	background-color: #ff5800;
	border: 0;
	border-radius: 5px;
	padding: 0 0.6rem;
	flex-shrink: 0;
}

header.text-header {
	background-color: #FFFFFF;
	width: calc(100% - 1rem);
	height: 6vh;
	padding: 0.5rem;
	z-index: 114514;
	position: sticky;
	top: 0;
}

header.text-header>span {
	color: #323233;
	font-size: 1.2rem;
}

header.text-header>a>img {
	width: 1.5rem;
	height: 1.5rem;
}

#carouselIndicators,
#backgroundPhoto {
	width: 100vw;
	height: calc(90vw * 0.55);
}

#carouselIndicators>.carousel-inner,
#carouselIndicators>.carousel-inner>.carousel-item {
	height: 100%;
}

#carouselIndicators .carousel-indicators button[data-bs-target] {
	width: 10px;
}

.video-box>video {
	width: 100%;
	height: auto;
}

#carouselIndicators>.carousel-inner>.carousel-item {
	background-size: cover;
	background-position: center;
	transition: transform .6s ease-in-out;
}

#carouselIndicators>.carousel-inner>.carousel-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

div#dropdown-group {
	width: 100%;
	position: sticky;
	top: calc(4vh + 1.5rem);
	background-color: #FFFFFF;
	padding: 0.5rem 0;
	z-index: 10;
}

div#dropdown-group>div.btn-group {
	position: unset;
}

div#dropdown-group>div.btn-group>button.btn {
	border-color: transparent;
	font-size: 1rem;
}

div#dropdown-group>div.btn-group>button.btn::after {
	color: #dcdee0;
	transition: transform .2s ease-in-out;
}

div#dropdown-group>div.btn-group>button.btn.show {
	color: #ff5800;
}

div#dropdown-group>div.btn-group>button.btn.show::after {
	transform: rotate(180deg);
}

div#dropdown-group>div.btn-group>nav.dropdown-menu {
	width: 100vw;
	border: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	overflow: auto;
}

div#dropdown-group>div.btn-group>nav.dropdown-menu>a {
	line-height: 1.5rem;
	text-align: center;
}

#dropdown-group>div.btn-group>nav.dropdown-menu>a.cur {
	color: #ff5800;
}

nav.exhi-nav {
	width: calc(100vw - 2rem);
	padding: 1rem;
	/* margin-top: 0.5rem; */
	background-color: #FFFFFF;
	border-radius: 5px;
	/* 导航滑动 shenwei 20250402 begin */
	display: flex;
	  flex-wrap: nowrap;
	  overflow-x: auto;
	  -webkit-overflow-scrolling: touch;
	  /* 导航滑动 shenwei 20250402 end */
}

nav.exhi-nav>a>div.img-box {
	/*导航欢动 shenwei 2025002 begin */
	margin-right:0.5rem;
	width: calc((82vw - 3rem) / 5);
	height: calc((82vw - 3rem) / 5);
	/*导航欢动 shenwei 2025002 end */
}
/*导航欢动 shenwei 2025002 begin */
nav.exhi-nav>a>span 
{
	margin-right:0.5rem;
}
/*导航欢动 shenwei 2025002 end */
section.default-panel {
	width: 100%;
}

section.default-panel>header.title {
	padding: 0.5rem;
}

section.default-panel>header.title>h1>img,
section.default-panel>header.title>h2>img,
section.default-panel>header.title>h3>img {
	width: 1.2rem;
	height: 1.2rem;
}

section.default-panel>header.title>h1,
section.default-panel>header.title>h1>span,
section.default-panel>header.title>h2,
section.default-panel>header.title>h2>span,
section.default-panel>header.title>h3,
section.default-panel>header.title>h3>span {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0;
}

section.default-panel>header.title>a.more {
	font-size: 1rem;
	color: #999999;
}

section.default-panel>header.title>a.more>img {
	width: 1rem;
	height: 1rem;
}

section.default-panel>.flex-body,section.default-panel>.grid-body {
	padding-top: 0;
	padding-bottom: 0;
}

section.default-panel>div.grid-body>a {
	background-color: #FFFFFF;
	border-radius: 5px;
	/* padding: 0.5rem; */
}

section.default-panel>div.grid-body>a>div.img-box {
	width: 100%;
	height: calc((80vw - 1.5rem) / 2 - 1rem);
	border: 0.5px solid rgba(0, 0, 0, 0.12);
}

section.default-panel>div.grid-body>a>div.img-box-aspect-ratio {
	width: 100%;
	position: relative;
	padding-top: 62.5%;
	overflow: hidden;
	border: 0.5px solid rgba(0, 0, 0, 0.12);
}

section.default-panel>div.grid-body>a>div.img-box-aspect-ratio img {
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
	width: 100%;
    height: 100%;
}

section.default-panel>div.grid-body>a>h1.title,
section.default-panel>div.grid-body>a>h2.title,
section.default-panel>div.grid-body>a>h3.title {
	font-weight: 500;
	font-size: 0.9rem;
	margin-top: 0.5rem;
	
	
}

section.default-panel>div.grid-body>a>p {
	color: #999;
	font-size: 0.8rem;
	/* float: left; */
}

section.default-panel>div.flex-body>a:first-child {
	margin-top: 0;
}

section.default-panel>div.flex-body>a {
	margin-top: 0.5rem;
	padding: 0.5rem;
	background-color: #FFFFFF;
}

section.default-panel>div.flex-body>a>div.img-box {
	width: calc((100vw - 2.5rem) / 3);
	height: calc((110vw - 2.5rem) / 4);
	min-height: 100%;
	margin-right: 0.5rem;
	border: 0.5px solid rgba(0, 0, 0, 0.12);
}

section.default-panel>div.flex-body>a>div.msg-box {
	width: 0;
}

section.default-panel>div.flex-body>a>div.msg-box>h1.title,
section.default-panel>div.flex-body>a>div.msg-box>h2.title,
section.default-panel>div.flex-body>a>div.msg-box>h3.title {
	font-weight: normal;
	font-size: 1.2rem;
	margin-bottom: 0.5rem;
	color: rgb(52, 68, 111);
}

section.default-panel>div.flex-body>a>div.msg-box>p {
	margin-bottom: 0.5rem;
	color: #000;
	font-size: 1rem;
	
}

section.default-panel>div.flex-body>a>div.msg-box>p.orange-time {
	color: #ff5800;
}

section.default-panel>div.flex-body>a>div.msg-box>p:last-child {
	margin-bottom: 0;
}

.country-list.country-body,
.country-list>.country-body,
.city-list.city-body,
.city-list>.city-body {
	background-color: #FFFFFF;
}

div#dropdown-group>div.btn-group>nav.dropdown-menu>a,
.country-list>.country-body>a,
.city-list>.city-body>a {
	padding: 0.5rem 0;
	text-align: center;
	color: #666666;
	background-color: #f1f1f1;
	border-radius: 5px;
}

.nav-footer {
	width: 100%;
	background-color: #FFFFFF;
	position: fixed;
	bottom: 0;
	padding: 0.5rem 0;
	z-index: 1;
}

.nav-footer>nav>a>div.img-box,
.nav-footer>a>div.img-box {
	width: 1.5rem;
	height: 1.5rem;
}

 .nav-footer.load-socket>a>div.img-box.has-tips {
 	position: relative;
 }

.nav-footer.load-socket>a>div.img-box .unread-count-tips{
	position: absolute;
    top: -0.3rem;
    right: -0.4rem;
    color: #FFFFFF;
    background-color: #f74c30;
    border-radius: 50%;
    line-height: 1rem;
    /* padding: 0.1rem 0.3rem; */
    font-size: 0.6rem;
    width: 1rem;
    height: 1rem;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box !important;
}

.nav-footer>div.btn-group>button:first-child {
	margin-left: 0;
}

.nav-footer>div.btn-group>button {
	margin-left: 0.5rem;
	margin-top: 0;
	font-size: 1rem;
}

.dropdown-menu.show.flex {
	display: flex;
}

.dropdown-menu.show.grid {
	display: grid;
}

.video-box.carousel-item.active {
	display: flex;
	justify-content: center;
	align-items: center;
}

.video-box {
	position: relative;
	overflow: hidden;
}

.video-box>img.play {
	position: absolute;
	z-index: -114514;
	cursor: pointer;
	width: 3rem;
	height: 3rem;
}

.video-box.active>img.play {
	z-index: 5;
}

button.default-button {
	margin-top: 0.5rem;
	font-size: 1.2rem;
	color: #FFFFFF;
	background-color: #ff5800;
	border: none;
	border-radius: 5px;
	padding: 0.65rem 0;
	width: 100%;
	cursor: pointer;
	margin-right: 5px;
}
button.default-button1 {
	margin-top: 0.5rem;
	font-size: 1.2rem;
	color: #ff5800;
	background-color: #FFFFFF;
	border: 0.5px solid #ff5800;
	border-radius: 5px;
	padding: 0.65rem 0;
	width: 100%;
	cursor: pointer;
	margin-right: 5px;
}

button.default-button[type="submit"] {
	padding: 0.8rem 0;
}

button.btn {
	font-size: 1rem;
}

table.default-table {
	width: 100%;
}

table.layout-fixed {
	table-layout: fixed;
}

table.default-table>thead>tr {
	font-size: 1.1rem;
}

table.default-table tr {
	border-bottom: 1px dashed #DDDDDD;
}

table.default-table th,
table.default-table td {
	padding: 0.65rem 0;
}

.td-10 {
	width: 10%;
}

.td-15 {
	width: 15%;
}

.td-20 {
	width: 20%;
}

.td-30 {
	width: 30%;
}

.td-40 {
	width: 40%;
}

.td-50 {
	width: 50%;
}

.td-60 {
	width: 60%;
}

.td-70 {
	width: 70%;
}

.td-80 {
	width: 80%;
}

.pre-wrap {
	white-space: pre-wrap;
}

label.default-label:first-child {
	margin-top: 0;
}

label.default-label {
	margin-top: 0.5rem;
	margin-bottom: 0;
	border: 1px solid #dcdfe6;
	border-radius: 4px;
	position: relative;
	/* padding: 1px; */
}

label.default-label span {
	z-index: 999999;
	display: inline-block;
	width: 7rem;
}

label.default-label input,
label.default-label textarea {
	-webkit-appearance: none;
	appearance: none;
	background-color: #FFFFFF;
	background-image: none;
	border: 0;
	box-sizing: border-box;
	color: #606266;
	display: inline-block;
	font-size: inherit;
	height: 44px;
	line-height: 40px;
	outline: 0;
	padding: 0 15px;
	transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
	border-radius: 4px;
}

label.default-label textarea {
	height: 6rem;
	resize: none;
}

label.default-label.verify-panel>button {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	width: 7rem;
	margin-left: -5rem;
	border: none;
	color: inherit;
	font-size: 1rem;
	cursor: pointer;
	position: absolute;
	right: 0;
	height: 100%;
}

#alert-box {
	position: absolute;
	top: 0;
	width: 100vw;
	z-index: 114514114;
}

#alert-box>div.alert:first-child {
	margin-top: 0;
}

#alert-box>div.alert {
	margin-bottom: 0;
	margin-top: 0.5rem;
}

a.switch-offcanvas {
	color: #606266;
	font-size: 1.2rem;
}

div.offcanvas-body>form>p.switch-link {
	margin-top: 0.5rem;
}

div.offcanvas.offcanvas-bottom {
	height: auto;
	max-height: 80vh;
	margin-bottom: 48px;
	border-top: 0.2px solid #9e9e9e;
	}

div.offcanvas.offcanvas-bottom>div.offcanvas-body>form>button {
	position: sticky;
	bottom: 0;
}

div#sroll-group {
	width: 100%;
	position: sticky;
	top:  calc(4vh + 1.5rem);
	background-color: #FFFFFF;
	padding: 0.5rem 0.5rem;
	box-sizing: border-box;
	white-space: nowrap;
	overflow-x: scroll;
	z-index: 9;
	font-size: 1rem;
}

div#sroll-group a {
	padding: 0.5rem 0.5rem;
	line-height: 1.1rem;
    height: 1.1rem;
    display: inline-block;
    font-size: 1rem;
}

div#sroll-group a:first-child {
	padding-left: 0;
}

div#sroll-group a.cur {
	color: #ff5800;
}

#app .img-box-new,
#app .img-box-new * {
	box-sizing: border-box;
}

.img-box-new-wrapper {
	width: 28%;
	margin-right: 0.5rem;
	/* height: 0; */
}

.img-box-new {
	width: 100%;
	overflow: hidden;
	position: relative;
    padding-bottom: 72.5%;
    height: 100%;
}

.img-box-new img {
	position: absolute;
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
}

/* .img-box-new {
	width: 40.2%;
	margin-right: 0.5rem;
	overflow: hidden;
	position: relative;
    padding-bottom: 62.5%;
    height: 100%;
} */

.img-box-new .placer {
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
}

.img-box-new img {
	width: 100%;
    height: 100%;
    object-fit: cover;
}

div.footer1 {
	box-sizing: border-box !important;
	width: 100%;
	background: #404347;
	/* height: 170px; */
	font-size: 12px;
	margin-top: auto;
	padding: 10px 10px;
}

div.footer1>p, div.footer1>p>span, div.footer1>p>a {
	color: #ababab;
	font-size: 12px;
}

div.footer1>p {
	padding: 1px;
}

div.footer1>p:last-child {
	margin-bottom: 0;
}

/* 顶部菜单改造 */
        
 /* ===== 全局重置 ===== */
        .app-container,
        .app-container * {
            margin: 0;
            padding: 0;
            box-sizing: border-box !important;
            -webkit-tap-highlight-color: transparent;
        }

        /* body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
            background: #f5f7fa;
            display: flex;
            justify-content: center;
            align-items: flex-start;
            min-height: 100vh;
            padding: 16px 12px 30px;
        } */

        /* ===== 主卡片容器 ===== */
        .app-container {
           /*  max-width: 480px; */
            width: 100%;
            background: #ffffff;
            /* border-radius: 20px; */
            box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
            overflow: hidden;
            padding: 16px 0 16px;
        }

        /* ===== 标题 ===== */
        .menu-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20px 16px;
        }
        .menu-header h2 {
            font-size: 18px;
            font-weight: 600;
            color: #1a2332;
            letter-spacing: 0.3px;
        }
        .menu-header .more-link {
            font-size: 13px;
            color: #8e99ab;
            text-decoration: none;
            display: flex;
            align-items: center;
            gap: 4px;
        }
        .menu-header .more-link::after {
            content: "›";
            font-size: 18px;
            line-height: 1;
        }

        /* ===== 滑动区域 ===== */
        .menu-slider-wrapper {
            position: relative;
            overflow: hidden;
            touch-action: pan-y;
            /* 防止垂直滑动干扰，但保留垂直滚动 */;
        }

        .menu-slider-track {
            display: flex;
            flex-wrap: nowrap;
            transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            will-change: transform;
            cursor: grab;
        }
        .menu-slider-track:active {
            cursor: grabbing;
        }

        /* ===== 每个菜单项 ===== */
        .menu-item {
            flex: 0 0 20%;
            /* 每页5个 */
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 6px 0 10px;
            text-decoration: none;
            color: #2c3e50;
            transition: transform 0.15s ease;
            user-select: none;
            -webkit-user-select: none;
        }
        .menu-item:active {
            transform: scale(0.92);
        }

        /* 图标容器 */
        .menu-item .icon-wrap {
            width: 52px;
            height: 52px;
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 28px;
            background: #f3f3f3;
            color: #4a6cf7;
            transition: background 0.2s, transform 0.2s;
            box-shadow: 0 2px 8px rgba(74, 108, 247, 0.08);
            margin-bottom: 6px;
        }
        /* 不同颜色点缀 */
        /* .menu-item:nth-child(6n+1) .icon-wrap {
            background: #eef6ff;
            color: #4a6cf7;
        }
        .menu-item:nth-child(6n+2) .icon-wrap {
            background: #fff0ee;
            color: #f56c6c;
        }
        .menu-item:nth-child(6n+3) .icon-wrap {
            background: #ecfdf3;
            color: #34c759;
        }
        .menu-item:nth-child(6n+4) .icon-wrap {
            background: #fef6e6;
            color: #f7b731;
        }
        .menu-item:nth-child(6n+5) .icon-wrap {
            background: #f3f0ff;
            color: #8b5cf6;
        }
        .menu-item:nth-child(6n+6) .icon-wrap {
            background: #fce8f3;
            color: #e83e8c;
        } */

        /* 菜单名称 */
        .menu-item .menu-label {
            font-size: 12px;
            font-weight: 500;
            color: #2c3e50;
            line-height: 1.3;
            text-align: center;
            letter-spacing: 0.2px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 100%;
            padding: 0 2px;
        }

        /* ===== 分页指示器 ===== */
        .menu-indicator {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 8px;
            margin-top: 5px;
            padding: 0 20px;
            height: 0px;
        }

        .menu-indicator .dot {
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #d0d7e3;
            transition: all 0.3s ease;
            cursor: default;
            flex-shrink: 0;
        }
        .menu-indicator .dot.active {
            width: 10px;
            border-radius: 4px;
            background: #ff5800;
            box-shadow: 0 0 0 2px rgba(74, 108, 247, 0.15);
        }

        /* ===== 空状态占位 ===== */
        .empty-placeholder {
            display: none;
        }

        /* ===== 底部说明 ===== */
        .footer-tip {
            text-align: center;
            font-size: 12px;
            color: #b0b8c8;
            padding: 18px 20px 4px;
            letter-spacing: 0.5px;
            border-top: 1px solid #f0f2f5;
            margin-top: 14px;
        }

        /* ===== 响应式适配 ===== */
        @media (max-width: 420px) {
            .app-container {
                /* border-radius: 16px; */
                padding: 16px 0 14px;
            }
            .menu-item .icon-wrap {
                width: 46px;
                height: 46px;
                font-size: 24px;
                border-radius: 14px;
            }
            .menu-item .menu-label {
                font-size: 11px;
            }
            .menu-header h2 {
                font-size: 16px;
            }
        }

        @media (max-width: 360px) {
            .menu-item .icon-wrap {
                width: 40px;
                height: 40px;
                font-size: 20px;
                border-radius: 12px;
            }
            .menu-item .menu-label {
                font-size: 10px;
            }
            .menu-indicator .dot {
                width: 6px;
                height: 6px;
            }
            .menu-indicator .dot.active {
                width: 10px;
                border-radius: 3px;
            }
        }

        /* ===== 深色模式兼容 (可选) ===== */
        @media (prefers-color-scheme: dark) {
            body {
                background: #12161e;
            }
            .app-container {
                background: #1a2332;
                box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
            }
            .menu-header h2 {
                color: #e8edf5;
            }
            .menu-header .more-link {
                color: #8a9bb5;
            }
            .menu-item .menu-label {
                color: #d0d9e8;
            }
            .menu-item .icon-wrap {
                background: #2a3448;
                color: #7a9cf7;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
            }
            .menu-item:nth-child(6n+1) .icon-wrap {
                background: #1e2a44;
                color: #6a8cf7;
            }
            .menu-item:nth-child(6n+2) .icon-wrap {
                background: #442a2a;
                color: #f58a8a;
            }
            .menu-item:nth-child(6n+3) .icon-wrap {
                background: #1a3a2a;
                color: #4cd964;
            }
            .menu-item:nth-child(6n+4) .icon-wrap {
                background: #443a1a;
                color: #f7c94a;
            }
            .menu-item:nth-child(6n+5) .icon-wrap {
                background: #2a2a44;
                color: #a88cf7;
            }
            .menu-item:nth-child(6n+6) .icon-wrap {
                background: #442a3a;
                color: #f06a9a;
            }
            .menu-indicator .dot {
                background: #3a4458;
            }
            .menu-indicator .dot.active {
                background: #6a8cf7;
                box-shadow: 0 0 0 2px rgba(106, 140, 247, 0.2);
            }
            .footer-tip {
                border-top-color: #2a3448;
                color: #6a7a8a;
            }
        }