::-webkit-scrollbar-thumb {
background-color: rgb(186 186 186 / 80%);
border-radius: 6px;
-webkit-transition: background .2s ease;
transition: background .2s ease;
}
::-webkit-scrollbar {
background-color: rgba(25,25,25,.1);
width: 8px;
height: 8px;
}
/* 根元素变量定义 */
:root , [data-theme="light"]{
--max-bg: #f5f7ff; /* 灰白色 */
--max-1-card: #fff; /* 白色 */
--max-2-bg: #fff; /* 白色 */
--max-3-bg: #f9f9f9; /* 浅灰背景色 */
--max-5-bg: #fff; /* 浅蓝黑灰背景色 */
--max-6-bg: #f8f9fa; /* 子模块浅灰背景色 */
/*文字*/
/*--max-color: #393535;*/
--max-color: #242121; /* 黑色 */
--max-1-color: #000; /* 深黑色 */
--max-2-color: #1890ff; /* 蓝色 */
--max-3-color: #059669; /* 浅绿色 */
--max-4-color: #f7fcff; /* 浅白色 */
--max-5-color: #242121; /* 黑色 */
--max-txt-color: #666; /* 浅灰色 */
--max-txt-border: #f0f0f0; /* 中灰色边框线条 */
--max-txt-border2: #f2f3ff; /* 浅蓝色边框线条 */
/*下方已调整*/
--btn-gray: #b3b3b3;/*中灰*/
--bright: brightness(.9);
--border: 1px solid #fff; /* 线条 */
/* ========== 色系 ========== */
--max-primary: #2b6eff; /* 主品牌色/蓝色 */
--max-primary-light: #5b8eff; /* 主品牌色-浅 */
--max-primary-dark: #1c4fcc; /* 主品牌色-深 */
--max-secondary: #6c757d; /* 次要色/灰色 */
--max-secondary-light: #8b93a0; /* 次要色-浅 */
--max-secondary-dark: #545b62; /* 次要色-深 */
--max-success: #2ecc71; /* 成功/绿色 */
--max-success-light: #54d98c; /* 成功-浅 */
--max-success-dark: #25a25a; /* 成功-深 */
--max-warning: #f97316; /* 警告/橙色 */
--max-warning-light: #ff9f4a; /* 警告-浅 */
--max-warning-dark: #ea580c; /* 警告-深 */
--max-danger: #dc3545; /* 危险/红色 */
--max-danger-light: #e4606d; /* 危险-浅 */
--max-danger-dark: #b02a37; /* 危险-深 */
--max-info: #17a2b8; /* 信息/青色 */
--max-info-light: #4fb9cc; /* 信息-浅 */
--max-info-dark: #117a8b; /* 信息-深 */
--max-purple: #9d1de8; /* 紫色 */
--max-purple-light: #b54dec; /* 紫色-浅 */
--max-purple-dark: #7a16b8; /* 紫色-深 */
--max-pink: #ec4899; /* 粉色 */
--max-pink-light: #f06eb0; /* 粉色-浅 */
--max-pink-dark: #cc2783; /* 粉色-深 */
--max-teal: #14cc72; /* 青绿色 */
--max-teal-light: #3ee08b; /* 青绿色-浅 */
--max-teal-dark: #0fa358; /* 青绿色-深 */
--max-orange: #fd7e14; /* 橙色 */
--max-orange-light: #fea34a; /* 橙色-浅 */
--max-orange-dark: #d4620a; /* 橙色-深 */
--max-yellow: #f7c32e; /* 黄色 */
--max-yellow-light: #fad163; /* 黄色-浅 */
--max-yellow-dark: #d9a30a; /* 黄色-深 */
/* ========== 背景色系 ========== */
--max-bg-secondary: #f8f9fa; /* 次背景色/浅灰 */
--max-bg-tertiary: #f0f2f5; /* 三级背景/中灰 */
--max-bg-hover: #f5f5f5; /* 悬停背景 */
--max-bg-active: #e9ecef; /* 激活背景 */
--max-bg-dark: #1a1a2e; /* 深色背景 */
--max-bg-overlay: rgba(0,0,0,0.6);/* 遮罩背景 */
--max-bg-soft: #f9fafb; /* 柔和背景 */
/* ========== 文字色系 ========== */
--max-text-primary: #1f2937; /* 主要文字/深灰 */
--max-text-secondary: #6b7280; /* 次要文字/中灰 */
--max-text-tertiary: #9ca3af; /* 辅助文字/浅灰 */
--max-text-disabled: #d1d5db; /* 禁用文字/更浅灰 */
--max-text-white: #ffffff; /* 白色文字 */
--max-text-black: #000000; /* 黑色文字 */
--max-text-success: #2ecc71; /* 成功文字 */
--max-text-warning: #f97316; /* 警告文字 */
--max-text-danger: #dc3545; /* 危险文字 */
--max-text-info: #17a2b8; /* 信息文字 */
--max-text-link: #2b6eff; /* 链接文字 */
--max-text-placeholder: #b0b3b8; /* 占位符文字 */
/* ========== 新增圆角尺寸 ========== */
--max-radius-sm: 0.25rem; /* 小圆角 4px */
--max-radius: 0.375rem; /* 默认圆角 6px */
--max-radius-md: 0.5rem; /* 中圆角 8px */
--max-radius-lg: 0.75rem; /* 大圆角 12px */
--max-radius-xl: 1rem; /* 超大圆角 16px */
--max-radius-full: 9999px; /* 全圆角/圆形 */
/* ========== 新增阴影效果 ========== */
--max-shadow-sm: 0 1px 2px rgba(0,0,0,0.05); /* 小阴影 */
--max-shadow: 0 4px 12px rgba(0,0,0,0.08); /* 默认阴影 */
--max-shadow-md: 0 8px 16px rgba(0,0,0,0.1); /* 中阴影 */
--max-shadow-lg: 0 12px 24px rgba(0,0,0,0.12); /* 大阴影 */
--max-shadow-xl: 0 20px 32px rgba(0,0,0,0.15); /* 超大阴影 */
--max-shadow-hover: 0 8px 20px rgba(0,0,0,0.12); /* 悬停阴影 */
--max-shadow-inset: inset 0 1px 3px rgba(0,0,0,0.05); /* 内阴影 */
}
[data-theme="dark"]{
/*--max-bg: #2f2f2f;*/
--max-bg: #191919; /* 黑灰色 */
--max-1-card: #181818; /* 浅黑色 */
--max-2-bg: #000; /* 黑色 */
--max-3-bg: #1e1c1c; /* #2f2f2f深灰色 */
--max-5-bg: #1f2937; /* 浅蓝黑灰背景色 */
--max-6-bg: #1a1f28; /* 子模块浅蓝黑背景色 */
--max-color: #b9b9b9; /* 浅白色 */
--max-1-color: #b9b9b9; /* 浅白色 */
--max-2-color: #6c6c6c; /* 浅灰色 */
--max-4-color: #2f2f2f; /* 深灰色 */
--max-5-color: #edeaea; /* 浅白色 */
--max-txt-color: #b9b9b9; /* 浅白色 */
--btn-gray: #b3b3b3;/*中灰*/
--max-txt-border: #2f2f2f; /* 深色边框线条 */
--max-txt-border2: #626373; /* 中灰色 */
--max-shadow: none; /* 阴影效果 */
--border: 1px solid #525252; /* 线条 */
}
/*html { visibility: hidden; }*/
/*body { opacity: 0;}*/
/* 为禁用JS的用户提供后备方案 */
/*noscript style { html { visibility: visible; } body { opacity: 1; } }*/
/* 全局重置样式 */
*, ::before, ::after {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-tap-highlight-color: transparent;
}
body {
/*font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
background-color: var(--max-bg); /* 背景颜色 */
color: var(--max-color); /* 文字颜色 */
line-height: 1.6;
margin: 0;
padding: 0;
-webkit-overflow-scrolling: touch; /* 启用惯性滚动 */
touch-action: manipulation; /* 优化触摸响应 */
}
html {
overflow-y: scroll !important;
scroll-behavior: auto;
}
/*h1, h2, h3, h4, h5, h6, h7{*/
/* color: var(--max-color);*/
/*}*/
/* 标题基础样式 */
.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 0.5rem;
font-weight: 600;
line-height: 1.2;
color: var(--max-color);
}
/* 响应式字体大小 */
.h1, h1 { font-size: calc(1.359375rem + 1.3125vw); } /* 约22-40px */
.h2, h2 { font-size: calc(1.3125rem + 0.75vw); } /* 约21-36px */
.h3, h3 { font-size: calc(1.2890625rem + 0.46875vw); }/* 约21-32px */
.h4, h4 { font-size: calc(1.265625rem + 0.1875vw); } /* 约20-28px */
.h5, h5 { font-size: 1.171875rem; } /* 约19px */
.h6, h6 { font-size: 0.9375rem; } /* 约15px */
/* 大屏幕固定最大值 */
@media (min-width: 1200px) {
.h1, h1 { font-size: 2.34375rem; } /* 37.5px */
.h2, h2 { font-size: 1.875rem; } /* 30px */
.h3, h3 { font-size: 1.640625rem; } /* 26px */
.h4, h4 { font-size: 1.40625rem; } /* 22.5px */
}
p {
margin-top: 0;
margin-bottom: 1rem
}
/* 响应式调整 */
/*@media (max-width: 768px) {*/
/* h1 { font-size: 1.75rem; }*/
/* h2 { font-size: 1.5rem; }*/
/* h3 { font-size: 1.25rem; }*/
/* h4 { font-size: 1.125rem; }*/
/*}*/
[data-theme="dark"] .pay2-vip-title {
color: #a9a9a9;
}
[data-theme="dark"] .fome-4 li,
[data-theme="dark"] .hide-0 {
background: #000;
}
[data-theme="dark"] .profile-1 {
box-shadow: none;
border: var(--border);
}
[data-theme="dark"] .ms-reply textarea,
[data-theme="dark"] .pay-style2 {
background: #181b1f;
}
[data-theme="dark"] .pay-method.active {
background: #212121;
}
[data-theme="dark"] .grid-item h1:hover a {
color: #7b7b7b;
}
[data-theme="dark"] .max-ico-box .btn-tran,
[data-theme="dark"] .impor-dark {
background: #1f2937 !important;
}
[data-theme="dark"] .directory-nav a:hover,
[data-theme="dark"] .grid-item-meta .post-price {
color: #fff;
}
[data-theme="dark"] .cat-filter-btn .btn.active,
[data-theme="dark"] .cat-filter-btn .btn:hover {
color: #eaeaea;
border-color: #b0aaa6;
}
[data-theme="dark"] .cat-filter-btn .btn {
border: 1px solid #696464;
}
/*.nav-modu span {*/
/* color: #edeaea;*/
/*}*/
}
/*暗黑*/
/* 主题切换按钮样式 */
/* 响应式设计 */
@media (max-width: 1100px) {
::-webkit-scrollbar {
/*height: 5px;*/
width: 4px;
}
}
/*@media (max-width: 480px) {*/
/* body {*/
/* font-size: 0.8rem;*/
/* }*/
/*}*/
a {
color: var(--max-color);
text-decoration: none;
cursor: pointer;
}
/*a:hover {*/
/*color: #000;;*/
/*filter: brightness(.9);*/
/* color: var(--max-1-color);*/
/* text-decoration: none;*/
/*}*/
html.is-scrolling * {
/* 1. 禁止所有 hover/焦点/active 反馈 */
pointer-events: none !important;
/* 2. 关掉动画，防止滚停后补帧 */
transition: none !important;
animation: none !important;
/* 3. 强制统一光标，不让浏览器来回切换手型/箭头 */
cursor: default !important;
scroll-behavior: auto;
}
main {
display: block;
}
button, select {
text-transform: none;
}
button{
cursor: pointer;
}
button, input, optgroup, select, textarea {
margin: 0;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button:focus:not(:focus-visible) {
outline: 0;
}
textarea {
resize: vertical;
}
fieldset {
min-width: 0;
padding: 0;
margin: 0;
border: 0;
}
legend {
float: left;
width: 100%;
padding: 0;
margin-bottom: .5rem;
font-size: calc(1.275rem + .3vw);
line-height: inherit;
}
legend+* {
clear: left;
}
img, svg {
vertical-align: middle;
max-width: 100%;
}
/*引导箭头*/
.scroll-no .su7-arrow {
position: absolute;
right: 20px;
color: #3fd999;
opacity: 1;
display: block;
font-size: 0.75rem !important;
animation:
arrowMove 1s ease-in-out 3,
showThenHide 3s ease forwards;
}
@keyframes arrowMove {
0% {
transform: translateX(0);
}
50% {
transform: translateX(-8px);
}
100% {
transform: translateX(0);
}
}
@keyframes showThenHide {
0% {
opacity: 1;
}
80% {
opacity: 1;
}
100% {
opacity: 0;
visibility: hidden;
}
}
/* 滚动时临时禁用动画 */
/*#scroll-block {*/
/* position: fixed;*/
/* top: 0;*/
/* left: 0;*/
/* width: 100vw;*/
/* height: 100vh;*/
/* z-index: 999999;*/
/* pointer-events: none;*/
/* background: transparent;*/
/*}*/
/*高亮*/
.cat-filter-btn .btn {
background: var(--max-5-bg);
border: 1px solid #e0e0e0;
}
.cat-filter-btn .btn.active,.cat-filter-btn .btn:hover {
color: #0b4aed;
border-color: #0b4aed;
background: var(--max-2-bg);
}
/*.cat-filter-btn .btn.active:hover {*/
/* background: #1a4ce8;*/
/* border-color: #1a4ce8;*/
/* color: #fff;*/
/*}*/
.hover-color:hover {
color: #333;
}
/*卡片类*/
/* 卡片样式 */
.card {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 1px solid rgba(0, 0, 0, 0.125);
border-radius: 0.25rem;
}
.card-body {
flex: 1 1 auto;
padding: 1.25rem;
}
.card-title {
margin-bottom: 0.75rem;
}
.card-text {
margin-bottom: 1rem;
}
.card-footer {
padding: 0.75rem 1.25rem;
background-color: rgba(0, 0, 0, 0.03);
border-top: 1px solid rgba(0, 0, 0, 0.125);
}
/*表单类*/
/* 表单样式 */
/*.form-control {*/
/* display: block;*/
/* width: 100%;*/
/* padding: 0.375rem 0.75rem;*/
/* font-size: 1rem;*/
/* line-height: 1.5;*/
/* color: #495057;*/
/* background-color: #fff;*/
/* background-clip: padding-box;*/
/* border: 1px solid #ced4da;*/
/* border-radius: 0.25rem;*/
/* transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;*/
/*}*/
/*.form-control:focus {*/
/* color: #495057;*/
/* background-color: #fff;*/
/* border-color: #80bdff;*/
/* outline: 0;*/
/* box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);*/
/*}*/
.form-group {
margin-bottom: 0.75rem;
}
.label {
display: block;
margin-bottom: 0.5rem;
}
/*分类文章*/
/* 基础布局 */
/* 基础布局 */
.max-item-box .card-item-title{
margin-bottom: 0;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
color: #fff;
}
.archive-posts .item_1,.col-xg-4 .item_2{
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.archive-posts .item_2{
-webkit-line-clamp: 2;
min-height: 42px;
-webkit-box-orient: vertical;
}
.grid-item-meta .post-price{
padding: 1px 6px;
text-align: center;
background-color: var(--max-txt-border);
color: #0f40f3;
border-radius: 3px;
}
/* 图片容器基础样式 */
.grid-item-thumbnail,
.card-item-thumbnail {
position: relative;
overflow: hidden;
/*background-color: #f8f9fa;*/
}
.size.loading::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 36px;
height: 36px;
border: 3px solid #e0e0e0;
border-top-color: #2f6eff;
border-radius: 50%;
animation: loading-spin 0.8s linear infinite;
z-index: 10;
pointer-events: none;
}
/* 加载中 - 图片半透明 */
.size .media-img.loading {
opacity: 0.5;
}
@keyframes loading-spin {
0% { transform: translate(-50%, -50%) rotate(0deg); }
100% { transform: translate(-50%, -50%) rotate(360deg); }
}
/* 缩略图显示模式 */
.thumb-fit-cover .bg-item {
object-fit: cover;
}
.thumb-fit-contain .bg-item {
object-fit: contain;
}
.thumb-fit-auto .bg-item {
object-fit: auto;
}
/* 图片对齐方式 */
.thumb-pos-top-left .bg-item { object-position: left top; }
.thumb-pos-top-center .bg-item { object-position: center top; }
.thumb-pos-top-right .bg-item { object-position: right top; }
.thumb-pos-center-left .bg-item { object-position: left center; }
.thumb-pos-center .bg-item { object-position: center center; }
.thumb-pos-center-right .bg-item { object-position: right center; }
.thumb-pos-bottom-left .bg-item { object-position: left bottom; }
.thumb-pos-bottom-center .bg-item { object-position: center bottom; }
.thumb-pos-bottom-right .bg-item { object-position: right bottom; }
/*.thumb-pos-top-left .bg-item { background-position: left top; }*/
/*.thumb-pos-top-center .bg-item { background-position: center top; }*/
/*.thumb-pos-top-right .bg-item { background-position: right top; }*/
/*.thumb-pos-center-left .bg-item { background-position: left center; }*/
/*.thumb-pos-center .bg-item { background-position: center center; }*/
/*.thumb-pos-center-right .bg-item { background-position: right center; }*/
/*.thumb-pos-bottom-left .bg-item { background-position: left bottom; }*/
/*.thumb-pos-bottom-center .bg-item { background-position: center bottom; }*/
/*.thumb-pos-bottom-right .bg-item { background-position: right bottom; }*/
/*.bg-item{*/
/* background-size: cover;*/
/* background-repeat: no-repeat;*/
/*}*/
/* 图片尺寸控制 */
.grid-item-thumbnail .bg-item,
.card-item-thumbnail .bg-item {
width: 100%;
height: 100%;
/*object-fit: cover;*/
transition: transform 0.3s ease;
}
/* 自定义缩略图尺寸 */
.thumb-size-2x3 {
position: relative;
width: 100%;
padding-bottom: 150%; /* 3/2 = 150% */
overflow: hidden;
}
/* 竖版 3:4（常见照片比例） */
.thumb-size-3x4 {
position: relative;
width: 100%;
padding-bottom: 133.33%; /* 4/3 ≈ 133.33% */
overflow: hidden;
}
/* 竖版 4:5（Instagram / 小红书） */
.thumb-size-4x5 {
position: relative;
width: 100%;
padding-bottom: 125%;
overflow: hidden;
}
/* 竖版 9:16（手机全屏视频 / 短视频） */
.thumb-size-9x16 {
position: relative;
width: 100%;
padding-bottom: 177.78%;
overflow: hidden;
}
/* 正方形 1:1 */
.thumb-size-1x1 {
position: relative;
width: 100%;
padding-bottom: 100%; /* 1/1 = 100% */
overflow: hidden;
}
/* 横版 4:3（旧照片、iPad） */
.thumb-size-4x3 {
position: relative;
width: 100%;
padding-bottom: 75%; /* 3/4 = 75% */
overflow: hidden;
}
/* 横版 3:2（经典照片比例） */
.thumb-size-3x2 {
position: relative;
width: 100%;
padding-bottom: 66.66%; /* 2/3 ≈ 66.66% */
overflow: hidden;
}
/* 横版 5:4（显示器 / 大画幅） */
.thumb-size-5x4 {
position: relative;
width: 100%;
padding-bottom: 80%;
overflow: hidden;
}
/* 横版 2:1（横幅 / 头图） */
.thumb-size-2x1 {
position: relative;
width: 100%;
padding-bottom: 50%;
overflow: hidden;
}
/* 横版 16:9（视频、宽屏） */
.thumb-size-16x9 {
position: relative;
width: 100%;
padding-bottom: 56.25%; /* 9/16 = 56.25% */
overflow: hidden;
}
/* 电影 1.85:1（好莱坞平场） */
.thumb-size-185x1 {
position: relative;
width: 100%;
padding-bottom: 54.05%;
overflow: hidden;
}
/* 超宽屏 21:9（电影比例） */
.thumb-size-21x9 {
position: relative;
width: 100%;
padding-bottom: 42.86%; /* 9/21 ≈ 42.86% */
overflow: hidden;
}
.size>*{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*.home-widget .grid-item {*/
/* box-shadow: 0 2px 15px rgba(0, 0, 0, 0.06);*/
/*}*/
/* 网格布局 */
.grid-item {
background: var(--max-5-bg);
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
transition: all 0.3s ease;
height: 100%;
/*display: flex;*/
/*flex-direction: column;*/
border: none;
position: relative;
}
.software-card:hover,.grid-item:hover{
transform: translateY(-3px);
box-shadow: var(--max-shadow);
box-shadow: var(--max-shadow-lg);
}
/*.grid-item:hover .grid-item-thumbnail .bg-item,*/
.card-item:hover .card-item-thumbnail .bg-item{
transform: scale(1.06);
}
.grid-item-title:hover a, .software-title:hover a{
color: var(--max-1-color);
}
/*.grid-item-title:hover a,.software-title:hover a{*/
/* color: #066fe0;*/
/*}*/
/*.grid-item:hover img,.software-card:hover,.card-item:hover{*/
/* transform: scale(1.05);*/
/* transition: all .3s linear!important;*/
/*}*/
.grid-item-content {
/*padding: 12px;*/
/*flex-grow: 1;*/
/*display: flex;*/
/*flex-direction: column;*/
}
/* 卡片布局 */
.card-item {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
transition: all 0.3s ease;
height: 100%;
border: none;
position: relative;
}
.card-item:hover .card-item-content {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.card-item:hover .show-extra-title {
opacity: 0;
}
.card-item .show-extra-title{
opacity: 1;
}
.card-item-content {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
/*background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);*/
background: linear-gradient(to top, rgba(0, 0, 0, 1.8), transparent);
color: #fff;
padding: 12px;
box-sizing: border-box;
opacity: 0;
transition: opacity .3s ease, transform .3s ease;
pointer-events: none;
}
.card-item-content .post-categories a {
color: #fff;
text-shadow: 0 0 10px rgba(0, 0, 0, 0.15), 0 0 20px rgba(0, 0, 0, 0.10), 0 0 30px rgba(0, 0, 0, 0.06);
}
.card-item-content .card-title,
.card-item-content .card-title a,
.card-item-content .card-excerpt,
.card-item-content .card-meta {
color: #fff;
}
.card-item-content .card-meta {
display: flex;
justify-content: space-between;
}
/*软件下载风格*/
/*.soft-to .software-2{*/
/* display: block;*/
/* text-align: center;*/
/* flex-direction: column;*/
/* position: relative;*/
/*}*/
.layout-software .col-1-7 .software-1,
.layout-software .col-1-8 .software-1 {
margin-top: -0.25rem;
}
.sof-ware{
margin:0 10px ;
}
.software-card {
background: var(--max-5-bg);
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
transition: all 0.3s ease;
height: 100%;
}
/*.software-card:hover {*/
/* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/
/*}*/
.software-info {
flex-grow: 1;
}
.software-title {
/*font-size: 16px;*/
font-size: 0.95rem;
line-height: 1.4;
font-weight: bold;
/*margin: 0 0 8px;*/
margin-bottom: 0.25rem;
display: -webkit-box;
overflow: hidden;
}
.software-details {
display: flex;
align-items: center;
position: relative;
min-height: 60px;
}
.software-details img {
width: 50px;
height: 50px;
/*margin-right: 12px;*/
max-width: 50px;
border-radius: 6px;
}
.rating-stars{
margin-bottom: 8px;
color: #ffa400;
position: relative;
overflow: hidden;
display: block;
align-items: center;
}
.rating-text {
font-size: 12px;
color: #666;
margin-left: 4px;
}
.software-size {
font-size: 12px;
color: #666;
}
.software-1 .softw-btn {
background-color: #007bff00;
border: 1px solid #27ca17;
display: initial;
padding: 0 5px;
color: #000;
border-radius: 4px;
cursor: pointer;
position: absolute;
right: 10px;
transition: background-color 0.3s ease;
}
.software-2 .softw-btn {
background-color: #007bff00;
border: 1px solid #27ca17;
display: initial;
padding: 0 5px;
color: #000;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.software-2 .softw-btn{
display: none;
}
@media (min-width: 998px){
.software-info .software-2 img{
width: 100%;
height: 80px;
width: 100px;
max-width: none;
margin-top: 0.25rem;
margin-left: -0.5rem;
}
.max-category-posts .software-info .software-2 img{
height: 65px;
width: 75px;
}
.col-1-7 .software-details img,.col-1-8 .software-details img {
width: 35px;
height: 35px;
max-width: 35px;
}
}
@media (max-width: 1200px){
.softw-btn {
display: none;
position: revert!important;
/*top: 50%;*/
bottom: -15px;
/*width: 60%;*/
background: #fff;
/*left: 50%;*/
/*transform: translate(-50%, -50%);*/
}
}
.softw-btn:hover {
background: #fdffbc;
}
@media (max-width: 998px) {
.software-details img{
width: 40px;
height: 40px;
margin: 0 3px 0 0;
}
.grid-item .grid-item-title{
font-size: 0.85rem;
}
.grid-item-meta .post-price{
padding: 0;
background: none;
}
.archive-posts .grid-item-content{
padding: 6px;
}
.sof-ware{
/*margin: 0 0 5px 0px;*/
text-align: center;
}
}
/*游戏风格*/
.layout-game .grid-item-thumbnail img{
border-radius: 12px;
}
.game-gallery-row {
position: relative;
isolation: isolate;
}
.game-gallery-item {
position: relative;
z-index: 1;
transition: transform 0.2s ease, box-shadow 0.2s ease;
transform-origin: center center;
}
.game-gallery-row:hover .game-gallery-item {
z-index: -1;
}
.game-gallery-row .game-gallery-item:hover {
transform: scale(1.5);
z-index: 999 !important;
box-shadow: 0 10px 30px rgba(0,0,0,0.6);
}
.game-gallery-inner {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 4px;
}
/*音频风格布局*/
.audio-item .audio-name {
margin: 2px 0px 8px 0;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
/*display: block;*/
}
.audio-name {
margin: 0px 0px 0px 10px;
z-index: 10;
/* 确保它在其他内容之上 */
/*background-color: #fff;*/
/* 背景颜色 */
border-radius: 5px;
/* 圆角边框 */
text-decoration: none;
/* 文字颜色 */
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
margin: 0 0 6px 0px;
font-size: 14px;
font-weight: 600;
}
.post-single .audio-name a {
pointer-events: none;
color: #000;
}
/*.audio-name a {*/
/* color: #000;*/
/*}*/
.audio-item .music-right {
width: 80%;
flex-shrink: 0;
}
.post-single .music-right {
width: 60%;
flex-shrink: 0;
}
.music-player {
background: var(--max-2-bg);
border-radius: 8px;
padding: 15px;
padding-top: 6px;
padding-bottom: 10px;
/*margin: 5px 0;*/
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
margin-bottom: 1rem;
}
.entry-content .music-player {
margin-bottom: 2rem;
margin-top: 1rem;
}
.player-button,.player-button img {
position: relative;
cursor: pointer;
border-radius: 50%;
}
.music-left {
width: 52px;
width: 62px;
}
.player-button-image {
width: 100%;
height: 100%;
border-radius: 4px;
object-fit: cover;
}
.play-btn-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
border-radius: 4px;
display: flex;
justify-content: center;
align-items: center;
}
.play-btn {
color: #fff;
font-size: 24px;
text-align: center;
border-radius: 50%;
background-color: #f5f5f5;
}
.music-right {
padding-left: 12px;
flex: 1;
}
.waveform-container {
width: 100%;
height: 30px;
position: relative;
}
.waveform-container canvas{
max-width: 600px;
height: 30px;
}
/* 添加保护层防止右键保存 */
.waveform-protector {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none;
/* 允许点击穿透 */
}
.aud-bt {
display: flex;
justify-content: space-between;
align-items: center;
}
/*.aud-left {*/
/* display: flex;*/
/* align-items: center;*/
/*}*/
.music-sound {
cursor: pointer;
margin-right: 5px;
}
.archive-posts .music-progress{
width: 60px;
}
.music-progress {
width: 80px;
height: 4px;
margin-top: 4px;
background: #e0e0e0;
border-radius: 2px;
position: relative;
cursor: pointer;
}
.volume-bar {
position: absolute;
top: 0;
left: 0;
height: 100%;
background: #e74b3b;
width: 70%;
border-radius: 2px;
}
.volume-icon {
position: absolute;
top: -4px;
width: 12px;
height: 12px;
background: #e74b3b;
border-radius: 50%;
transform: translateX(-50%);
}
.aud-rg {
display: flex;
font-size: 12px;
color: #666;
}
.music-left .player-button .play-btn-bg {
display: inline-block;
height: 20px;
width: 20px;
position: absolute;
top: 50%;
left: 50%;
background-color: #fff;
border-radius: 17px;
z-index: 2;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
opacity: 0.9;
transition: all 0.3s;
}
.music-left .player-button:hover .play-btn-bg {
transform: translate(-50%,-50%) scale(1.1);
opacity: 1;
}
.music-left .player-button .play-btn-bg .icon-play {
display: inline-block;
height: 20px;
width: 20px;
position: absolute;
left: 50%;
top: 50%;
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
background-image: url('data:image/svg+xml;utf8,');
}
.music-left .player-button .play-btn-bg .icon-pause {
display: inline-block;
height: 20px;
width: 20px;
position: absolute;
left: 50%;
top: 50%;
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
background-image: url('data:image/svg+xml;utf8,');
}
@media (max-width: 767px) {
.waveform-container {
height: 25px;
}
/*.music-progress {*/
/* width: 60px;*/
/*}*/
.player-button, .player-button img {
width: 52px;
height: 52px;
}
.music-left .player-button .play-btn-bg {
height: 20px;
width: 20px;
}
}
/*文章样式*/
/*.entry-content code {*/
/* padding: 2px 4px;*/
/* font-size: 90%;*/
/* color: #c7254e;*/
/* background-color: #f9f2f4;*/
/* border-radius: 4px;*/
/*}*/
/*pre * {*/
/* background: transparent !important;*/
/*}*/
/*.u-text-format h2 {*/
/* font-size: 22px;*/
/*}*/
/*.u-text-format h3 {*/
/* font-size: 20px;*/
/*}*/
/*音频风格结束*/
/*音频风格*/
@media (max-width: 1200px){
.audio-item{
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
}
@media (max-width: 998px){
.audio-item{
flex: 0 0 50%;
max-width: 50%;
}
.ref-card-2 .col-1-4{
width: 25%;
}
}
@media (max-width: 598px){
.audio-item{
flex: 0 0 100%!important;
max-width: 100%!important;
}
.mobile-cols-2 .row > .music-right {
flex: 0 0 70%!important;
max-width: 70%!important;
}
.poster-item .poster-image{
height: 150px;
}
.card-1 .ref-card{
justify-content: center;
}
.card-item-content,.grid-item-meta{
white-space: nowrap;
}
.max-video-locked-mask .gao-list-1 .col-auto{
margin-bottom: 8px;
}
}
/* 分类标签样式 */
.post-categories {
display: flex;
/*flex-wrap: wrap;*/
overflow: hidden;
white-space: nowrap;
}
.category-badge {
font-size: 0.75rem;
padding: 0px 6px;
border-radius: 4px;
text-decoration: none;
position: relative;
padding-left: 10px;
color: #a1a1a8;
}
.category-badge:before,.xz-3 .text-light-red:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
/*width: 6px;*/
/*height: 6px;*/
width: 5px;
height: 5px;
border-radius: 50%;
}
.cat-1:before { background-color: #ff4757; }
.cat-2:before { background-color: #2ed573; }
.cat-3:before,.xz-3 .text-light-red::before { background-color: #1e90ff; }
/* 标题样式 */
.grid-item-title{
font-size: 0.95rem;
line-height: 1.4;
margin: 0 0 6px;
font-weight: 600;
/*color: #333;*/
margin-bottom: 0.25rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.card-title{
font-size: 0.95rem;
line-height: 1.4;
margin: 0 0 6px;
font-weight: 600;
margin-bottom: 0.25rem;
/*color: #333;*/
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* 摘要样式 */
.grid-item-excerpt,
.card-excerpt {
/*font-size: 0.8rem;*/
font-size: 0.75rem;
line-height: 1.4;
color: var(--max-txt-color);
margin-bottom: 8px;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
min-height: 18px;
overflow: hidden;
}
/* 元信息样式 */
.grid-item-meta, .card-meta {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.75rem;
color: #999;
margin-top: auto;
/*gap: 10px;*/
}
/* 日期样式 */
.post-date {
/* 可以根据需要添加特定样式 */
}
/* 浏览量样式 - 强制靠右 */
/* 当只有浏览量时的样式 */
.ms-auto:only-child {
margin-left: auto;
width: 100%;
text-align: right;
}
/* 占位图 */
.placeholder-image {
background-color: #e9ecef;
display: flex;
align-items: center;
justify-content: center;
}
.placeholder-image img {
width: 40%;
height: auto;
opacity: 0.3;
}
/* 基础行样式 */
/*分类文章模块样式结束*/
.gao-list-1 {
margin: 0 -5px;
display: flex;
flex-wrap: wrap;
}
.gao-list-1 > [class*="col-"] {
padding: 0 5px;
margin-bottom: 16px;
box-sizing: border-box;
}
/*避免影响加载翻页，首页模块单独用这个*/
.gao-list {
margin: 0 -7.5px;
display: flex;
flex-wrap: wrap;
}
.gao-list > [class*="col-"] {
padding: 0 7.5px;
margin-bottom: 16px;
box-sizing: border-box;
}
.gao-list-2 {
margin: 0 -12px;
display: flex;
flex-wrap: wrap;
}
.gao-list-2 > [class*="col-"] {
padding: 0 12px;
margin-bottom: 16px;
box-sizing: border-box;
}
/* 懒加载容器必须有宽高 */
/*顶部菜单*/
.logo_miao:before {
content: "";
position: absolute;
width: 220px;
height: 6px;
background-color: rgba(255,255,255,.5);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-animation: blink 1.7s ease-in 1.7s infinite;
animation: blink 1.7s ease-in 1.7s infinite;
}
.logo_saoyi {
overflow: hidden;
position: relative; /* 确保伪元素定位正确 */
}
.logo_sao:before {
content: "";
position: absolute;
width: 220px;
height: 6px;
background-color: rgba(255,255,255,.5);
transform: rotate(-45deg);
animation: blink 1.5s ease-in infinite; /* 移除延迟 */
left: -200px;
top: 0;
}
/* 夜间模式 */
.dark-open .logo_sao:after {
content: "";
position: absolute;
width: 150px;
height: 10px;
background-color: rgba(41,48,66,1);
transform: rotate(-45deg);
animation: blink 1.5s ease-in infinite; /* 移除延迟 */
left: -200px;
top: 0;
}
@keyframes blink {
from {
left: -200px;
top: 0;
}
to {
left: 200px;
top: 0;
}
}
/* 兼容性前缀可以保留，但现代浏览器已不需要 */
@-webkit-keyframes blink {
from {left: -200px;top: 0;}
to {left: 200px;top: 0;}
}
/*顶部菜单模块开始*/
/* 主菜单容器 */
/*透明菜单*/
.bg-cd-menu .site-header{
background-color: transparent!important;
-webkit-box-shadow: none!important;
box-shadow: none!important;
color: #fff!important;
}
.bg-cd-menu .to-nav-list a,.bg-cd-menu .user-name,.bg-cd-menu .toggle-notify{
color: #fff;
}
.bg-cd-menu .to-sub-menu a{
color: var(--max-color);
}
.bg-cd-menu .header-heg,.bg-cd-menu .header-heg-1{
height: 0;
}
.bg-cd-menu .to-menu-sj{
background-color: #fff0;
}
/*.navbar .to-sub-menu a{*/
/* color: #4c4141;*/
/*}*/
.site-header {
background-color: var(--max-5-bg);
/*background-color: var(--max-2-bg);*/
/*box-shadow: 0 0px 4px #e2e8f0;*/
box-shadow: 0 0 28px rgb(0 0 0 / 7%);
position: fixed;
width: 100%;
z-index: 100;
top: 0;
left: 0;
}
.navbar {
display: flex;
/*align-items: center;*/
flex: 1; /* 占据剩余空间 */
}
.to-menu-sj {
display: flex;
/*align-items: center;*/
}
.actions {
display: flex;
align-items: center;
position: relative;
padding-left: 18px;
margin-left: auto;
cursor: pointer;
}
.burger {
display: none; /* 默认隐藏 */
margin-left: 10px; /* 与前面元素的间距 */
}
.header-heg,.header-heg-1{
height: 65px;
}
.nav-hg{
display: flex;
justify-content: space-between;
align-items: center;
height: 65px;
}
.to-menu-sj::-webkit-scrollbar,.user-menu::-webkit-scrollbar,.cols-0::-webkit-scrollbar,.login-modal-right::-webkit-scrollbar{
display: none;
}
@media (max-width: 576px) {
.to-menu-sj::after {
content: "";
position: absolute;
/* top: 0; */
right: 0;
width: 60px;
height: 24px;
background: linear-gradient(90deg,
rgba(255,255,255,0) 0%,
rgba(255,255,255,0.8) 100%);
pointer-events: none;
z-index: 1;
position: fixed;
}
}
/* 固定在容器右侧的阴影 */
/*顶部菜单模块结束*/
.logo-menu {
display: flex;
justify-content: center;
overflow: hidden;
position: relative;
}.logo-img {
min-width: 100px;
max-height: 60px;
/*max-height: 50px;*/
width: auto;
}
.to-nav-list {
display: flex;
list-style: none;
/*margin: 0;*/
/*padding: 0;*/
white-space: nowrap;
/*transition: transform 0.3s ease;*/
/*justify-content: center;*/
/*position: absolute;*/
}
/* 一级菜单项 */
.to-nav-list > li {
font-size: 14px;
margin: 0 3px;
position: relative;
}
/* 所有菜单链接 */
.to-nav-list a {
display: flex;
align-items: center;
justify-content: center;
padding: 8px 10px;
/*color: var(--max-color);*/
text-decoration: none;
/*transition: all 0.3s ease;*/
position: relative;
/*font-size: 0.9rem;*/
z-index: 100;
}
/* 下拉箭头图标 */
.i-menu-arrow {
margin-left: 5px;
font-size: 12px;
transition: transform 0.3s ease;
}
/* 子菜单样式 */
.to-sub-menu {
position: absolute;
pointer-events: none;
top: 100%;
left: 50%;
transform: translateX(-50%);
min-width: 150px;
background: var(--max-5-bg);;
box-shadow: 2px 5px 20px rgb(0 0 0 / 23%);
list-style: none;
padding: 10px 8px;
/*padding: 10px 0px;*/
margin: 0;
opacity: 0;
visibility: hidden;
transition: all 0.2s ease;
z-index: 99;
text-align: center; /* 子菜单内容居中 */
}
/*.to-sub-menu .cd-to{*/
/* padding:0px 8px;*/
/*}*/
/* 子菜单三角标 */
.to-nav-list > li > .to-sub-menu:before {
content: "";
position: absolute;
top: -19px;
left: 50%;
margin-left: -10px;
border-width: 10px;
border-style: solid;
border-color: transparent;
border-bottom-color: var(--max-1-card);
}
/* 二级子菜单位置调整 */
.to-sub-menu.to-level-2 {
left: 100%;
top: 0;
transform: none;
}
/* 三级子菜单位置调整 */
.to-sub-menu.to-level-3 {
left: 100%;
top: 0;
transform: none;
}
/* 鼠标悬停显示子菜单 */
.to-nav-list > li:hover > .to-sub-menu {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
/* 子菜单项悬停显示下一级 */
.to-sub-menu li:hover > .to-sub-menu {
opacity: 1;
visibility: visible;
pointer-events: auto;
margin-left: -7px;
}
/* 当前菜单项样式 */
.to-active > a{
color: #0f83ff;
/*font-weight: bold;*/
}
/* 鼠标悬停菜单项效果 */
/*.to-nav-list a:hover {*/
/* color: #0073aa;*/
/*}*/
/* 有子菜单的项悬停时箭头旋转 */
.to-nav-list > li:hover > a > .i-menu-arrow {
transform: rotate(180deg);
}
@media (max-width: 798px) {
.to-nav-list > li > .to-sub-menu:before,.to-sub-menu,.directory-nav{
display: none;
}
.to-nav-list{
padding-right: 40px;
}
.to-nav-list a{
padding: 0px 6px;
font-size: 13px;
}
.header-heg{
height: 80px;
}
.header-heg-1{
height: 50px;
}
.burger {
display: flex; /* 在小屏幕上显示 */
}
.to-menu-sj {
/*display: none;*/
display: grid;
height: 30px;
flex-direction: column; /* 垂直排列 */
position: absolute;
top: 100%; /* 位于头部下方 */
left: 0;
width: 100%;
background-color: var(--max-5-bg);
/*box-shadow: 0 2px 4px rgba(0,0,0,0.1);*/
z-index: 99;
align-items: center;
overflow-x: auto;
overflow-y: hidden;
}
.to-menu-sj.active {
display: flex; /* 显示菜单 */
}
.bg-cd-menu .navbar{
display: none;
}
.nav-hg{
/*height: 55px;*/
height: 50px;
}
.actions .translateSelectLanguage,.actions .translate-option {
background-size: 18px 14px;
background-position: 3px center;
padding: 5px 14px 5px 26px;
min-width: 80px;
font-size: 0.75rem;
}
.actions .translate-dropdown,.actions .language-selector{
min-width: 80px;
/*max-width: 100%;*/
}
.actions .translateSelectLanguage:after{
right: 2px;
}
.actions{
padding-left: 8px;
}
}
/*@media (min-width: 798px) and (max-width: 1200px){*/
/* .actions {*/
/* }*/
/*}*/
/*顶部菜单结束*/
/*菜单模板3*/
.mod-2{
font-size: 22px;
/*padding-left: 15px;*/
}
/*菜单模板3结束*/
/*手机侧边栏菜单*/
/* 隐藏默认的 PC 端菜单 */
/*@media (max-width: 768px) {*/
/* .to-menu-sj {*/
/* display: none;*/
/* }*/
/*}*/
.side-mobile .logo-menu{
display: block;
text-align: center;
margin-bottom: 1rem;
}
/* 移动端菜单图标 */
.mobile-icon {
/*display: none;*/
font-size: 16px;
cursor: pointer;
position: fixed;
right: 0;
background: var(--max-5-bg);
z-index: 100;
/*width: 50px;*/
/*text-align: center;*/
padding-left: 15px;
padding-right: 15px;
/*margin: 5px;*/
}
/* 遮罩层 */
.s-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
z-index: 1000;
opacity: 0;
transition: opacity 0.3s ease;
}
.s-overlay.active {
opacity: 1;
}
.side-mobile {
position: fixed;
top: 0;
right: -70%; /* 初始位置在屏幕外 */
width: 70%;
height: 100%;
background: var(--max-2-bg);
z-index: 1001;
box-shadow: -2px 0 10px rgba(0, 0, 0, 0.2);
padding: 20px;
overflow-y: auto;
transition: right 0.3s ease;
}
.mou2-left.side-mobile{
left: -70%;
transition: left 0.3s ease;
}
.side-mobile.active {
right: 0; /* 激活时滑入屏幕 */
}
.mou2-left.active{
left: 0;
}
/* 关闭按钮样式修改 */
.s-close {
position: absolute;
top: 0px;
right: 5px;
font-size: 28px;
cursor: pointer;
color: #8b8787;
padding: 10px; /* 增加点击区域 */
z-index: 1;
}
@media (max-width: 768px) {
.side-mobile {
display: none;
}
}
/* 菜单样式 */
.side-mobile-menu ul {
list-style: none;
padding: 0;
margin: 0;
}
/*.side-mobile-menu ul li {*/
/* margin-bottom: 10px;*/
/*}*/
.side-mobile-menu ul li a {
text-decoration: none;
/*color: #000;*/
display: block;
background: var(--max-txt-border);
padding: 10px 16px;
margin-bottom: 8px;
font-size: 14px;
white-space: nowrap;
/*overflow: hidden;*/
position: relative;
}
.side-mobile-menu ul .s-level-2 li a{
margin-left: 10px;
}
.side-mobile-menu ul .s-level-3 li a{
margin-left: 20px;
}
.side-mobile-menu .menu-arrow {
position: absolute;
background: rgba(0,0,0,0.03);
border-radius: 50%;
transform: translateY(-50%);
width: 30px;
height: 30px;
right: 10px;
top: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: transform 0.3s ease;
z-index: 1;
}
.side-mobile-menu ul ul {
text-align: center;
max-height: 0; /* 初始高度为0 */
overflow: hidden;
transition: max-height 0.3s ease; /* 平滑过渡效果 */
}
/*.s-menu-item-92{*/
/* background: #e5e5e5;*/
/*}*/
/*.s-menu-item-42{*/
/* margin: 8px;*/
/*}*/
.side-mobile-menu > ul > li > a{
display: block;
background: #d5d6d312;
padding: 10px 15px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
/*个人中心浏览记录*/
.vie-time{
font-size: 14px;
color: #b8b2b2;
text-align: center;
background: #000;
}
.history-list .card-item{
transform: translateY(0px);
}
.card-item:hover .vie-time{
color: #000;
}
/*浏览页面结束*/
/*个人中心充值套餐*/
.balance-but{
color: #fff;
border: none;
padding: 0.75rem 2rem;
font-size: 1rem;
border-radius: 6px;
}
.package-radio {
position: absolute;
opacity: 0;
}
.package-label {
cursor: pointer;
border: 1px solid #e0e0e0;
min-height: 90px;
display: flex;
flex-direction: column;
text-align: center;
}
.package-label:hover {
border: 1px solid #4285f4;
}
.package-label.active {
background: var(--max-3-bg);
border-color: var(--max-2-color);
}
/*充值套餐结束*/
/*个人中心下载页*/
/*.down-span .bg-light-white{*/
/* transition: all 0.3s ease;*/
/*}*/
/*.down-span .bg-light-white:hover {*/
/* background: rgb(235 235 235);*/
/*}*/
/*.download-info {*/
/* min-width: 0;*/
/*}*/
/*.download-info .ell {*/
/* display: block;*/
/* overflow: hidden;*/
/* text-overflow: ellipsis;*/
/* white-space: nowrap;*/
/*}*/
/*.download-time {*/
/* flex-shrink: 0;*/
/* white-space: nowrap;*/
/*}*/
/*个人中心下载页面结束*/
/*投稿*/
.media-modal .screen-reader-text,.tougao-2 .wp-editor-tools .csf-shortcode-button,.media-modal #menu-item-gallery,.media-modal #menu-item-playlist,.media-modal #menu-item-video-playlist{
display: none;
}
.tougao-2 .wp-core-ui .button {
color: #fff;
border-color: #007bff;
background: #007bff;
}
.tougao-2 .wp-core-ui .button:hover {
color: #fff;
border-color: #0069d9;
background: #0069d9;
}
.tougao-2 .wp-core-ui .button:active,
.tougao-2 .wp-core-ui .button:focus {
color: #fff;
border-color: #005cbf;
background: #005cbf;
}
/*推广海报*/
.poster-item {
cursor: pointer;
border: 2px solid transparent;
border-radius: 4px;
margin-bottom: 1rem;
transition: all 0.3s;
}
.poster-item:hover {
transform: translateY(-2px);
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.poster-item.active {
border-color: #2163e8;
}
.poster-image {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border-radius: 4px;
margin-top: 5px;
width: 100%;
height: 220px;
display: block;
}
.poster-result-image img {
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
/*形式class*/
.dd-software .w-n30 img {
object-fit: contain;
}
/*****************/
/*推广明细*/
.table-cell{
padding: 12px 8px;
text-align: center;
font-size: 0.9rem;
}
.table-header .table-cell {
padding: 12px 8px;
text-align: center;
}
.commission-table-container {
min-width: 600px;
border: 1px solid #eee;
border-radius: 5px;
overflow: hidden;
}
.table-header {
/*background-color: #f8f9fa;*/
font-weight: bold;
}
.table-row {
border-top: 1px solid #eee;
}
.table-cell:not(:last-child) {
border-right: 1px solid #eee;
}
/**********/
/*个人中心菜单入口*/
.user-sidebar {
/*background: #ffffff;*/
/*padding: 15px;*/
/*height: 100%;*/
}
.user-info {
text-align: center;
padding: 20px;
border-bottom: 1px solid #eee;
}
.user-info .user-avatar {
margin-bottom: 15px;
}
.user-info .user-avatar img {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
border: 3px solid #fff;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.user-info .user-name {
display: block;
font-weight: 600;
margin-top: 10px;
}
.min-h{
min-height: 300px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
/*信息模块简介*/
/* 头像上传部分样式 */
.to-avatar-upload {
/*margin-right: 20px;*/
position: relative;
}
.upload-hint {
position: absolute;
/*bottom: 4px;*/
top: 45px;
right: -3px;
padding: 6px;
border-radius: 50%;
background: linear-gradient( -125deg,#17cf35e0 0%, #0fad5f 100%);
display: flex;
align-items: center;
justify-content: center;
height: 25px;
width: 25px;
}
.upload-hint i{
font-size: 12px;
}
.progress {
width: 100%;
height: 15px;
background-color: #e0e0e0;
border-radius: 8px;
overflow: hidden;
margin-bottom: 5px;
}
.progress-fill {
height: 100%;
background: linear-gradient( -125deg,#12a96c 0%, #37e14b 100%);
/*transition: width 0.3s ease;*/
}
.to-avatar-progress {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.progress-text {
font-size: 14px;
color: #3498db;
}
.to-avatar-name {
font-size: 18px;
font-weight: 600;
margin-bottom: 5px;
}
.to-avatar-info-right {
display: flex;
flex-direction: column;
}
.to-avatar-info {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.to-avatar-info-left {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.to-avatar-input {
display: none;
}
.to-upload-icon {
color: white;
font-size: 24px;
}
.to-avatar-section {
margin-bottom: 40px;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
padding: 10px;
border-radius: 15px;
}
.to-avatar-preview {
position: relative;
width: 75px;
height: 75px;
border-radius: 50%;
overflow: hidden;
cursor: pointer;
border: 4px solid #f0f0f0;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease;
}
.to-avatar-preview:hover {
transform: scale(1.05);
}
.to-avatar-preview img {
width: 100%;
height: 100%;
object-fit: cover;
}
.to-avatar-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: all 0.3s;
}
.to-avatar-overlay span{
color: #fff;
font-size: 12px;
}
.to-avatar-upload:hover .to-avatar-overlay{
opacity: 1;
}
.to-avatar-upload:hover .upload-hint{
opacity: 0;
/*transition: all 0.2s;*/
}
.user-menu {
list-style: none;
display: flex;
/*margin-right: -10px;*/
flex-wrap: wrap; /* 允许换行 */
}
.user-menu-nav span{
color: var(--max-color);
}
.user-menu-nav .active span{
color: #338aff;
}
.show-po .user-menu-nav i{
margin-bottom: 0px;
}
/*.show-po .user-menu-nav .active{*/
/* background: radial-gradient(ellipse at center, #f8ffff 60%, transparent 100%);*/
/*}*/
.show-no .user-menu-nav li {
flex: 0 0 calc(33.33% - 12px);
min-width: 60px;
border-radius: 5px;
margin: 6px;
/*box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);*/
text-align: center;
}
.show-all .user-menu-nav li {
flex: 0 0 calc(50% - 12px);
min-width: 60px;
border-radius: 5px;
margin: 6px;
margin-bottom: 3px;
/*box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);*/
text-align: center;
}
.user-menu a {
display: flex;
/*flex-direction: column;*/
/*justify-content: center;*/
align-items: center;
height: 32px;
/*height: 100%;*/
text-decoration: none;
color: var(--max-color);
padding: 3px;
justify-content: center;
min-width: 90px;
}
.user-menu a:hover{
background: var(--max-6-bg);
}
.user-menu i {
font-size: 0.9rem;
width: 25px;
text-align: center;
/*height: 30px;*/
/*line-height: 30px;*/
/*margin-bottom: 8px;*/
border-radius: 50%;
/*background: #fff0;*/
}
.user-menu .menu-title {
font-size: 0.82rem;
line-height: 1.2;
text-align: center;
word-break: break-word; /* 防止长文本溢出 */
}
.user-1{
background: url(../img/01.png) center no-repeat;
}
.user-2{
background: url(../img/02.png) center no-repeat;
}
.user-3{
background: url(../img/03.png) center no-repeat;
}
.user-4{
background: url(../img/04.png) center no-repeat;
}
.user-5{
background: url(../img/05.png) center no-repeat;
}
.user-6{
background: url(../img/06.png) center no-repeat;
}
.user-7{
background: url(../img/07.png) center no-repeat;
}
.user-8{
background: url(../img/08.png) center no-repeat;
}
.user-9{
background: url(../img/09.png) center no-repeat;
}
.user-10{
background: url(../img/10.png) center no-repeat;
}
/* 播放图标 */
/* 公共CSS中没有的，保留在样式表中 */
.max-preview .max-format-icon {
/*background: rgba(255, 255, 255, 0.18);*/
border: 2px solid rgba(235, 224, 224, 0.55);
background: rgba(0,0,0,.2);
color: #fff;
font-size: 1rem;
pointer-events: none;
transition: opacity 0.3s ease;
}
.max-format-icon .fa-video{
font-size: 0.875rem;
}
/* 视频/音频元素 - 默认隐藏 */
.max-preview .media-preview video,
.max-preview .media-preview audio {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: none;
z-index: 1;
}
/* 悬停时显示视频（音频不自动显示） */
.max-preview.media-video:hover .media-preview video {
display: block;
}
/* 悬停时隐藏播放图标（视频） */
.max-preview.media-video:hover .max-format-icon {
opacity: 0;
}
/* 进度条 */
.max-preview .progress-bar {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background: rgba(255, 255, 255, 0.3);
z-index: 3;
}
.max-preview .progress-bar .progress {
width: 0%;
height: 100%;
background: #ff6b00;
transition: width 0.1s ease;
}
/* ========== 音频转盘样式 ========== */
/* 转盘容器 - 居中并缩放 */
.max-preview .audio-cd-player {
transform: translate(-50%, -50%) scale(0.4);
width: 500px;
height: 500px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
border-radius: 50%;
}
/* 转盘 */
.max-preview .audio-cd-disc {
/* 转盘图片 */
background: url(../img/y-1.jpg) no-repeat center;
background-size: cover;
width: 330px;
height: 330px;
border-radius: 50%;
}
/* 转盘旋转动画 */
@keyframes cd-rotate {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.max-preview .audio-cd-disc.rotate {
animation: cd-rotate 2s linear infinite;
}
/* 拨杆 */
.max-preview .audio-cd-arm {
position: absolute;
top: 0;
right: 170px;
width: 100px;
height: 265px;
z-index: 2;
/* 拨杆图片 */
background: url(../img/y-2.jpg) no-repeat center;
background-size: cover;
transform: rotate(-36deg);
transition: all .6s ease-in-out;
transform-origin: right top;
}
/* 拨杆移动 - 播放时状态 */
.max-preview .audio-cd-arm.skewing {
transform: rotate(0deg);
}
/* 音频区域可点击 */
.max-preview.media-audio .media-preview.audio {
cursor: pointer;
}
/* 音频播放时隐藏格式图标 */
.max-preview.media-audio .max-format-icon {
transition: opacity 0.3s ease;
}
/*专题音频*/
.child-audio .archive-posts .audio-cd-disc{
width: 170px;
height: 170px;
}
.child-material .thumb-pos-center .bg-item {
object-position: top;
}
.child-audio .archive-posts .max-format-icon,.child-material .archive-posts .max-format-icon,.child-tag .archive-posts .max-format-icon{
display: none;
}
.series-audio .audio-item{
max-width: 100%;
}
.child-card{
padding: 15px;
background: var(--max-5-bg);
border-radius: 0.25rem;
position: relative;
}
/*.series-audio{*/
/* max-width: 1200px;*/
/*}*/
/*.t-6{*/
/* background: url(https://v2.w6e.cn/wp-content/uploads/2025/12/ce1d9b6fab97731c.png) center no-repeat*/
/*}*/
/* 为每个菜单项添加不同的浅色背景 */
/* 蓝色系 */
.ic-1 {
background-color: #e0f2fe; /* 浅天蓝 */
color: #0369a1; /* 深天蓝 */
}
/* 绿色系 */
.ic-2 {
background-color: #dcfce7; /* 浅薄荷绿 */
color: #15803d; /* 深森林绿 */
}
/* 红色系 */
.ic-3 {
background-color: #fee2e2; /* 浅粉红 */
color: #ef1111; /* 深红 */
}
/* 紫色系 */
.ic-4 {
background-color: #f3e8ff; /* 浅薰衣草 */
color: #7e22ce; /* 深紫 */
}
/* 青色系 */
.ic-5 {
background-color: #ccfbf1; /* 浅青 */
color: #0d9488; /* 深青绿 */
}
/* 橙色系 */
.ic-6 {
background-color: #ffedd5; /* 浅杏黄 */
color: #c2410c; /* 深橙棕 */
}
/* 黄色系 */
.ic-7 {
background-color: #fef9c3; /* 浅奶油黄 */
color: #a16207; /* 深芥末黄 */
}
/* 粉色系 */
.ic-8 {
background-color: #fce7f3; /* 浅粉 */
color: #be185d; /* 深玫红 */
}
/* 青色系2 */
.ic-9 {
background-color: #e0f7fa; /* 浅冰蓝 */
color: #00acc1; /* 深青蓝 */
}
/* 棕色系 */
.ic-10 {
background-color: #efebe9; /* 浅米灰 */
color: #6d4c41; /* 深咖啡 */
}
/*透明*/
.ic-11{
background-color: #ffffff;
color: #3b26ce;
box-shadow: 0 0px 10px rgba(0, 0, 0, 0.1);
}
/*浅金色*/
.ic-12{
background-color: #fff4e4;
color: #3b26ce;
}
/*浅淡绿色*/
.ic-13{
background-color: #f6fff9;
color: #15803d;
}
/*深色背景*/
/* 深色背景配色体系 */
/* 蓝色系深色 */
.iv-1 {
background-color: #0c4a6e; /* 深海军蓝 */
color: #e0f2fe; /* 浅天蓝 */
}
/* 绿色系深色 */
.iv-2 {
background-color: #14532d; /* 深森林绿 */
color: #dcfce7; /* 浅薄荷绿 */
}
/* 红色系深色 */
.iv-3 {
background-color: #7f1d1d; /* 深酒红 */
color: #fee2e2; /* 浅粉红 */
}
/* 紫色系深色 */
.iv-4 {
background-color: #581c87; /* 深紫罗兰 */
color: #f3e8ff; /* 浅薰衣草 */
}
/* 青色系深色 */
.iv-5 {
background-color: #134e4a; /* 深墨绿 */
color: #ccfbf1; /* 浅青 */
}
/* 橙色系深色 */
.iv-6 {
background-color: #7c2d12; /* 深赭石 */
color: #ffedd5; /* 浅杏黄 */
}
/* 黄色系深色 */
.iv-7 {
background-color: #713f12; /* 深琥珀 */
color: #fef9c3; /* 浅奶油黄 */
}
/* 粉色系深色 */
.iv-8 {
background-color: #831843; /* 深莓红 */
color: #fce7f3; /* 浅粉 */
}
/* 青色系2深色 */
.iv-9 {
background-color: #006064; /* 深海蓝绿 */
color: #e0f7fa; /* 浅冰蓝 */
}
/* 棕色系深色 */
.iv-10 {
background-color: #3e2723; /* 深巧克力 */
color: #efebe9; /* 浅米灰 */
}
.user-menu-nav .active{
/*box-shadow: 0 1px 2px rgb(11 184 104);*/
box-shadow: var(--max-shadow);
background: var(--max-1-card);
/*background: #0cd9dd0d;*/
}
/*.user-menu-nav li a{*/
/* transition: all 0.3s ease;*/
/*}*/
.user-menu-nav li:hover a span,.down-1 .show-all li:hover span,.user-nav-item:hover{
color: #338aff;
/*transition: all 0.3s ease;*/
/*transform: translateY(-3px);*/
/*box-shadow: var(--max-shadow);*/
/*box-shadow: 0 1px 2px rgb(11 184 104);*/
/*background: #0cd9dd0d;*/
}
.up-1 {
position: relative;
/*min-height: 100vh;*/
}
.user-sidebar {
position: sticky;
/*top: 65px;*/
}
.w-n75.cols-0 {
overflow-y: visible;
height: auto;
}
/* 手机端样式 */
/*手机端侧边栏展开模块*/
.font-btn{
background: linear-gradient(90deg, #25be03, #39da1b);
color: #ffffff;
text-align: center;
/*border-radius: 30px;*/
border-radius: 4px;
padding: 4px 10px;
font-size: 0.75em;
font-weight: 500;
}
.fon-bo{
border-bottom: 1px solid #e5e7eb;
padding-bottom: 5px;
}
/*菜单入口结束*/
/*悬浮侧边栏*/
.custom-float-panel {
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
pointer-events: none;
z-index: 1001;
/*width: 280px;*/
}
.max-float-menu.position-right .custom-float-panel {
transform: translateX(10px);
}
.max-float-menu.position-left .custom-float-panel {
transform: translateX(-10px);
}
.float-menu-item:hover .custom-float-panel {
opacity: 1;
visibility: visible;
transform: translateX(0);
pointer-events: auto;
}
.float-menu-list {
overflow: visible;
}
.max-float-menu {
pointer-events: none;
}
.max-float-menu > * {
pointer-events: auto;
}
/*第三方登录绑定模块*/
.up-notice-des {
width: 35px;
text-align: center;
display: inline-block;
}
.up-notice-tg {
color: #4CAF50;
font-size: 1.2rem;
cursor: pointer;
transition: all 0.3s ease;
}
.up-notice-tg:hover {
color: #3d8b40;
}
.up-notice-des:hover .up-notice {
opacity: 1;
visibility: visible;
text-align: left;
}
.up-notice {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 100%;
margin-top: 10px;
width: 380px;
padding: 20px;
background: rgb(245 255 250);
border-radius: 12px;
box-shadow: 0 4px 10px rgb(199 199 199 / 70%);
/* backdrop-filter: blur(5px); */
z-index: 10;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
text-align: left;
}
.up-wx-bind {
position: relative;
display: inline-block;
}
.up-wx-bind .up-text {
visibility: hidden;
width: 180px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 4px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
transform: translateX(-50%);
opacity: 0;
font-size: 14px;
margin-left: -35px;
}
.up-wx-bind .up-text::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
.up-wx-bind:hover .up-text {
visibility: visible;
opacity: 1;
}
/*.up-h3 {*/
/* font-size: 1.25rem;*/
/* color: #333;*/
/* margin-bottom: 8px;*/
/*padding-bottom: 10px;*/
/*border-bottom: 1px solid #eee;*/
/*}*/
.up-des {
color: #666;
font-size: 0.95rem;
margin-bottom: 20px;
position: relative; /* 关键：使子元素的定位基于 .up-des */
}
.up-list {
margin-bottom: 30px;
display: flex;
flex-wrap: wrap;
gap: 20px;
}
.up-item {
width: 100%;
display: flex;
padding: 15px;
border-radius: 12px;
/*background: rgba(245, 255, 250, 0.7);*/
/*backdrop-filter: blur(10px);*/
border: 1px solid rgba(255, 255, 255, 0.3);
/*box-shadow: 0 4px 6px rgb(164 244 198 / 70%);*/
transition: all 0.3s ease;
position: relative;
/*overflow: hidden;*/
border: 1px solid #b9b9b94a;
align-items: center;
}
.up-item:hover {
transform: translateY(-5px);
/*box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);*/
}
.up-icon {
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background: #fff;
border-radius: 50%;
margin-right: 15px;
font-size: 28px;
color: #fff;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
flex-shrink: 0;
}
.up-item:hover .up-icon {
transform: scale(1.1);
}
.up-item.up-weixin .up-icon {
background: linear-gradient(135deg, #09BB07, #2BD964);
}
.up-item.qq-binding .up-icon {
background: linear-gradient(135deg, #12B7F5, #3DCEF9);
}
.up-content {
flex: 1;
display: flex;
}
.up-header{
width: 100%;
}
/*.up-header {*/
/* display: flex;*/
/* justify-content: space-between;*/
/* align-items: center;*/
/* margin-bottom: 10px;*/
/*}*/
.up-header h4 {
margin: 0;
font-size: 1.2rem;
/*color: #333;*/
font-weight: 600;
}
.up-status {
font-size: 0.85rem;
padding: 3px 10px;
border-radius: 12px;
background: #f5f5f5;
}
.up-item.bound .up-status {
color: #2E7D32;
background: #e8f5e9;
}
.up-item.unbound .up-status {
color: #EF6C00;
background: #fff3e0;
}
.up-body {
width: 100%;
}
.up-action {
margin-top: 10px;
text-align: right;
}
.up-notice p {
margin-top: 0;
font-weight: 600;
color: #2E7D32;
display: flex;
align-items: center;
}
.up-notice p i {
margin-right: 10px;
font-size: 1.2rem;
}
.up-notice ul li {
margin-bottom: 8px;
position: relative;
list-style-type: none;
}
.cd-moud{
background: var(--max-5-bg);
box-shadow: var(--max-shadow);
border-radius: 8px;
padding: 8px;
}
@media (min-width: 998px) {
.r-x {
padding-left: 15px;
}
.show-po .user-menu .menu-title {
font-size: 0.9rem;
}
.show-po .user-menu-nav li{
width: 100%;
flex: 1 0 100%;
justify-content: center;
display: flex;
padding-bottom: 5px;
}
.show-po .w-n25 {
width: 18%;
}
.show-po .w-n75 {
width: 82%;
}
.show-po .user-menu-nav a{
height: 38px;
min-width: 90%;
}
}
/* 响应式调整 */
@media (max-width: 1200px) {
.up-item {
flex: 1 1 calc(50% - 20px);
}
/*.to-menu-sj {*/
/* overflow-x: clip;*/
/*}*/
}
/* 移动端适配 */
@media (max-width: 998px) {
.scroll-no .user-menu{
flex-wrap: nowrap;
}
.scroll-no .user-menu-nav li{
flex: 0 0 calc(23% - 10px);
min-width: unset;
height: auto;
}
.show-po li {
flex: 0 0 calc(33.33% - 12px);
min-width: 60px;
border-radius: 5px;
margin: 6px;
/* box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); */
text-align: center;
}
.user-menu {
/*overflow-x: visible;*/
/*white-space: normal;*/
overflow-x: auto; /* 允许横向滚动 */
-webkit-overflow-scrolling: touch; /* iOS 平滑滚动 */
white-space: nowrap; /* 防止文字换行 */
max-height: none;
position: relative;
}
.user-menu li a {
/*white-space: normal;*/
padding: 4px;
}
.user-menu-nav li{
margin: 5px;
}
.user-menu .menu-arrow {
display: none;
}
.user-sidebar {
position: static;
height: auto;
}
.up-1 .user-block {
display: block;
/*margin: -15px;*/
}
.to-avatar-section {
flex-direction: column;
align-items: center;
}
.to-avatar-upload {
margin-bottom: 20px;
margin-right: 0;
}
/*.upload-hint {*/
/* top: -5px;*/
/* right: -5px;*/
/*}*/
.to-avatar-info {
flex-direction: column;
align-items: center;
}
.to-avatar-info-left, .to-avatar-info-right {
width: 100%;
text-align: center;
}
.to-avatar-progress {
width: 100%;
}
}
@media (max-width: 768px) {
.up-item {
flex: 1 1 100%;
}
.up-icon {
width: 50px;
height: 50px;
font-size: 24px;
}
.up-notice ul{
font-size: 13px;
}
.up-notice {
width: 280px; /* 在小屏幕上缩小宽度 */
left: 0;
transform: none;
right: 0;
margin: 10px auto; /* 在小屏幕上居中 */
}
}
/*绑定样式结束*/
/* ====== 个人中心基础设置 ====== */
.profile-1{
height: 190px;
background: var(--max-5-bg);
box-shadow: var(--max-shadow);
}
.to-profile-form {
margin-bottom: 40px;
}
.to-form-group { /* 保留兼容旧样式，可删 */
margin-bottom: 25px;
}
.to-form-label {
display: block;
margin-bottom: 10px;
font-weight: 500;
color: #707070;
font-size: 16px;
}
.to-form-input {
width: 100%;
padding: 10px 12px;
border: 1px solid var(--max-bg);
border-radius: 8px;
font-size: 0.85rem;
background: var(--max-3-bg);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
color: var(--max-color);
overflow: hidden;
}
.to-form-actions {
margin-top: 30px;
text-align: right;
}
.hide-tag{
padding: 2px 12px;
border-radius: 0 8px 0 8px;
/*background: #ff6b6b;*/
background: linear-gradient(135deg, #059669, #10b981);
}
.hide-1{
flex-wrap: wrap;
max-width: 600px;
margin: 0 auto;
padding: 0 15px;
}
.hide-0{
background: #eef2ff;
/*background: var(--max-txt-border2);*/
border: 3px solid var(--max-txt-border);
}
/*个人中心手机端切换*/
@media (max-width: 767px) {
.user-block {
min-height: 60vh;
}
.user-block .max-menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--max-2-bg);
z-index: 999;
transform: translateX(100%);
transition: transform 0.3s ease;
overflow-y: auto;
display: none;
}
.max-menu.menu-active {
transform: translateX(0);
display: block;
padding-bottom: 3rem;
}
.mobile-menu-header {
position: sticky;
top: 0;
background: var(--max-2-bg);
border-bottom: 1px solid #eee;
padding: 15px;
display: flex;
align-items: center;
z-index: 10000;
}
.mobile-menu-back {
background: none;
border: none;
font-size: 16px;
color: var(--max-color);
cursor: pointer;
display: flex;
align-items: center;
}
.mobile-menu-title {
font-weight: bold;
margin-left: 15px;
font-size: 18px;
}
}
@media (min-width: 768px) {
.mobile-menu-header {
display: none;
}
.hide-2{
/*flex: 0 0 auto;*/
/*min-width: 140px;*/
/*padding-left: 3rem;*/
max-width: 238px;
flex: 1;
}
/*.hide-1 .flex-1{*/
/* max-width: 330px*/
/*}*/
}
/* 桌面端：2 列（已存在 .col-1-2） */
/*@media (min-width: 998px) {*/
/* .to-form-row {*/
/* display: grid;*/
/* grid-template-columns: repeat(2, 1fr);*/
/* gap: 20px;*/
/* margin-bottom: -25px;*/
/* }*/
/*}*/
/* 文章内页专用样式 */
.article-header {
/*display: flex;*/
/*justify-content: space-between;*/
/*align-items: center;*/
margin-bottom: 1.5rem;
margin-bottom: 1rem;
padding-bottom: 1rem;
border-bottom: 1px solid #eee;
}
/*.meta-info {*/
/* font-size: 0.85rem;*/
/* color: #666;*/
/*}*/
/*.meta-info .category {*/
/*background: #f0f7ff;*/
/* padding: 0.3rem 0.8rem;*/
/* border-radius: 20px;*/
/* margin-right: 1rem;*/
/*}*/
.spx-left img{
width: 30px;
height: 30px;
border-radius: 50%;
object-fit: cover;
}
.spx-right span{
color: var(--max-txt-color);
}
.spx-right > *:last-child {
margin-right: 0;
}
.meta-info .category a {
color: #1e73be;
text-decoration: none;
}
/*.meta-info .date {*/
/* color: #888;*/
/*}*/
/*.edit-btn {*/
/* position: absolute;*/
/* right: 8px;*/
/* top: 4px;*/
/* border-radius: 4px;*/
/* font-size: 0.85rem;*/
/*}*/
.edit-btn:hover {
color: #2563eb;
}
.edit-btn .dashicons {
margin-right: 5px;
font-size: 16px;
height: auto;
width: auto;
}
.entry-content hr{
margin-top: 18px;
margin-bottom: 18px;
border: 0;
border-top: 1px solid #d8d8d8;
}
.entry-content {
/*font-size: 1.1rem;*/
line-height: 1.8;
font-size: 16px;
word-wrap: break-word;
}
.entry-content h3{
font-size: 18px;
margin: 26px 0 12px;
padding-left: 15px;
line-height: 1.4;
position: relative;
}
.entry-content p {
/*margin-bottom: 1.5rem;*/
margin-bottom: 0.75rem;
}
.entry-content>.h3::before, .entry-content>h3::before {
position: absolute;
top: 3px;
left: 0;
content: "";
width: 3px;
height: calc(100% - 6px);
border-radius: 3px;
background-color: #1a5de2;
}
.entry-content img {
max-width: 100%;
/*height: auto;*/
/*margin: 1.5rem 0;*/
border-radius: 8px;
border: none!important;
}
#gallery-1 .gallery-item{
padding: 5px;
}
/* 文章导航样式 */
/*.entry-navigation .nav-prev,*/
/*.entry-navigation .nav-next {*/
/* border-radius: 8px;*/
/* height: 100%;*/
/*}*/
.entry-navigation a {
color: var(--max-txt-color);
}
.no-gutters span{
font-size: 0.9rem;
}
/* 相关文章样式 */
.related-thumbnail {
height: 160px;
position: relative;
}
.related-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1);
transition: transform 0.3s ease;
}
.related-item h2 {
font-size: .95rem;
font-weight: 600;
line-height: 1.4;
}
/* 侧边栏样式 */
.sidebar-widgets {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
/* 响应式设计 */
@media (max-width: 998px) {
.related-item {
margin-bottom: 1.5rem;
}
.post-max .pl-4{
padding-left: 0;
}
.article-header .post-title,.post-xz-1 h1{
font-size: 1.2rem;
}
}
@media (max-width: 768px) {
.entry-navigation .nav-prev,
.entry-navigation .nav-next {
margin-bottom: 1rem;
}
.entry-navigation .row > div {
flex: 0 0 100%;
max-width: 100%;
padding: 0 !important;
}
.hide-2{
width: 100%;
}
.hide-5{
padding-top: 2rem;
}
}
.theme-switcher:hover {
background: var(--color-secondary);
}
.theme-icon {
/*display: inline-block;*/
/*font-size: 1.2rem;*/
/*width: 24px;*/
/*height: 24px;*/
/*text-align: center;*/
line-height: 24px;
}
.the-vip{
background: #000;
border-radius: 6px;
margin-bottom: 10px;
transform: skewX(0deg);
padding: 8px;
}
.the-vip span {
color: #d4af37;
font-size: 0.75rem;
/*font-weight: 600;*/
letter-spacing: 1.5px;
text-shadow: 0 0 8px rgba(212, 175, 55, .7);
}
.dark-icon {
display: none;
}
[data-theme="dark"] .light-icon {
display: none;
}
[data-theme="dark"] .dark-icon {
display: inline-block;
}
.modal-container.notice-modal .modal-content{
border-radius: 12px;
}
.notice-modal,.sou-top{
margin-top: -3rem;
}
/* 微交互动画 */
/*加载效果*/
.social-login-btn.weixin-btn.loading i {
display: none;
}
.loading::after {
content: "";
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255,255,255,0.3);
border-radius: 50%;
border-top-color: #fff;
animation: spin 1s ease-in-out infinite;
margin-bottom: -2px;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
/*加载效果结束*/
/*微信登录二维码样式*/
.wx-text {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(0, 0, 0, 0.7);
color: white;
padding: 10px 20px;
border-radius: 4px;
z-index: 9999;
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}
/* 当按钮被点击时显示提示 */
.wx-bind:active + .wx-text,
.wx-bind:focus + .wx-text {
opacity: 1;
}
.qrcode-loading {
width: 100%;
max-width: 240px;
height: auto;
aspect-ratio: 1/1;
background: #f5f5f5;
position: relative;
overflow: hidden;
border-radius: 8px;
margin: 0 auto;
}
/* 二维码图片样式 */
#weixin-qrcode {
width: 100%;
height: auto;
display: block;
max-width: 100%;
}
.shimmer {
position: absolute;
top: 0;
left: -20%; /* 调整为从-50%开始 */
width: 50%; /* 缩小扫光宽度 */
height: 100%;
background: linear-gradient(
to right,
transparent 0%,
rgba(255, 255, 255, 0.3) 20%, /* 调整渐变点 */
rgba(255, 255, 255, 0.2) 50%, /* 添加中间渐变 */
rgba(255, 255, 255, 0.3) 80%, /* 对称渐变 */
transparent 100%
);
transform: skewX(-30deg); /* 添加倾斜效果 */
animation: shimmer 0.9s infinite ease-in-out; /* 调整动画时间和缓动 */
opacity: 0.5; /* 降低不透明度 */
}
@keyframes shimmer {
0% { left: -50%; opacity: 0.8; }
50% { opacity: 0.7; } /* 中间更亮 */
100% { left: 150%; opacity: 0.8; } /* 超出容器消失 */
}
.wx-login-nav {
text-align: center;
border-radius: 12px;
/*max-width: 350px; */
width: 100%;
padding: 10px;
padding-top: 0;
padding-bottom: 0;
}
.qrcode-container {
position: relative;
/*padding: 15px;*/
background: white;
border-radius: 8px;
display: flex;
justify-content: center;
align-items: center;
margin: 15px auto;
max-width: 100%;
width: fit-content;
width: 200px;
height: 200px;
}
.status {
margin-bottom: 0;
color: #666;
font-size: 0.85rem;
}
.error {
color: #e74c3c;
/*font-weight: bold; */
}
/* 成功状态覆盖层 */
.success-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.9);
border-radius: 8px;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 10;
}
.success-overlay.active {
display: flex;
animation: fadeIn 0.3s ease;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
/* 超时遮罩 */
.timeout-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
border-radius: 8px;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 11;
color: white;
}
.timeout-overlay.active {
display: flex;
animation: fadeIn 0.3s ease;
}
.refresh-btn {
margin-top: 15px;
padding: 8px 15px;
background-color: #07c160;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
.refresh-btn:hover {
background-color: #06ad56;
}
.login-modal-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
z-index: 9998;
}
html.login-open{
overflow: hidden!important;
}
.login-mode {
position: relative;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 20px;
height: 100%;
width: 100%;
overflow-x: hidden;
overflow-y: auto;
-webkit-box-align: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
}
.login-modal-container {
display: flex;
max-width: 700px;
width: 100%;
background: var(--max-2-bg);
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
/*height: 500px;*/
max-height: 90vh;
/*margin: 5vh auto;*/
z-index: 9999;
animation: fadeInUp 0.4s ease-out 0.1s both; /* 添加0.2秒延迟 */
}
/* 定义动画关键帧 */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(-20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.login-modal-left {
flex: 1;
position: relative;
display: flex;
flex-direction: column;
}
.login-modal-left img {
width: 100%;
height: 100%;
object-fit: cover;
}
.left-content {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 30px;
background: linear-gradient(transparent, rgba(0,0,0,0.7));
color: white;
z-index: 1;
padding-bottom: 15px;
}
.left-content span{
font-size: 24px;
margin-bottom: 10px;
font-weight: 600;
text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.left-content p {
font-size: 16px;
margin-bottom: 20px;
opacity: 0.9;
}
.login-modal-right {
flex: 1;
position: relative;
/*padding-right: 5px;*/
/*padding-left: 0px;*/
padding: 40px 25px 0 25px;
overflow-y: auto;
}
.auth-section{
position: relative;
overflow: hidden;
height: 100vh;
}
.auth-container {
margin: 0 auto;
background: var(--max-2-bg);
border-radius: var(--max-radius);
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
overflow: hidden;
margin-bottom: -10px;
}
.auth-tabs {
display: flex;
border-bottom: 1px solid var(--max-txt-border);
/*margin-bottom: 20px;*/
justify-content: center;
}
.auth-tabs .auth-tab {
padding: 10px 20px;
cursor: pointer;
color: var(--max-txt-color);
font-weight: 500;
position: relative;
transition: all 0.3s ease;
white-space: nowrap;
/*margin-right: 10px;*/
}
.auth-tabs .auth-tab:hover {
color: #333;
}
.auth-tabs .auth-tab.active {
color: #1890ff;
}
.auth-tabs .auth-tab.active::after {
content: '';
position: absolute;
bottom: 6px;
left: 50%;
transform: translateX(-50%);
width: 10px;
height: 2px;
background-color: #1890ff;
transition: all 0.3s ease;
}
.tab-content {
display: none;
}
.tab-content.active {
display: block;
margin-bottom: -12px;
}
/*.form-group {*/
/* margin-bottom: 1.5rem;*/
/*}*/
.form-label {
display: block;
margin-bottom: 0.5rem;
font-weight: 500;
color: #555;
}
.form-group .form-control,.input-group .mgs-form {
width: 100%;
padding: 10px 15px;
border: 1px solid var(--max-bg);
border-radius: 6px;
font-size: 0.85rem;
background-color: var(--max-3-bg);
margin-bottom: 5px;
}
.form-group .form-control:focus,.form-control:focus,.to-form-input:focus {
border-color: var(--btn-gray);
background: var(--max-2-bg);
outline: none;
}
.form-contro2{
width: 100%;
padding: 10px 15px;
border: 1px solid var(--max-bg);
border-radius: 6px;
font-size: 0.85rem!important;
margin-bottom: 5px;
}
.form-group button{
width: 100%;
cursor: pointer;
font-size: 1rem;
}
.error-message {
color: var(--danger-color);
font-size: 0.875rem;
margin-top: 0.25rem;
}
.remember-me {
display: flex;
align-items: center;
font-size: 14px;
}
.remember-me input {
margin-right: 8px;
margin-top: 2px;
}
/* 社交登录样式 */
.login-container {
margin-top: 30px;
text-align: center;
}
.login-divider {
display: flex;
align-items: center;
color: #999;
font-size: 14px;
}
.login-divider .divider-line {
flex: 1;
height: 1px;
background-color: var(--max-txt-border);
}
.login-divider .divider-text {
padding: 0 15px;
}
.login-buttons {
display: flex;
justify-content: center;
/*gap: 20px;*/
margin-top: 15px;
}
.social-login-btn {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
margin: 0 10px 0 10px;
border-radius: 50%;
font-size: 24px;
color: white;
text-decoration: none;
transition: all 0.3s;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.social-login-btn:hover {
transform: translateY(-3px);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}
.social-login-btn.qq-btn {
/*background-color: #12B7F5;*/
background: linear-gradient(135deg, #1298f5, #2294ed);
}
.social-login-btn.weixin-btn {
background-color: #07C160;
cursor: pointer;
}
.wx-login-nav h3 {
margin-bottom: 8px;
color: #333;
font-size: 1.15rem;
}
.qrcode-container {
position: relative;
width: 170px;
height: 170px;
margin: 0 auto 20px;
margin-bottom: 10px;
border-radius: 8px;
overflow: hidden;
}
.qrcode-loading {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #f9f9f9;
display: flex;
align-items: center;
justify-content: center;
}
.shimmer {
width: 80%;
height: 80%;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: shimmer 1.5s infinite;
border-radius: 4px;
}
@keyframes shimmer {
0% { background-position: 200% 0; }
100% { background-position: -200% 0; }
}
.success-overlay,
.timeout-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgb(0 0 0 / 71%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
opacity: 0;
visibility: hidden;
transition: all 0.3s;
}
.success-overlay.active,
.timeout-overlay.active {
opacity: 1;
visibility: visible;
}
.success-icon {
width: 60px;
height: 60px;
border-radius: 50%;
border: 3px solid #07C160;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 15px;
background-color: #4CAF50;
position: relative;
color: #fff;
font-size: 28px;
}
.success-text {
color: #07C160;
font-weight: 500;
margin-top: 10px;
font-size: 20px;
}
.refresh-btn {
margin-top: 15px;
padding: 8px 16px;
background-color: #07C160;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s;
}
.refresh-btn:hover {
background-color: #06AD56;
}
/* 响应式设计 */
@media (max-width: 768px) {
.login-modal-container {
flex-direction: column;
max-width: 100%;
height: auto;
max-height: none;
}
.qrcode-container{
width: 120px;
height: 120px;
}
.wx-login-nav{
padding: 0px;
}
.login-modal-right{
padding: 20px 12px 0 12px;
}
.login-modal-left {
display: none;
}
.login-modal-right .login-container {
display: block;
margin-top: 25px;
}
.login-buttons{
margin-top: 10px;
margin-bottom: 0rem;
}
}
/*邀请好友*/
.card-header .desc {
line-height: 1.2;
padding: 0;
margin: 15px 0 0 0;
color: #979797;
}
.card-header .desc p {
margin: 0;
padding: 0;
}
.card-list {
display: flex;
margin-bottom: 30px;}
.give-list .archive-posts .col-25{
margin-bottom: 3rem;
max-width: 160px;
}
.card-box {
/*width: 160px;*/
background: #595d69;
height: 70px;
border-radius: 10px;
position: relative;}
.card-step {
position: absolute;
left: 10px;
font-style: italic;
width: 45px;
font-size: 31px;
line-height: 37px;
background: linear-gradient(180deg,#ffffff 0%,rgba(255,255,255,0) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
opacity: .3;
font-weight: 600;
}
.card-lock {
display: block;
text-align: center;
width: 100%;
height: 100%;}
.lock-img {
height: 40px;
width: 44px;
overflow: hidden;
margin: 0 auto;
}
.card-text {
margin-top: 5px;
height: 24px;
display: flex;
justify-content: center;
padding-left: 24px;
font-size: 0.9rem;
}
.text-tip {
width: 15px;
color: #636363;
transform: translateY(-1px);
margin-left: 8px;
cursor: pointer;
position: relative;
z-index: 10;
}
.text-tip:hover .tooltip-right{
display: block;
}
.box-line {
color: #686868;
width: 20px;
height: 20px;
margin-top: 28px;
display: flex;
align-items: center;
justify-content: center;}
.tooltip-right::after {
content: '';
position: absolute;
/*top: 50%;*/
/*left: 0;*/
top: 0;
left: 50%;
width: 15px;
height: 15px;
background: #3f3f3f;
/*transform: translate(-50%, calc(-0% - 50%)) rotate(135deg);*/
transform: translate(-50%, -50%) rotate(135deg);
}
.tooltip-right {
clear: both;
padding: 8px 10px;
line-height: 1.6;
word-wrap: break-word;
background: #3f3f3f;
color: #fff;
display: none;
border-radius: 4px;
font-weight: 500;
pointer-events: none;
width: auto;
min-width: 150px;
min-height: 50px;
/*margin-left: 30px;*/
position: absolute;
/*top: -50%;*/
right: 0;
margin-right: -30px;
margin-top: -23px;
}
@media (max-width: 796px){
.card-step {
font-size: 20px;
}
.card-text {
font-size: 12px;
padding-left: 0;}
.text-tip {
display: none;
}
.give-input{
top: 0;
}
}
/*连续签到*/
.sign-1{
background: var(--max-5-bg);
box-shadow: var(--max-shadow);
text-align: center;
padding: 12px 2px;
border-radius:5px;
}
/*用户协议*/
.legal-p {
font-size: 0.9rem;
color: var(--max-txt-color);
line-height: 28px;
margin-bottom: 1rem;
}
.legal-ul {
font-size: 0.9rem;
color: var(--max-txt-color);
line-height: 28px;
margin-bottom: 1rem;
padding-left: 20px;
}
.legal-h3 {
font-size: 1rem;
font-weight: 600;
color: var(--max-1-color);
margin-top: 1.5rem;
margin-bottom: 0.5rem;
}
.legal-h2 {
font-size: 1.25rem;
font-weight: 700;
color: var(--max-1-color);
margin-bottom: 1rem;
}
.legal-meta {
font-size: 0.85rem;
color: var(--max-txt-color);
margin-bottom: 1.5rem;
}
/*登录结束*/
/*手机端顶部标签*/
/* 基础样式 */
/*.tab-yd {*/
/* display: none;*/
/*}*/
/* 手机端显示 */
@media (max-width: 598px) {
.tab-yd {
display: flex;
justify-content: center; /* 让所有标签项整体居中 */
font-size: 14px;
/*overflow-x: auto;*/
white-space: nowrap; /* 防止文字换行 */
}
.tab-item {
position: relative;
/*color: #333;*/
/*padding-bottom: 4px;*/
text-decoration: none;
display: inline-block;
text-align: center; /* 文字居中 */
margin-right: 8px;
font-size: 0.825rem;
}
.tab-item.active {
color: red;
}
.tab-item.active::after {
content: '';
position: absolute;
bottom: 0;
left: 50%; /* 从50%位置开始 */
width: 60%; /* 适当宽度 */
height: 2px;
background-color: red;
transform: translateX(-50%); /* 向左回移自身宽度的一半 */
border-radius: 1px; /* 可选：圆角效果 */
}
}
/*会员角标颜色*/
.vip-type-nov {background-color: #999; /*灰色*/}
.vip-type-month ,.vip-type-quarter,.vip-type-year{background: linear-gradient(135deg, #1a5dff, #0052ff);}/*蓝色*/
.vip-type-vip{background: linear-gradient(135deg, #059669, #10b981);}/*绿色*/
.vip-type-forever{background: linear-gradient( -125deg,#ce0e0ee0 0%, #f26014 100%);}/*橙黄*/
.vip-type-super{background: linear-gradient( -125deg,#9d49ffe0 0%, #e714f2 100%);}/*紫色*/
/*TAB切换组件*/
/* ============================================
Tab切换样式 - 适配深色背景
============================================ */
.tab-btn {
cursor: pointer;
padding: 6px 14px;
border: none;
background: none;
font-size: 14px;
color: rgba(255,255,255,0.6);
transition: all 0.3s ease;
position: relative;
border-radius: 4px;
}
.tab-btn:hover {
color: rgba(255,255,255,0.8);
}
.tab-btn.active {
color: #fff;
font-weight: 600;
background: rgba(255,255,255,0.1);
}
.tab-btn.active.bd-light-blue:hover {
color: #fff;
}
.tab-btn.bd-light-blue:hover {
color: #0e5eff;
}
.tab-btn.active.bd-light-blue{
background: #2163e8;
}
.tab-btn.active::after {
content: '';
position: absolute;
bottom: -2px;
left: 50%;
transform: translateX(-50%);
width: 20px;
height: 2px;
background: #ffdb1f;
border-radius: 2px;
}
/* Tab内容切换 */
.tab-content-item {
display: none!important;
}
.tab-content-item.active {
display: block!important;
}
/* 移动端适配 */
@media (max-width: 998px) {
.max-video-body {
height: auto !important;
max-height: 240px !important;
}
.tab-btn {
font-size: 13px;
padding: 4px 10px;
}
}
/*短代码画廊*/
.max-gallery-wrapper .gallery-thumb-item{border:2px solid transparent;transition:all .2s;cursor:pointer}
.max-gallery-wrapper .gallery-thumb-item.active{border-color:#2163e8;box-shadow:0 0 10px rgba(33,99,232,.5)}
.max-gallery-wrapper .gallery-thumb-item.active .thumb-mask{opacity:0}
@media(max-width:798px){
.max-gallery-wrapper .gallery-thumb-item{width:calc(25% - 7.5px)!important}
.max-gallery-main{height:200px!important}
}
/*折叠组件*/
.max-accordion-item {
border: 1px solid #dee2e6;
border-radius: 8px;
overflow: hidden;
margin-bottom: 8px;
}
.max-accordion-btn {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
text-align: left;
padding: 12px 15px;
background: #f8f9fa;
border: none;
font-weight: 600;
cursor: pointer;
color: #333;
font-size: 0.95rem;
transition: background 0.2s;
}
.max-accordion-btn:hover {
background: #e9ecef;
}
.max-accordion-arrow {
font-size: 0.7rem;
color: #999;
transition: transform 0.3s ease;
flex-shrink: 0;
}
.max-accordion-arrow.open {
transform: rotate(180deg);
}
.max-accordion-body {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.max-accordion-body-inner {
padding: 15px;
border-top: 1px solid #dee2e6;
line-height: 1.7;
/*color: var(--max-txt-color);*/
font-size: 0.95rem;
}
/*公共轮播css*/
/* ========= 轮播容器 ========= */
.search-bg-swiper{
/*position:absolute;*/
/*top:0;*/
/*left:0;*/
/*z-index:1;*/
width:100%;
height:100%;
overflow:hidden;
position: relative;
}
/* ========= 幻灯片 ========= */
.swiper-wrapper{
position:relative;
width:100%;
height:100%;
display:flex;
will-change: transform; /* 提升动画性能 */
backface-visibility: hidden;
}
.swiper-slide{
flex-shrink:0;
width:100%;
height:100%;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
/* 防止图片加载时的布局抖动 */
min-height: 0;
overflow: hidden;
}
/* ========= 多列 ========= */
@media (max-width: 998px) { .os-3{ --cols: 3!important; } }
@media (max-width: 798px) { .os-2{ --cols: 3!important; } }
/* ========= 箭头 ========= */
.swiper-button-prev,
.swiper-button-next{
position:absolute;
top:50%;
transform:translateY(-50%);
width:30px;
height:30px;
background:rgba(0,0,0,.4);
color:#fff;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
z-index:10;
font-size:16px;
}
.swiper-button-prev{left:10px}
.swiper-button-next{right:10px}
/* ========= 圆点 ========= */
.swiper-pagination{
position:absolute;
bottom:15px;
left:50%;
transform:translateX(-50%);
display:flex;
gap:6px;
z-index:10;
}
.dot{
/*width:8px;*/
/*height:8px;*/
width:10px;
height:10px;
border-radius:50%;
background:rgba(255,255,255,.5);
cursor:pointer;
}
.dot.active{background:var(--swiper-theme-color,#007aff)}
/***************************************************************/
/* ===== Max Box 切换组件 ===== */
.max-box-swp {
position: relative;
}
.max-box-hdr {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
}
.max-box-tit {
font-size: 18px;
font-weight: 600;
color: #000;
margin: 0;
}
.max-box-dsc {
font-size: 14px;
color: #666;
margin: 0;
}
.max-box-nav {
display: flex;
/*gap: 8px;*/
}
.max-box-btn {
width: 36px;
height: 36px;
border-radius: 50%;
border: 1px solid #e0e0e0;
background: white;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s ease;
color: #666;
margin-right: 5px;
}
.max-box-btn:hover:not(:disabled) {
border-color: #007cba;
color: #007cba;
background: #f0f7ff;
}
.max-box-btn:disabled {
opacity: 0.8;
cursor: not-allowed;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
background: #f5f5f5;
}
.max-box-ctn {
position: relative;
overflow: hidden;
}
/* 默认隐藏所有组 */
.max-box-grp-box {
/*width: 100%;*/
display: none; /* 默认隐藏 */
flex-wrap: wrap;
opacity: 1;
/*transition: opacity 0.3s ease;*/
}
/* 第一组通过内联样式显示，JS可以控制显示隐藏 */
.max-box-grp-box{
display: flex;
}
/* 切换动画 */
.max-box-grp-box.slide-in {
animation: maxBoxSlideIn 0.3s ease forwards;
}
@keyframes maxBoxSlideIn {
0% {
opacity: 0;
transform: translateX(20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
/* 响应式调整 */
@media (max-width: 576px) {
.max-box-btn {
width: 32px;
height: 32px;
}
}
/***********************/
/*开关样式*/
/* 开关样式 - 独立组件 */
.max-switch {
position: relative;
display: inline-block;
width: 50px;
height: 26px;
}
.max-switch input {
opacity: 0;
width: 0;
height: 0;
}
.max-switch-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
transition: .4s;
border-radius: 34px;
}
.max-switch-slider:before {
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 4px;
bottom: 4px;
background-color: white;
transition: .4s;
border-radius: 50%;
}
.max-switch input:checked + .max-switch-slider {
background-color: #2196F3;
}
.max-switch input:checked + .max-switch-slider:before {
transform: translateX(24px);
}
/***************************************************************/
.liquid-btn {
color: white;
overflow: hidden;
z-index: 1;
padding: 3px 14px;
border: none;
font-size: 14px;
font-weight: 500;
outline: none;
/*min-width: 100px;*/
display: inline-flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
background: #2563eb;
border-color: #2563eb;
background: linear-gradient(135deg, #059669, #10b981);
background: linear-gradient(135deg, #1342e9 0%, #2b6aff 50%, #277cff 100%);
border-radius: 50px;
padding: 7px 18px;
}
.liquid-btn:hover {
transform: translateY(-3px);
}
/*悬浮侧边栏*/
.float-menu-top {
position: absolute;
bottom: -70px;
right: 0;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.float-menu-top.show {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
/*首页底部模块*/
/* 确保页脚始终在底部 */
.site-footer ul {
list-style: none;
padding-left: 0;
}
.site-footer {
flex-shrink: 0;
}
.site-footer.bot_3{
background: #000;
}
.site-footer.bot_3 h5{
color: #f2f2f2;
}
.site-footer.bot_3 .text-gray,.site-footer.bot_3 .text-muted,.site-footer.bot_3 .text-gray a{
color: #9e9e9e;
}
/* 页脚基础样式 */
.site-footer {
background-color: var(--max-5-bg);
color: #000;
width: 100%;
margin-top: auto;
padding-top: 2rem;
padding-bottom: 2rem;
min-height: 200px;
}
/*.site-footer a {*/
/*color: #fff;*/
/* text-decoration: none;*/
/*transition: color 0.3s;*/
/*}*/
.site-footer .bg-success{
color: #fff;
}
/*.site-footer a:hover {*/
/* color: #165dff;*/
/*}*/
.site-footer h5 {
font-size: 0.9rem;
margin-bottom: 1rem;
font-weight: 600;
}
/*, .text-muted a*/
.site-footer .text-muted{
color: var(--max-txt-color);
font-size: 0.9rem;
line-height: 1.6;
padding: 9px;
padding-left: 0;
}
/* 优化后的二维码样式 */
.qr-container {
position: relative;
}
.qr-item {
position: relative;
margin-right: 8px;
/* 创建复合层减少重排 */
transform: translateZ(0);
}
.qr-ico{
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
font-size: 18px;
text-decoration: none;
}
.qr-code {
position: absolute;
bottom: calc(100% + 10px);
left: 50%;
transform: translateX(-50%);
width: 100px;
height: 100px;
background: white;
border-radius: 4px;
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
padding: 5px;
opacity: 0;
transition: opacity 0.3s ease, transform 0.2s ease;
will-change: opacity, transform;
pointer-events: none;
z-index: 1000;
}
.qr-code img {
width: 100%;
height: 100%;
object-fit: cover;
background: white; /* 防止图片加载闪烁 */
}
.qr-item:hover .qr-code {
opacity: 1;
transform: translateX(-50%) translateY(-5px);
}
.bot-op:hover {
opacity: 0.8;
}
/* 响应式调整 */
@media (max-width: 1300px) {
.footer-main .w-n20:nth-child(4) {
display: none;
}
.footer-main .w-n20 {
flex: 0 0 25%;
max-width: 25%;
}
}
@media (max-width: 998px) {
.footer-main .w-n20 {
flex: 0 0 25%;
max-width: 25%;
}
}
@media (max-width: 768px) {
.footer-main .w-n20:nth-child(4),
.footer-main .w-n20:nth-child(5) {
display: none;
}
.footer-main .w-n20 {
flex: 0 0 33.3333%;
max-width: 33.3333%;
}
}
@media (max-width: 576px) {
.footer-main {
display: none !important;
}
.site-footer {
padding: 1rem 0 !important;
min-height: 50px;
}
.border-top{
margin-bottom: 50px;
}
}
/*全局报错弹窗样式*/
body.wp-error-page {
margin: 0;
padding: 20px;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.error-container {
background: white;
border-radius: 12px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
padding: 40px;
max-width: 500px;
width: 100%;
text-align: center;
}
.error-icon {
font-size: 64px;
margin-bottom: 20px;
}
.error-icon.error { color: #dc3545; }
.error-icon.warning { color: #ff9800; }
.error-icon.info { color: #2196F3; }
.error-icon.success { color: #4CAF50; }
.error-title {
font-size: 24px;
font-weight: 600;
color: #333;
margin-bottom: 15px;
line-height: 1.3;
}
.error-message {
color: #666;
line-height: 1.6;
margin-bottom: 25px;
font-size: 16px;
}
.error-actions {
display: flex;
gap: 12px;
justify-content: center;
flex-wrap: wrap;
}
.error-btn {
padding: 10px 24px;
border-radius: 6px;
text-decoration: none;
font-weight: 500;
font-size: 15px;
transition: all 0.2s ease;
border: none;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 120px;
}
.error-btn-primary {
background: linear-gradient(135deg, #1342e9 0%, #2b6aff 100%);
color: white;
}
.error-btn-secondary {
background: #6c757d;
color: white;
}
.error-btn:hover {
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
@media (max-width: 576px) {
.error-container {
padding: 24px;
margin: 0 16px;
}
.error-icon {
font-size: 48px;
}
.error-title {
font-size: 20px;
}
.error-actions {
flex-direction: column;
}
.error-btn {
width: 100%;
}
}
/*数字分页*/
.pagination-number{
display: flex;
justify-content: center;
flex-wrap: wrap;
align-items: center;
}
.pagination-number .page-numbers.current{
border: 1px solid #f3f3f3;
background: #0683ff;
color: #fff;
}
.feny{
background: #dff1ff;
color: var(--max-txt-color);
border: 1px solid #f3f3f3;
padding: 5px 3px 5px 15px;
width: 55px;
}
.feny:focus {
border-color: #92b3f6 !important;
background: #f8f8f8 !important;
outline: none;
}
.pag-wrapper {
text-align: center;
margin-bottom: 1rem;
padding: 20px 0;
}
/* 数字分页样式 */
.pagination-number .page-numbers {
display: inline-block;
padding: 4px 12px;
margin: 0 3px;
border-radius: 5px;
text-decoration: none;
color: #333;
transition: all 0.3s ease;
border: 1px solid #f3f3f3;
background: #fff;
}
.pagination-number .page-numbers:hover {
border: 1px solid #b8bbc0;
}
/*.pagination-number .page-numbers.dots {*/
/* border: none;*/
/* background: none;*/
/* width: 0;*/
/* padding: 0;*/
/* padding-right: 10px;*/
/* margin-top: 10px;*/
/*}*/
/* 加载更多按钮样式 */
.pagination-loadmore .loadmore-btn,
.pagination-infinite .loadmore-btn {
padding: 12px 40px;
font-size: 16px;
border: none;
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.pagination-loadmore .loadmore-btn:hover,
.pagination-infinite .loadmore-btn:hover {
background-color: #005a87;
transform: translateY(-2px);
}
.pagination-loadmore .loadmore-btn:disabled,
.pagination-infinite .loadmore-btn:disabled {
/*background-color: #ccc;*/
cursor: not-allowed;
transform: none;
}
.pagination-loadmore .loadmore-btn:disabled:hover,
.pagination-infinite .loadmore-btn:disabled:hover {
/*background-color: #ccc;*/
transform: none;
}
/* 按钮内部图标和文字 */
.loadmore-icon {
margin-right: 5px;
}
.loadmore-text {
font-weight: 500;
}
/* 滚动触发点 */
.infinite-scroll-trigger {
height: 1px;
width: 100%;
visibility: hidden;
}
/* 响应式设计 */
@media (max-width: 768px) {
.pagination-number .page-numbers {
padding: 6px 10px;
margin: 0 2px;
font-size: 0.75rem;
}
.feny{
padding: 6px 3px 4px 6px;
width: 40px;
}
.pagination-loadmore .loadmore-btn,
.pagination-infinite .loadmore-btn {
padding: 10px 30px;
font-size: 14px;
}
.pag-wrapper {
padding: 15px 0;
}
}
/* 分页容器样式 - 居中显示 */
/*.pag-wrapper {*/
/* display: flex;*/
/* justify-content: center;*/
/* margin: 40px 0;*/
/* width: 100%;*/
/*}*/
/* 通用页码和导航按钮样式 */
/*.page-numbers,.prev,.next {*/
/* display: inline-flex;*/
/* align-items: center;*/
/* justify-content: center;*/
/* height: 33px;*/
/* padding: 0 12px;*/
/* border-radius: 6px;*/
/* text-decoration: none;*/
/* font-weight: 500;*/
/* font-size: 15px;*/
/* color: #4a5568;*/
/* background-color: #f7fafc;*/
/* transition: all 0.3s ease;*/
/* box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);*/
/* border-radius: 4px;*/
/* background: #fff;*/
/* margin: 2px;*/
/*}*/
/* 当前页样式 */
/*.page-numbers.current {*/
/* border-radius: 4px;*/
/* border: 1px solid #f3f3f3;*/
/* background: #0b80f4;*/
/* margin: 0 5px;*/
/* color: #fff;*/
/*}*/
/* 悬停效果 */
/*.page-numbers:not(.current):hover,*/
/*.prev:hover,*/
/*.next:hover {*/
/* opacity: 0.6;*/
/*}*/
/*.pag-wrapper .screen-reader-text{*/
/* display: none;*/
/*}*/
/* 禁用状态（第一页和最后一页） */
/*.pag-wrapper .current{*/
/* cursor: not-allowed;*/
/*}*/
/* 小屏幕适配 */
/*@media (max-width: 640px) {*/
/* .page-numbers,.prev,.next {*/
/* min-width: 36px;*/
/* height: 36px;*/
/* padding: 0 8px;*/
/* font-size: 14px;*/
/* }*/
/*}*/
/*灯箱*/
/* 灯箱css（已按滑动动画需求调整） */
.lightbox {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
z-index: 99999;
overflow: hidden;
}
.lightbox-content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 75%;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
box-sizing: border-box;
}
#lightbox-image {
max-width: 90%;
max-height: 90%;
transition: transform 0.3s ease;
object-fit: contain;
}
/*.lightbox .close {*/
/* font-size: 40px;*/
/*}*/
.lightbox-thumbnails {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 20%;
background-color: rgba(0, 0, 0, 0.7);
padding: 10px 0;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
text-align: center;
z-index: 10000;
box-sizing: border-box;
display: flex;
align-items: center;
transition: opacity 0.3s ease, height 0.3s ease;
overflow: hidden;
}
.lightbox-thumbnails img {
width: 126px;
height: 111px;
margin: 0 5px;
cursor: pointer;
opacity: 0.7;
border: 2px solid #FFF;
object-fit: cover;
flex-shrink: 0;
}
.lightbox-thumbnails img.active {
opacity: 1;
border-color: #4a90e2;
}
.lightbox-controls {
position: fixed;
top: 35%;
width: 100%;
transform: translateY(-50%);
display: flex;
justify-content: space-between;
pointer-events: none;
z-index: 10000;
}
.lightbox-controls span {
font-size: 24px;
cursor: pointer;
pointer-events: auto;
padding: 15px;
margin: 10px;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 50%;
color: white;
width: 50px;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
}
/* 顶部按钮栏 */
.lightbox-topbar {
position: fixed;
top: 20px;
right: 20px;
display: flex;
align-items: center;
gap: 10px;
z-index: 10001;
}
.lightbox-btn {
font-size: 1rem;
color: white;
cursor: pointer;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 50%;
width: 40px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.lightbox-controls .prev {
left: 20px;
}
.lightbox-controls .next {
right: 20px;
}
/* 滑动动画容器 */
.slide-track {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 80%;
display: flex;
transition: transform 0.4s ease;
will-change: transform;
}
.slide-item {
width: 100%;
height: 100%;
flex-shrink: 0;
display: flex;
justify-content: center;
align-items: center;
}
.slide-item img {
max-width: 90%;
max-height: 90%;
object-fit: contain;
}
/*登录弹窗*/
.login-modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999;
display: none;
}
.login-modal .form-group{
margin-bottom: 0.7rem;
}
.login-modal-left {
width: 300px;
background-color: #f5f5f5;
overflow: hidden;
}
.login-modal-left img {
width: 100%;
height: 100%;
object-fit: cover;
}
.login-close {
position: absolute;
top: 15px;
right: 15px;
background: none;
border: 2px solid #d3d3d3;
border-radius: 50%;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
cursor: pointer;
color: #666;
z-index: 3;
padding: 5px;
transition: all 0.2s ease;
}
/* 响应式调整 */
@media (max-width: 768px) {
.login-modal-container {
flex-direction: column;
height: auto;
}
.login-modal-left {
width: 100%;
height: 150px;
}
.form-control{
padding: 5px;
}
.form-group {
margin-bottom: 0.25rem;
}
}
/*分类页顶部标题模块*/
.archive-title {
font-size: 1.25rem;
font-weight: 900;
margin: 0 auto;
position: relative;
text-align: center;
color: #fff;
}
.archive-hero {
position: relative;
z-index: 1;
}
.archive-hero-bg {
position: absolute;
left: 0;
top: 0;
right: 0;
height: 100%;
width: 100%;
background-repeat: no-repeat;
background-position: 50%;
background-size: 120%;
overflow: hidden;
z-index: -1;
}
.archive-hero-bg::before {
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: rgba(0,0,0,.65);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
/* 分类标题模块样式 */
.category-header-module {
background-size: cover;
background-position: center;
border-radius: 4px;
}
.category-header-container {
max-width: 1200px;
margin: 0 auto;
text-align: center;
}
.category-description {
font-size: 1.2rem;
line-height: 1.6;
color: #fff;
max-width: 800px;
margin: 0 auto;
}
@media (max-width: 768px) {
.category-title {
font-size: 2rem;
}
.category-description {
font-size: 1rem;
}
}
/*搜索弹窗*/
/* 弹窗容器 */
.search-modal {
display: none;
position: fixed;
inset: 0;
z-index: 9999;
}
.search-modal.active {
display: flex;
align-items: center;
justify-content: center;
}
/* 遮罩 */
/*.search-overlay {*/
/* position: absolute;*/
/* inset: 0;*/
/* background: rgba(0, 0, 0, 0.7);*/
/* cursor: pointer;*/
/*}*/
/* 弹窗内容 */
.search-box {
position: relative;
/*background: #fff;*/
padding: 10px;
border-radius: 12px;
width: 550px;
height: 300px;
/*box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);*/
display: flex;
flex-direction: column;
z-index: 1;
}
.search-header {
margin-bottom: 25px;
text-align: center;
}
.search-header h2 {
color: var(--max-color);
font-weight: 600;
font-size: 24px;
}
/* 新的搜索表单布局 */
.search-form-inline {
display: flex;
/*height: 50px;*/
margin-bottom: 15px;
}
.search-input-group {
display: flex;
flex: 1;
position: relative;
align-items: center;
background: #fff;
border: 2px solid #e0e0e0;
border-radius: 8px;
overflow: hidden;
}
.search-input-group:focus-within {
border-color: #a6a6a6;
}
.search-category-wrapper {
position: relative;
border-right: 1px solid #e0e0e0;
}
.search-cat-select {
border: none;
padding: 10px 16px;
background: transparent;
font-size: 14px;
outline: none;
cursor: pointer;
min-width: 120px;
height: 100%;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
}
/* 下拉箭头 */
.search-category-wrapper::after {
content: "▼";
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
font-size: 10px;
color: #666;
pointer-events: none;
}
.focus-input {
flex: 1;
border: none;
padding: 10px 10px;
font-size: 16px;
outline: none;
background: transparent;
}
.search-submit {
padding: 0 20px;
border: none;
/*background: #14cc72;*/
background: linear-gradient(135deg, #19c791, #10b981);
color: #fff;
border-radius: 8px;
cursor: pointer;
margin-left: -10px;
z-index: 1;
}
.search-submit:hover {
background: linear-gradient(135deg, #059669, #10b981);
}
.hot-searches {
margin-top: auto;
}
.hot-searches h3 {
font-size: 16px;
color: #7f8c8d;
font-weight: 500;
}
.hot-hint{
color: #7f8c8d;
background: var(--max-3-bg);
padding: 4px 12px;
border-radius: 20px;
}
.hot-tags {
display: flex;
flex-wrap: wrap;
}
.hot-tags a {
padding: 3px 12px;
border-radius: 5px;
font-size: 0.825rem;
/*font-size: 0.75rem;*/
/*background-color: #14cc72;*/
/*background: linear-gradient(135deg, #059669, #10b981);;*/
/*background: #e41212;*/
background: #0cbc87;
color: #fff;
cursor: pointer;
transition: all 0.3s;
margin-right: 12px;
margin-bottom: 10px;
}
.hot-tags a:hover {
transform: translateY(-2px);
}
@media (max-width: 598px) {
.h4, h4 { font-size: 1rem; } /* 22.5px */
.search-box {
width: auto;
height: auto;
/*min-height: 300px;*/
padding: 0;
}
.btn.search-button{
right: 5px;
font-size: 0.75rem;
}
.search-2-title h1{
font-size: 1.5rem;
margin-bottom: 0.25rem;
}
.search-2-title p,.max-float-menu i{
font-size: 0.85rem;
}
.focus-input,.max-float-menu span{
font-size: 0.75rem;
}
.hot-tags a,.home-widget .section-desc{
font-size: 0.75rem;
}
.search-input-group,.layout-game .w-n60 {
width: 100%;
}
.search-cat-select {
min-width: 90px;
font-size: 12px;
padding: 6px 10px;
}
.search-submit{
padding: 0 15px;
}
.search-box input {
/*padding: 8px 12px;*/
/*font-size: 13px;*/
}
.to-avatar-preview{
width: 50px;
height: 50px;
border: 3px solid #f0f0f0;
}
.upload-hint{
top: 28px;
}
.mo-user-5{
}
.mo-user-6{
min-width: 300px;
}
.mo-user-7 {
flex-direction: column;
align-items: center;
text-align: center;
}
.mo-user-7 .flex-shrink-0 {
margin-right: 0 ;
margin-bottom: -0.5rem;
}
.mo-user-8 {
justify-content: center;
}
.mo-user-7 .mo-user-6 > span,
.mo-user-7 .mo-user-6 > div {
margin: 0 8px;
}
.liquid-btn{
font-size: 0.75rem;
padding: 3px 10px;
}
.max-gallery-wrapper .gallery-thumb-item{
width:calc(40% - 7.5px)!important;
}
.max-float-menu .w-60{
width: 50px;
}
.max-float-menu .h-60 {
height: 55px;
}
.max-float-menu{
bottom: 115px!important;
}
/*.search-form-inline {*/
/* height: 40px;*/
/*}*/
}
/*搜索轮播模块*/
/* ========= 模块整体 ========= */
.search-bg{
position:relative;
width:100%;
height:460px; /* 固定高度，图片未加载也不会抖 */
overflow:hidden;
/*background:#f5f5f5;*/
}
/* ========= 内容遮罩 ========= */
.search-content-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:flex;
align-items:center;
/*z-index:10;*/
}
.search-exp{
display:flex;
justify-content:space-between;
width:100%;
padding: 20px;
}
/* ========= 搜索区 ========= */
.search-container{
flex:0 0 55%;
display:flex;
flex-direction:column;
justify-content:center;
}
.search-container .search-input-group{
background: rgba(255,255,255,.95);
}
.search-icon{
/*position:absolute;*/
padding-right: 0;
padding-left: 15px;
color:#999;
font-size:18px;
}
.search-input{
width:100%;
height:50px;
padding:0 15px 0 45px;
font-size:16px;
outline:none;
transition:all .3s ease;
}
.search-button{
position:absolute;
right:15px;
top:50%;
transform:translateY(-50%);
border:none;
font-size:16px;
cursor:pointer;
}
.recent-searches{
color:#666;
font-size:14px;
}
/*************************/
.search-2-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
/*background: rgba(0, 0, 0, 0.4);*/
background: rgb(0 0 0 / 26%);
z-index: 1;
}
.search-1 .search-button{
border-radius: 28px;
border: none;
}
.search-2-content{
position: relative;
min-height: 380px;
/*padding: 100px 0;*/
}
/* ========= 探索菜单 ========= */
/*.explore-panel{*/
/* flex:0 0 22%;*/
/* padding:30px;*/
/* display:flex;*/
/* flex-direction:column;*/
/* background:rgba(0,0,0,.3);*/
/* border-radius:8px;*/
/* backdrop-filter:blur(5px);*/
/*}*/
/*.explore-header{*/
/* display:flex;*/
/* align-items:center;*/
/* margin-bottom:25px;*/
/*}*/
/*.explore-icon{*/
/* color:#25da54;*/
/* margin-right:10px;*/
/* font-size:14px;*/
/*}*/
/*.explore-title{*/
/* font-size:20px;*/
/* font-weight:bold;*/
/* color:#fff;*/
/*}*/
/*.explore-menu{*/
/* display:flex;*/
/* flex-direction:column;*/
/*}*/
/*.explore-item{*/
/* display:flex;*/
/* align-items:center;*/
/* padding:12px 15px;*/
/* margin-bottom:18px;*/
/* border-radius:8px;*/
/* background:rgba(255,255,255,.1);*/
/* transition:all .3s ease;*/
/* text-decoration:none;*/
/* color:#fff;*/
/*}*/
/*.explore-item:hover{background:rgba(255,255,255,.2)}*/
/*.explore-item.active{background:rgba(74,144,226,.3)}*/
/*.menu-icon{margin-right:10px;font-size:16px}*/
/* ========= 移动端补丁（≤768px） ========= */
/*@media (max-width: 798px) {*/
/* 1. 搜索框自适应 */
/* .search-container {*/
/* flex: 1 1 100% !important;*/
/* max-width: 100%;*/
/* padding: 0 15px;*/
/* }*/
/* .search-bg{*/
/* height:260px;*/
/* }*/
/* .explore-item:nth-child(+n+4) {*/
/* display: none; */
/* }*/
/* 2. 把右侧 explore 面板搬到模块底部，横排 3 个 */
/*.search-exp {*/
/* flex-direction: column;*/
/* height: 100%;*/
/*}*/
/* .explore-panel {*/
/* position: absolute;*/
/* left: 0;*/
/* bottom: 0px;*/
/* width: 100%;*/
/* padding: 10px 15px;*/
/* background: rgba(0,0,0,.45);*/
/* border-radius: 0;*/
/* backdrop-filter: blur(4px);*/
/* z-index: 99;*/
/* }*/
/* .explore-header{*/
/* display: none;*/
/* }*/
/* .explore-menu {*/
/* flex-direction: row;*/
/* flex-wrap: wrap;*/
/* justify-content: flex-start;*/
/* }*/
/* .explore-item {*/
/* flex: 0 0 calc(33.333% - 10px);*/
/* margin-bottom: 0;*/
/* margin: 5px;*/
/* padding: 4px 5px;*/
/* font-size: 13px;*/
/* text-align: center;*/
/* justify-content: center;*/
/* }*/
/*}*/
/*三合一幻灯片*/
/* ===== 三合一布局 ===== */
.sanhe-swiper{height:100%;border-radius:8px;overflow:hidden;position: relative;}
/* 右侧列样式 */
.sanhe-right-container {
display: flex;
flex-direction: column;
height: 100%;
}
.sanhe-right-item {
flex: 1;
display: block;
overflow: hidden;
border-radius: 8px;
margin-bottom: 12px; /* 用 margin 代替 gap */
}
.sanhe-right-item:last-child {
margin-bottom: 0;
}
.sanhe-right-item img {
width: 100%;
height: 100%;
transition: transform .3s;
}
.sanhe-right-item:hover img,.sanhe-grid-img:hover img,.five-card:hover .five-card-bg {
transform: scale(1.05);
}
.item-img{
width: 100%!important;
}
.search-item {
position: relative;
width: 100%;
overflow: hidden;
}
.search-post-swiper {
position: relative;
border-radius: 8px;
overflow: hidden;
margin: -8px;
/*padding-bottom: 10px;*/
/*padding-top: 10px;*/
}
.swiper-item {
padding: 8px;
}
/* ===== 手机端：轮播在上，两图在下并排 ===== */
@media(max-width:998px){
.max-hd-san .sanhe-row {
height: 100%;
}
.sanhe-row .w-n75, .sanhe-row .w-n25 {
width: 100%;
padding-left: 0;
}
.sanhe-swiper {
height: 260px;
margin-bottom: 12px;
}
.sanhe-right-container {
flex-direction: row;
height: 180px; /* 手机端右侧图片高度 */
}
.sanhe-right-item {
margin-bottom: 0;
margin-right: 8px;
}
.sanhe-right-item:last-child {
margin-right: 0;
}
/*.swiper-button-prev,*/
/*.swiper-button-next {*/
/* width: 32px;*/
/* height: 32px;*/
/*}*/
.swiper-item,.search-post-swiper {
padding: 5px;
}
.search-item{
margin-top: 8px;
margin-bottom: -8px;
}
.search-item .five-row{
height: 100%!important;
}
}
@media(max-width:598px){
.sanhe-swiper {
height: 200px;
margin-bottom: 12px;
}
.max-video-grid .sanhe-swiper {
min-height: 200px;
}
.sanhe-right-container {
height: 120px; /* 手机端右侧图片高度 */
}
}
/*折叠分类页面*/
.archive-fold .filter-option .count {
position: absolute;
top: -5px;
right: -5px;
}
.filter-accordion-item {
border-bottom: 1px solid #eee;
position: relative;
}
.filter-accordion-header,.filter-accordion-top {
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
}
.filter-accordion-toggle {
position: absolute;
right: 10px;
border: none;
display: flex;
align-items: center;
cursor: pointer;
color: #666;
width: 20px;
height: 20px;
z-index: 2;
}
.filter-accordion-toggle:hover{
color: #448aff;
}
.filter-accordion-toggle .accordion-icon {
transition: transform 0.3s ease;
}
.filter-accordion-toggle.active .accordion-icon {
transform: rotate(180deg);
}
.filter-accordion-content {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.filter-accordion-content.expanded {
max-height: 1000px;
}
.filter-sublevel {
border-bottom: none;
margin-left: 15px;
}
.filter-sublevel .filter-option {
padding-left: 15px;
}
/*侧边栏分类页*/
.filter-group {
padding: 20px;
/*border-bottom: 2px solid #f1f5f9;*/
}
.filter-border {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 2px solid var(--max-txt-border2);
}
.filter-group-title {
font-size: 1rem;
font-weight: 600;
margin: 0;
}
.filter-row {
display: flex;
flex-wrap: wrap;
}
.filter-row .filter-side{
flex: 0 0 calc(50% - 10px);
min-width: 60px;
margin-bottom: 12px;
text-align: center;
}
/*.grid-item:hover::before {*/
/* transform: scaleX(1);*/
/*}*/
/*.grid-item::before {*/
/* content: '';*/
/* position: absolute;*/
/* top: 0;*/
/* left: 0;*/
/* right: 0;*/
/* height: 3px;*/
/* background: linear-gradient(135deg, #cd0202 0%, #bd1075bd 50%, #1f3cff 100%);*/
/* transform: scaleX(0);*/
/* transition: transform 0.3s;*/
/* z-index: 1;*/
/*}*/
/* 侧边栏布局容器 */
.archive-layout .archive-wrapper {
display: flex;
}
.archive-sidebar {
flex: 0 0 285px;
position: sticky;
/*background: #fff;*/
margin-bottom: 20px;
padding-bottom: 50px;
border-radius: 8px;
top: 20px;
align-self: flex-start;
}
.archive-to{
max-height: 180vh;
overflow-y: auto;
}
.sidebar_left .archive-sidebar,.sidebar_left .category-widget{
margin-right: 15px;
}
.sidebar_right .archive-sidebar,.sidebar_right .category-widget{
margin-left: 15px;
}
/* 左侧布局 */
.archive-layout.sidebar_left .archive-wrapper {
flex-direction: row;
}
/* 右侧布局 */
.archive-layout.sidebar_right .archive-wrapper {
flex-direction: row-reverse;
}
/*分类页小工具*/
/*.archive-widget .archive-main{*/
/* width: 75%;*/
/*}*/
.category-widget{
flex: 0 0 320px;
/*width: 25%;*/
position: sticky;
margin-bottom: 20px;
border-radius: 8px;
top: 20px;
align-self: flex-start;
overflow-y: auto;
}
.category-widget .widget{
margin-bottom: 1rem;
}
.archive-widget .archive-wrapper main .filter-items {
display: block;
}
/* 响应式设计 - 移动端 */
@media (min-width: 998px) and (max-width: 1200px){
.archive-layout .archive-wrapper .archive-posts > [class*="col-"] {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 33.333333%;
}
}
/* 响应式设计 - 移动端 */
@media (max-width: 998px) {
.archive-sidebar,.category-widget,.bot_3 .w-n28{
display: none; /* 移动端隐藏侧边栏 */
}
}
/* 桌面端布局控制 */
@media (min-width: 998px) {
/* 侧边栏布局时隐藏主内容区的顶部筛选条 */
.archive-layout main .filter-items {
display: none;
}
.archive-posts .group-70{
padding-left: 1rem;
}
.down-1{
max-width: 1080px;
}
.archive-posts {
margin: 0 -7.5px;
display: flex;
flex-wrap: wrap;
}
.archive-posts > [class*="col-"] {
padding: 0 7.5px;
margin-bottom: 16px;
box-sizing: border-box;
}
.max-video-body{
margin-bottom:-170%;
}
}
/*分类页面*/
.filter-option .count {
position: absolute;
top: -10px;
right: -10px;
/*background: rgb(21 126 247);*/
/*color: #fff;*/
font-size: 12px;
padding: 0px 5px;
border-radius: 10px;
min-width: 20px;
text-align: center;
}
.filter-header {
font-size: 18px;
font-weight: 600;
margin-bottom: 15px;
color: #333;
}
.filter-label {
font-weight: 500;
margin-bottom: 8px;
/*color: #555;*/
}
.filter-options{
position: relative;
}
.filter-items{
/*background: #fff;*/
/*padding: 12px;*/
/*padding-left: 20px;*/
/*margin-bottom: 15px;*/
/*border-radius: 8px;*/
}
.filter-archive{
background: var(--max-5-bg);
padding: 12px;
padding-left: 20px;
margin-bottom: 15px;
border-radius: 8px;
}
.filter-span{
/*margin-right: 1rem;*/
font-size: 0.85rem;
margin-right: 0.25rem;
font-size: 0.85rem;
display: inline-block;
/*min-width: 80px;*/
min-width: 50px;
}
.filter-span i{
width: 14px;
}
.filter-option {
display: inline-block;
padding: 4px 8px;
/*background: var(--max-1-card);*/
border: var(--border);
border-radius: 4px;
text-decoration: none;
/*color: #333;*/
font-size: 0.77rem;
margin: 5px;
position: relative;
}
.cat_4 .filter-option:hover{
border: 1px solid #059669;
color: #059669;
}
.cat_3 .filter-option:hover{
border: 1px solid #e91313;
color: #e91313;
}
.cat_2 .filter-option:hover{
border: 1px solid #2971ff;
color: #2971ff;
}
.cat_1 .filter-option:hover{
border: 1px solid #277cff;
color: #277cff;
}
.cat_1 .filter-option.active,.cat_1 .cat-option:hover,
.cat_1 .cat-option.active,.cat_1 .filter-option .count {
background: linear-gradient(135deg, #1342e9 0%, #2b6aff 50%, #277cff 100%);
color: #fff;
}
.cat_1 .filter-option.active .filter-accordion-toggle,.cat_3 .filter-option.active .filter-accordion-toggle{
color: #fff;
}
.cat_1 .filter-span i,.cat_2 .filter-span i,.cat_1 .filter-group-title i,.cat_2 .filter-group-title i{
color: #2563eb;
}
.cat_2 .filter-option.active,.cat_2 .cat-option:hover,
.cat_2 .cat-option.active,.cat_2 .filter-option .count {
color: #2f71ff;
background: #f2f3ff;
}
.cat_3 .filter-option.active,.cat_3 .cat-option:hover,
.cat_3 .cat-option.active,.cat_3 .filter-option .count {
color: #fff;
background: linear-gradient(135deg, #e91313 0%, #e44444 50%, #ff5454 100%);
}
.cat_3 .filter-span i,.cat_3 .filter-group-title i{
color: #e72a2a;
}
.cat_4 .filter-option.active,.cat_4 .cat-option:hover,
.cat_4 .cat-option.active,.cat_4 .filter-option .count {
/*background: linear-gradient(135deg, #059669, #10b981);*/
background: linear-gradient(135deg, #11be88, #10b981);
color: #fff;
}
.cat_4 .filter-span i,.cat_4 .filter-group-title i{
color: #059669;
}
.archive-sidebar::-webkit-scrollbar,.records-list::-webkit-scrollbar {
width: 6px;
}
.archive-sidebar::-webkit-scrollbar-thumb{
background-color: rgb(24 126 219 / 14%);
}
.archive-sidebar::-webkit-scrollbar-thumb:hover{
background-color: #157ef7;
}
/* 响应式设计 */
@media (max-width: 998px) {
.filter-option {
padding: 4px 6px;
font-size: 0.75rem;
margin-bottom: 10px;
margin: 4px;
}
.filter-label{
margin-left: -8px;
margin-right: -8px;
}
.filter-span{
display: block;
margin-bottom: 8px;
}
.row-filter .w-n75{
flex: 0 0 100%;
max-width: 100%;
}
.filter-options .cat-all{
position: absolute;
right: 0;
top: -8px;
}
/*.cat-opt1 .filter-option {*/
/*margin: 5px 0px 0px 5px;*/
/* padding: 2px 5px;*/
/* margin-bottom: 0px;*/
/*}*/
}
/*文章内页其它信息*/
.post-info ul {
list-style: none;
margin: 0;
padding: 0;
}
.post-info li{
display: flex;
justify-content: space-between;
margin-bottom: 8px; /* 可根据需要调整间距 */
}
.post-info li span{
display: flex;
align-items: center;
color: #838383;
font-weight: 500;
font-size: 0.8rem;
}
.post-info li b {
color: #838383;
font-weight: 500;
text-align: right;
font-size: 0.8rem;
}
.post-sidebar .widget,.category-widget .widget{
position: relative;
overflow: hidden;
background: var(--max-5-bg);
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
padding: 12px;
}
/*会员套餐卡片颜色*/
.pr-black{
color: #fff;
}
.pr-warn{
color: #f7a50b;
}
.pr-primary{
color: #007bff;
}
.pr-emerald{
color: #079d6e;
}
.pr-success{
color: #28a745;
}
.pr-dark{
color: #323232;
}
.pr-danger{
color: #dc3545;
}
.pr-info{
color: #17a2b8;
}
.pr-secondary{
color: #6c757d;
}
.pr-purple{
color: #ad0bf9;
}
.pr-skyblue{
color: #007bff;
}
.pr-orange{
color: #ff8015;
}
.pr-red{
color: #ff0202;
}
.pr-teal{
color: #14cc72;
}
/*会员套餐*/
.membership-price .price {
position: relative;
display: inline-block;
padding-right: 15px;
width: 100%;
}
.membership-price .line-through{
margin-right: auto;
}
.vip-card-2 {
position: absolute;
left: 50%;
max-width: 76px;
margin-left: 8px;
font-size: 0.85rem;
color: #fff;
padding: 0px 10px;
/*border-radius: 12px;*/
transform: translateX(100%);
white-space: nowrap;
transform: skewX(-15deg);
margin-top: -10px;
}
.badge-recommended {
position: absolute;
top: 10px;
right: 10px;
background-color: #ff4d4d;
color: #fff;
padding: 5px 10px;
font-size: 12px;
border-radius: 5px;
}
/**/
.membership-price button{
color: #fff;
}
.vip-card {
background: var(--max-2-bg);
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
padding: 30px;
height: 100%;
display: flex;
flex-direction: column;
transition: all 0.15s ease;
/*border-top: 4px solid #12a96c;*/
position: relative;
}
.vip-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}
.membership-title {
font-size: 1.5rem;
font-weight: bold;
margin-bottom: 1.5rem;
text-align: center;
}
.membership-features {
list-style: none;
padding: 0;
flex-grow: 1;
}
.membership-features li {
padding: 4px 0;
color: #666;
position: relative;
font-size: 0.95rem;
}
.membership-price {
text-align: center;
}
.membership-price .price {
font-size: 2rem;
margin-bottom: 1.5rem;
}
.membership-price .price span {
font-size: 1rem;
color: #999;
}
/* Different card border colors */
.vip-card.basic {
border-top-color: #17a2b8;
}
.vip-card.premium {
border-top-color: #ffc107;
}
.vip-card.vip {
border-top-color: #d6293e;
}
.vip-card-1 .vip-poss{
width: auto!important;
}
/*多功能幻灯片组件*/
.nav-qian:hover{
box-shadow: 0 3px 3px rgb(231 231 231);
}
.custom-scrollbar {
padding-right: 10px;
}
.category-item i {
opacity: 0;
}
.category-item:hover i {
color: #6c98ff;
opacity: 1;
}
.custom-scrollbar::-webkit-scrollbar{
display: none;
background-color: rgba(25,25,25,.1);
width: 4px;
height: 8px;
opacity: 0;
transition: opacity 0.3s ease 0.2s;
}
.custom-scrollbar:hover::-webkit-scrollbar{
display: block;
opacity: 1;
}
.custom-scrollbar::-webkit-scrollbar-thumb,.ico-cards::-webkit-scrollbar-thumb{
background-color: rgb(186 186 186 / 80%);
border-radius: 6px;
transition: background .2s ease;
}
.category-item a {
transition: all 0.3s ease;
}
.category-item a:hover {
background: var(--max-4-color);
color: #6c98ff;
}
.poin-ul {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
/*****************/
.n-0-1 {
font-size: 12px;
font-weight: normal;
color: #FFFDFF;
line-height: 16px;
text-align: center;
border-radius: 12px 0 12px 0;
left: 50px;
top: -5px;
height: 17px;
width: 55px;
position: absolute;
pointer-events: none;
background-size: 100%;
transform: translate(0px,-4px);
}
.home-rel img{
width: 65px;
height: 65px;
border-radius: 50%;
object-fit: cover;
}
.wel-poin{
padding: 0px 8px;
background: #ffcf54;
}
.welcome-buttons .p-8-48 {
padding: 3% 17%;
}
.welcome-buttons .badge {
font-size: 0.85rem;
}
.notice-item {
padding: 4px 0;
transition: all 0.2s ease;
}
.notice-item a:hover {
color: var(--primary-color);
}
/*五合一幻灯片组件*/
.five-right {
height: 100%;
}
.five-right .row {
height: 100%;
margin-right: -4px;
margin-left: -4px;
}
.five-right .w-n50 {
height: 50%;
padding: 4px;
box-sizing: border-box;
}
.five-right .h-n33 {
height: 33.333333%;
}
.sanhe-grid-img {
width: 100%;
height: 100%;
border-radius: 8px;
overflow: hidden;
}
.sanhe-grid-img img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
}
.category-menu {
height: 100%;
}
.category-menu-list {
list-style: none;
}
.category-menu-item a {
transition: all 0.3s ease;
border: 1px solid transparent;
}
.category-menu-item a:hover {
background: var(--max-4-color);
color: #6c98ff;
border-color: #6c98ff;
}
.category-menu-item i {
opacity: 0;
transition: opacity 0.3s ease;
}
.category-menu-item a:hover i {
opacity: 1;
color: #6c98ff;
}
.five-right .w-n50:nth-child(+n+5){
padding-bottom: 0;
}
.five-right .w-n50:nth-child(-n+2) {
padding-top: 0;
}
.five-card {
overflow: hidden;
display: block;
}
/*下载页*/
.down-1 .show-all li {
/*flex: 0 0 calc(50% - 12px);*/
flex: 0 0 calc(33.33% - 12px);
min-width: 60px;
border-radius: 5px;
margin: 6px;
text-align: center;
}
.down-1 .card-1{
padding: 15px;
}
.down-1 .w-n75{
padding-left: 15px;
}
/*内容卡片小工具*/
.cards-i{
margin-top: -49px;
position: relative;
z-index: 99;
}
.ico-cards .col-1-5{
margin-bottom: 0;
padding: 0;
}
.cards-go{
flex-shrink: 0;
color: #fff;
padding: 2px 10px;
border-radius: 5px;
font-size: 0.75rem;
white-space: nowrap;
}
/* 手机端：横向滚动 */
@media (max-width: 768px) {
.ico-cards .col-1-5 {
flex: 0 0 50%;
max-width: 50%;
scroll-snap-align: start;
/*padding: 0 8px 0 0;*/
}
.ico-cards .col-1-5:last-child {
padding-right: 0;
}
.ico-cards .p-20-30 {
padding: 10px 13px;
}
.ico-cards .text-light-red ,.ico-cards .ju-center-bet{
margin-top: 0;
font-size: 0.75rem;
}
.ico-cards .h-50{
height: 30px;
width: 30px;
}
.ico-cards .h-50 i{
font-size: 0.75rem;
}
.cards-i{
margin-top: -40px;
}
.cards-go{
padding: 0px 8px;
}
}
/*顶部全局消息通知样式*/
.top-message-container {
position: fixed;
top: 15%; /* 距离顶部20px */
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%); /* 兼容iOS Safari */
padding: 5px 15px;
padding: 6px 20px;
/*background-color: #f8d7da;*/
color: #721c24;
border-radius: 5px;
font-size: 16px;
text-align: center;
display: none; /* 默认不显示 */
z-index: 999999; /* 确保在页面最上层 */
}
/* 添加成功和错误状态的样式 */
.top-message-container.success {
/*background-color: #d4edda;*/
/*color: #155724;*/
color: #fff0f2;
/*background: linear-gradient( -0deg,#12ff4d 5%, #0bd06f 20%);*/
background: linear-gradient( -0deg,#0cec44 5%, #0bd06f 20%);
}
.top-message-container.error {
background: linear-gradient( -125deg,#cb0000 0%, #d44949 100%);
color: #fff; /* 错误文字颜色 */
}
@media (max-width: 598px) {
.top-message-container {
font-size: 0.8rem;
padding: 4px 20px;
}
}
/*消息通知结束*/
/*顶部接收私信菜单模块*/
.message-notification {
position: relative;
}
.message-notification:hover .message-dropdown,
.message-dropdown:hover {
display: block;
}
.message-dropdown::before {
content: '';
position: absolute;
bottom: 100%;
left: 0;
right: 0;
height: 10px;
background: transparent;
}
.message-icon {
position: relative;
cursor: pointer;
border-radius: 8px;
transition: all 0.3s ease;
}
.message-dropdown {
display: none;
position: absolute;
right: -50px;
top: 100%;
width: 200px;
background: var(--max-5-bg);
box-shadow: 2px 5px 20px rgb(0 0 0 / 23%);
z-index: 1000;
margin-top: 8px;
}
/*图标数字*/
.message-count {
position: absolute;
top: -15px;
right: -8px;
background: #ff4757;
color: white!important;
border-radius: 50%;
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 500;
padding: 0 6px;
}
.message-category-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px;
border-bottom: 1px solid #f0f0f0;
transition: all 0.3s ease;
cursor: pointer;
}
.message-category-item:last-child {
border-bottom: none;
}
.message-category-item:hover {
background-color: #f8f9fa;
background: var(--max-6-bg);
}
.category-info {
display: flex;
align-items: center;
flex: 1;
}
.category-icon {
width: 32px;
height: 32px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 12px;
font-size: 14px;
}
/* 不同类型图标背景色 */
.category-icon.important {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.category-icon.notification {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}
.category-icon.message {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}
.category-name {
font-size: 14px;
color: #333;
font-weight: 500;
}
.category-count {
font-size: 12px;
font-weight: 600;
}
@media (max-width: 480px) {
.message-dropdown {
width: 180px;
right: -20px;
}
}
/*个人中心私信模块*/
/* 消息中心主容器 */
.mgs-1 {
background: url(../img/ms-1.jpg) center no-repeat;
}
.mgs-2 {
background: url(../img/ms-2.jpg) center no-repeat;
}
.mgs-3 {
background: url(../img/ms-3.jpg) center no-repeat;
}
/*顶部VIP图标*/
.vip-button-container {
position: relative;
display: inline-block;
}
.vip-button {
cursor: pointer;
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
}
.icon-vip {
width: 32px;
height: 35px;
margin-right: -20px;
position: relative;
z-index: 1;
top: -3px;
}
.vip-but {
background: #555;
padding: 1px 4px 1px 14px;
border-radius: 5px;
color: white;
display: inline-flex;
align-items: center;
justify-content: center;
}
.vip-badge {
position: absolute;
top: 0;
right: 0;
background-color: #ff4d4d;
color: white;
font-size: 12px;
padding: 0px 6px;
border-radius: 2px;
font-weight: bold;
transform: translate(65%, -54%);
z-index: 2;
}
.vip-button:hover + .vip-container, .vip-container:hover {
opacity: 1;
visibility: visible;
}
.vip-container {
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
text-align: center;
position: absolute;
top: 80%;
left: 50%;
transform: translateX(-50%);
opacity: 1;
visibility: hidden;
width: 400px;
max-width: 400px;
}
.new-module {
background-image: url(../img/b9.png);
}
.new-module {
padding: 24px;
background-repeat: no-repeat;
-webkit-background-size: 100% auto;
background-size: 100% auto;
position: absolute;
top: 0px;
z-index: 10;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
left: 20%;
transform: translateX(-50%);
width: 520px;
height: auto;
max-width: 520px;
}
.vip-tit {
text-align: left;
margin-left: 20px;
color: #504d4d;
}
.vip-package {
background: #fff;
border: 1px solid #ddd;
padding: 15px 0px;
width: calc(33.333% - 10px);
box-sizing: border-box;
color: #504d4d;
}
.package-top-label {
background-color: #0cbc87;
height: 4px;
}
.vip-package:hover .package-top-label {
background-color: #f00e0e;
}
.package-2 {
margin-top: 10px;
padding: 0 20px;
}
.package-2 button,.package-2 a{
font-size: 14px;
width: 100%;
text-align: center;
padding: 6px 15px;
background: #0cbc87;
}
.package-2 button:hover,.package-2 a:hover{
background: #0aa073;
}
.feature-border {
border-top: 1px solid #ddd;
width: 100%;
margin-bottom: 10px;
}
.package-features {
margin-top: 6px;
}
.package-features p {
margin-bottom: -0.5rem;
font-size: 0.75rem;
color: #333;
}
.new-module .vip-card-2{
margin-top: -20px;
}
.new-module .vip-card-2{
font-size: 0.75rem;
}
.new-module .vip-card-2{
padding: 0px 7px;
}
.vip-container:not(:hover) * {
transition: none !important;
}
/*搜索框*/
.ms-search-box .input-group .mgs-form {
background: #ebebeb;
border: 1px solid #dee2e6;
}
.input-group .mgs-form:focus {
background: #fff;
border-color: var(--btn-gray);
outline: none;
}
.ms-item.filtered {
display: none;
}
.ms-list{
overflow-y: auto;
scrollbar-width: none;
-ms-overflow-style: none;
}
/* TAB导航 */
.ms-tabs {
background: var(--max-1-card);
/*border-bottom: 1px solid #fafafa;*/
}
.ms-tab-list {
display: flex;
list-style: none;
}
.ms-tab-item{
width: 33.33%;
}
.ms-tab-link {
display: flex;
align-items: center;
padding: 10px 2px;
justify-content: center;
text-decoration: none;
position: relative;
border-radius: 4px;
font-size: 0.85rem;
}
.ms-tab-link:hover {
background: var(--max-3-bg);
}
.ms-tab-link.active {
/*background: #11c229;*/
background: linear-gradient( -125deg,#0fe332 0%, #0fad5f 100%);
color: #ffffff;
}
.ms-tab-link i {
margin-right: 2px;
font-size: 16px;
width: 18px;
text-align: center;
display: inline-block;
}
.ms-badge {
background: #dc3545;
color: white;
border-radius: 10px;
padding: 2px 6px;
font-size: 12px;
margin-left: 6px;
font-weight: 500;
}
/* 主要内容区域 */
.ms-content {
display: flex;
height: 600px;
}
/* 左侧边栏 */
.ms-sidebar {
width: 30%;
/*border-right: 1px solid #e9ecef;*/
border: 1px solid var(--max-txt-border);;
/*background: #fbfbfb;*/
display: flex;
flex-direction: column;
height: 100%;
}
.ms-item:hover,.ms-item.active {
background: var(--max-3-bg);
}
.ms-item.active:hover {
background: var(--max-6-bg);
}
.ms-link {
display: flex;
padding: 5px 10px;
margin-bottom: 0.25rem;
text-decoration: none;
color: inherit;
}
.ms-item .ms-ptb{
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.ms-avatar {
display: flex;
position: relative;
align-items: center;
margin-right: 8px;
}
.ms-avatar img {
width: 40px;
height: 40px;
border-radius: 50%;
}
.ms-unread{
position: absolute;
background: #f32020;
color: white;
border-radius: 50%;
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 500;
padding: 0 6px;
}
.ms-avatar .ms-unread{
top: -8px;
right: -8px;
}
.ms-tab-item .ms-unread{
top: 0px;
right: 8px;
}
.ms-info {
flex: 1;
min-width: 0;
overflow: hidden;
}
.ms-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 4px;
}
.ms-name {
font-weight: 600;
/*color: #2d3748;*/
font-size: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
min-width: 0;
}
.ms-time {
font-size: 12px;
color: #9ca3af;
flex-shrink: 0;
}
.ms-preview {
font-size: 13px;
color: #6b7280;
line-height: 1.4;
margin-bottom: 4px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
/* 右侧主区域 */
.ms-main {
width: 70%;
background: var(--max-5-bg);
display: flex;
flex-direction: column;
min-height: 0;
height: 600px;
}
/* 聊天界面 */
.ms-chat {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.ms-chat-header {
padding: 4px 15px;
background: var(--max-5-bg);
border-bottom: 1px solid #deebf8;
padding-top: 0;
}
.ms-chat-user {
display: flex;
align-items: center;
}
.ms-chat-avatar {
margin-right: 12px;
}
.ms-chat-avatar img,.ms-message img {
/*width: 40px;*/
/*height: 40px;*/
width: 42px;
height: 42px;
border-radius: 50%;
border: 2px solid rgb(201 209 255 / 30%);
padding: 2px;
}
.ms-chat-info {
flex: 1;
min-width: 0;
overflow: hidden;
}
.ms-chat-name {
font-weight: 600;
font-size: 0.9rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ms-chat-status {
font-size: 13px;
color: #10b981;
}
/* 修改聊天内容区域 - 关键修改 */
.ms-chat-body {
flex: 1;
padding: 20px;
background: var(--max-3-bg);
overflow-y: auto;
display: flex;
flex-direction: column-reverse;
}
/* 消息气泡 */
.ms-message {
display: flex;
margin-bottom: 16px;
max-width: 70%;
flex-shrink: 0;
word-wrap: break-word;
word-break: break-word;
/*align-items: center;*/
}
.ms-received {
align-self: flex-start;
}
.ms-sent {
align-self: flex-end;
/*flex-direction: row-reverse;*/
}
.ms-sent .ms-message-content {
background: #007bff;
color: white;
margin-left: auto;
margin-right: 8px;
}
.ms-message-content {
background: var(--max-5-bg);
padding: 10px 16px;
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
line-height: 1.3;
word-wrap: break-word;
max-width: 100%;
min-width: 0;
flex: 1;
}
.ms-sent .ms-message-content,.ms-received .ms-message-content {
border-radius: 10px;
position: relative;
margin-left: auto;
}
.ms-received .ms-message-content{
margin-left: 8px;
}
/* 在右侧中间添加小三角形 */
.ms-sent .ms-message-content::after {
content: '';
position: absolute;
right: -8px;
top: 30%;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left: 8px solid #007bff;
}
.ms-received .ms-message-content::after {
content: '';
position: absolute;
left: -8px;
top: 30%;
/*top: 50%;*/
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-right: 8px solid var(--max-5-bg);
}
.ms-text p {
margin: 0 0 8px 0;
}
.ms-text p:last-child {
margin-bottom: 0;
}
.ms-meta {
font-size: 11px;
color: #9ca3af;
margin-top: 4px;
}
.ms-sent .ms-meta {
text-align: right;
color: rgba(255,255,255,0.8);
}
/* 回复输入 */
.ms-reply {
padding: 16px 20px;
/*border-top: 1px solid #e9ecef;*/
/*background: #fff;*/
flex-shrink: 0;
}
.ms-reply textarea {
border: 1px solid #ddd;
border-radius: 6px;
padding: 12px;
height: 90px;
width: 100%;
}
.ms-reply textarea:focus {
border-color: var(--btn-gray);
background: var(--max-3-bg);
outline: none;
}
.ms-input {
flex: 1;
border: none;
outline: none;
padding: 8px 0;
font-size: 14px;
}
/* 测试按钮样式 */
.ms-send.btn-test-1,
.ms-send.btn-test-2,
.ms-send.btn-test-3 {
background: #28a745;
min-width: 60px;
font-size: 12px;
padding: 0 8px;
}
.ms-send.btn-test-1 {
background: #007bff;
}
.ms-send.btn-test-2 {
background: #ffc107;
color: #000;
}
.ms-send.btn-test-3 {
background: #dc3545;
}
.ms-send {
background: #007bff;
border: none;
width: 36px;
height: 36px;
border-radius: 50%;
color: white;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.2s;
}
.ms-send:hover {
background: #0056b3;
}
/* 空状态和欢迎页面 */
.ms-empty, .ms-welcome {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
text-align: center;
color: #9ca3af;
}
.ms-empty i, .ms-welcome i {
font-size: 48px;
margin-bottom: 16px;
opacity: 0.5;
}
.ms-welcome h3 {
color: #6b7280;
margin-bottom: 8px;
font-weight: 500;
}
.ms-welcome p {
color: #9ca3af;
font-size: 14px;
}
/* 好友请求样式 */
.ms-requests-section {
/*background: #fff3cd;*/
/*border: 1px solid #ffeaa7;*/
border-radius: 8px;
overflow: hidden;
margin-bottom: 5px;
}
.ms-requests-header {
/*background: #fff3cd;*/
border-bottom: 1px solid #ffeaa7;
padding: 10px 12px;
}
.ms-requests-list {
max-height: 200px;
overflow-y: auto;
}
.ms-request-item {
display: flex;
align-items: center;
padding: 10px 12px;
border-bottom: 1px solid #ffeaa7;
background: var(--max-6-bg);
/*background: #fff;*/
}
.ms-request-item:last-child {
border-bottom: none;
}
.ms-request-avatar {
margin-right: 10px;
}
.ms-request-avatar img {
width: 32px;
height: 32px;
border-radius: 50%;
}
.ms-request-info {
flex: 1;
}
.ms-request-name {
font-weight: 500;
/*color: #2d3748;*/
display: block;
}
.ms-request-time {
font-size: 11px;
color: #6b7280;
}
.ms-request-actions {
display: flex;
gap: 5px;
}
.ms-btn-accept, .ms-btn-reject {
background: none;
border: none;
width: 30px;
height: 30px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background-color 0.2s;
}
.ms-btn-accept {
color: #10b981;
}
.ms-btn-accept:hover {
background: #d1fae5;
}
.ms-btn-reject {
color: #ef4444;
}
.ms-btn-reject:hover {
background: #fee2e2;
}
/* 好友列表样式 */
.ms-friends-section {
/*background: #f8f9fa;*/
border-radius: 8px;
overflow: hidden;
}
.ms-friends-header {
/*background: #fff;*/
border-bottom: 1px solid #e9ecef;
/*padding: 10px 12px;*/
padding-bottom: 0.75rem;
}
.ms-friends-list {
max-height: 400px;
overflow-y: auto;
}
.ms-friend-item {
display: flex;
align-items: center;
padding: 10px 12px;
/*background: #fff;*/
cursor: pointer;
transition: background-color 0.2s;
}
.ms-friend-item:hover {
background: var(--max-3-bg);
}
.ms-friend-avatar {
margin-right: 10px;
}
.ms-friend-avatar img {
width: 32px;
height: 32px;
border-radius: 50%;
}
.ms-friend-info {
flex: 1;
min-width: 0;
overflow: hidden;
}
.ms-friend-name {
font-weight: 600;
font-size: 0.85rem;
/*color: #2d3748;*/
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ms-no-friends {
background: #fff;
padding: 20px;
}
/* 搜索相关样式 */
.search-result-item {
background: #fff;
transition: background-color 0.2s;
}
.search-result-item:hover {
background: #f8f9fa;
}
@media (min-width: 768px) {
.ms-chat-header .back-to-list{
display: none;
}
}
/* 响应式设计 */
@media (max-width: 768px) {
.ms-content {
height: 500px;
}
.ms-reply{
padding-bottom: 0;
padding: 16px 0px;
}
.ms-message-content{
padding: 8px 12px;
}
.ms-reply textarea{
height: 70px;
}
.ms-reply .ju-center-bet{
padding-bottom: 2rem;
}
.ms-sidebar{
width: 100%;
}
.ms-main {
width: auto;
/*height:700px;*/
height: 100%;
}
.ms-main .ms-welcome {
display: none;
}
.ms-sidebar {
border-right: none;
border-bottom: 1px solid #e9ecef;
max-height: 600px;
}
.ms-tab-list {
flex-wrap: wrap;
}
.ms-tab-item {
flex: 1;
min-width: 80px;
}
.ms-message {
max-width: 85%;
}
.ms-friends-list {
max-height: 200px;
}
.ms-send.btn-test-1,
.ms-send.btn-test-2,
.ms-send.btn-test-3 {
min-width: 50px;
font-size: 11px;
padding: 0 6px;
}
/* 聊天框定位显示 */
.ms-main {
position: fixed;
left: 0;
width: 100%;
z-index: 9999;
transform: translateX(100%);
transition: transform 0.3s ease;
/*overflow-y: auto;*/
display: none;
}
.ms-main.chat-active {
transform: translateX(0);
display: flex;
margin-top: -40px;
}
.ms-main .ms-chat{
padding: 20px;
}
.ms-chat-user{
margin-top: 10px;
}
/* 聊天头部返回按钮 */
.ms-chat-header {
position: relative;
background: #f8f9fa;
/*border-bottom: 1px solid #e9ecef;*/
padding: 8px;
padding-bottom: 0;
}
.back-to-list {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
border: none;
font-size: 0.75rem;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
border-radius: 5px;
margin-top: 4px;
}
}
.ms-list::-webkit-scrollbar {
display: none;
}
.ms-chat-body::-webkit-scrollbar{
width: 6px;
}
.ms-chat-body::-webkit-scrollbar-track{
background: #f8f9fa;
}
.ms-chat-body::-webkit-scrollbar-thumb{
background: transparent;
border-radius: 3px;
}
/* 鼠标悬停时显示滚动条 */
.ms-chat-body:hover::-webkit-scrollbar-thumb{
background: #c1c1c1;
}
/*私信弹窗*/
.popup-message-chat {
min-height: 500px;
}
.popup-chat-user {
display: flex;
align-items: center;
justify-content: center;
}
.mgs-avatar {
align-items: center;
}
.mgs-avatar img {
width: 30px;
height: 30px;
border-radius: 50%;
margin-right: 5px;
}
.popup-chat-name {
font-size: 0.9rem;
/*color: #333;*/
}
.popup-chat-status {
font-size: 12px;
color: #666;
}
.popup-chat-body {
/*max-height: 320px;*/
height: 320px;
overflow-y: auto;
margin: 12px 0;
padding: 15px;
border: 1px solid var(--max-txt-border);
border-radius: 8px;
display: flex;
flex-direction: column-reverse;
background: var(--max-3-bg);
}
.mgs-input textarea {
border: 1px solid #ddd;
border-radius: 6px;
padding: 12px;
height: 70px;
font-size: 0.85rem;
background-color: var(--max-3-bg);
margin-bottom: 5px;
width: 100%;
}
.mgs-input textarea:focus {
border-color: #2973ff;
}
@media (max-width: 998px){
.popup-chat-body{
height: 260px
}
.popup-message-chat{
min-height: 400px;
}
.popup-chat-user{
margin: -6px;
}
}
/*私信聊天结束*/
/*卡密兑换模块*/
.exchange-input {
padding: 8px 15px;
border: 2px solid var(--max-txt-border);
border-radius: 6px;
font-size: 14px;
background: var(--max-3-bg);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
color: var(--max-color);
outline: none;
}
.exchange-input:focus {
background: #fff;
}
.cdk-info {
background: var(--max-3-bg);
border-radius: 6px;
padding: 20px;
margin-top: 15px;
}
.detail-label {
font-weight: 500;
color: #7f8c8d;
min-width: 80px;
font-size: 0.75rem;
}
/*卡密兑换模块结束*/
.box-nax-1 .p-8-35{
padding: 8px 28px;
}
@media (max-width: 1200px) {
.five-row .w-n14 {
display: none;
}
.five-row .w-n26 {
width: 40%;
}
.category-item a {
transition: all 0.3s ease;
font-size: 0.75rem;
padding: 5px 0px;
}
.welcome-buttons .p-8-48 {
padding: 3% 15%;
}
.box-nax-1 .p-8-35{
padding: 6px 12px;
}
}
@media (max-width: 998px) {
.max-five-wu .five-row{
height: 245px;
}
.five-right{
height: 260px;
}
.five-right .w-n50 {
height: 128px;
}
.box-nax-row .w-n24,.five-module{
display: none;
}
.box-nax-row .custom-scrollbar{
height: 260px;
}
.box-nax-row .w-n12{
width: 18%;
}
.box-nax-row .w-n64{
width: 82%;
}
.max-hd-nav .box-nax-row{
height: 100%;
}
.down-1 .w-n25{
width: 100%;
}
.down-1 .w-n75{
padding-left: 0px;
}
/*.down-1 .user-menu{*/
/* display: none;*/
/*}*/
.bot_3 .w-n10{
width: 16%;
}
.bot_3 .w-n22{
width: 33%;
}
}
@media (max-width: 768px) {
.max-five-wu .five-row {
height: auto;
}
.five-row .w-n60,.group-mk .w-n50,.cdk-info-content .w-n50{
width: 100%;
padding: 0;
}
.five-row .w-n26,.five-row .w-n40 {
width: 100%;
padding-left: 0;
padding-right: 0;
order: 2;
}
.five-right {
height: auto;
border-radius: 8px;
}
.five-right .w-n50 {
height: 100px;
}
.max-hd-nav .box-nax-row .w-n12 {
width: 100%;
padding: 0;
order: 2;
}
.max-hd-nav .box-nax-row .w-n64 {
width: 100%;
padding-left: 0;
order: 1;
}
.box-nax-row .w-n12 .custom-scrollbar {
height: auto;
overflow-x: auto;
overflow-y: hidden;
padding: 0px 12px;
}
.box-nax-row .w-n12 .poin-ul {
display: flex;
flex-wrap: nowrap;
}
.box-nax-row .w-n12 .category-item {
flex: 0 0 auto;
margin: 0px 8px 0px -8px;
white-space: nowrap;
}
.box-nax-row .w-n12 .category-item i,.bot_5 .bot_3 {
display: none;
}
.box-nax-row .w-n12 .custom-scrollbar::-webkit-scrollbar,.an_h_bg_1::-webkit-scrollbar {
display: none;
}
.max-hd-nav .category-item a{
padding: 8px 12px;
font-size: 0.75rem;
}
}
/*目录树导航*/
@media (min-width: 1800px) {
.directory-nav {
left: 5%;
}
}
.directory-nav {
opacity: 1;
visibility: visible;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.directory-nav a:hover{
color: #0b4cd9;
}
.directory-nav .bg-success:hover{
color: #fff;
}
.directory-nav.nav-hidden {
opacity: 0;
visibility: hidden;
}
/*离线遮罩*/
.msg-over {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: var(--max-2-bg);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
}
/*小工具自适应*/
/*.max-ico-box .flex-1 .fs-1.text-white {*/
/* color: #ebebeb;*/
/*}*/
.max-ico-box .ico-box2 > [class*="col-"]{
margin-bottom: 2px;
}
/*纯标题三排模块*/
.category-header {
min-height: 65px;
padding: 12px 16px;
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
/*文章内页热度排行榜2小工具*/
.max-post-views2 .views2-1{
margin: 0 -6px;
}
/* 缩略图模式的特定样式 */
.rank-thumb-mode .rank-item {
position: relative;
}
/* 缩略图悬停效果 */
.rank-thumb-mode .rank-item:hover .card-item-thumbnail,.mini-cat2:hover .card-item-thumbnail {
transform: scale(1.15);
z-index: 10;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
margin-right: 15px;
}
.rank-thumb-mode .card-item-thumbnail,.mini-list .card-item-thumbnail{
overflow: revert;
transition: all 0.3s ease;
}
/* 确保标题区域有足够空间 */
.rank-thumb-mode .thumb-title {
transition: margin-left 0.3s ease;
}
/* 鼠标悬停时调整标题位置 */
.rank-thumb-mode .rank-item:hover .thumb-title {
margin-left: 5px;
}
/*文字交互浅蓝色*/
.rank-item:hover a,.mns-2:hover a,.mini-cat2:hover a,.xz-7 a:hover span,.entry-navigation a:hover,.notice-item:hover a,.site-footer ul a:hover,.pure-1:hover a{
/*color: #2563eb;*/
color: #2563eb!important;
}
/*文字交互深蓝色*/
.grid-item-title a:hover,.software-title a:hover,.audio-item .audio-name a:hover{
color: #1b4cf1;
}
/*图片内放大交互*/
.item-rela .bg-item{
transition: transform 0.3s ease;
}
.item-rela .d-flex:hover .bg-item{
transform: scale(1.06);
}
.item-rela .d-flex:hover a{
color: #f2f2f2;
}
/*热度排行榜结束*/
.bai-mk.mini-cat3 .col-75{
padding: 0;
}
/*分词搜索页面*/
.search-filter-buttons .badge {
position: absolute;
top: -11px;
right: -8px;
font-size: 10px;
padding: 0px 5px;
border-radius: 8px;
background-color: #e83838;
color: #ffffff;
}
.btn-group .btn {
position: relative;
margin-right: 15px;
padding: 5px 10px;
border-radius: 4px;
font-size: 0.9rem;
}
@media (max-width: 998px){
.btn-group .btn {
font-size: 0.75rem;
}
}
/*分词搜索页面结束*/
/*个人中心入口展开*/
/* 用户信息展示区 */
.user-avatar{
display: flex;
align-items: center;
}
.user-profile {
display: flex;
align-items: center;
/*gap: 10px;*/
/*padding-left: 15px;*/
border-radius: 30px;
/*background: rgb(255 255 255);*/
cursor: pointer;
/*transition: all 0.3s ease;*/
}
/* 用户头像 */
.user-avatar img {
width: 35px;
height: 35px;
border-radius: 50%;
object-fit: cover;
border: 2px solid rgba(255,255,255,0.3);
}
/* 用户名 */
.user-name {
font-weight: 500;
color: var(--max-color);
font-size: 14px;
white-space: nowrap;
}
/* 下拉菜单 */
.site-menu {
display: none;
position: absolute;
top: 100%;
right: 0;
width: 320px;
background: var(--max-2-bg);
box-shadow: 0 10px 30px rgba(0,0,0,0.15);
border-radius: 10px;
padding: 0;
z-index: 100;
animation: fadeIn 0.3s forwards;
}
@media (min-width: 798px) {
.user-avatar:hover .site-menu {
display: block;
}
.layout-game .ell3{
width: 80%;
}
/*.actions .language-selector ~ .site-profile .site-menu {*/
/* margin-top: -0.5rem;*/
/*}*/
}
@media (max-width: 598px) {
.user-avatar img {
width: 30px;
height: 30px;
}
.exchange-input{
width: 80%;
margin-bottom: 0.75rem;
}
.group-w25 .w-n25{
width: 50%;
}
.an_h_bg_2 span,.gong-title{
font-size: 0.75rem;
}
.an_h_bg_2 img{
width: 25px;
height: 25px;
}
.card-title{
font-size: 0.825rem;
-webkit-line-clamp: 1!important;
min-height: auto!important;
}
.card-excerpt,.layout-game .w-n40,.n-0-1{
display: none;
}
.max-preview .max-format-icon{
height: 25px;
width: 25px;
font-size: 0.75rem;
}
.max-preview .audio-cd-disc{
width: 200px;
height: 200px;
}
.gong-swiper{
padding: 5px 8px!important;
}
.vip-card-1 .p-12{
padding: 12px 18px;
}
::-webkit-scrollbar-thumb{
background-color: rgb(212 210 210 / 84%);
}
}
/* 动画效果 */
@keyframes fadeIn {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
/* 功能导航网格 */
.user-nav-item {
transition: all 0.2s;
}
/* 促销图片模块 */
.user-avatar .user-promo-img {
display: block;
width: 100%;
height: auto;
border-radius: 8px;
}
/*首页视频小工具*/
.max-shiping .container {
max-width: 900px;
}
.max-shiping .video-container {
position: relative;
background: #000;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
.max-shiping .video-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 2;
}
.max-shiping .video-cover::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.3);
transition: background 0.3s ease;
}
.max-shiping .video-cover:hover::before {
background: rgba(0, 0, 0, 0.5);
}
.max-shiping .video-play-btn {
position: relative;
z-index: 3;
background: none;
border: none;
padding: 0;
cursor: pointer;
transition: transform 0.3s ease;
}
.max-shiping .video-play-btn:hover {
transform: scale(1.1);
}
.max-shiping .video-player {
position: absolute;
width: 100%;
height: 100%;
object-fit: contain;
}
.max-shiping .video-fallback {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
text-align: center;
padding: 20px;
}
@media (max-width: 768px) {
.max-shiping .video-play-btn svg {
width: 48px;
height: 48px;
}
}
/*公告小工具*/
.gong-wrapper .swiper-wrapper {
display: block;
}
.gong-swiper .g-pr{
background: none;
width: 15px;
color: var(--max-txt-color);
}
.gong-swiper .g-rr{
right: 15px;
left: auto;
}
.gong-swiper .g-rl{
right: 4px;
}
/* 公告轮播整体样式 */
.gong-swiper {
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
padding: 8px 16px;
}
.gong-wrapper a{
color: var(--max-color);
}
/* 内容滚动区域 */
.gong-wrapper {
flex: 1;
height: 30px;
overflow: hidden;
position: relative;
}
.gong-wrapper .swiper-slide {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
/*min-height: 30px;*/
padding: 0 10px;
height: 30px;
}
.max-bulletin-date {
color: #666;
font-size: 0.9rem;
white-space: nowrap;
margin-left: 15px;
}
/* 响应式 */
@media (max-width: 768px) {
.g-pr{
font-size: 20px;
}
.gong-swiper .g-rl {
right: 0px;
}
}
/*公告小工具结束*/
/*导航图片模块*/
.an_h_bg_2 img{
width: 32px;
height: 32px;
}
.an_h_bg_2 span{
font-size: 13px;
}
.an_h_bg_1 .btn-tran{
margin-bottom: 20px;
}
/*图标按钮模块*/
.nav-modu:hover{
/*filter: brightness(.98);*/
box-shadow: 0px 5px 20px 2px rgb(231 229 229);
}
.nav-modu {
display: flex;
align-items: center;
text-decoration: none;
color: inherit;
width: 100%;
height: 100%;
justify-content: center;
background-color: var(--max-5-bg);
box-shadow: 0px 5px 20px 2px rgb(0 0 0 / 5%);
padding: 5px 0px;
box-sizing: border-box;
border-radius: 28px;
min-height: 50px;
}
.nav-modu img {
width: 40px;
height: 40px;
margin-right: 10px;
}
.nav-modu span {
font-size: 16px;
color: var(--max-5-color);
white-space: nowrap;
}
.su7-resou {
text-align: center;
font-size: 16px;
}
.su7-resou b {
font-size: 24px;
color: var(--max-5-color);
font-weight: 700;
padding: 0 4px;
}
@media (max-width: 998px) {
/*.nav-cont .nav-modu:nth-child(+n+5) {*/
/* display: none;*/
/*}*/
/*.max-ico-title .col-1-5,.max-ico-title .col-1-6{*/
/* width: 25%;*/
/*}*/
/*.max-ico-title .col-1-7,.max-ico-title .col-1-8,.max-ico-title .col-1-9,.max-ico-title .col-1-10{*/
/* width: 12.5%;*/
/* }*/
.an_h_bg_2 .col-1-7,.an_h_bg_2 .col-1-8,.an_h_bg_2 .col-1-9,.an_h_bg_2 .col-1-10{
width: 12.5%;
}
.an_h_bg_1 > [class*="col-"]{
width: 25%;
}
.archive-posts {
margin: 0 -5px;
display: flex;
flex-wrap: wrap;
}
.archive-posts > [class*="col-"] {
padding: 0 5px;
margin-bottom: 16px;
box-sizing: border-box;
}
}
@media (max-width: 798px) {
.nav-cont{
margin: -4.5px;
}
.nav-modu span {
font-size: 0.75rem;
}
.nav-modu img{
width: 25px;
height: 25px;
margin-right: 5px;
}
.max-ico-title .col-1-7,.max-ico-title .col-1-8,.max-ico-title .col-1-9,.max-ico-title .col-1-10{
width: 20%;
}
.an_h_bg_1{
overflow-x: auto;
overflow-y: hidden;
display: flex;
flex-wrap: nowrap;
}
.an_h_bg_1 .btn-tran {
margin-right: 12px;
padding: 0;
}
.an_h_bg_1 .nav-modu {
min-height: 40px;
}
.an_h_bg_1 > [class*="col-"],.sign-2 .col-1-3{
width: 33.333333%;
}
}
/*用户信息模块小工具*/
.info-check{
border: 2px solid #ffffff;
align-items: center;
justify-content: center;
display: flex;
bottom: 0px;
position: absolute;
left: 55%;
border-radius: 50%;
height: 25px;
width: 25px;
}
.stat-number {
font-size: 0.875rem;
font-weight: 600;
line-height: 1.2;
}
.stat-label {
font-size: 0.75rem;
color: #666;
margin-top: 4px;
}
.info-i{
color: #10b981;
margin: 8px;
background: #ecfdf5;
width: 32px;
height: 32px;
justify-content: center;
display: flex;
border-radius: 50%;
align-items: center;
}
.info-aut .follow-btn.following {
/*background: linear-gradient(-125deg, #6c757d 0%, #5a6268 100%) !important;*/
/*border: 2px solid #697179;*/
}
.info-aut .btn-teal{
border: 2px solid #14cc72;
}
.info-aut .p-8-35{
cursor: pointer;
padding: 3% 13%;
white-space: nowrap;
}
.author-avatar img {
width: 60px;
height: 60px;
border-radius: 50%;
object-fit: cover;
border: 3px solid #f8f9fa;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
/*margin-right: 15px;*/
}
.author-avatar .info-none{
display: none;
}
.author-desc {
margin: 0;
font-size: 0.75rem;
line-height: 1.5;
color: #666;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
}
/*侧边栏作者模块*/
.info-type2 .user-des{
display: flex;
}
.info-type2 .t-10{
top: 6px;
}
.info-type2 .author-avatar img{
width: 55px;
height: 55px;
margin-right: 15px;
}
.info-type2 .author-avatar{
margin-bottom: 0;
}
.info-type2 .mt-4{
margin-top: 1rem;
}
.info-type2 .author-details{
text-align: left;
}
.info-type2 .author-details h3{
max-width: 150px;
padding-left: 0;
margin-bottom: 0;
margin-bottom: -6px;
padding-top: 10px;
}
.info-type2 .ju-center{
justify-content: left;
}
/*侧边栏付费购买模块*/
/*自定义按钮*/
.pay-custom{
margin: 0 -5px;
}
.no-btn .btn{
padding: 12px 15px;
}
/*风格3*/
.pay3-vip-item{
position: relative;
align-items: center;
display: flex;
}
.pay3-name1{
background: #fffbde;
padding: 4px 10px;
color: #e36320;
border-radius: 8px;
font-size: 0.75rem;
}
/*风格2*/
.pay-style2 {
background: #f9f9f9;
border-radius: 10px;
/*border: 1px solid #eee;*/
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}
.pay2-name1{
font-size: 24px;
font-weight: bold;
color: #dc3545;
}
.pay2-left {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-right: 2px solid var(--max-txt-border);
min-width: 90px;
}
.pay2-right {
flex: 2;
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 15px;
}
.pay2-vip-item {
min-width: 120px;
background: var(--max-1-card);
border-radius: 8px;
padding: 12px;
/*border: 1px solid #e9ecef;*/
border: 1px solid var(--max-txt-border);
position: relative;
transition: all 0.2s ease;
}
.pay2-vip-item:hover {
border-color: #ffc107;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
z-index: 10;
}
.pay2-vip-item:last-child {
margin-bottom: 0;
}
.pay2-vip-title {
font-size: 0.95rem;
color: #666;
margin-bottom: 5px;
font-weight: 600;
}
.pay2-vip-title i{
color: #ffc107;
margin-right: 5px;
}
.pay2-price-wrap {
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: center;
}
.pay2-vip-price {
color: #fd7e14;
font-size: 18px;
font-weight: bold;
line-height: 1.2;
}
.pay2-coin {
font-size: 14px;
color: #fd7e14;
margin-left: 2px;
font-weight: 600;
}
.pay2-name2 {
font-size: 12px;
background: #fff3cd;
color: #856404;
padding: 2px 6px;
border-radius: 4px;
margin-left: 8px;
font-weight: 500;
}
.pay2-hover-list,.pay3-hover-list{
position: absolute;
top: 100%;
left: auto;
right: 30px;
background: var(--max-2-bg);
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
padding: 12px;
z-index: 100;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: all 0.3s ease;
/*border: 1px solid #dee2e6;*/
border: 1px solid var(--max-txt-border);
min-width: 220px;
max-width: 230px;
}
.pay2-vip-item:hover .pay2-hover-list ,.pay3-vip-item:hover .pay3-hover-list{
opacity: 1;
visibility: visible;
transform: translateY(5px);
}
.pay2-hover-list .discount-price,.pay3-hover-price .discount-price {
color: #dc3545;
font-weight: 600;
font-size: 0.85rem;
padding-right: 3px;
}
.pay2-hover-list .rate,.pay3-hover-price .rate{
background: #f8f9fa;
color: #24b92b;
padding: 1px 5px;
border-radius: 3px;
font-size: 0.75rem;
border: 1px solid #dee2e6;
}
/*.pay2-hover-list .free-badge {*/
/* background: #28a745;*/
/* color: white;*/
/* padding: 1px 6px;*/
/* border-radius: 3px;*/
/* font-size: 0.75rem;*/
/* font-weight: 500;*/
/*}*/
.post-sidebar .widget.max-download{
padding: 16px;
overflow: visible;
}
@media (max-width: 598px) {
.pay2-coin {
font-size: 12px;
}
}
@media (max-width: 998px) {
.pay2-hover-list {
right: 25%;
}
}
/*风格1*/
.post-info .pay-type1 li{
justify-content: left;
}
.demons a{
color: #646464;
}
.demons a:hover{
color: #bf0909;
}
.price-list .price-user{
position: absolute;
top: -10px;
left: 50%;
transform: translate(-50%, -50%);
font-size: 0.75rem;
color: #666;
}
.pay-style1 .rate{
position: relative;
top: 0;
font-size: .75em;
color: #24b92b;
}
.price-list {
width: 100%;
margin-bottom: 1rem;
}
.price-header {
display: flex;
justify-content: space-between;
padding: 10px 15px;
background: #f8f9fa;
font-weight: 500;
color: #495057;
border-radius: 6px 6px 0 0;
}
.price-list ul{
list-style: none;
margin: 0;
padding: 0;
border: 1px solid var(--max-txt-border);
border-top: none;
border-radius: 0 0 6px 6px;
padding-bottom: 5px;
position: relative;
}
.price-list li,.pay2-hover-li{
display: flex;
justify-content: space-between;
align-items: center;
padding: 6px 15px;
font-size: 0.85rem;
}
.vip-name {
position: relative;
font-weight: 500;
color: #605454;
}
.original-price {
text-decoration: line-through;
color: #6c757d;
font-size: 0.8em;
margin-right: 5px;
margin-top: 10px;
}
.discount-price {
color: #dc3545;
}
.fo-price {
color: #343a40;
font-weight: 600;
}
.free-badge {
/*background: #13b864;*/
background: #28a745;
color: #fff;
/*background: #fff3cd;*/
/*color: #856404;*/
padding: 2px 6px;
border-radius: 3px;
font-size: 0.75em;
}
.purchase-btn {
transition: all 0.3s ease;
border-radius: 6px;
padding: 10px 20px;
font-weight: 500;
width: 100%;
}
.type-vip,.type-month,.type-quarter,.type-year{
color: #da0909;
}
.post-forever{
color: #13b864;
font-weight: 600;
}
.post-super{
color: #da0909;
font-weight: 600;
}
@media (max-width: 798px) {
.price-header,
.price-header li {
padding: 10px 12px;
font-size: 14px;
}
.purchase-btn {
padding: 8px 15px;
font-size: 14px;
}
.original-price,
.discount-price,
.fo-price {
font-size: 0.85em;
}
}
/*个人中心订单页*/
@media (max-width: 797px) {
.order-row {
flex-wrap: wrap;
position: relative;
padding: 12px 15px;
min-height: 105px;
}
.order-row .table-cell {
padding: 0;
border: none;
}
.order-product {
width: 100% !important;
padding-right: 50px !important;
margin-bottom: 6px;
}
.order-product .order-title {
font-weight: 500;
font-size: 0.95rem;
}
.order-product .order-no {
font-size: 0.75rem;
}
/* 支付方式 - 右上角 */
.order-row .table-cell:nth-child(2) {
position: absolute;
top: 12px;
right: 15px;
width: auto !important;
text-align: right;
}
/* 订单类型 - 左下 */
.order-row .table-cell:nth-child(3) {
position: absolute;
bottom: 12px;
left: 15px;
width: 40% !important;
font-size: 0.85rem;
}
/* 实付金额 - 右上偏下 */
.order-row .table-cell:nth-child(4) {
position: absolute;
top: 37px;
right: 15px;
width: 40% !important;
text-align: right;
font-size: 1rem;
}
/* 支付时间 - 右下 */
.order-row .table-cell:nth-child(5) {
position: absolute;
bottom: 12px;
right: 15px;
width: 40% !important;
text-align: right;
font-size: 0.85rem;
}
}
/*支持购买弹窗模块样式*/
.modal-content {
padding: 20px;
position: relative;
max-height: calc(90vh - 40px); /* 减去 padding */
overflow-y: auto;
}
.payment-modal {
display: flex;
flex-direction: column;
}
.payment-header {
position: relative;
margin-bottom: 15px;
}
.pay-des1{
font-size: 0.85rem;
color: #535353;
position: absolute;
left: 0;
}
.pay-des2{
font-size: 0.85rem;
color: #535353;
position: absolute;
right: 0;
}
/* 支付内容区域 - 桌面端左右布局 */
.payment-content {
display: flex;
margin-top: 15px;
}
.payment-left {
flex: 1;
/*min-width: 0;*/
margin-right: 20px;
padding-top: 10px;
}
.payment-right {
flex: 1.1;
/*min-width: 0;*/
display: flex;
flex-direction: column;
position: relative;
}
/* 支付方式网格 */
.pay-meth {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
}
.payment-info-section {
padding: 20px 5px;
}
.info-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
}
.info-label {
font-size: 14px;
color: #666;
font-weight: 400;
}
.info-value {
font-size: 14px;
/*color: #1a1a1a;*/
font-weight: 500;
}
.amount-display {
font-weight: 600;
color: #ff3b30;
}
.info-row:last-child {
margin-bottom: 0;
}
.payment-divider {
height: 1px;
background: #f0f0f0;
margin: 0 5px;
}
.payment-options-section {
padding: 5px;
}
/* 支付方式按钮 */
.pay-method {
padding: 8px 0px;
border: 2px solid var(--max-txt-border);
border-radius: 6px;
background: var(--max-1-card);
color: var(--max-1-color);
cursor: pointer;
text-align: center;
width: 100%;
margin: 5px;
box-sizing: border-box;
position: relative; /* 为选中标记定位 */
overflow: hidden; /* 防止选中标记溢出 */
}
.pay-method:hover {
border-color: var(--max-2-color);
box-shadow: var(--max-shadow);
/*transform: translateY(-2px);*/
}
.pay-method.active {
border-color: #1890ff;
background: #f0f7ff;
}
/* 选中状态的斜三角标记 */
.pay-method.active::after {
content: '';
position: absolute;
bottom: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 20px 20px;
border-color: transparent transparent #1890ff transparent;
z-index: 2;
}
.pay-method.active::before {
content: '✓';
position: absolute;
bottom: -2px;
right: -2px;
color: white;
font-size: 10px;
font-weight: bold;
z-index: 3;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
}
/* 二维码区域 */
.qrcode-pay {
/*flex: 1;*/
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
/*min-height: 200px;*/
border-radius: 12px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
height: 220px;
flex-shrink: 0; /* 防止二维码区域被压缩 */
margin-top: auto; /* 关键：推到右侧底部 */
position: relative;
/*position: absolute;*/
/*bottom: 0;*/
/*width: 100%;*/
}
.qrcode-placeholder {
width: 100%;
text-align: center;
}
.qrcode-default {
color: #ccc;
font-size: 48px;
}
.qrcode-default p {
margin-top: 10px;
font-size: 14px;
color: #999;
}
.qrcode-active img {
max-width: 200px;
max-height: 200px;
border: 1px solid #f0f0f0;
border-radius: 8px;
}
/*.external-pay-icon .pay-icon:hover {*/
/* transform: scale(1.1);*/
/* box-shadow: 0 6px 25px rgba(0, 0, 0, 0.2);*/
/*}*/
.external-pay-icon .pay-tooltip {
margin-top: 8px;
padding: 4px 12px;
background: rgba(0, 0, 0, 0.8);
color: white;
border-radius: 20px;
font-size: 12px;
font-weight: 500;
opacity: 0;
transform: translateY(10px);
transition: all 0.3s ease;
white-space: nowrap;
}
.external-pay-icon:hover .pay-tooltip {
opacity: 1;
transform: translateY(0);
}
/*支付图标*/
.cdk-img{
background: url(../img/cdk_pay.png) center no-repeat;
}
.balance-img{
background: url(../img/balance.png) center no-repeat;
}
.zfb-img{
background: url(../img/zfb.png) center no-repeat;
}
.weixin-img{
background: url(../img/wx.png) center no-repeat;
}
/*超时*/
.qrcode-expired img{
filter: brightness(0.7);
}
/* 刷新图标样式 */
.refresh-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #ffffff;
color: #000;
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 24px;
}
.refresh-icon:hover {
color: #6f6f6f;
}
/* 支付内容样式 */
.pay-body-html {
text-align: center;
width: 100%;
}
.pay-body-html .title {
font-size: 16px;
font-weight: 600;
margin-bottom: 10px;
}
.pay-body-html .title b {
color: #ff3b30;
}
.pay-body-html .qrcode {
position: relative;
margin-bottom: 15px;
}
.pay-body-html .qrcode img{
width: 120px;
height: 120px;
background: url(../img/pay-0.jpg) left top / cover no-repeat;
padding: 3px;
box-shadow: inset 0 0 0 1px rgba(18,17,42,.07);
}
.pay-body-html .desc {
font-size: 0.75rem;
color: #666;
line-height: 1.5;
}
.payment-info i {
width: 30px;
height: 30px;
line-height: 30px;
margin-right: 6px;
vertical-align: middle;
background-size: contain!important;
}
.payment-info span{
font-weight: 600;
}
.payment-info {
display: flex;
align-items: center;
text-align: center;
justify-content: center;
}
/* 动画 */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* 确保弹窗的 z-index 设置正确 */
.modal-overlay {
z-index: 10000 !important;
}
.modal-container {
z-index: 10001 !important;
}
/* 移动端响应式 */
@media (max-width: 768px) {
.payment-content {
flex-direction: column;
}
.payment-left,
.payment-right {
width: 100%;
}
.pay-method {
width: calc(50% - 10px);
}
.qrcode-pay {
/*min-height: 150px;*/
/*position: relative;*/
}
.qrcode-active img {
max-width: 150px;
max-height: 150px;
}
/* 移动端隐藏外部支付图标 */
.external-pay-icon {
display: none;
}
/* 移动端在二维码区域显示支付图标 */
.pay-body-html .pay-icon {
width: 40px;
height: 40px;
margin-bottom: 10px;
}
}
@media (max-width: 598px) {
.payment-info i{
width: 22px;
height: 22px;
line-height: 22px;
}
/*.payment-info h4{*/
/* font-size: 0.75rem;*/
/*}*/
.payment-info-section{
padding: 5px 5px 8px 5px;
}
.payment-left{
padding-top: 0;
}
/*.pay-top{*/
/* margin-top: -15%;*/
/*}*/
}
/*支付购买模块结束*/
/*购物车模块*/
.max-cart-float {
position: fixed;
/*bottom: 470px;*/
bottom: 60%;
right: 20px;
z-index: 99;
width: 70px;
height: 70px;
border-radius: 50%;
background: #fff;
box-shadow: 0 2px 10px rgba(0,0,0,.2);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
}
.max-cart-float:hover {
transform: scale(1.1);
box-shadow: 0 4px 15px rgba(0,0,0,.3);
}
.max-cart-icon {
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: #f8f9fa;
color: #333;
font-size: 14px;
font-weight: bold;
transition: all 0.3s;
}
.max-cart-float:hover .max-cart-icon {
background: #3F67FF;
color: white;
}
.max-cart-count {
position: absolute;
top: -5px;
right: -5px;
background: #ff4757;
color: white;
width: 26px;
height: 26px;
border-radius: 50%;
font-size: 12px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
}
/* 购物车模态框 */
.max-cart-modal {
display: none;
position: fixed;
bottom: 0;
right: 0;
width: 400px;
max-width: 90vw;
/*height: auto;*/
/*max-height: 80vh;*/
z-index: 9999;
background: white;
border-radius: 10px 0 0 0;
box-shadow: -5px -5px 20px rgba(0,0,0,.2);
}
@media (max-width: 768px) {
.max-cart-float{bottom: 70%;width: 55px;height: 55px;}
.max-cart-icon{width: 55px;height: 55px;font-size: 0.75rem;}
.max-cart-count{width: 22px;height: 22px;}
}
.max-cart-header {
border-bottom: 1px solid #eee;
display: flex;
justify-content: space-between;
align-items: center;
}
.max-cart-body {
height: 450px;
overflow-y: auto;
}
.max-cart-footer {
border-top: 1px solid #eee;
/*background: #f8f9fa;*/
}
.max-cart-item {
display: flex;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #f5f5f5;
}
.max-cart-item-img {
width: 50px;
height: 50px;
object-fit: cover;
border-radius: 5px;
margin-right: 10px;
}
.max-cart-item-info {
flex: 1;
}
.max-cart-item-title {
font-size: 14px;
margin-bottom: 5px;
line-height: 1.3;
-webkit-line-clamp: 1;
}
.max-cart-item-price {
color: #ff4757;
font-size: 13px;
}
.max-cart-checkbox {
margin-right: 10px;
}
.max-cart-total {
color: red;
}
.max-cart-empty {
text-align: center;
padding: 30px;
color: #999;
}
/*广告模块样式*/
.cat-ads,.single-ads,.top-ads {
margin: 0 -5px;
display: flex;
flex-wrap: wrap;
}
.ad-module{
overflow: hidden;
}
.sidebar-gao .w-n20,.sidebar-gao .w-n25,.sidebar-gao .w-n33,.sidebar-gao .w-n50{
width: 100%;
}
/* 响应式广告布局 */
@media (max-width: 998px) {
.ad-module .w-n20{
flex: 0 0 50%;
max-width: 50%;
}
}
/* 响应式广告布局 */
@media (max-width: 768px) {
.ad-module .w-n25,
.ad-module .w-n33 {
flex: 0 0 50%;
max-width: 50%;
}
}
@media (max-width: 598px) {
.ad-module .w-n20,
.ad-module .w-n25,
.ad-module .w-n33,
.ad-module .w-n50 {
flex: 0 0 100%;
max-width: 100%;
}
/*.max-cart-modal { width: 100%;top: 0; }*/
.gou-des{
font-size: 0.75rem;
}
.max-cart-body{height: 430px;}
}
/*广告模块结束*/
/*进度条*/
.progress {
height: 8px;
background: rgb(218 218 218);
border-radius: 6px;
}
.dowl-bar {
height: 100%;
}
/*团购下载模块*/
.group-hg{
height: 20px;
background-color: #e4dfdf;
width: 100%;
display: flex;
position: relative;
}
.group-orange{
background: linear-gradient(to right,#ff4c00 , #ff0000);
position: relative;
}
.group-pos{
position: absolute;
top: 0;
left: 0;
color: #fff;
height: 100%;
width: 100%;
line-height: 20px;
white-space: nowrap;
}
.max-group-buttons .btn-danger{
line-height: 30px;
width: 150px;
margin-right: 5px;
/* background-color: #1f97fb; */
background: linear-gradient(to right, #fa7f3f, #ff1d1d);
color: #fff;
-webkit-box-shadow: 0 8px 10px rgba(32, 160, 255, .3);
box-shadow: 0 8px 10px rgb(160 20 20 / 30%);
}
.max-group-buttons .btn-danger:hover{
-webkit-transform: scale(0.95);
-moz-transform: scale(0.95);
-o-transform: scale(0.95);
transform: scale(0.95);
-webkit-box-shadow: 0 0px 0px rgba(32, 160, 255, .3);
box-shadow: 0 0px 0px rgba(32, 160, 255, .3);
background: linear-gradient(-125deg, #69bff9 0%, #7080ef 100%);
border-color: #ff1d1d;
background-color: #40a9ff;
background: linear-gradient(to right, #fa7f3f, #ff1d1d);
color: #fff;
}
/*.group-tags {*/
/* display: flex;*/
/* flex-wrap: wrap;*/
/* background: var(--max-3-bg);*/
/*}*/
/*.group-tags a{*/
/* text-align: center;*/
/*}*/
/*.group-tags a:hover{*/
/* color: #1e54f3;*/
/*}*/
.group-1{
background: #ff0e00;
color: #fff;
border-radius: 15px;
padding: 2px 8px 3px 6px;
}
/*文章顶部下载模块*/
.xz-2{
min-width: 80px;
/*min-height: 80px;*/
padding: 2px;
cursor: default;
}
.xz-3 span{
position: relative;
padding-left: 10px;
}
.xz-8 .pay2-vip-item{
display:inline-block;
border: none;
cursor:pointer;
background: none!important;
box-shadow: none!important;
}
/*下载风格2*/
.post-xz-1 .flex-wrap a{
color: #f2f2f2;
}
@media (max-width: 598px){
.xz-3 span,.xz-5 span{
font-size: 0.75rem;
}
.xz-3.h-50 {
height: 45px;
}
.xz-6 img{
max-height: 180px;
}
.xz-5{
margin-bottom: 0.5rem;
}
.xz-2{
width: 25%;
margin-right: 0rem;
}
}
/*文章顶部下载模块结束*/
/*评论+场景问题模块*/
.list-comments{
background: var(--max-3-bg);
border-radius: 8px;
border: none;
padding: 15px 18px;
}
.comment-meta .comment-reply-link{
color: var(--max-txt-color);
font-size: 0.85rem;
margin-right: 0.5rem;
}
.comment-list,
.comment-list .children {
list-style: none;
padding-left: 0;
margin-left: 0;
}
.comment-list li::marker,
.comment-list .children li::marker {
display: none;
content: '';
unicode-bidi: normal;
}
.comment-content p{
margin-bottom: 0.5rem;
}
.comment-reply-title{
font-size: 1rem;
}
/*顶部菜单风格*/
/*.fome-1{*/
/* padding: 15px;*/
/*}*/
.max_3e{
display: flex;
padding: 25px;
border-radius: 15px;
}
.cd-2 ul{
list-style: none;
}
.max_3e .menu-images a{
padding: 6px 10px;
}
.max_3e .menu-image-box img{
height: 50px;
}
.max_3e .cd-2{
width: 150px;
border-right: 1px solid var(--max-txt-border);
padding: 12px;
}
.max_3e .cd-2:last-child {
border-right: none;
}
.max_3e .cd-2 > a {
color: #919191;
pointer-events: none;
cursor: default;
}
.max_3e .cd-2 a:hover {
background: #fafafa;
border-radius: 5px;
}
.max_3e .cd-2 a{
margin-bottom: 8px;
}
.fome-3 i,.fome-3 img{
margin-right: 0.5rem;
min-width: 20px;
}
.fome-3 .img-15,.fome-8 .cd-3 .img-15{
width: 20px;
height: 20px;
line-height: 20px;
vertical-align: middle;
background-size: contain!important;
}
.max_3e .menu-images{
width: 230px!important;
padding: 0;
}
.max_3e .menu-image-box{
width: 100%;
padding: 0;
}
.menu-image-box img {
object-fit: cover;
/*min-height: 80px;*/
/*height: 90px;*/
height: 65px;
width: 100%;
border-radius: 6px;
transition: all 0.3s ease;
}
.menu-image-box:hover img {
transform: scale(1.03);
}
.menu-images {
padding: 0 15px;
width: 100%;
box-sizing: border-box;
}
.menu-images a{
padding: 0px;
}
.fome-4 .menu-images {
padding: 0;
margin: 0;
width: 100%;
background: none;
box-sizing: border-box;
}
.menu-images-row {
display: flex;
flex-wrap: wrap;
/* 如果需要垂直间距，可以添加 margin-top: -10px; margin-bottom: -10px; */
}
.menu-image-box {
width: 33.33333%;
box-sizing: border-box;
padding: 5px;
}
/***********************************************/
.menu-desc{
font-size: .8em;
color: #666;
margin-top: 0.2em;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 170px;
}
.fome-1 .menu-title{
font-weight: 600;
color: #1e0d0d;
color: var(--max-color);
}
.fome-1 .img-15,.fome-4 .img-15{
width: 35px;
height: 35px;
line-height: 35px;
vertical-align: middle;
background-size: contain!important;
margin-right: 0.5rem;
}
.fome-1 li a,.fome-4 li a{
text-align: left;
}
.fome-1 li:hover .menu-title,.cd-to a:hover span{
color: #0d7af0;
}
/*.to-sub-menu .cd-to:hover{*/
/* background: #eef5ff;*/
/* background: linear-gradient(135deg, #f2f4f7 0%, #f6f9ff 50%, #e5e9ed 180%);*/
/* border-radius: 6px;*/
/*}*/
.fome-1 li{
/*background: #fafafa;*/
margin: 10px;
border-radius: 5px;
width:240px;
}
/*max四列*/
.fome-4{
/*background: #fafafa;*/
display: flex;
flex-wrap: wrap;
width:790px!important;
box-sizing: border-box;
padding-right: 10px;
padding-left: 10px;
}
.fome-4 li{
border: var(--border);;
background: #fafafa;
margin: 5px 6px;
border-radius: 5px;
width:180px;
}
/*.fome-4 .menu-title{*/
/* color: #1e0d0d;*/
/*}*/
.fome-4 li:hover{
background: #f5fffa;
}
.fome-4 .menu-desc{
width: 120px;
}
/***************************************************/
.max_7e{
margin-right: -5px;
margin-left: -5px;
}
.max_07 .menu-images,.max_08 .menu-images{
padding: 0 5px;
}
.max_7e,.max_8e{
display: flex!important;
align-items: center;
width: 760px;
flex-wrap: wrap;
}
.fome-7,.fome-8{
display: flex!important;
flex-wrap: wrap;
padding-left: 0;
}
.fome-7 li,.max_7e >a{
width: 108px;
}
.to-sub-menu .max_7e >a{
font-weight: 600;
/*color: #1e0d0d;*/
}
.fome-8 li{
width: 90px;
}
.max_8e{
margin-bottom: 8px
}
.fome-8 .cd-3 .img-15{
margin-right:0px ;
}
.max_8e .img-15,.max_8e i{
width: 30px;
height: 30px;
line-height: 30px;
vertical-align: middle;
background-size: contain!important;
margin-right: 0;
}
.to-sub-menu .max_8e >a{
padding: 5px 12px!important;
margin-left: 10px;
background: var(--max-3-bg);
border-radius: 5px;
font-weight: 600;
/*color: #1e0d0d;*/
}
/***********************************************/
/*菜单双列*/
.yome-2{
display: flex;
flex-wrap: wrap;
width: 230px;
box-sizing: border-box;
}
/* 每一项占一半 */
.yome-2 li{
width: 50%;
box-sizing: border-box;
}
/*菜单三列*/
.yome-3{
display: flex;
flex-wrap: wrap;
width: 300px;
padding-right: 10px;
padding-left: 10px;
box-sizing: border-box;
}
/* 每一项占一半 */
.yome-3 li{
width: 33.33%;
box-sizing: border-box;
}
/*菜单横向换行*/
.yome-7{
display: flex;
flex-wrap: wrap;
width: 760px;
box-sizing: border-box;
}
/* 每一项占一半 */
.yome-7 li{
width: 106px;
box-sizing: border-box;
}
/*顶部菜单结束*/
/*文章视频播放模块*/
.max-video-list-header h1{
line-height: 1.6;
color: #fff;
margin-bottom: 0;
}
/*.max-video-i{*/
/* font-size: 1.5rem;*/
/* color: #fff;*/
/*}*/
.max-video-locked-mask,.max-video-login{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 10;
}
.max-video-item-icon span{
width: 25px;
height: 25px;
border-radius: 4px;
justify-content: center;
align-items: center;
display: flex;
}
.max-video-player-section {
background: var(--max-5-bg);
padding: 20px 0;
}
.max-video-wrapper {
position: relative;
/*height: 0;*/
/*padding-bottom: 56.25%;*/
overflow: hidden;
}
.max-video-item {
cursor: pointer;
padding: 10px 14px;
}
.max-video-item:hover .max-video-item-content{
color: #ffdb1f;
/*background: #e2ecff;*/
}
.max-video-item-content{
color: #b7b3b3;
}
.max-video-item.active .max-video-item-content{
/*background: #e2ecff;*/
color: #ffdb1f;
}
.max-video-item.active .max-video-item-icon {
color: #294dff;
}
.max-video-body {
background: #2f2f2f;
/*margin-bottom: -170%;*/
height: 481px;
min-height: 0;
flex: 1;
height: auto;
/*padding-top: 0.5rem;*/
}
.max-video-list {
flex: 1; /* 占满剩余高度 */
display: flex;
flex-direction: column;
}
.max-video-list > div:last-child {
flex: 1;
display: flex;
flex-direction: column;
}
/* video.js 按钮样式 - 增加权重 */
.video-js .vjs-big-play-button {
/*border: none;*/
border-radius: 50%!important;
width: 60px!important;
height: 60px!important;
line-height: 60px!important;
/*left: 50%;*/
/*top: 50%;*/
margin: 0!important;;
padding: 0!important;
transform: translate(-50%, -50%);
}
.video-js:hover .vjs-big-play-button {
background: rgb(46 45 45)!important;
}
.video-js .vjs-poster img,.video-js .vjs-tech {
object-fit: cover;
}
.video-grid-3 .col-60{
padding-bottom: 1rem;
}
/*视频封面阴影遮罩*/
/*.video-js .vjs-poster:before {*/
/* content: "";*/
/* display: block;*/
/* width: 100%;*/
/* height: 100%;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 0;*/
/* background: rgba(0,0,0,.75);*/
/*}*/
.tag-input.br-5{
border-radius: 5px; font-size: 0.8rem; min-width: 160px;background: var(--max-5-bg);border: 1px solid #143fe4;
}
.language-selector {
display: inline-block;
/*padding: 0.25rem;*/
font-family: none;
font-size: 1rem;
line-height: 1.5;
cursor: pointer;
text-align: center;
vertical-align: middle;
color: #4d4d4d;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
text-align: right;
/*overflow: hidden;*/
text-overflow: ellipsis;
white-space: nowrap;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
min-width: 130px;
}
.translateSelectLanguage {
display: inline-block;
padding: 7px 35px 7px 0px;
border: 1px solid #ddd;
background: var(--max-5-bg);
color: var(--max-1-color);;
/*margin-top: 5px;*/
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
cursor: pointer;
min-width: 130px;
position: relative;
background-repeat: no-repeat;
background-position: 10px center;
background-size: 24px 18px;
}
.translateSelectLanguage:after {
content: '▼';
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
font-size: 12px;
color: #666;
}
.translate-dropdown {
position: absolute;
background: var(--max-5-bg);
border: 1px solid #ddd;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
z-index: 1000;
min-width: 130px;
margin-top: 2px;
}
.translate-option {
padding: 8px 10px 8px 40px;
cursor: pointer;
font-size: 14px;
color: var(--max-1-color);;
background-repeat: no-repeat;
background-position: 10px center;
background-size: 24px 18px;
text-align: center;
}
.translate-option:hover {
background-color: #f5f5f5;
}
.flag-english { background-image: url('../img/us.png'); }
.flag-chinese_simplified { background-image: url('../img/cn.png'); }
.flag-chinese_traditional { background-image: url('../img/tw.png'); }
.flag-japanese { background-image: url('../img/jp.png'); }
.flag-korean { background-image: url('../img/kr.png'); }
.prize-dot{
width: 30px;
height: 15px;
margin-right: 8px;
}
.wheel-pointer {
background-image: url(../img/0-51.jpg);
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
width: 130px;
height: 146px;
}
#wheelCanvas {
width: 100%;
height: auto;
border-radius: 50%;
box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}
/* ---------- 移动端：展开式布局 ---------- */
@media (max-width: 998px) {
/* 调整布局为上下结构 */
.max-video-row .w-n75,
.max-video-row .w-n25 {
flex: 0 0 100%;
max-width: 100%;
padding: 0;
margin-bottom: 8px;
position: relative;
}
.max-video-body{
max-height: 240px;
}
/* 防止iOS全屏播放 */
.video-js ::-webkit-media-controls {
display: none !important;
}
.video-js {
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
.video-js video {
object-fit: contain !important;
}
/*视频播放小工具手机端*/
.max-video-locked-mask .p-2-6 .fs-2{
font-size: 0.75rem;
}
.max-shiping-v2 .pos-rel.w-n100.mt-10 {
padding-left: 0 !important;
display: flex;
flex-direction: column;
margin-top: 10px !important;
}
.max-shiping-v2 .pos-abs.l-0.w-n60 {
position: relative !important;
left: auto !important;
top: 0 !important;
width: 100% !important;
margin-bottom: 10px;
z-index: 20;
order: -1;
}
.max-shiping-v2 #v2-info-panel {
/*padding-bottom: 15px !important;*/
/*width: 100% !important;*/
/*display: block !important;*/
/*margin-top: 0 !important;*/
order: 1; /* 排在视频后面 */
padding-top: 0 !important;
padding-bottom: 0 !important;
background: #ffffff00!important;
}
.max-shiping-v2 .mt-auto{
padding-top: 0;
}
.max-shiping-v2 #v2-bg-cover,
.max-shiping-v2 #v2-info-panel > .pos-abs.r-0.t-0.w-n100.h-n100.z-0 {
display: none !important;
}
.max-shiping-v2 #v2-info-panel > .pos-abs.r-0.t-0.w-n45 {
position: relative !important;
right: auto !important;
top: auto !important;
width: 100% !important;
height: auto !important;
padding: 0px !important;
}
.max-shiping-v2 #v2-info-panel .v2-title,
.max-shiping-v2 #v2-info-panel .v2-desc,
.max-shiping-v2 #v2-info-panel .mt-5 {
display: none !important;
}
/* 7. 底部轮播列表 */
/*.max-shiping-v2 #v2-thumbs-list {*/
/* margin-top: 0 !important;*/
/* padding-top: 0 !important;*/
/*}*/
}
/*文章视频播放模块结束*/
/*手机端底部菜单导航*/
.bottom-navbar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
display: none;
/*justify-content: space-around;*/
align-items: flex-end; /* 修改为底部对齐 */
background-color: white;
padding: 8px 0; /* 减少底部padding */
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
z-index: 99;
}
.nav-item {
display: flex;
flex-direction: column;
/*align-items: center;*/
text-align: center;
text-decoration: none;
color: #999;
font-size: 10px;
padding: 0 0 4px; /* 调整padding */
flex: 1;
position: relative;
}
.nav-item i {
font-size: 0.9rem;
}
.nav-item.active {
color: #1a73e8;
}
.nav-item span {
margin-top: 4px; /* 统一文字上边距 */
line-height: 1.2;
}
/* 响应式调整 */
@media (max-width: 798px) {
.bottom-navbar {
display: flex;
}
}
/*手机端底部菜单导航结束*/
/*全局公共弹窗组件*/
/*html.modal-open,body.modal-open {*/
/* overflow: hidden!important;*/
/*}*/
html.modal-open{
overflow: hidden!important;
}
/* 全局弹窗样式 */
.global-modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
visibility: hidden;
/*transition: opacity 0.3s ease, visibility 0.3s ease;*/
}
.global-modal.active {
display: flex;
opacity: 1;
visibility: visible;
}
.modal-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
}
.modal-container {
position: relative;
width: 90%;
max-width: 500px;
/*background: #fff;*/
border-radius: 8px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
max-height: 90vh;
/*overflow-y: auto;*/
/* 关键：从上方滑入动画 */
transform: translateY(-50px);
transition: transform 0.3s ease, opacity 0.3s ease;
}
.global-modal.active .modal-container {
transform: translateY(0);
}
.modal-close {
position: absolute;
/*top: -25px;*/
/*right: 15px;*/
left: 50%;
bottom: -60px;
transform: translate(-50%, -50%);
background: none;
border: none;
cursor: pointer;
padding: 5px;
color: #666;
z-index: 1; /* 确保在最上层 */
}
.modal-close svg {
transition: transform 0.2s ease;
}
.modal-close:hover svg {
transform: rotate(360deg);
}
.modal-content {
padding: 20px;
/* 如果你希望内容离右上角关闭按钮远一点，可以适当 padding-top */
}
/* 弹窗类型样式（不再关联 header，只作用于内容区域，可根据需求调整） */
.modal-success .modal-content {
background-color: transparent; /* 你可以根据需要设置背景 */
}
.modal-error .modal-content {
background-color: transparent;
}
.modal-warning .modal-content {
background-color: transparent;
}
.modal-info .modal-content {
background-color: var(--max-5-bg);
border-radius: 5px;
}
@media (max-width: 598px) {
.modal-content{
margin-top: -15%;
}
}
/*公共弹窗结束*/
/*********************************自适应*****************************************************/
@media (max-width: 1200px) {
.max-ico-box .box-mk1 {
padding: 10px;
}
.max-ico-box .col-1-5 {
width: 25%;
}
.max-ico-box .h-50 {
height: 40px;
width: 40px;
margin-right: 0.5rem;
}
.max-ico-box .box-mk1 .flex-1 .fs-4,.max-ico-box .box-mk2 .fs-5 {
font-size: 0.9rem;
}
.max-ico-box .box-mk1 .flex-1 .fs-1 {
font-size: 0.75rem;
}
.vip-card-1 .w-n65{
font-size: 0.78rem;
width: 65%;
}
/*指定模块隐藏*/
.box-mk-0 .col-1-5:nth-child(+n+5),.bot_3 .w-n10:nth-child(n+6),.box-mk-0 .archive-posts > [class*="col-"]:nth-child(+n+5),.five-module .col-1-6:nth-child(+n+5) {
display: none;
}
}
@media (max-width: 998px) {
.five-right .w-n50:nth-child(+n+5),.mini-cat3 .col-25 {
display: none;
}
.mini-cat3 .col-75{
width: 100%;
}
.vip-card-1 .col-1-3{
width: 50%;
}
.section-header{
display: block!important;
}
.section-cat-navbtn{
margin-top: 10px;
}
/*.max-ico-box .archive-posts > [class*="col-"] {*/
/* width: 25%;*/
/*}*/
}
@media (max-width: 798px) {
.max-search-2 .search-2-content{
min-height: 150px;
padding: 30px 15px!important;
}
.max-search-2 .w-n50{
width: 100%;
height: 40px;
}
.max-ico-box .col-1-5,.max-ico-box .col-1-6 {
width: 50%;
}
.max-ico-box .h-60 {
height: 45px;
width: 45px;
}
.max-ico-box .box-mk2 .fs-7 {
font-size: 1.25rem;
}
.max-ico-box .box-mk2 {
min-height: 150px!important;
padding: 10px;
}
.box-mk-0 .col-1-5:nth-child(+n+5) {
display: none;
}
.rank-2g {
height: 24px;
line-height: 24px;
min-width: 24px;
font-size: 13px;
}
.max-post-views2 .views2-1{
width: 60%;
}
.period-tab {
flex: 1;
}
.section-cat-navbtn a{
font-size: 0.75rem;
}
.nav-module .archive-posts > [class*="col-"] {
width: 100%;
}
}
/***************************************************/
/*会员套餐卡片颜色结束*/
@media (min-width: 769px) and (max-width: 998px){
.max-ico-box .archive-posts > [class*="col-"] {
width: 25%;
}
.nav-module .archive-posts > [class*="col-"],.max-pure-posts .archive-posts > [class*="col-"] {
width: 50%;
}
.ico-cards .col-1-5:nth-child(+n+4) {
display: none;/*隐藏*/
}
}
/*PC手机端适应*/
@media (min-width: 798px) and (max-width: 1200px){
.actions{
position: absolute;
right: 0;
background: var(--max-5-bg);
padding-right: 20px;
z-index: 999;
}
.vip-card{
padding: 30px 15px;
}
}
@media (min-width: 998px) and (max-width: 1200px){
.user-menu li,.show-no .user-menu-nav li{
flex: 0 0 calc(50% - 12px);
}
.pay-style2 .name-2,.max-post-views2 .ju-center-bet{
display: block;
}
.pay-style2 .pay2-left{
border-right: none;
}
.pay-style2 .pay2-right{
padding-left: 0;
}
.pay-custom .col-1-3 {
width: 50%;
margin-bottom: 0;
}
.nav-module .archive-posts .col-1-4,.max-pure-posts .archive-posts .col-1-4{
width: 33.333333%;
}
.max-post-views2 h4{
margin-bottom: 5px;
}
.ico-cards .col-1-5:nth-child(+n+5) {
display: none;/*隐藏*/
}
.max-video-list-header .flex-wrap{
justify-content: center;
}
}
/* 容器类 */
@media (min-width: 576px) {
.container {
max-width: 540px;
}
.nav-module .archive-posts .col-1-1{
width: 100%;
}
}
@media (min-width: 768px) {
.container {
max-width: 720px;
}
.ico-cards .scroll-x{
margin: 0 -7.5px;
}
}
@media (min-width: 998px) {
.container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1380px;
}
.entry-content .music-player{
width: 75%;
}
/*.vip-card-1 .w-n100{*/
/* width: 65%;*/
/* }*/
.vip-card-1 .col-1-5 .w-n65{
width: 80%;
font-size: 0.85rem;
}
}
.container {
width: 100%;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}