/* =========================================
   移动端基础重置与自动适配初始化 (750px设计稿标准)
   ========================================= */

/* 1. 核心适配逻辑：1rem = 100px (基于750px设计稿) */
html {
    /* 100vw / 7.5 = 13.33333vw -> 这样设置后，在 750px 屏幕下 1rem 等于 100px */
    font-size: 13.33333vw;
}

/* 兼容平板或PC预览，防止屏幕过大时页面元素变得巨无霸 */
@media screen and (min-width: 750px) {
    html {
        font-size: 100px;
    }
}

/* 2. 全局基础重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* 极度重要：让 padding 和 border 不会撑大容器 */
    -webkit-tap-highlight-color: transparent;
    /* 彻底消除移动端点击链接或按钮时出现的灰色闪烁色块 */
}

/* 3. Body 体验优化 */
body {
    /* 移动端最优字体栈：优先使用苹果和安卓系统的默认字体，不强求下载外部字体 */
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", STHeiti, "Microsoft Yahei", Tahoma, sans-serif;
    font-size: 0.28rem;
    /* 基础字体大小，相当于设计稿里的 28px */
    line-height: 1.5;
    color: #333333;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
    /* iOS 字体抗锯齿，让文字更清晰平滑 */
    -webkit-text-size-adjust: 100%;
    /* 防止手机横竖屏切换时，系统自动强行放大字体 */

    /* 让页面在 PC/平板 上居中显示，体验更好 */
    max-width: 750px;
    margin: 0 auto;
}

/* 4. 媒体元素防爆框 */
img,
video {
    max-width: 100%;
    height: auto;
    display: block;
    /* 消除图片底部的 3px 留白间隙 */
}

/* 5. 表单与交互元素重置 */
ul,
ol,
li {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
    /* 增加可点击区域，提升移动端触控体验 */
    touch-action: manipulation;
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    border: none;
    outline: none;
    background: none;
    /* 彻底消除 iOS (iPhone) 上输入框自带的圆角和内阴影丑陋样式 */
    -webkit-appearance: none;
}

.footer {
    width: 100%;
    padding-top: 0.1rem;
    background: #223730;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9999999999;
}

.footer ul {
    display: flex;
    width: 100%;
    height: 1.2rem;
}

.footer ul a {
    color: #fff;
    font-size: 0.14rem;
}

.footer ul li {
    opacity: 0.6;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;

}

.footer ul li h1 {
    display: inline-block;
    font-weight: 300;
    font-size: 0.2rem;
}

.footer ul li img {
    display: block;
    width: 0.4rem;
    margin: 0 auto;
    margin-bottom: 0.1rem;
}

.footer ul li.on {
    opacity: 1;
}

.swiper-pagination SPAN {
    background: #FFF !IMPORTANT;
}

.bt img {
    display: block;
    width: 80%;
    margin: 0.3rem auto;
}

.title img {
    height:0.9rem;
    display: block;
    margin: 0 auto;
}

.cp_l {
    margin-top: 1rem;
}

/* 首页搜索栏容器 */

/* 全屏搜索弹层 (默认隐藏 - 从右侧隐藏) */
.search-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    z-index: 9999;
    /* 【修改这里】：将 translateY(100%) 改为 translateX(100%) */
    transform: translateX(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}
.search-modal-header{
    background: #fff;
}
/* 激活状态 (滑入屏幕正中) */
.search-modal.active {
    /* 【修改这里】：将 translateY(0) 改为 translateX(0) */
    transform: translateX(0);
}


.search-modal-input {
    flex: 1;
    border: none;
    outline: none;
    -webkit-appearance: none;
}

.search-box {
    position: relative;
    width: 94%;
    margin: 0.6rem  auto 0.4rem auto;

}

.seainput {
    width: 100%;
    display: block;
    height: 0.6rem;
    background: #F4F4F4;
    box-sizing: border-box;
    padding-left: 0.6rem;
        padding-right: 0.3rem;
    border-radius: 0.3rem;
    font-size: 0.26rem;
    position: relative;
    line-height: 0.6rem;
    color: #999999;
}
/* 现代浏览器通用写法 */
.seainput ::placeholder {
color: #999999; /* 提示文字颜色 */
font-size: 0.26rem; /* 字体大小 */
}
/* WebKit 内核浏览器（Chrome、Safari） */
.seainput ::-webkit-input-placeholder {
color: #999999;
}
/* Firefox */
.seainput ::-moz-placeholder {
color: #999999;
}
/* IE / Edge */
.seainput :-ms-input-placeholder {
color: #999999;
}
.search-icon {
    display: flex;
    align-items: center;
    height: 0.6rem;
    width: 0.3rem;
    position: absolute;
    left: 0.2rem;
    top: 0;
    z-index: 999;
}

.search-cancel {
    margin-left: 15px;
    color: #666;
    font-size: 14px;
    padding: 5px;
}

/* 搜索结果区域 */
.search-results {
    overflow-y: auto;
    padding: 3%;
    background: #f5f5f5;
    display: flex;
    flex-wrap: wrap;
}

.search-result-item {
    display: block;
    width:50%;
    box-sizing: border-box;
    padding: 0.1rem;
    position: relative;
    margin-bottom: 0.1rem;

}
.cp_s{
    position: absolute;
    bottom: 0;
    left: 0.1rem;
    font-size: 0.2rem;
    padding: 0.2rem;
    color: #fff;
    font-weight: bold;
    background: rgba(0, 0, 0, 0.8);

    width: calc(100% - 0.2rem);
}
.search-result-item img {
    width: 100%;
    object-fit: cover;
    background: #eaeaea;
    min-height: 1.7rem;
}

/* 锁定底层滑动 */
body.locked {
    overflow: hidden;
}

.foo_b {
    height: 1.56rem;
    width: 100%;
}
/* 修改搜索框自带的“清除 X”的颜色为 #999999 (高级灰) */
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none; 
    width: 16px; 
    height: 16px;
    margin-left: 5px;
    /* 重点在这里：stroke='%23999999' */
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999999' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E") no-repeat center;
    background-size: 14px 14px;
    cursor: pointer;
}
.sea_l{
    width: 90%;
    margin: 0 auto;
    position: relative;
    padding: 0.2rem 0;

}
.swiper .swiper-slide img{
    background: #f2f2f2;
}
.more img{
    background: none!important;
}
.sea_l input{
    color: #000;
}
.swiper-pagination span{
    width: 5px;
    height: 5px;
}
.sea_l .search-icon{
    top: 0.2rem;
}
#searchModal{
    padding-bottom: 0.2rem;
}
.cp_menu{
    display: block;
    width: 94%;
    margin: 0 auto;
}
.cp_menu li{
    margin-top: 0.2rem;
}
.list_index{
    display: flex;
    width: 94%;
    margin: 0 auto;
    padding-top: 0.5rem;
}
.list_index img{
    height: 0.4rem;
}
.list_index img:first-child{
    margin-right: 1rem;
}
.mySwiper1{
    margin-top: 0.6rem;
}
.mySwiper1 .main_lisr{
    width: 100%;
    height:4.16rem;
    background: #f2f2f2;
}
.mySwiper1 a{
    position: relative;
}
.mySwiper1 .more{
    position: absolute;
    bottom: 0.1rem;
    right: 3%;
}
.mySwiper1 .more img{
    display: block;
    height: 0.16rem;
}
.index_l{
    padding-top: 0.5rem;
}
.index_l li{
    padding-top: 0.1rem;
}
.foot_a img{
    display: block;
    width: 94%;
    margin: 0.5rem auto;
}
.banner{
    width: 100%;
}
.cp_cag,.nr{
    width: 94%;
    margin: 0 auto;
}


.show_tit{
    padding:0.4rem 0.3rem ;
    font-size: 0.30rem;
    border-bottom: 1px solid #F2F2F2;
    
}
.tit_show img{
    height:0.4rem;

}
.tit_show{
        padding:0.4rem 0.3rem ;
}
.li_show{
    display: flex;
    padding:0.2rem 0.2rem;
    border-top: 1px solid #f2f2f2;
}
.li_show li{
    padding: 0 0.1rem;
    position: relative;
}
.li_show li img{
    width: 100%;
      object-fit: cover;
    height: 2.4rem;
}
.li_show li .show_tj_ti{
    position: absolute;
    left: 0.1rem;
    bottom: 0;
    width: calc(100% - 0.2rem);
    background: rgba(0, 0, 0, 0.8);
    color:#fff;
    font-size: 0.16rem;
    line-height: 0.4rem;
    padding-left: 0.1rem;
}
.zw{
    padding: 0.4rem 0.3rem;
    text-align: center;
    font-size: 0.18rem;
    width: 100%;
    color: #999;
}
.js_show{
    padding: 0 0.3rem;
}

/* 1. 为编辑器里的图片添加基础骨架样式 */
.lazy-content-img {
    background-color: #f0f2f5; /* 骨架屏底色 */
    min-height: 200px; /* 给一个最小高度撑开页面，防止文字抖动 */
    width: 100%; /* 适配手机端 */
    max-width: 100%;
    object-fit: cover;
    
    /* 骨架扫光动画 */
    background-image: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
    background-size: 200% 100%;
    animation: contentShimmer 1.5s infinite linear;
    
    /* 为真实图片加载完成后的淡入做准备 */
    transition: opacity 0.5s ease-in-out;
}

/* 扫光动画关键帧 */
@keyframes contentShimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* 2. 图片加载成功后的状态 */
.lazy-content-img.loaded {
    background: none; /* 移除骨架背景 */
    animation: none; /* 停止动画 */
    min-height: auto; /* 恢复真实高度 */
    opacity: 1; /* 完全显示 */
}
.papg_menu{
    display: flex;
    align-items: center;
    justify-content: center;
}
.papg_menu li{
    flex:1;
        padding: 0.3rem 0;
    text-align: center;
}


.papg_menu li a{
    color: #223730;
    opacity: 0.5;
    font-size: 0.22rem;

}
.papg_menu li.on a{
opacity: 1;
}