/* 唐山有力网站自定义样式 */

/* 全局样式 */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
}

body {
    font-family: 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #fff;
}

/* 导航栏样式 */
.navbar {
    background-color: rgba(0,0,0,.4) !important;
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    padding: 0 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* 导航栏居中布局 */
.navbar-collapse {
    justify-content: center;
    align-items: center;
}

.navbar-nav {
    margin: 0;
    display: flex;
    align-items: center;
}

.navbar-nav .nav-item {
    margin: 0 8px;
}

/* 中间标题紧凑间距 */
.main-title {
    margin: 0 15px !important;
    display: flex;
    align-items: center;
    font-size: 14px;
}

/* 导航链接样式 */
.navbar-nav .nav-link {
    font-weight: 400;
    font-size: 14px;
    transition: all 0.3s ease;
    color: white !important;
    padding: 8px 12px !important;
    margin: 0 4px;
    position: relative;
    cursor: pointer;
    width: 118px;
    height: 28px;
    background: url(data:image/png;base64,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) 0 no-repeat;
    background-size: 100% 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.navbar-nav .nav-link:hover {
    color: #ffc107 !important;
    transform: translateY(-1px);
}

/* 首页按钮样式 */
.nav-btn {
    padding: 8px 12px !important;
    margin: 0 4px;
    transition: all 0.3s ease;
    position: relative;
}

.nav-btn:hover {
    transform: translateY(-1px);
}

/* 确保导航栏内容居中 */
.navbar > .container {
    justify-content: space-between;
    align-items: center;
}

.navbar-nav.me-auto {
    margin-right: 0 !important;
}

.navbar-nav.ms-auto {
    margin-left: 0 !important;
}

/* 使用Grid布局调整左侧logo位置 */
.navbar > .container {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
}

.navbar-brand-left {
    justify-self: start;
    margin-left: 80px;
}

.navbar-nav.me-auto {
    justify-self: center;
}

.navbar-nav.ms-auto {
    justify-self: end;
}

/* 中间logo居中 */
.navbar-brand.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 激活状态的导航链接样式 */
.navbar-nav .nav-link.active {
    color: #ffc107 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(255, 193, 7, 0.3);
}

/* 查看更多页面样式 */
.sidebar {
    background-color: #f8f9fa;
    min-height: 100vh;
    padding: 20px;
    border-right: 1px solid #dee2e6;
    margin-top: 50px;
}

.sidebar-header {
    background-color: #8B4513;
    color: white;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.sidebar-header h5 {
    margin: 0;
    font-size: 16px;
    font-weight: bold;
}

.sidebar-header p {
    margin: 5px 0 0 0;
    font-size: 12px;
    opacity: 0.8;
}

.sidebar-nav .nav-link {
    color: #333;
    padding: 12px 15px;
    border-radius: 6px;
    margin-bottom: 8px;
    transition: all 0.3s ease;
    background-color: white;
    border: 1px solid #e9ecef;
}

.sidebar-nav .nav-link:hover {
    background-color: #007bff;
    color: white;
    transform: translateX(5px);
}

.main-content {
    padding: 30px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-bottom: 3px solid #fff;
    position: relative;
}

.main-content::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    height: 20px;
    background-color: #fff;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* 顶部背景区域样式 */
.top-banner {
    margin: -30px -30px 30px -30px;
    position: relative;
    height: 300px;
    overflow: hidden;
    border-radius: 0 0 15px 15px;
}

.banner-background {
    position: relative;
    width: 100%;
    height: 100%;
}

.banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.7) contrast(1.1);
}

.banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.6) 100%);
}

.banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: white;
    z-index: 2;
}

.banner-title {
    font-size: 3rem;
    font-weight: bold;
    margin-bottom: 10px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.banner-subtitle {
    font-size: 1.2rem;
    opacity: 0.9;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.page-header {
    margin-bottom: 30px;
}

.page-title {
    font-size: 2.5rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
}

.title-line {
    border: none;
    height: 3px;
    background: linear-gradient(90deg, #007bff, #28a745);
    margin: 15px 0;
}

.breadcrumb-text {
    color: #666;
    font-size: 14px;
    margin: 0;
}

.content-section {
    margin-top: 30px;
}

/* 视频播放器样式 */
.video-player-container {
    margin-bottom: 40px;
}

.video-player {
    position: relative;
    width: 100%;
    height: 400px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.video-player video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.video-overlay {
    position: absolute;
    top: 20px;
    left: 20px;
    background: rgba(0,0,0,0.7);
    color: white;
    padding: 10px 20px;
    border-radius: 6px;
}

.video-overlay h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
}

/* 卡片通用样式 */
.food-card, .homestay-card, .scenic-card, .specialty-card, .village-card {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    height: 100%;
}

.food-card:hover, .homestay-card:hover, .scenic-card:hover, .specialty-card:hover, .village-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.food-image, .homestay-image, .scenic-image, .specialty-image, .village-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.food-content, .homestay-content, .scenic-content, .specialty-content, .village-content {
    padding: 20px;
}

.food-content h4, .homestay-content h4, .scenic-content h4, .specialty-content h4, .village-content h4 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
}

.food-content p, .homestay-content p, .scenic-content p, .specialty-content p, .village-content p {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
}

/* 标签和信息样式 */
.food-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.tag {
    background-color: #e9ecef;
    color: #495057;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
}

.homestay-info, .scenic-info, .specialty-info, .village-info {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.info-item {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #666;
    font-size: 13px;
}

.info-item i {
    color: #007bff;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .sidebar {
        min-height: auto;
        border-right: none;
        border-bottom: 1px solid #dee2e6;
    }
    
    .main-content {
        padding: 20px;
    }
    
    .page-title {
        font-size: 2rem;
    }
    
    .video-player {
        height: 250px;
    }
}

/* 头部横幅区域样式 */
.header[data-v-df1486ce] {
    height: 900px;
    position: relative;
    margin-top: 50px;
    width: 100%;
    z-index: 0;
    overflow: visible;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
}

/* 确保header内的容器不受全局container样式影响 */
.header[data-v-df1486ce] .container {
    max-width: none;
    margin: 0;
    padding: 0;
}

/* 强制banner容器完全铺满 */
.header[data-v-df1486ce] .banner-container[data-v-df1486ce] {
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    left: 0;
    top: 0;
    box-sizing: border-box;
    z-index: 1;
    display: block;
    float: none;
    clear: none;
    vertical-align: baseline;
    text-align: left;
    direction: ltr;
}

.header .bannerItem[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    cursor: pointer;
    position: relative;
}

.header .bannerItem img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    /* animation: scale-df1486ce 10s infinite alternate; */
}

/* @keyframes scale-df1486ce {
    0% {
        transform: scale(1);
    }
    to {
        transform: scale(.98);
    }
} */

/* 标题区域样式 */
._title[data-v-df1486ce] {
    margin: 60px auto 40px;
    text-align: center;
}

._title ._titleTop[data-v-df1486ce],
._title ._titleTop div[data-v-df1486ce] {
    display: flex;
    align-items: center;
    justify-content: center;
}

._title ._titleTop div[data-v-df1486ce] {
    font-weight: 400;
    font-size: 32px;
    color: #3e2524;
    width: 50px;
    height: 50px;
    margin: 0 5px;
    background: url(../images/Ellipse1@2x.a5690b22.png) 0 no-repeat;
    background-size: 100% 100%;
}

._title ._titleBottom[data-v-df1486ce] {
    font-weight: 400;
    font-size: 20px;
    color: #d8c2ba;
    margin-top: 10px;
}

/* 第一部分：美食展示样式 */
.section1[data-v-df1486ce] {
    height: 675px;
    background: url(../images/Group2@2x.0b7d9b43.png) 0 no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    margin-top: 20px;
    position: relative;
    z-index: 1;
    padding: 20px 0 60px 0;
}

.section1List[data-v-df1486ce] {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    gap: 20px;
    align-items: center;
    height: 70%;
    padding-top: 40px;
}

.section1List ._img1[data-v-df1486ce] {
    width: 580px;
    height: 380px;
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
}

.section1List ._img1 img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    object-fit: cover;
}

.section1List ._img2Wrap[data-v-df1486ce] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 20px;
    flex: 1;
    height: 380px;
}

.section1List ._img2Wrap>div[data-v-df1486ce] {
    cursor: pointer;
    position: relative;
    width: 100%;
    height: 100%;
}

.section1List ._img2Wrap>div img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    object-fit: cover;
}

.section1List ._img2Wrap>div[data-v-df1486ce]:nth-of-type(2n) {
    margin-right: 0;
}

/* 遮罩和文字样式 */
.mask-1[data-v-df1486ce] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.text-tips[data-v-df1486ce],
.text-view[data-v-df1486ce] {
    position: absolute;
    left: 50%;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 16px;
    color: #fff;
}

.text-tips[data-v-df1486ce] {
    bottom: 20px;
    transform: translateX(-50%);
    padding: 0 10px;
    background: rgba(0,0,0,.2);
    border-radius: 20px;
    display: flex;
    display: inline-block;
    white-space: nowrap;
}

.text-view[data-v-df1486ce] {
    top: 50%;
    transform: translate(-50%,-50%);
    width: 118px;
    height: 28px;
    background: url(data:image/png;base64,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) 0 no-repeat;
    background-size: 100% 100%;
    display: none;
}

/* 悬停效果 */
._img1:hover .text-tips[data-v-df1486ce],
._img2Wrap>div:hover .text-tips[data-v-df1486ce] {
    display: none;
}

._img1:hover .text-view[data-v-df1486ce],
._img2Wrap>div:hover .text-view[data-v-df1486ce] {
    display: flex;
}

._img2Wrap>div:hover .mask-1[data-v-df1486ce] {
    background: rgba(0,0,0,.4);
}

._img1:hover .mask-1[data-v-df1486ce] {
    background: rgba(0,0,0,.4);
}

/* 第二部分：景点展示样式 */
.section2[data-v-df1486ce] {
    height: 600px;
    background: url(../images/Group3@2x.bdd09c0c.png) 0 no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    padding: 40px 0;
}

.section2List[data-v-df1486ce] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    flex-wrap: nowrap;
}

.section2List .section2Item[data-v-df1486ce] {
    width: 200px;
    height: 480px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.section2List .section2Item:hover[data-v-df1486ce] {
    transform: translateY(-10px);
}

.section2List .section2Item img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    border-top-right-radius: 500px;
    border-top-left-radius: 500px;
}

.section2List .section2Item[data-v-df1486ce]:last-child {
    margin-right: 0;
}

/* 第四部分：民宿展示样式（竖向列表格式） */
.section4[data-v-df1486ce] {
    background: #f8f9fa;
    padding: 60px 0;
    margin-top: 20px;
    position: relative;
    z-index: 1;
}

.s4List[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.s4Item[data-v-df1486ce] {
    display: flex;
    align-items: stretch;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-bottom: 20px;
    overflow: hidden;
    transition: all 0.3s ease;
    flex-direction: row;
    min-height: 200px;
}

.s4Item[data-v-df1486ce] a {
    display: flex;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

.s4Item:hover[data-v-df1486ce] {
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.s4Image[data-v-df1486ce] {
    width: 300px;
    height: 200px;
    flex-shrink: 0;
    overflow: hidden;
}

.s4Image img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.s4Item:hover .s4Image img[data-v-df1486ce] {
    transform: scale(1.05);
}

.s4Content[data-v-df1486ce] {
    flex: 1;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 200px;
}

.s4Title[data-v-df1486ce] {
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    line-height: 1.4;
}

.s4ContentRow[data-v-df1486ce] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    flex: 1;
}

.s4Desc[data-v-df1486ce] {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    flex: 1;
    margin-bottom: 0;
}

.s4Button[data-v-df1486ce] {
    font-size: 12px;
    padding: 6px 12px;
    flex-shrink: 0;
    background: #8B4513;
    color: white;
    border-radius: 15px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    outline: none;
    text-decoration: none;
    display: inline-block;
    white-space: nowrap;
}

.s4Button:hover[data-v-df1486ce] {
    background: #A0522D;
    transform: translateY(-1px);
    text-decoration: none;
    color: white;
}

/* 查看更多按钮样式 */
.view-moreWrap[data-v-df1486ce] {
    padding-top: 20px;
}

/* 乡味美食区域的查看更多按钮特殊样式 */
.section1 .view-moreWrap[data-v-df1486ce] {
    position: absolute;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

/* 乡居民宿区域的查看更多按钮特殊样式 */
.section4 .view-moreWrap[data-v-df1486ce] {
    padding-top: 30px;
    text-align: center;
}

/* 乡景景点区域的查看更多按钮特殊样式 */
.section2 .view-moreWrap[data-v-df1486ce] {
    padding-top: 30px;
    text-align: center;
}

.view-moreWrap .view-more[data-v-df1486ce],
.view-moreWrap[data-v-df1486ce] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.view-moreWrap .view-more[data-v-df1486ce] {
    cursor: pointer;
    width: 118px;
    height: 28px;
    font-weight: 400;
    font-size: 16px;
    color: #3e2524;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOwAAAA4CAYAAAD+fBQtAAAAAXNSR0IArs4c6QAADoxJREFUeF7tnX94VNWZx7/vnUlQxAdF1tWqLJi5ww/LilZ0/dUFdZd2W5g7gcUH11aou63dtbJ9tNpqyD13DAqt3aUq2m1VwFb7lC6ZGbDVWgrWimCLmFp+hLkTAyu6i2VX2LJAkpn7Xe8kk0JMwqTeeUzImb/yTM68930/536fc+8573mPoIyf5qQ6LQeZ7hkcHoaEyngpbVoT+FAJ5MEWoTSblv3Tcjoi5TC+p/6+Mw6HczXi8TYCRjmuoW1qAv2RgAC7CDxoWva/lsO/wAXbnFSj8yLrCYwG+QQNrAiHw7vL4by2qQn0FwL0WAkPEwl+leRkA1haZdm3Bu1f4IJ104k3QIzw6P312Lj6lZtUUyD4OEQCv1bQMLQ9TeCPJUDgUIXHH42Jq11u2rFBKENwf1XMvvuPtdnd7wIVUTalPkvICgHnRyz1oJtO/BD0zoTIC0E6rW1pAv2OAFlJyA2gPB6N19Zlks7zIrjsIPlnF8XV/qD8DViwiaQHTopa9phMMlFjiHdmxFK3BeWstqMJ9GcCO+rvOyNstG3KgTeFiUq0vxp+LmrZy4LyO1DBuilnB8DdpqU+4aadVwW8PhJT2aCc1XY0gf5OoCntzCc4sqUFiysq5V0R1Jkx2wnK70AFm0k5zRBuisbUnOxq9fnIDPWdoBzVdjSBgUCgcWXNmFBYRpnV9/7CTTmHIVg0IAQ7EOBqHzWBchLoF4Ld8xN17uFW/AMgfwPBMACVnUET5wuw3xNsFfLFinzFw6Nn3vOf5YSibWsC/YVAJlU7TxCeDeHogk/EOAHeJeR/IGzr+C4HyD4RLo/E7BV99b1Pj8SZemeeGFgC4mQItwHodvaLgrBQrvIXkUPkVH+qu6+O6faawEAhQFLclPOiiFwFIAPw7d59l7OAgpj7rI+SBeum1ARAfJFm6BlWtHrBjq5OvblSjWgdIp8hsJ857kQYLwjl5YhlXzNQ4Gs/NYG+EtiZVLcaIg9BoEKUdXnhNWGPK3obqJrWqBu8vDwKkf8+6HkXl7r0U7Jgs2nnJY84J09ODSMUgvAxgH7u5Of8AHc/c//pbbnWLYUMJ2CjadlXFBeQD5Knl+pQX2Hp9prAh03ATTmv+Q/ApmVf3JhM3BkSLgbQmgOnjrfUy0X/mterk3L/KxtAbDxI1pxqyEUk1gG0TUslSomjJMEWkvhF3hXwG1Ux+66mdOINI4TbDuT4y6IQs0llUSQpHj4fqba/6188k1RzRWSZUcHJVZ9Sm0txSLfRBAYaATft/E7IZyKWmuf7viOpRleIvAYwVfyuGNOOFV87wxh+0j0CDI1a9i1u0vktDe6PxtTVpcRdkmCz9eqjNOS3Ipibb+MrRhiPmpaaevQFiuIEOdWMq0Jmk5tOfA/0/u5ACMMuma4OleKQbqMJDDQCbiqxHuCEvPCicTH1tj/A5UWaPTIdjau5XeNxV6lzGZJf+glG2ZRa5kGm+H+XEnePguV6Fc7ulxoYuB6QPMgLehNsx1a6nRD4a09rAYmA/EsIHDNmq1Kc0W00gYFIIJNS1xmQ5wC8SXAtxJgM8sIQMON8y17TNabmH6uz2tpkY1GwhFiANAAcRuLZUNuhb1bNXnygOxbdCjZbr86kyLMQXAzwBUJGCzC6N8H6xrNpFSHxFCCXknxDRB4u1zajgdix2ucTl8DOZO0nBSFHBJOFcI0QFp8/w368u4i7EexcArtEuBWUTwNoygs/7o/WXX/frWDdtPPcey/G0+jxi9Fq9e1dz9Rd0ZbLbzieYE/c7tCRaQLBEehWsF7bhGh13Y6mpDPHEywn0PB0Ay9XSnlHX/l9gt2ZvPd2Q7wHILzdjKl/8Rs3J9WknMhrWrDBdZq2NHgJdBVs13dYN+l8EYJHPObvGBtPfLNHwfqbz3NiNIBsMOP2lGJDLdjBe3PpyIMncDzBtr9eOj8hcbkXav3o2OkL3yp6ccwIm0k53xbgC+wYnv1GTfUq6hlGNcD79QgbfOdpi4OPQHeTTh45b2xcpYo0iiszgDxpWrU3vU+wTWvUKM9DBsQPTUsVGmSTzgIKOhd0tWAH382lIw6eQHfvsP5VuqYqti+L8oYj0vKRibH79na0aXfITal/BGRpK3nRBXHVkKlXnxZD1kDkuRC4Nk88oAUbfOdpi4OPQLfLOsTdIrjPE3GjsdpLfSo7VyUmGyH+yk95LG7R63wkdlOJ7SRbo3F7UmF0TTnN/vQUD3Fy5ck4V086Db4bS0dcHgI9vcO6KeefADwM4rNm3P5e+0BaSMqYZFr26Z0jbKeSgVtNy17aWZtJMNffAqQnncrTcdrq4CTQ26STm3K2+WmL329glb+kk02rW0l5qJhBWBhhM2lnvhBLvBzHj52lGt104nmSZkPr1sjs2T/Ka8EOzhtLR10eAr0JNlPvfEUMfL0o0I46UftI1Ebj9r3tgk0lfiDgJ/xhtzG9+NQQj+wj+HS0I5lZC7Y8HaetDk4CvQm2Iw95nyd8KBpTXy48FqcTe0hvS9RSMwqC9QumkTglatnj3NXqL+DJRn+CqbgjXgt2cN5YOuryEDjeOqxfG03ABtNS8eJ7LMGzfX0WBJtNJV73wEr/i6ZUYqIHvq4FW57O0lY1gVIEa4DZiKX+6ijBjoha9oUdglXLSPmUGbfPLOy6MfBfAJaaMXW7/wM9wuqbTBMIjkCvj8Tr1Wm5A/IuhUs6H4lTie2At9ff0tr+SJxy7gKwCHmeZ85Ue/ypZIJjzeEcJVNVTgs2uM7SljSB3gS7M+3cZBDLDeK6qrj988LOOUP20uDC6AxVUxBsc2rBZTmEN1F4VzSmvu6udm6Gh8fCBqwxM+y0Fqy+yTSB4AgcZ1lnB4GTihvai4UhPOK6sXH750clTjhvAZIxrdqphSpw6cQbArC1leOGVmCCTpwIrsO0pcFNoCfBZtKJW4R8NGTg74t7abOrnbXMI2LG7ULp1D8ItuPELY+8zD91bmeqNm4gVA/B4/T4kl+bSacmDu4bTUcfDIHuUhONfP5GLxxeRo+/j8btqo65o9E5kWaS34nG1ReOEezbT6uRh4bKXlBSkXjtzI7lnsKxeUU3tWCD6TBtZXAT6Cn536864VclHd9RxzubSiwjODdHjil+d+z2uqRaLCK3AfyYaantPtamtLqEQIyUGi3YwX2j6eiDIdBt8r/I7Qc9r75YhbR9b7o0E1xeTGA6ZoQtiHONGpX3jO1C/Np/ly26pyedgukobUUTKDzqdinC1l3VxO5G1/cJtiDa1c5dnodFApkfsWof7HiW1iVi9L2mCQRE4HiCdZPOzRA8BsH9ZpcT3N9X02nz5n+rGL5n7/MAL4XHL5nV6omj0xV7qkscUCzajCZwwhPooeLENH+yN7sqcSVD3rOAvPNUA6PHLcLm08qm6s7zkH/RL20KSErAKIEJx3uH3fXcwrPbWnIL3juqYxopjUbI+25k+h/KXpzwPaEDHLQEdq9S57eGcQ8p1xiCbXmDd4ydrhq7A9LdpJNfbYIivwEZ6zr5dLSNHguJb1+18OyKcNud8GQGDDkV5J/0Jli/8HjTAXEJnCXABg+o8gWfJ788Lq6WDNqe1IGf8ATa63HLJkDCAm5uv/d5Brz8NLP63o1dAXRfSBzvABgBwdKDHpf0dBZVSUd1uKsXXAAvvNUXLMANJJablvKP1uv8FM/WMQzMqpphr3If/NIQjBrpOzvmtdatI/19tSd8z+kAByUBd7WzGh6uzJEf85df/LN1wiK/EeAHEcu+pSuUXasWnt0ayr3cXvnfedIDrv7AR3UcfZHGtPpIiPKWiCyQlsqHWNnSeNhru2ZidV3nkZOdKVQerx5brV7yf1/8Lp/jheNmqdcHZW/qoE94Av5hWPC4zoyr6/1g/T3lYR75DwqfMWPqM10BuKmEQ3ij/OWa7OrEZnqEadmXlAKqpBHWN9RRW+bPD5JVw4z8GDD0BAWN0Zia4/+/44Q7//zYYaD8uxmvvTmbTtxJcrEcbh0VmbPwzVIc0m00gYFGoH3/quzyl0IzqcQdhuBukqcfXZupGJObcn5N8B3DwzyIcR6FmwXylYhV+0ApcZcs2GzazzEOrQPk1TC9Wd0dVttxzN4iCnb4B9rmRdYTOGJa9vhSnNFtNIGBSCCTdBIiWAAPNzKEkUJelcvJY+Nn2T/tKR43qaZA5Cn658jmQ1MmzKzZXUrsJQvWN1YcMUG0QWQDBHuEXu7oC1GwH5BThPhbAjBybZdWzapzS3FGt9EEBiKB9qdLYzPAKhDPwsArfhxCFhL2j9WHEfaPpgRxMYjdR9B27cR4XVOpcfdJsL5RfxQNiWELvEmEnFaYDYNUdFzwJAI5Q7CPwCs5j/9czIEs1SHdThMYiATeXKlGtAyRRSSuAFBI3n9vj3lBDwLkiEJRiMLHEPyOlNRBeo/0NBvcE4M+C7Y3mP6zPISbiu+1AxG89lkTCIrAe4Uh/LOSFxWLgAdht2yCdVPONNPq+Rk+COe1DU2gvxEoJO23Yag5W20fEII1yC2RuJrpppzsEWm5sngmSH8Dq/3RBMpBoCntzM+T55rD8TX3gBwWQV3/HWHTiXohp/r1jd20owAONztqq5YDjrapCfQnAttWqhFDKuXVkME5rXl4hsgrAt4UsdSTQfkZ6CNxY9K5OeTvMgjhxnCOP86J/AxghsTPgnJY29EE+iMBgZwsglsoqPdH1J62x31Q3wMV7LaVqrJyiGwBcY4X4uV+8nMmpW4wiPEUhD+os/r3mkB/JSBEjiFjrTmj9hdu0lEQ2AAWm5b91SB9DlSwvmONK2vGGJUV6wT8UxF5xPP4/bY2ZIf+H45Zrw0yCG1LE/iwCRw6BadVVmCciFFD8FoA6yOx2mtFxE9HCOwTuGB9zwprtRAlgs6TowPzWBvSBPo1Af5eBN/a0rJNlWPDS1kEW+TZvmvBuA7Cc/o1Y+2cJvABCZDIiSHuwbz3fF+TIfpy6f8H0bA2sWo0BYcAAAAASUVORK5CYII=) 0 no-repeat;
    background-size: 100% 100%;
}

/* 添加一些基础样式来改善整体布局 */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* 改善图片显示效果 */
img {
    max-width: 100%;
    height: auto;
}

/* 添加一些间距和布局优化 */
.section1[data-v-df1486ce],
.section2[data-v-df1486ce],
.section4[data-v-df1486ce] {
    padding: 40px 0;
}

.section1List[data-v-df1486ce],
.section2List[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 改善文字显示效果 */
.text-tips[data-v-df1486ce] {
    font-size: 14px;
    font-weight: 500;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}

/* 手机端响应式设计 */
@media (max-width: 768px) {
    /* 手机端通用样式 */
    .container {
        padding: 0 15px;
    }
    
    /* 标题区域手机端样式 */
    ._title[data-v-df1486ce] {
        margin: 30px 0 20px 0;
    }
    
    ._title ._titleTop[data-v-df1486ce] {
        font-size: 24px;
        margin-bottom: 8px;
    }
    
    ._title ._titleBottom[data-v-df1486ce] {
        font-size: 12px;
    }
    
    /* 美食区域手机端列表样式 */
    .section1List[data-v-df1486ce] {
        flex-direction: column;
        gap: 15px;
    }

    .section1List ._img1[data-v-df1486ce] {
        width: 100%;
        height: 200px;
        margin-bottom: 0;
    }

    .section1List ._img2Wrap[data-v-df1486ce] {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .section1List ._img2Wrap>div[data-v-df1486ce] {
        width: 100%;
        height: 150px;
        margin-bottom: 0;
    }

    .section1List ._img2Wrap>div[data-v-df1486ce]:nth-of-type(2n) {
        margin-left: 0;
    }
    
    /* 景点区域手机端列表样式 */
    .section2List[data-v-df1486ce] {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    
    .section2List .section2Item[data-v-df1486ce] {
        width: 100%;
        margin-bottom: 0;
        height: 200px;
    }
    
    /* 民宿区域手机端列表样式 */
    .s4List[data-v-df1486ce] {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    
    .s4Item[data-v-df1486ce] {
        width: 100%;
        margin-bottom: 15px;
        flex-direction: row;
        height: auto;
        min-height: 150px;
    }
    
    .s4Image[data-v-df1486ce] {
        width: 120px;
        height: 150px;
        flex-shrink: 0;
    }
    
    .s4Image img[data-v-df1486ce] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    
    .s4Content[data-v-df1486ce] {
        flex: 1;
        padding: 15px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        min-height: 150px;
    }
    
    .s4Title[data-v-df1486ce] {
        font-size: 16px;
        margin-bottom: 8px;
    }
    
    .s4ContentRow[data-v-df1486ce] {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        flex: 1;
    }
    
    .s4Desc[data-v-df1486ce] {
        font-size: 12px;
        margin-bottom: 0;
    }
    
    .s4Button[data-v-df1486ce] {
        font-size: 12px;
        padding: 6px 12px;
        flex-shrink: 0;
        background: #8B4513;
        color: white;
        border-radius: 15px;
        cursor: pointer;
        transition: all 0.3s ease;
        border: none;
        outline: none;
        text-decoration: none;
        display: inline-block;
        white-space: nowrap;
    }
    
    /* 特产区域手机端列表样式 */
    .s5List[data-v-df1486ce] {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    
    .s5Item[data-v-df1486ce] {
        width: 100%;
        margin-bottom: 0;
        flex-direction: row;
        height: auto;
        min-height: 120px;
    }
    
    .s5Image[data-v-df1486ce] {
        width: 120px;
        height: 120px;
        flex-shrink: 0;
    }
    
    .s5Image img[data-v-df1486ce] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    
    .s5Content[data-v-df1486ce] {
        flex: 1;
        padding: 15px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
    .s5Title[data-v-df1486ce] {
        font-size: 16px;
        margin-bottom: 8px;
    }
    
    .s5Desc[data-v-df1486ce] {
        font-size: 12px;
    }
    
    /* 乡镇区域手机端列表样式 */
    ._s5Box[data-v-df1486ce] {
        flex-direction: column;
        gap: 20px;
    }
    
    ._s5Left[data-v-df1486ce] {
        width: 100%;
        height: 200px;
    }
    
    ._s5Right[data-v-df1486ce] {
        width: 100%;
    }
    
    .s6Item[data-v-df1486ce] {
        width: 100%;
        margin-bottom: 15px;
        flex-direction: row;
        height: auto;
        min-height: 80px;
    }
    
    .s6Content[data-v-df1486ce] {
        flex: 1;
        padding: 10px 15px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    
    .s6Title[data-v-df1486ce] {
        font-size: 14px;
        margin-bottom: 5px;
    }
    
    .s6Desc[data-v-df1486ce] {
        font-size: 12px;
    }
    
    /* 查看更多按钮手机端样式 */
    .view-moreWrap[data-v-df1486ce] {
        margin-top: 20px;
        margin-bottom: 30px;
    }
    
    .view-more[data-v-df1486ce] {
        padding: 10px 20px;
        font-size: 14px;
    }
    
    /* 导航栏手机端样式 */
    .navbar {
        padding: 0 10px;
    }
    
    .navbar-nav .nav-link {
        font-size: 12px;
        padding: 6px 8px !important;
        width: auto;
        height: auto;
    }
    
    .main-title {
        font-size: 12px;
        margin: 0 10px !important;
    }
    
    /* Banner区域手机端样式 */
    .header[data-v-df1486ce] {
        height: 300px;
    }
    
    .banner-container[data-v-df1486ce] {
        height: 300px;
    }
    
    .banner-container .bannerItem[data-v-df1486ce] {
        height: 300px;
    }
    
    .banner-container .bannerItem[data-v-df1486ce] img {
        height: 300px;
    }
    
    /* 隐藏鼠标指针动画 */
    .mouse-pointer[data-v-df1486ce] {
        display: none;
    }
    
    /* 隐藏Banner导航 */
    .banner-nav[data-v-df1486ce] {
        display: none;
    }
}

/* Logo样式 */
.navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: bold;
    font-size: 1.2rem;
}

.navbar-logo {
    height: 80px;
    width: auto;
    border-radius: 8px;
}

/* Logo文字渐变效果 */
.logo-text {
    background: linear-gradient(45deg, #007bff, #e83e8c, #ffc107, #28a745);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: gradient 3s ease infinite;
    font-weight: bold;
    font-size: 1.8rem;
}

@keyframes gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 中间标题 */
.main-title {
    font-size: 2rem;
    font-weight: bold;
    color: white !important;
    text-align: center;
    margin: 0 10px;
}

/* 中间Logo样式 */
.navbar-center-logo {
    height: 35px;
    width: auto;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.navbar-center-logo:hover {
    transform: scale(1.05);
}

/* 导航按钮样式 */
.nav-btn {
    padding: 8px 8px !important;
    margin: 0;
    transition: all 0.3s ease;
    position: relative;
}

.nav-btn:hover {
    transform: translateY(-1px);
}



/* 英雄区域样式 */
.hero-section {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
}

.hero-content {
    color: white;
    z-index: 2;
    position: relative;
}

.hero-logo {
    margin-bottom: 2rem;
    text-align: center;
}

.hero-logo-img {
    height: 100px;
    width: auto;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.4);
    background: rgba(255,255,255,0.15);
    padding: 15px;
}

.hero-title {
    font-size: 3.5rem;
    font-weight: bold;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.hero-subtitle {
    font-size: 1.2rem;
    margin-bottom: 2rem;
    opacity: 0.9;
}

.hero-buttons {
    margin-top: 2rem;
}

.hero-image {
    text-align: center;
}

/* 特色服务样式 */
.features-section {
    background: #f8f9fa;
}

.section-title {
    font-size: 2.5rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 1rem;
}

.section-subtitle {
    font-size: 1.1rem;
    color: #666;
    margin-bottom: 3rem;
}

.feature-card {
    background: white;
    border-radius: 15px;
    padding: 2rem;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
}

.feature-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

.feature-icon {
    margin-bottom: 1.5rem;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-icon img {
    max-height: 100%;
    max-width: 100%;
}

.feature-card h5 {
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 1rem;
    color: #333;
}

.feature-card p {
    color: #666;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.feature-link {
    color: #007bff;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
}

.feature-link:hover {
    color: #0056b3;
}

/* 统计数据样式 */
.stats-section {
    background: linear-gradient(135deg, #007bff, #0056b3);
}

.stat-item {
    text-align: center;
    padding: 2rem 1rem;
}

.stat-number {
    font-size: 3rem;
    font-weight: bold;
    color: white;
    margin-bottom: 0.5rem;
}

.stat-label {
    font-size: 1.1rem;
    color: rgba(255,255,255,0.9);
}

/* 内容区域样式 */
.content-section {
    background: white;
}

.content-block {
    margin-bottom: 4rem;
}

.content-card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
}

.content-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

.content-card .card-img-top {
    height: 200px;
    object-fit: cover;
}

.content-card .card-body {
    padding: 1.5rem;
}

.content-card .card-title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.content-card .card-text {
    color: #666;
    margin-bottom: 1rem;
}

/* 页脚Logo样式 */
.footer-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-logo-img {
    height: 70px;
    width: auto;
    border-radius: 8px;
}

.footer-logo-text {
    color: white;
    font-weight: bold;
    font-size: 1.2rem;
}

/* 联系我们样式 */
.contact-section {
    background: #f8f9fa;
}

.contact-section h2 {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

.contact-section .lead {
    font-size: 1.1rem;
    color: #666;
    margin-bottom: 3rem;
}

.contact-section i {
    color: #007bff;
}

.contact-section h5 {
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.contact-section p {
    color: #666;
}

/* 卡片样式 */
.card {
    border: none;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

.card-img-top {
    height: 200px;
    object-fit: cover;
}

/* 按钮样式 */
.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background-color: #0056b3;
    border-color: #0056b3;
    transform: translateY(-2px);
}

/* 服务图标样式 */
.service-icon {
    font-size: 3rem;
    color: #007bff;
    margin-bottom: 1rem;
}

/* 统计数据样式 */
.statistics-item {
    text-align: center;
    padding: 2rem 1rem;
}

.statistics-number {
    font-size: 2.5rem;
    font-weight: bold;
    color: #007bff;
}

.statistics-label {
    font-size: 1.1rem;
    color: #666;
    margin-top: 0.5rem;
}

/* 客户评价样式 */
.testimonial-card {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 2rem;
    margin: 1rem 0;
}

.testimonial-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

/* 产品展示样式 */
.product-card {
    margin-bottom: 2rem;
}

.product-price {
    font-size: 1.2rem;
    font-weight: bold;
    color: #e74c3c;
}

.product-category {
    color: #666;
    font-size: 0.9rem;
}

/* 新闻列表样式 */
.news-item {
    border-bottom: 1px solid #eee;
    padding: 1rem 0;
}

.news-date {
    color: #999;
    font-size: 0.9rem;
}

.news-summary {
    color: #666;
    line-height: 1.6;
}

/* 联系表单样式 */
.contact-form {
    background: #f8f9fa;
    padding: 2rem;
    border-radius: 10px;
}

.form-control:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* 页脚样式 */
footer {
    margin-top: auto;
}

.social-links a {
    font-size: 1.5rem;
    transition: color 0.3s ease;
}

.social-links a:hover {
    color: #007bff !important;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .carousel-item {
        height: 300px;
    }
    
    .statistics-number {
        font-size: 2rem;
    }
    
    .service-icon {
        font-size: 2rem;
    }
}

/* 动画效果 */
.fade-in {
    animation: fadeIn 1s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 加载动画 */
.loading {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 工具提示样式 */
.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

/* 返回顶部按钮 */
.back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background-color: #007bff;
    color: white;
    border-radius: 50%;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1000;
}

.back-to-top.show {
    opacity: 1;
}

.back-to-top:hover {
    background-color: #0056b3;
    color: white;
}

/* 第三部分：特色介绍样式 */
.section3[data-v-df1486ce] {
    height: 745px;
    background: url(../images/Group4@2x.f4460f09.png) 0 no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
}

._s3[data-v-df1486ce] {
    display: flex;
    align-items: center;
    height: 100%;
}

._img_202[data-v-df1486ce] {
    position: relative;
    cursor: pointer;
    flex: 1;
}

._img_202[data-v-df1486ce] img {
    width: 100%;
    height: auto;
}

._s3Right[data-v-df1486ce] {
    flex: 1;
    padding: 20px;
}

._s3RightList[data-v-df1486ce] {
    display: flex;
    gap: 20px;
}

._s3RightList[data-v-df1486ce] img {
    width: 50%;
    height: auto;
    border-radius: 10px;
}

/* 第五部分：新闻资讯样式 */
.section5[data-v-df1486ce] {
    height: 745px;
    overflow: hidden;
}

._s5Box[data-v-df1486ce] {
    display: flex;
    height: 100%;
}

._s5Box ._s5Left[data-v-df1486ce] {
    width: 580px;
    height: 380px;
    position: relative;
    cursor: pointer;
}

._s5Box ._s5Left img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
}

._s5Box ._s5Left ._title_103[data-v-df1486ce] {
    width: 100%;
    height: 44px;
    background: rgba(0,0,0,.4);
    position: absolute;
    bottom: 0;
    font-weight: 700;
    font-size: 20px;
    color: #fff;
    display: flex;
    align-items: center;
    padding-left: 15px;
    box-sizing: border-box;
}

._s5Right[data-v-df1486ce] {
    flex: 1;
    width: 620px;
}

._s5RightItem[data-v-df1486ce] {
    border-bottom: 1px dashed #d8c2ba;
    padding-bottom: 15px;
    margin: 15px 20px 20px;
    cursor: pointer;
    width: 100%;
}

._s5RightItem ._s5RightTitle[data-v-df1486ce] {
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size: 20px;
    color: #3e2524;
    height: 30px;
}

._s5RightItem ._s5RightTitle img[data-v-df1486ce] {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

._s5RightItem ._title_104[data-v-df1486ce] {
    font-weight: 500;
    font-size: 16px;
    color: #3e2524;
    margin-top: 10px;
}

._s5RightItem[data-v-df1486ce]:last-child {
    border: none;
}

/* 添加一些动画效果 */
.section1List ._img1[data-v-df1486ce]:hover,
.section1List ._img2Wrap>div[data-v-df1486ce]:hover,
.section2List .section2Item[data-v-df1486ce]:hover,
.s4Item[data-v-df1486ce]:hover {
    transform: translateY(-5px);
    transition: transform 0.3s ease;
}

/* 改善文字显示效果 */
.text-tips[data-v-df1486ce] {
    font-size: 14px;
    font-weight: 500;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
    transition: opacity 0.3s ease;
}

/* 添加一些间距和布局优化 */
.section1[data-v-df1486ce],
.section2[data-v-df1486ce],
.section3[data-v-df1486ce],
.section4[data-v-df1486ce],
.section5[data-v-df1486ce] {
    padding: 40px 0;
}

.section1List[data-v-df1486ce],
.section2List[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

._s3[data-v-df1486ce],
._s5Box[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
} 

/* 简洁的导航链接样式 */
 

/* 第五部分：乡礼特产展示样式 */
.section5[data-v-df1486ce] {
    height: 600px;
    background: url(../images/Group4@2x.f4460f09.png) 0 no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    padding: 40px 0;
}

.s5List[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    height: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.s5List .s5Item[data-v-df1486ce] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 250px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.s5List .s5Item:hover[data-v-df1486ce] {
    transform: translateY(-5px);
}

.s5Image[data-v-df1486ce] {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.s5Image img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.s5Content[data-v-df1486ce] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.s5Title[data-v-df1486ce] {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    line-height: 1.4;
}

.s5Desc[data-v-df1486ce] {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    text-align: center;
} 

/* 第六部分：乡村乡镇展示样式 */
.section6[data-v-df1486ce] {
    height: 600px;
    overflow: hidden;
    padding: 40px 0;
}

.s6List[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 60px;
}

.s6Left[data-v-df1486ce] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.s6Image[data-v-df1486ce] {
    width: 100%;
    height: 500px;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.s6Image img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.s6Caption[data-v-df1486ce] {
    font-size: 16px;
    color: #333;
    text-align: center;
    font-weight: 500;
}

.s6Right[data-v-df1486ce] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.s6Item[data-v-df1486ce] {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    padding: 8px;
    border-radius: 8px;
    transition: all 0.3s ease;
    background: rgba(255,255,255,0.1);
}

.s6Item:hover[data-v-df1486ce] {
    background: rgba(255,255,255,0.2);
    transform: translateX(10px);
}

.s6Arrow[data-v-df1486ce] {
    font-size: 18px;
    color: #8B4513;
    margin-right: 15px;
    font-weight: bold;
    margin-top: 2px;
}

.s6Content[data-v-df1486ce] {
    flex: 1;
}

.s6Title[data-v-df1486ce] {
    font-size: 15px;
    font-weight: bold;
    color: #333;
    margin-bottom: 4px;
    line-height: 1.2;
}

.s6Desc[data-v-df1486ce] {
    font-size: 12px;
    color: #666;
    line-height: 1.4;
} 

/* 第五部分：乡村乡镇展示样式 */
.section5[data-v-df1486ce] {
    height: 600px;
    overflow: hidden;
    padding: 40px 0;
}

._s5Box[data-v-df1486ce] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 60px;
}

._s5Left[data-v-df1486ce] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.s6Image[data-v-df1486ce] {
    width: 100%;
    height: 400px; /* 从500px减少到400px，避免压住按钮 */
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.s6Image img[data-v-df1486ce] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.s6Caption[data-v-df1486ce] {
    font-size: 16px;
    color: #333;
    text-align: center;
    font-weight: 500;
}

._s5Right[data-v-df1486ce] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.s6Item[data-v-df1486ce] {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    padding: 8px;
    border-radius: 8px;
    transition: all 0.3s ease;
    background: rgba(255,255,255,0.1);
}

.s6Item:hover[data-v-df1486ce] {
    background: rgba(255,255,255,0.2);
    transform: translateX(10px);
}

.s6Arrow[data-v-df1486ce] {
    font-size: 18px;
    color: #8B4513;
    margin-right: 15px;
    font-weight: bold;
    margin-top: 2px;
}

.s6Content[data-v-df1486ce] {
    flex: 1;
}

.s6Title[data-v-df1486ce] {
    font-size: 15px;
    font-weight: bold;
    color: #333;
    margin-bottom: 4px;
    line-height: 1.2;
}

.s6Desc[data-v-df1486ce] {
    font-size: 12px;
    color: #666;
    line-height: 1.4;
} 

/* 下方内容区域样式 */
.bottom-content {
    background-color: #fff;
    min-height: calc(100vh - 300px);
    max-width: 1200px;
    margin: -100px auto 0 auto;
    border-radius: 10px 10px 0 0;
    padding: 20px;
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.1);
}

/* 左侧边框区域样式 */
.left-border {
    background-color: #fff;
    padding: 30px 20px;
    border-right: 2px solid #e9ecef;
    min-height: calc(100vh - 300px);
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: relative;
}

.left-border::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    height: 20px;
    background-color: #fff;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.border-content {
    position: sticky;
    top: 20px;
}

/* 美食列表页面样式 */
.filter-section {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 30px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}



.pagination-section {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

/* 查看更多按钮链接样式 */
.view-more a {
    display: flex;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    justify-content: center;
    align-items: center;
}

.view-more a:hover {
    color: #ffc107;
    transform: translateY(-2px);
}

/* 食物列表容器样式 */
.food-list-container {
    margin-top: 30px;
}

/* 食物列表项目样式 - 改为水平布局 */
.food-list-item {
    display: flex;
    background-color: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    margin-bottom: 25px;
    height: 200px; /* 固定高度 */
}

.food-list-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/* 左侧图片区域 - 固定尺寸 */
.food-list-image {
    position: relative;
    width: 250px; /* 固定宽度 */
    height: 200px; /* 固定高度 */
    flex-shrink: 0; /* 防止收缩 */
    overflow: hidden;
}

.food-list-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.food-list-item:hover .food-list-image img {
    transform: scale(1.05);
}

/* 右侧内容区域 */
.food-list-content {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}

.food-list-title {
    font-size: 1.25rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    line-height: 1.3;
}

.food-list-desc {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

.food-list-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    flex-wrap: wrap;
    gap: 10px;
}

.food-price {
    color: #e74c3c;
    font-weight: bold;
    font-size: 1.1rem;
}

.food-rating {
    color: #f39c12;
    font-size: 14px;
}

.food-location {
    color: #7f8c8d;
    font-size: 12px;
    background-color: #ecf0f1;
    padding: 2px 8px;
    border-radius: 12px;
}

.food-list-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 15px;
}

.food-list-tags .tag {
    background-color: #e8f5e8;
    color: #27ae60;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

/* 右下角查看详情按钮 */
.food-list-button {
    position: absolute;
    bottom: 20px;
    right: 20px;
}

.food-list-button .btn {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.food-list-button .btn:hover {
    background-color: #0056b3;
    border-color: #0056b3;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3);
}

/* 列表页面手机端响应式设计 */
@media (max-width: 768px) {
    /* 列表页面手机端通用样式 */
    .container-fluid {
        padding: 0 15px;
    }
    
    .main-content-centered {
        padding: 0;
    }
    
    /* 页面标题手机端样式 */
    .page-header {
        margin-bottom: 15px;
    }
    
    .page-title {
        font-size: 20px;
        margin-bottom: 8px;
    }
    
    .breadcrumb-text {
        font-size: 11px;
    }
    
    /* 筛选区域手机端样式 */
    .filter-section {
        margin-bottom: 15px;
    }
    
    .filter-section .row {
        margin: 0;
    }
    
    .filter-section .col-md-3 {
        margin-bottom: 8px;
        padding: 0 3px;
    }
    
    .form-select {
        font-size: 12px;
        padding: 6px 10px;
    }
    
    .btn-primary {
        font-size: 12px;
        padding: 6px 12px;
    }
    
    /* 美食列表手机端样式 */
    .food-list-item {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 15px !important;
    }

    .food-list-image {
        width: 100% !important;
        height: 180px !important;
    }

    .food-list-content {
        padding: 12px !important;
    }
    
    .food-list-title {
        font-size: 16px !important;
        margin-bottom: 6px !important;
        line-height: 1.3 !important;
    }
    
    .food-list-desc {
        font-size: 12px !important;
        margin-bottom: 8px !important;
        line-height: 1.4 !important;
    }
    
    .food-list-info {
        margin-bottom: 8px !important;
    }
    
    .food-price {
        font-size: 14px !important;
    }
    
    .food-location {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    
    .food-list-tags {
        margin-bottom: 8px !important;
    }
    
    .food-list-tags .tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .food-list-button {
        position: static !important;
        margin-top: 8px !important;
        text-align: center !important;
    }
    
    .food-list-button .btn {
        width: 100% !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* 民宿列表手机端样式 */
    .homestay-list-item {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 15px !important;
    }

    .homestay-list-image {
        width: 100% !important;
        height: 180px !important;
    }

    .homestay-list-content {
        padding: 12px !important;
    }
    
    .homestay-list-title {
        font-size: 16px !important;
        margin-bottom: 6px !important;
        line-height: 1.3 !important;
    }
    
    .homestay-list-desc {
        font-size: 12px !important;
        margin-bottom: 8px !important;
        line-height: 1.4 !important;
    }
    
    .homestay-list-info {
        margin-bottom: 8px !important;
    }
    
    .homestay-price {
        font-size: 14px !important;
    }
    
    .homestay-location {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    
    .homestay-list-tags {
        margin-bottom: 8px !important;
    }
    
    .homestay-list-tags .tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .homestay-list-button {
        position: static !important;
        margin-top: 8px !important;
        text-align: center !important;
    }
    
    .homestay-list-button .btn {
        width: 100% !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* 景点列表手机端样式 */
    .scenic-list-item {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 15px !important;
    }

    .scenic-list-image {
        width: 100% !important;
        height: 180px !important;
    }

    .scenic-list-content {
        padding: 12px !important;
    }
    
    .scenic-list-title {
        font-size: 16px !important;
        margin-bottom: 6px !important;
        line-height: 1.3 !important;
    }
    
    .scenic-list-desc {
        font-size: 12px !important;
        margin-bottom: 8px !important;
        line-height: 1.4 !important;
    }
    
    .scenic-list-info {
        margin-bottom: 8px !important;
    }
    
    .scenic-price {
        font-size: 14px !important;
    }
    
    .scenic-location {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    
    .scenic-list-tags {
        margin-bottom: 8px !important;
    }
    
    .scenic-list-tags .tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .scenic-list-button {
        position: static !important;
        margin-top: 8px !important;
        text-align: center !important;
    }
    
    .scenic-list-button .btn {
        width: 100% !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* 特产列表手机端样式 */
    .specialty-list-item {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 15px !important;
    }

    .specialty-list-image {
        width: 100% !important;
        height: 180px !important;
    }

    .specialty-list-content {
        padding: 12px !important;
    }
    
    .specialty-list-title {
        font-size: 16px !important;
        margin-bottom: 6px !important;
        line-height: 1.3 !important;
    }
    
    .specialty-list-desc {
        font-size: 12px !important;
        margin-bottom: 8px !important;
        line-height: 1.4 !important;
    }
    
    .specialty-list-info {
        margin-bottom: 8px !important;
    }
    
    .specialty-price {
        font-size: 14px !important;
    }
    
    .specialty-location {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    
    .specialty-list-tags {
        margin-bottom: 8px !important;
    }
    
    .specialty-list-tags .tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .specialty-list-button {
        position: static !important;
        margin-top: 8px !important;
        text-align: center !important;
    }
    
    .specialty-list-button .btn {
        width: 100% !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* 乡镇列表手机端样式 */
    .village-list-item {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 15px !important;
    }

    .village-list-image {
        width: 100% !important;
        height: 180px !important;
    }

    .village-list-content {
        padding: 12px !important;
    }
    
    .village-list-title {
        font-size: 16px !important;
        margin-bottom: 6px !important;
        line-height: 1.3 !important;
    }
    
    .village-list-desc {
        font-size: 12px !important;
        margin-bottom: 8px !important;
        line-height: 1.4 !important;
    }
    
    .village-list-info {
        margin-bottom: 8px !important;
    }
    
    .village-population {
        font-size: 14px !important;
    }
    
    .village-location {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    
    .village-list-tags {
        margin-bottom: 8px !important;
    }
    
    .village-list-tags .tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .village-list-button {
        position: static !important;
        margin-top: 8px !important;
        text-align: center !important;
    }
    
    .village-list-button .btn {
        width: 100% !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* 分页手机端样式 */
    .pagination-section {
        margin-top: 20px;
    }
    
    .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .page-link {
        padding: 8px 12px;
        font-size: 14px;
    }
    
    /* 顶部背景区域手机端样式 */
    .top-banner {
        height: 150px;
    }
    
    .banner-background {
        height: 150px;
    }
    
    .banner-image {
        height: 150px;
    }
}

/* 强制覆盖其他样式的食物列表布局 */
.food-list-container .food-list-item {
    display: flex !important;
    background-color: #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s ease !important;
    margin-bottom: 25px !important;
    height: 200px !important;
    flex-direction: row !important;
}

.food-list-container .food-list-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
}

.food-list-container .food-list-image {
    position: relative !important;
    width: 250px !important;
    height: 200px !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
    display: block !important;
}

.food-list-container .food-list-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.food-list-container .food-list-item:hover .food-list-image img {
    transform: scale(1.05) !important;
}

.food-list-container .food-list-content {
    flex: 1 !important;
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
}

.food-list-container .food-list-title {
    font-size: 1.25rem !important;
    font-weight: bold !important;
    color: #333 !important;
    margin-bottom: 10px !important;
    line-height: 1.3 !important;
}

.food-list-container .food-list-desc {
    color: #666 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 15px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    flex: 1 !important;
}

.food-list-container .food-list-info {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 15px !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.food-list-container .food-price {
    color: #e74c3c !important;
    font-weight: bold !important;
    font-size: 1.1rem !important;
}

.food-list-container .food-rating {
    color: #f39c12 !important;
    font-size: 14px !important;
}

.food-list-container .food-location {
    color: #7f8c8d !important;
    font-size: 12px !important;
    background-color: #ecf0f1 !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
}

.food-list-container .food-list-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    margin-bottom: 15px !important;
}

.food-list-container .food-list-tags .tag {
    background-color: #e8f5e8 !important;
    color: #27ae60 !important;
    padding: 4px 8px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.food-list-container .food-list-button {
    position: absolute !important;
    bottom: 20px !important;
    right: 20px !important;
}

.food-list-container .food-list-button .btn {
    background-color: #007bff !important;
    border-color: #007bff !important;
    color: white !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.food-list-container .food-list-button .btn:hover {
    background-color: #0056b3 !important;
    border-color: #0056b3 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3) !important;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .food-list-container .food-list-item {
        flex-direction: column !important;
        height: auto !important;
    }
    
    .food-list-container .food-list-image {
        width: 100% !important;
        height: 200px !important;
    }
    
    .food-list-container .food-list-content {
        padding: 15px !important;
    }
    
    .food-list-container .food-list-button {
        position: static !important;
        margin-top: 15px !important;
        text-align: center !important;
    }
}

/* 中间logo居中 */
.navbar-brand.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 备用方法：使用Flexbox + 绝对定位 */
.navbar-flex-layout {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navbar-brand-absolute {
    position: absolute;
    left: 80px;
    z-index: 10;
}

.navbar-nav-center {
    flex: 1;
    display: flex;
    justify-content: center;
}

.navbar-nav-right {
    margin-left: auto;
}

/* 方法3：使用CSS Transform（最不影响其他元素） */
.navbar-brand-transform {
    transform: translateX(80px);
    transition: transform 0.3s ease;
}

.navbar-brand-transform:hover {
    transform: translateX(80px) scale(1.05);
}

/* 中间标题链接样式 */
.main-title {
    text-decoration: none;
    transition: all 0.3s ease;
}

.main-title:hover {
    transform: scale(1.02);
    text-decoration: none;
}

/* Banner轮播样式 */
.banner-container[data-v-df1486ce] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
    max-width: none;
}

.banner-container .bannerItem[data-v-df1486ce] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
    z-index: 1;
}

.banner-container .bannerItem[data-v-df1486ce].active {
    opacity: 1;
    z-index: 2;
}

.banner-container .bannerItem[data-v-df1486ce] img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    /* animation: scale-df1486ce 10s infinite alternate; */
}

/* Banner指示器 */
.banner-indicators {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 10px;
}

.banner-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
}

.banner-indicator.active {
    background-color: #fff;
    transform: scale(1.2);
}

/* Banner控制按钮 */
.banner-controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}

.banner-control {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.3);
    color: white;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.banner-control:hover {
    background-color: rgba(0, 0, 0, 0.6);
    transform: scale(1.1);
}


/* 鼠标指针图形样式 */
.mouse-pointer {
    position: absolute;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    animation: mouseFloat 3s ease-in-out infinite;
}

.mouse-body {
    width: 24px;
    height: 36px;
    border: 2px solid #FFFFFF;
    border-radius: 12px;
    background: transparent;
    position: relative;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.6);
}

.mouse-scroll {
    width: 4px;
    height: 8px;
    background: #FFFFFF;
    border-radius: 2px;
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    animation: scrollMove 2s ease-in-out infinite;
}

/* 鼠标浮动动画 */
@keyframes mouseFloat {
    0%, 100% {
        transform: translateX(-50%) translateY(0);
    }
    50% {
        transform: translateX(-50%) translateY(-10px);
    }
}

/* 鼠标滚轮动画 */
@keyframes scrollMove {
    0%, 100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    50% {
        opacity: 0.3;
        transform: translateX(-50%) translateY(4px);
    }
}

/* 鼠标箭头样式 */
.mouse-arrows {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    margin-top: 8px;
}

.arrow-down {
    width: 12px;
    height: 14px;
    margin: 10px auto 0;
    background: url(../images/banArrow.png) center top no-repeat;
    background-size: contain;
    opacity: 0;
    animation: arrowFade 2s ease-in-out infinite;
    box-shadow: 0 0 4px rgba(255, 255, 255, 0.8);
    position: relative;
}



/* 箭头淡入淡出动画 */
@keyframes arrowFade {
    0%, 100% {
        opacity: 0;
        transform: translateY(0);
    }
    25%, 75% {
        opacity: 1;
        transform: translateY(2px);
    }
    50% {
        opacity: 0.7;
        transform: translateY(4px);
    }
}

/* Banner右侧导航样式 */
.banner-nav {
    position: absolute;
    z-index: 33;
    right: 20px;
    bottom: 70px;
    height: 145px !important;
    display: none;
}

@media (min-width: 1200px) {
    .banner-nav {
        display: block;
    }
}

.banner-nav .swiper-wrapper {
    height: 100%;
}

.banner-nav .swiper-slide {
    height: 36.25px !important;
    display: flex;
    align-items: center;
}

.banner-nav .item {
    width: 100%;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 4px;
    margin-bottom: 2px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.banner-nav .item:hover {
    background: rgba(0, 0, 0, 0.8);
}

.banner-nav .txt {
    color: #FFFFFF;
    font-size: 12px;
    line-height: 1.4;
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.banner-nav .line {
    height: 1px;
    background: rgba(255, 255, 255, 0.3);
    width: 100%;
}

.banner-nav .swiper-slide-active .item {
    background: rgba(255, 255, 255, 0.2);
    border-left: 3px solid #FFFFFF;
}

.banner-nav .swiper-slide-active .txt {
    color: #FFFFFF;
    font-weight: bold;
}