﻿

        /* 顶部图画吧标题样式 - 还原图片效果 */
        header {
            background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%); /* 和参考图片一致的粉色渐变 */
            width: 100%;
            padding: 30px 0; /* 加大上下内边距，更大气 */
            text-align: center;
            box-sizing: border-box;
            border-bottom: 2px dashed #ff6b9d; /* 底部虚线，还原图片样式 */
        }
        .logo {
            font-size: 48px !important; /* 超大字体，还原图片大小 */
            font-weight: bold !important;
            color: #ffffff !important; /* 白色文字更醒目 */
            text-shadow: 2px 2px 4px rgba(0,0,0,0.1); /* 加阴影更立体 */
            margin: 0 !important;
            padding: 0 !important;
        }
        .logo a {
            color: #ffffff !important;
            text-decoration: none !important;
        }
        .subtitle {
            font-size: 18px !important; /* 副标题加大 */
            color: #fff !important;
            margin: 10px 0 0 0 !important;
            padding: 0 !important;
            text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
        }
        /* 修复导航栏多余闭合标签问题 */
        nav {
            background-color: #ffd166;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            padding: 15px 0;
        }
        .nav-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 15px;
        }
        .normal-nav-list {
            list-style: none;
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 15px;
            margin: 0;
            padding: 0;
        }
        .normal-nav-list li {
            border-radius: 8px;
        }
        .normal-nav-list li a {
            color: #000;
            font-weight: bold;
            text-decoration: none;
            font-size: 18px;
            padding: 12px 22px;
            display: block;
            border-radius: 8px;
            transition: all 0.2s ease;
        }
        .normal-nav-list li a:hover {
            background-color: #ff4444;
            color: #000;
        }
        .su-model-item a {
            background-color: #ff4444 !important;
            color: #000 !important;
            font-weight: bold !important;
            font-size: 18px !important;
        }
        .hot-icon {
            color: #ff0000;
            margin-right: 5px;
            font-size: 18px;
        }
















/* 全局样式重置 - 仅保留基础重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Microsoft Yahei", Arial, sans-serif;
    background-color: #f9f9f9;
    color: #333;
}



/* 搜索容器样式 - 保留原始布局，添加蓝色虚线边框 */
.search-container {
    max-width: 800px;
    margin: 20px auto;
    padding: 0 15px;
}

/* 搜索表单样式 - 还原原始样式 + 核心：蓝色虚线边框 */
.search-form {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    padding: 8px;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(255, 107, 157, 0.1);
    border: 2px dashed #007bff; /* 核心：蓝色虚线边框（#007bff是标准蓝色） */
    /* 可选：如果想要更细的虚线，把2px改成1px */
    /* border: 1px dashed #007bff; */
}

/* 下拉选择框样式 - 原始样式 */
.search-select {
    height: 48px;
    padding: 0 15px;
    border: none;
    border-radius: 24px;
    background: #f8f9fa;
    color: #333;
    font-size: 14px;
    cursor: pointer;
    outline: none;
    flex: 0 0 120px;
}

/* 搜索输入框样式 - 原始样式 */
.search-input {
    flex: 1;
    height: 48px;
    padding: 0 20px;
    border: none;
    border-radius: 24px;
    background: #f8f9fa;
    font-size: 14px;
    color: #333;
    outline: none;
}

.search-input::placeholder {
    color: #999;
}

/* 搜索按钮样式 - 原始粉色渐变 */
.search-button {
    height: 48px;
    padding: 0 25px;
    border: none;
    border-radius: 24px;
    background: linear-gradient(135deg, #ff6b9d 0%, #ff8fab 100%); /* 原始粉色渐变 */
    color: white;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

/* SU标签折叠区域样式 - 原始配色 */
.su-tags-wrapper {
    margin-top: 10px;
    width: 100%;
}

/* 折叠/展开按钮 - 原始粉色系 */
.toggle-tags-btn {
    width: 100%;
    padding: 8px 15px;
    background: #fef5f8; /* 原始浅粉色 */
    border: 1px solid #ff6b9d; /* 原始粉色边框 */
    border-radius: 8px;
    color: #ff6b9d; /* 原始粉色文字 */
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

#toggleIcon {
    font-size: 10px;
    transition: transform 0.3s ease;
}

/* 标签容器 - 原始样式 */
.su-tags-container1 {
    display: none; /* 默认隐藏 */
    padding: 10px 15px;
    background: #fff;
    border: 1px solid #fef5f8;
    border-radius: 8px;
    margin-top: 4px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* SU标签样式 - 原始配色 */
.su-tag {
    padding: 4px 10px;
    background: #f8f9fa;
    color: #555;
    text-decoration: none;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
}

.su-tag:hover {
    background: #ff6b9d; /* 原始粉色hover */
    color: white;
}

/* 下载按钮样式 - 原始配色 */
.download-btn {
    padding:12px 24px;
    border-radius:8px;
    border:none;
    font-size:14px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
    text-decoration: none;
    color: #fff !important;
}

/* 图片下载按钮 - 原始绿色 */
.download-img {
    background:linear-gradient(135deg, #4CAF50 0%, #45a049 100%);
}

/* SU模型下载按钮 - 原始橙色 */
.download-su {
    background:linear-gradient(135deg, #FF9800 0%, #f57c00 100%);
}

/* 线稿下载按钮 - 原始灰色 */
.download-line {
    background:linear-gradient(135deg, #757575 0%, #616161 100%);
}

/* 交流群按钮 - 原始玫红 */
.download-qrcode {
    background:linear-gradient(135deg, #e91e63 0%, #c2185b 100%);
}

/* 响应式适配 - 仅保留布局适配 */
@media (max-width: 768px) {
    .search-form {
        flex-wrap: wrap;
        padding: 10px;
        border-radius: 15px;
    }
    
    .search-select {
        flex: 1 1 100%;
        margin-bottom: 8px;
    }
    
    .search-input {
        flex: 1 1 calc(100% - 100px);
    }
    
    .search-button {
        flex: 0 0 80px;
        padding: 0 15px;
    }
    
    .su-tag {
        padding: 3px 8px;
        font-size: 11px;
    }

    .nav-container ul {
        flex-direction: column;
        gap: 5px;
    }

    .download-btn {
        padding: 8px 16px;
        font-size: 12px;
    }
}

/* 响应式图片 */
.responsive-special-img {
    max-width: 100%;
    height: auto;
}

.normal-img {
    max-width: 100%;
    height: auto;
}





/* 导航栏整体样式 - 统一橙色背景（和页面橙色一致） */
nav {
    background-color: #ffd166; /* 和底部footer同款橙色 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    padding: 15px 0; /* 加大内边距，更大气 */
    display: block;
}

.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* 导航项列表 - 统一布局 */
.normal-nav-list {
    list-style: none;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px; /* 间距同步调大，适配大字体 */
    margin: 0;
    padding: 0;
}

/* 普通导航项样式 */
.normal-nav-list li {
    padding: 0; /* 清空默认内边距 */
    border-radius: 8px; /* 圆角更精致 */
    flex: 0 1 auto;
}

.normal-nav-list li a {
    color: #000; /* 默认黑色文字 */
    font-weight: bold; /* 默认加粗 */
    text-decoration: none;
    font-size: 18px; /* 核心：字体调大到18px */
    padding: 12px 22px; /* 内边距同步调大，适配大字体 */
    display: block; /* 铺满li区域 */
    border-radius: 8px; /* 和li圆角一致 */
    transition: all 0.2s ease; /* 悬浮过渡动画 */
}

/* 核心：鼠标悬浮样式 - 红色背景 + 黑色加粗文字 */
.normal-nav-list li a:hover {
    background-color: #ff4444; /* 红色背景 */
    color: #000 !important; /* 黑色文字（强制生效） */
    font-weight: bold !important; /* 加粗（强制生效） */
}

/* SU模型项样式 - 默认选中（红色背景+黑色文字） */
.su-model-item a {
    color: #000 !important; /* 黑色文字 */
    font-weight: bold !important; /* 加粗 */
    font-size: 18px !important; /* SU项字体同步调大 */
    background-color: #ff4444 !important; /* 核心：默认红色背景 */
}

/* SU模型项悬浮时样式（保持一致，避免闪烁） */
.su-model-item a:hover {
    background-color: #ff4444 !important; /* 悬浮仍为红色背景 */
    color: #000 !important; /* 悬浮黑色文字 */
}

.hot-icon {
    color: #ff0000; /* 火焰图标红色，更醒目 */
    margin-right: 5px;
    font-size: 18px; /* 火焰图标字体同步 */
}

/* 移动端隐藏导航栏（保留之前的逻辑） */
@media (max-width: 768px) {
    nav {
        display: none !important;
    }
}






/* 主图片居中容器 - 确保容器宽度100%，图片居中 */
.main-image-container {
    width: 100%;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center;     /* 垂直居中 */
    padding: 0 15px;        /* 左右留白，避免贴边 */
    box-sizing: border-box;
}

/* 主图片样式 - 65%宽度 + 高度自动 + 居中 */
#mainImage {
    width: 65% !important;   /* 强制设置宽度为65% */
    height: auto !important; /* 高度自动，保持宽高比 */
    display: block;          /* 消除行内间隙，确保margin生效 */
    margin: 0 auto 20px;     /* 底部间距，兜底居中 */
    max-width: 100%;         /* 移动端适配：不超过屏幕宽度 */
}

/* 响应式图片样式保留（兼容原有类名） */
.responsive-special-img, .normal-img {
    width: 65%;              /* 统一应用65%宽度 */
    height: auto;            /* 高度自动 */
}

/* 移动端优化：小屏幕时图片宽度自适应 */
@media (max-width: 768px) {
    #mainImage {
        width: 90% !important; /* 移动端宽度调整为90%，更适配 */
    }
}







/* ======================
   手机端隐藏：SU筛选 + 面包屑
====================== */
@media (max-width: 768px) {
  /* 隐藏 SU模型快速筛选 */
  .su-tags-wrapper {
    display: none !important;
  }
  /* 隐藏面包屑导航 */
  .breadcrumb {
    display: none !important;
  }
}












