﻿   /* 顶部Banner轮播 - 修复轮播样式 */
   .page-index .banner-swiper {
   	position: relative;
   	height: 870px;
   	/* overflow: hidden; */
   	width: 100%;
   	/* background: rgba(0, 0, 0, 0.4); */
   }

   .page-index .banner-swiper .swiper-container {
   	width: 100%;
   	height: 100%;
   }

   .page-index .banner-swiper .swiper-slide {
   	position: relative;
   	height: 870px;
   	width: 100%;
   }

   .page-index .banner-swiper .swiper-slide::before {
   	content: "";
   	/* 伪元素必须有content属性 */
   	position: absolute;
   	top: 0;
   	left: 0;
   	width: 100%;
   	height: 100%;
   	background: rgba(0, 0, 0, 0.4);
   	/* 你需要的半透明黑色遮罩 */
   	z-index: 1;
   	/* 遮罩层层级，低于文字 */
   	pointer-events: none;
   	/* 可选：让遮罩层不阻挡鼠标事件 */
   }

 .page-index .banner-swiper .swiper-slide img {
   	width: 100%;
   	height: 100%;
   	object-fit: cover;
   }

 .page-index .banner-content {
   	position: absolute;
   	top: 35%;
   	left: 50%;
   	transform: translate(-50%, -50%);
   	text-align: center;
   	color: #fff;
   	width: 100%;
   	padding: 0 20px;
   	z-index: 2;
   }

  .page-index .banner-title {
   	font-size: 78px;
   	margin-bottom: 20px;
   	/* text-shadow: 0 2px 4px rgba(0,0,0,0.5); */
   }

  .page-index .banner-come {
   	font-size: 32px;
   	/* text-shadow: 0 2px 4px rgba(0,0,0,0.5); */
   }

   .swiper-button-prev:after,
   .swiper-rtl .swiper-button-next:after {
   	content: none !important;
   }

   .swiper-button-next:after,
   .swiper-rtl .swiper-button-prev:after {
   	content: none !important;
   }

   .swiper-button-next,
   .swiper-rtl .swiper-button-prev {
   	right: 0 !important;
   }

   .swiper-button-prev,
   .swiper-rtl .swiper-button-next {
   	left: 0 !important;
   }

   /* Banner轮播导航按钮样式 - 修复定位和优先级 */
   .banner-swiper .swiper-button-prev,
   .banner-swiper .swiper-button-next {
   	/* color: #fff !important;
   	--swiper-navigation-size: 30px !important;
   	background-color: rgba(0, 0, 0, 0.3) !important;
   	width: 40px !important;
   	height: 40px !important;
   	border-radius: 50% !important;
   	top: 50% !important;
   	margin-top: -20px !important;
   	z-index: 10 !important; */
   }

   .banner-swiper .swiper-button-prev:hover,
   .banner-swiper .swiper-button-next:hover {
   	/* background-color: rgba(209, 32, 38, 0.8) !important; */
   }

   .banner-swiper .swiper-pagination {
   	bottom: 20px !important;
   	z-index: 10 !important;
   }

   .banner-swiper .swiper-pagination-bullet {
   	width: 12px !important;
   	height: 12px !important;
   	background-color: #fff !important;
   	opacity: 0.7 !important;
   }

   .banner-swiper .swiper-pagination-bullet-active {
   	background-color: #d12026 !important;
   	opacity: 1 !important;
	width: 26px !important;
    border-radius: 8px;
   }

   /* 搜索框区域 - 统一样式优先级 */
  .page-index .search-box {
   	position: absolute;
   	bottom: 30%;
   	left: 50%;
   	transform: translateX(-50%);
   	width: 60%;
   	/* background-color: #fff; */
   	padding: 10px;
   	border-radius: 4px;
   	/* box-shadow: 0 2px 8px rgba(0,0,0,0.1); */
   	z-index: 3;
   }

 .page-index .search-tabs {
   	display: flex;
   	margin-bottom: 8px;
   }

  .page-index .search-tab {
   	padding: 5px 15px;
   	background-color: transparent;
   	border: none;
   	cursor: pointer;
   	transition: all 0.3s;
   	/* border-radius: 4px 4px 0 0; */
   	font-size: 24px;
   	outline: none;
   	/* 增加点击区域和层级，确保可点击 */
   	position: relative;
   	z-index: 1;
   	color: #D4D4D4;
   }

  .page-index .search-tab.active {
   	/* background-color: #d12026; */
   	color: #fff;
   }
  .page-index .search-tab:hover{
	color: #d12026;
	background-color: transparent !important;
   }
  .page-index .search-tab:hover:not(.active) {
   	background-color: #eee;
   }

  .page-index .search-tab.active::after {
   	content: '';
   	/* 关键1：宽高设为0，只靠边框形成三角 */
   	width: 0;
   	height: 0;
   	/* 关键2：边框宽度统一，仅下边框有颜色 */
   	border: 10px solid transparent;
   	/* 所有边框先设为透明 */
   	border-bottom-color: #FFF;
   	/* 仅下边框设为白色（向上三角） */
   	/* 精准定位 */
   	position: absolute;
   	bottom: -32px;
   	/* 三角顶部贴紧按钮底部 */
   	left: 50%;
   	transform: translateX(-50%);
   	z-index: 9;
   	/* 关键3：清除默认样式，避免干扰 */
   	box-shadow: none;
   	background: none;
   }

  .page-index .search-input-wrap {
   	display: flex;
   	align-items: center;
   	margin-top: 30px;
   }

  .page-index .input-with-icon {
   	flex: 1;
   	position: relative;
   	max-width: 960px;
   	max-height: 90px;
	background: #FFF;
   	/* 作为右侧图文的定位父级 */
   }

  .page-index .search-input {
   	width: 80%;
   	/* 改为100%，适配容器 */
   	padding: 30px 15px 30px 15px;
   	/* 调整右侧内边距，给图文留空间 */
   	padding-right: 50px;
   	/* 关键：根据图文宽度调整，避免文字遮挡 */
   	border-right: none;
   	border-radius: 4px 0 0 4px;
   	outline: none;
   	box-sizing: border-box;
   	/* 确保内边距不超出宽度 */
   	font-size: 24px;
   	border: none;
	color:#bdbdbd;
   	max-height: 90px;
   }

   /* .search-input:focus {
            border-color: #d12026;
        } */
  .page-index .input-right-content {
   	position: absolute;
   	right: 15px;
   	/* 距离输入框右侧的距离 */
   	top: 50%;
   	transform: translateY(-50%);
   	/* 垂直居中 */
   	display: flex;
   	align-items: center;
   	gap: 5px;
   	/* 图片和文字之间的间距 */
   	/* pointer-events: none; */
   	/* 关键：让鼠标事件穿透，不影响输入框操作 */
   }

   /* 示例图片样式（你可替换为自己的图片地址和尺寸） */
  .page-index .input-right-icon {
   	width: 40px !important;
   	height: 40px !important;
   	margin-right: 5px;
	background: url(/img/point.png) no-repeat;
   }

   /* 右侧文字样式 */
  .page-index .input-right-text {
   	font-weight: 600;
   	font-size: 26px;
   	color: #2C2C2C;
   }

  .page-index .search-btn {
   	text-align: center;
   	width: 220px;
   	height: 90px;
   	/* 与输入框高度一致（20*2+1*2+15*2？不对，输入框padding是20上下，所以高度是20*2 + 行高，这里直接设62px匹配） */
   	background-color: #cf2b0c;
   	color: #fff;
   	border: none;
   	border-radius: 0 4px 4px 0;
   	cursor: pointer;
   	transition: background-color 0.3s;
   	font-size: 26px;
   }

  .page-index .search-btn:hover {
   	background-color: #b0181e;
   }
   
   .page-index .input-with-hidden{ width: 100%; max-height: 275px; background-color: #fff; position: absolute; top: 100%; left: 0; overflow-y: auto; display: none;}
   .page-index .input-with-hidden ul{ display: none;}
   .page-index .input-with-hidden li{ font-size: 20px; padding: 14px 20px; cursor: pointer;}
   .page-index .input-with-hidden li:hover{ background-color: #d12026; color: #fff;}

   /* 视频板块 */
   .video-section {
   	padding: 140px 0 120px 0;
   	text-align: center;
   	background: url(../img/index-bg.png)no-repeat center center;
	background-size: cover;
   }

   .title-wrapper {
   	position: relative;
   	display: inline-block;
   	/* 贴合标题宽度 */
   	width: 100%;
	z-index: 1;
   }

   .title-wrapper::after {
	content: '';
	background: url(../img/trans.png) no-repeat;
   	position: absolute;
   	top: 25%;
   	left: 50%;
	right: 50%;
   	transform: translate(-50%, -50%);
   	text-transform: uppercase;
   	/* 可选：让英文全大写更美观 */
   	letter-spacing: 2px;
   	/* 可选：增加字母间距提升高级感 */
   	/* content: "diplomatic  residence  compound"; */
   	font-size: 86px;
   	color: rgba(4, 4, 5, 0.05);
   	font-weight: bold;
   	width: 80%;
   	/* 背景层宽度 */
   	height: 100px;
   	/* 背景层高度 */
   	z-index: -1;
   	/* 放在标题下方 */
   	/* opacity: 0.5; */
   	/* 调整透明度，避免遮挡标题 */
	background-size:contain;
   }

   .title-wrapper2 {
   	position: relative;
   	display: inline-block;
   	/* 贴合标题宽度 */
   	width: 100%;
	z-index: 1;
   }

   .title-wrapper2::after {

content: '';
	background: url(../img/trans.png) no-repeat;
   	position: absolute;
   	top: 25%;
   	left: 50%;
	right: 50%;
   	transform: translate(-50%, -50%);
   	text-transform: uppercase;
   	/* 可选：让英文全大写更美观 */
   	letter-spacing: 2px;
   	/* 可选：增加字母间距提升高级感 */
   	/* content: "diplomatic  residence  compound"; */
   	font-size: 86px;
   	color: rgba(4, 4, 5, 0.05);
   	font-weight: bold;
   	width: 80%;
   	/* 背景层宽度 */
   	height: 100px;
   	/* 背景层高度 */
   	z-index: -1;
   	/* 调整透明度，避免遮挡标题 */
	background-size:contain;
   }

   .video-title {
   	font-size: 40px;
   	color: #040405;
   	margin-bottom: 15px;
   }

   .video-en {
   	font-size: 18px;
   	color: #040405;
   	margin-bottom: 100px;
   	text-transform: uppercase;
   	font-weight: 300;
   }

   .video-container {
   	position: relative;
   	max-width: 1200px;
   	margin: 0 auto;
   }

   .video-player {
   	width: 100%;
   	height: 700px;
   	background-color: #000;
   	border-radius: 8px;
	position: relative;
   }

   .video-control {
   	position: absolute;
   	top: 50%;
   	left: 50%;
   	transform: translate(-50%, -50%);
   	width: 160px;
   	height: 160px;
   	border-radius: 50%;
   	/* background-color: rgba(0, 0, 0, 0.6); */
   	color: #fff;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	font-size: 24px;
   	cursor: pointer;
   	/* transition: background-color 0.3s; */
	background:none;
   	border: none;
   	/* 提升层级，确保按钮可点击 */
   	z-index: 20;
   }

   .fa-play:before {
   	content: none !important;
   }

   .fa-pause:before {
   	content: none !important;
   }

   .kefu {
            position: fixed;
            bottom: 50%; /* 初始基准位置：上边缘50px */
            right: 3%; /* 初始基准位置：左边缘50px */
            z-index: 999;
            /* 增大动画时长到30秒，避免移动过快 */
            /* animation: irregularMove1 30s linear infinite;  */
        }

        .tuijian {
            max-width: 290px;
            min-height: 320px;
            position: fixed;
            top: 0; /* 初始基准位置：上边缘50px */
            left: 0; /* 初始基准位置：左边缘50px */
			bottom: auto !important;
            z-index: 9999;
            font-size: 16px;
            color: #333333;
            line-height: 28px;
            padding: 28px 46px;
            background: url(../img/tan-bg.png) no-repeat;
            text-align: center;
            /* 增大动画时长到25秒，与kefu错开节奏，更自然 */
            /* animation: irregularMove2 25s ease-in-out infinite; */
        }
        .tuijian p{
             overflow: hidden; /* 隐藏超出容器的内容 */
            text-overflow: ellipsis; /* 超出部分显示省略号（仅单行生效，多行需配合下面属性） */
            display: -webkit-box; /* 将元素转为弹性盒模型（webkit内核专用，主流浏览器均支持） */
            -webkit-line-clamp: 2; /* 限制显示的行数为 2 */
            -webkit-box-orient: vertical; 
        }
        .zhong{
            position: absolute;
            right: 3%;
    bottom: 13%;
        }

        .tuijian img {
            margin: 40px 10px;
        }
		.tuijian .pic{ margin-top: 40px; height: 100px; overflow: hidden;}
		.tuijian .pic img{ display: block; width: 100%; height: 100%; object-fit: cover; margin: 0 auto;}
        .cha {
            position: absolute; /* 改为绝对定位，相对于父元素.tuijian定位 */
           bottom: -35% !important;
			right: 40%;
            z-index: 1000; /* 层级高于父元素，确保不被遮挡 */
			cursor: pointer;
        }

        /* 定义 .kefu 的全屏不规则运动（扣除50px边距） */
        @keyframes irregularMove1 {
            0% {
                /* 初始位置：基准点（top:50px, left:50px），无额外位移 */
                transform: translate(0, 0); 
            }
            20% {
                /* 左上方：向左少量位移，向上无额外位移（避免超出上50px） */
                transform: translate(-20px, 0); 
            }
            40% {
                /* 右下方：向右接近屏幕右边缘（屏幕宽度-元素宽度-100px），向下接近屏幕下边缘 */
                transform: translate(calc(100vw - 200px - 100px), calc(100vh - 100px - 100px)); 
                /* 100vw=屏幕宽度，200px=kefu元素大致宽度，100px=左右各50px边距 */
                /* 100vh=屏幕高度，100px=kefu元素大致高度，100px=上下各50px边距 */
            }
            60% {
                /* 右上方：向右接近右边缘，向上少量位移 */
                transform: translate(calc(100vw - 200px - 100px), 100px); 
            }
            80% {
                /* 左下方：向左少量位移，向下接近下边缘 */
                transform: translate(100px, calc(100vh - 100px - 100px)); 
            }
            100% {
                /* 回到初始基准位置 */
                transform: translate(0, 0); 
            }
        }

        /* 定义 .tuijian 的全屏不规则运动（扣除50px边距，与kefu轨迹错开） */
        @keyframes irregularMove2 {
            0% {
                transform: translate(0, 0); /* 初始基准位置 */
            }
            25% {
                /* 右下方：向右中等位移，向下中等位移 */
                transform: translate(calc(100vw - 300px - 200px), calc(100vh - 350px - 200px)); 
                /* 300px=tuijian最大宽度，350px=tuijian最小高度，预留足够边距 */
            }
            50% {
                /* 左上方：向左少量位移，向上少量位移 */
                transform: translate(100px, 100px); 
            }
            75% {
                /* 左下方：向左少量位移，向下接近下边缘 */
                transform: translate(50px, calc(100vh - 350px - 100px)); 
            }
            100% {
                /* 回到初始基准位置 */
                transform: translate(0, 0); 
            }
        }
   .video-control:hover {
   	/* background-color: rgba(209, 32, 38, 0.8); */
   }

   .video-timeline {
   	position: absolute;
   	bottom: 20px;
   	left: 0;
   	width: 100%;
   	height: 4px;
   	background-color: rgba(255, 255, 255, 0.3);
   	cursor: pointer;
   	border-radius: 2px;
   	z-index: 10;
   }

   .video-progress {
   	height: 100%;
   	background-color: #d12026;
   	width: 0%;
   	border-radius: 2px;
   }
   
   .video-container .video-box{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: none;}
   .video-container .video-box video{ display: block; width: 100%; height: 100%;}
   

   /* 公寓介绍板块 */
   .apartment-section {
   	/* padding: 40px 0; */
   	background-color: #f9f9f9;
   }

   .apartment-modules {
   	display: grid;
   	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
   	gap: -1px;
   	/* 无间距，保持视觉统一 */
   	margin: 0 auto;
   }

   /* 单个模块样式 */
   .module-item {
   	position: relative;
   	overflow: hidden;
   	/* aspect-ratio: 4/3; */
   	/* 固定图片比例，避免变形 */
   	cursor: pointer;
   	height: 100%;
   	max-width: 480px;
   }

   /* 模块图片样式 */
   .module-img {
	width: 100%;
   	height: 100%;
   	object-fit: cover;
   	/* 图片自适应填充，不拉伸 */
   	transition: transform 0.5s ease;
   	/* 图片缩放过渡 */
   }

   /* 红色蒙版样式 */
   .module-mask {
   	position: absolute;
   	top: 0;
   	left: 0;
   	width: 100%;
   	height: 100%;
   	background-color: #CC240F;
   	/* 外交公寓品牌红 */
   	opacity: 0;
   	/* 初始隐藏 */
   	transition: opacity 0.5s ease;
   	/* 蒙版淡入淡出 */
   	display: flex;
   	flex-direction: column;
   	justify-content: center;
   	align-items: flex-start;
   	/* 文字左对齐，贴合设计 */
   	padding: 2rem;
   	color: #fff;
   }
	.module-mask div{
		    font-size: 12px;
    line-height: 23px;
    margin-bottom: 99px;
	}
   /* 蒙版内文字样式 */
   .mask-title {
   	font-size: 48px;
   	font-weight: bold;
	line-height: 1;
   	margin-bottom: 15px;
   }

   .mask-english {
   	font-size: 26px;
   	opacity: 0.8;
   	margin-bottom: 10px;
   }

  .mask-desc {
   	font-size: 18px;
   	line-height: 1.8;
	height: 16.2em;
	overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:9; -webkit-box-orient:vertical;
   	/* margin-bottom: 80px;
    height: 220px;
    max-height: 220px;
    overflow: hidden;          
  text-overflow: ellipsis;  */
   }

     .mask-more {
   	width: 130px;
   	line-height: 34px;
   	font-size: 16px;
   	text-decoration: none;
   	color: #fff;
   	border-radius: 17px;
   	border: 1px solid #FFFFFF;
   	text-align: center;
    position: absolute;
    bottom: 5%;
   }

   /* 鼠标移入效果 */
   .module-item:hover .module-img {
   	transform: scale(1.05);
   	/* 图片轻微放大，增强视觉层次 */
   }

   .module-item:hover .module-mask {
   	opacity: 1;
   	/* 蒙版显示 */
   }

   .apartment-wrap {
   	display: grid;
   	grid-template-columns: 1fr 2fr;
   	gap: 20px;
   }

   .apartment-info {
   	background-color: #d12026;
   	color: #fff;
   	padding: 30px;
   	display: flex;
   	flex-direction: column;
   	justify-content: center;
   }

   .apartment-info h3 {
   	font-size: 24px;
   	margin-bottom: 20px;
   }

   .apartment-info p {
   	line-height: 1.6;
   	margin-bottom: 20px;
   }

   .more-btn {
   	display: inline-block;
   	padding: 8px 20px;
   	border: 1px solid #fff;
   	color: #fff;
   	border-radius: 4px;
   	transition: all 0.3s;
   	align-self: flex-start;
   }

   .more-btn:hover {
   	background-color: #fff;
   	color: #d12026;
   }

   .apartment-imgs {
   	display: grid;
   	grid-template-columns: repeat(3, 1fr);
   	gap: 10px;
   }

   .apartment-imgs img {
   	height: 100%;
   	object-fit: cover;
   }

   /* 新闻资讯板块 */
  .page-index .news-section {
   	padding: 60px 0;
   	background: url(../img/news-bg.png) no-repeat center center;
	background-size: cover;
   }

  .page-index .news-title {
   	font-size: 40px;
   	color: #040405;
   	text-align: center;
   	margin-bottom: 20px;

   }

  .page-index .news-en {
   	font-size: 18px;
   	color: #040405;
   	font-weight: 300;
   	text-align: center;
   	margin-bottom: 100px;
   	text-transform: uppercase;
   }

  .page-index .news-list {
   	display: grid;
   	grid-template-columns: repeat(3, 1fr);
   	/* gap: 20px; */
   	height: 648px;
   	margin-bottom: 70px;
   }

  .page-index .news-more {
   	width: 140px;
   	height: 40px;
   	background: #F5A623;
   	border-radius: 8px;
   	color: #FFF;
   	text-align: center;
   	line-height: 40px;
   	margin: auto;
   	margin-bottom: 100px;
   }

  .page-index .news-more a {
   	color: #FFF;
   }

  .page-index .news-more span {
   	/* 让箭头继承父元素的行高 */
   	line-height: inherit;
   	/* 可选：微调箭头与文字的间距 */
   	margin-left: 4px;
   }

  .page-index .news-card {
   	/* width: 400px; */
   	background: #F5F6F8;
   	border: 1px solid #eee;
   	border-radius: 4px;
   	overflow: hidden;
   	transition: all 0.3s;
	height:100%;
   }

   .date-box {
   	display: flex;
   	/* 让数字和日期横向排列 */
   	align-items: baseline;
   	/* 让文字基线对齐（数字底部和日期底部对齐） */
   	gap: 8px;
   	/* 数字和日期之间的间距 */
   	font-family: Arial, sans-serif;
   }

   .date-number {
   	font-size: 42px;
   	/* 大号数字 */
   	font-weight: bold;
   	color: #323232;
   }

   .date-text {
   	font-size: 20px;
   	/* 小号日期 */
   	color: #9b9b9b;
   }

  .page-index .news-card:hover {
   	transform: translateY(-5px);
   	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   	/* border-color: #d12026; */
   	/* 新增：背景变白、底部加白色边框 */
   	background: #fff;
   	border-bottom: 2px solid #d12026;
   	/* 底部白色边框（宽度按需调） */
   }

   /* hover时标题文字变红 */
  .page-index .news-card:hover .news-title-sm {
   	color: #d12026;
   	/* 红色（和你现有border-color一致） */
   }

  .page-index .news-card:hover .news-right {
   	color: #fff;
   	/* 可加背景色让白色箭头更明显 */
   	background: url(../img/go2.png) no-repeat;
	background-size: cover;
   }

  .page-index .news-img {
   	height: 180px;
   	max-width: 320px;
   	margin: auto;
   	overflow: hidden;
   }

  .page-index .news-img img {
   	width: 100%;
   	height: 100%;
   	object-fit: cover;
   	transition: transform 0.5s;
   }

  .page-index .news-right {
   	/* 圆形样式 */
   	margin-left: 40px;
   	margin-top: 60px;
   	width: 60px;
   	/* 圆形直径，可根据需要调整 */
   	height: 60px;
   	border-radius: 50%;
   	/* 实现圆形 */
   	background-color: #fff;
   	/* 红色背景，可替换成具体色值如 #f43f3b */
   	/* 箭头文字样式 */
   	background: url(../img/go1.png) no-repeat;
   	/* 箭头大小 */
   	line-height: 40px;
   	/* 和高度一致，实现垂直居中 */
   	text-align: center;
   	/* 水平居中 */
   	cursor: pointer;
   	/* 鼠标悬浮显示手型，模拟按钮 */
   	/* 可选：去掉文字选中效果 */
   	user-select: none;
   	/* 可选：增加一点阴影，更贴近设计感 */
   	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   }

  .page-index .news-card:hover .news-img img {
   	transform: scale(1.05);
   }

  .page-index .news-content {
   	padding: 40px;
   }

  .page-index .news-date {
   	font-size: 12px;
   	color: #999;
   	margin-bottom: 8px;
   }

  .page-index .news-title-sm {
   	margin-top: 55px;
   	margin-bottom: 10px;
   	font-size: 20px;
   	color: #393939;
   	display: -webkit-box;
   	-webkit-line-clamp: 1;
   	-webkit-box-orient: vertical;
   	overflow: hidden;
   }

  .page-index .news-desc {
   	font-size: 16px;
   	color: #9A9A9A;
   	line-height: 1.5;
   	display: -webkit-box;
   	-webkit-line-clamp: 2;
   	-webkit-box-orient: vertical;
   	overflow: hidden;
   	margin-bottom: 30px;
   }

   /* 集团服务轮播 - 修复样式 */
   .service-section {
   	padding: 40px 0;
   	color: #fff;
   	background: url(../img/service.png) center no-repeat;
    background-size: cover;
   }

   .service-title {
   	display: flex;
   	/* 让数字和日期横向排列 */
   	align-items: baseline;
   	/* 让文字基线对齐（数字底部和日期底部对齐） */
   	gap: 8px;
   	/* 数字和日期之间的间距 */
   	font-weight: 100;
   	font-size: 32px;
   	color: #FFFFFF;
   	margin-bottom: 70px;
   }

   .tab-list {
   	display: flex;
   	gap: 20px;
   	list-style: none;
   	padding: 0;
   	margin: 0;
   }

   .tab-items {
   	cursor: pointer;
   	padding-bottom: 5px;
   	transition: all 0.2s;
   	/* 关键修改：让下划线只占单个文字宽度 */
   	position: relative;
   	/* 为伪元素定位做准备 */
   }

   /* 选中状态样式 - 替换原来的border-bottom */
   .tab-items.active {
   	font-weight: bold;
   }

   /* 用伪元素创建短的黄色下划线 */
   .tab-items.active::after {
   	content: '';
   	position: absolute;
   	bottom: 0;
   	left: 0;
   	/* 关键修改：从居中改为靠左对齐 */
   	width: 1em;
   	/* 宽度为1个文字大小 */
   	height: 2px;
   	background-color: #ffd100;
   	/* 黄色实线 */
   }

   .service-swiper {
   	height: 120px;
   	position: relative;
   	width: 100%;
   	overflow: hidden;
   }

   .service-swiper .swiper-container {
   	width: 100%;
   	height: 100%;
   }

   .service-swiper .swiper-slide {
	width: 160px !important;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	height: 100%;
   }

   /* 服务轮播导航按钮样式 */
   .service-swiper .swiper-button-prev,
   .service-swiper .swiper-button-next {
   	color: #d12026 !important;
   	--swiper-navigation-size: 20px !important;
   	background-color: #fff !important;
   	width: 30px !important;
   	height: 30px !important;
   	border-radius: 50% !important;
   	top: 50% !important;
   	transform: translateY(-50%) !important;
   	z-index: 10 !important;
   }

   .service-swiper .swiper-button-prev {
   	left: 10px !important;
   }

   .service-swiper .swiper-button-next {
   	right: 10px !important;
   }

   .service-item {
   	width: 160px;
   	height: 100px;
   	background-color: #fff;
   	border-radius: 4px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	transition: transform 0.3s;
   	cursor: pointer;
   }

   .service-item:hover {
   	transform: scale(1.08);
   }

   .service-item img {
   	max-width: 100%;
   	max-height: 100%;
   }

   @media(max-width:1600px) {
   	

   	.kefu {
   		right: 3%;
   		width: 120px;
   	}

   	.tuijian {
   		width: 220px;
        height: 240px;
        /* right: 3%; */
        background-size: contain;
        padding: 10px;
        bottom: 5%;
   	}
    .tuijian img {
        margin: 10px;
    }
	.tuijian .pic{ height: 80px; margin-top: 25px;}
	.tuijian .pic img{ width: 80%;}
	

.zhong {
        width: 50px;
        height: 50px;
        bottom: 40%;
    }
   	.cha {
   		right: 35%;
   		bottom: 4% !important;
   	}
	.page-index .news-section .containers .container{
		/* max-width: 900px; */
	}
   }
   @media(max-width:1366px) {
	.kefu{
		right: 3%;
	}

.page-index .search-box{
		bottom: 24%;
	}
   }
   @media(max-width:1680px) {
	   .mask-desc{ height: 14.4em; -webkit-line-clamp: 8;}
   }
   @media(max-width:1440px) {
	.module-item:hover .module-img{
		transform: scale(1);
	}
	.module-mask{
	 /* padding: 135px 50px 110px 50px; */
	}
	.mask-desc {
    font-size: 12px; height: 18em; -webkit-line-clamp: 10;
}
.module-mask{
	justify-content: unset !important;
}
.mask-english{
	font-size: 20px;
}
	.mask-title {
    font-size:26px;
    font-weight: 600;
    margin-bottom: 8px;
}
.mask-titlec{
	/* margin-bottom: 36px; */
}
 .page-index .news-section{
	padding: 120px 0;
}
.page-index .news-title{
	font-size: 28px;
}
.page-index .news-en{
	font-size: 14px;
	margin-bottom: 75px;
}
.page-index .news-content{
	padding: 38px 30px 0px 30px;
}
.date-number{
	font-size: 31px;
}
.date-text{
	font-size: 15px;
}
.page-index .news-title-sm{
	margin-top: 42px;
	font-size: 15px;
}
.page-index .news-desc{
	font-size: 12px;
}
.page-index .news-img{
	width: 240px;
	height: 136px;
	/* padding: 23px 30px 60px 30px; */
}
.page-index .news-right{
	width: 44px;
	height: 44px;
	margin-top: 60px;
	margin-left: 30px;
	background-size: cover;
}
	.page-index .banner-swiper .swiper-slide{
		height: auto;
	}
	.page-index .banner-swiper{
		height: auto;
	}
	.banner-content{
		height: 20%;
	}
	.nav-main .container{
		margin-left: 0px;
	}
	.nav-menu{
		/* margin-left: 360px; */
	}
  
	.kefu {
   		right: 3%;
   		width: 120px;
   	}

   	.tuijian {
   		width: 220px;
   		height: 240px;
   		/* right: 3%; */
   		background-size: contain;
		padding: 10px;
		bottom: 5%;
   	}
.tuijian img{
	margin: 10px;
	
}
.zhong{
	width: 50px;
	height: 50px;
	bottom: 40%;
}

   	.cha {
   		right: 30%;
        bottom: 4%;
   	}
.page-index .search-box{
	bottom: 22%;
}
	.page-index .banner-title{
		font-size: 42px;
	}
	.page-index .banner-come{
		font-size: 24px;
		font-weight: 400;
	}
	.page-index .search-input-wrap{
		width: 800px;
	}
	.page-index .search-input{
		font-size: 18px;
		padding: 20px 15px;
	}
	.page-index .search-tab{
		font-size: 18px;
	}
	.page-index .search-tabs{
		margin-top: 20px;
		font-size: 20px;
	}
	.video-player{
		width: 75%;
    height: 525px;
    margin: auto;

	}
	.video-title{
		font-size: 28px;
	}
	.video-section{
		padding: 100px 0 120px 0;
	}
	.video-en{
		font-size: 14px;
	}
	.page-index .news-list{
		max-width: 1024px;
    margin: auto;
	margin-bottom: 45px;
	height: 486px;
	}
	.page-index .news-more{
		margin-bottom: 0px;
		width: 105px;
		height: 30px;
		font-size: 12px;
		line-height: 30px;
	}
	.page-index .search-tab.active::after{
		bottom: -32px;
	}
	.video-control{
		width: 120px;
		height: 120px;
	}
	.page-index .search-btn{
		height: 66px;
		font-size: 20px;
	}
	.page-index .input-right-text{
		font-size: 20px;
	}
	.input-right-icon{
		width: 30px !important;
		height: 30px !important;
	}
	.title-wrapper::after{
		font-size: 54px;
	}
	.title-wrapper2::after{
		font-size: 54px;
	}
	
	
	.page-index .service-item{
		width: 120px;
		height: 75px;
	}
	.page-index .service-title{
		font-size: 24px;
		margin-bottom: 50px;
		margin-left: 270px;
	}
	.tab-items.active::after{
		top: 45px;
	}
	.service-section{
		padding: 53px 0px 57px 0px;
		overflow: hidden;
	}
	.footer-cols{
		width: 225px;
	}
	.link-select select{
		width: 225px;
	}
	.footer-cols ul li a{
		font-size: 14px;
	}
	.footer-col h4{
		font-size: 14px;
		margin-bottom: 15px;
		padding-bottom: 0px;
	}
	.footer-col ul li a{
		font-size: 14px;
	}
	.footer .container{
		/* max-width: 782px !important; */
	}
	.footer-cold{
		margin-left: 21% !important;
	}
	.service-swiper .swiper-slide{
		width: 150px !important;
		margin-right: 0px !important;
	}
	.footer-cols{
		margin-left: 60px;
	}
   }

   /* 响应式适配 */
   @media (max-width:1200px) {

   	.banner-swiper,
   	.banner-swiper .swiper-slide {
   		height: 400px;
   	}

   	.banner-title {
   		font-size: 24px;
   	}

   	.banner-come {
   		font-size: 16px;
   	}

   	.page-index .search-tab {
   		font-size: 16px;
   	}

   	.page-index .search-box {
   		width: 40%;
   		bottom: 20%;
   	}

   	.page-index .input-right-icon {
   		width: 20px !important;
   		height: 20px !important;
   	}

   	.page-index .input-right-text {
   		font-size: 14px;
   	}
	.page-index .search-input{
		height: 40px;
		font-size: 12px;
		padding: 10px 15px 10px 15px;
	}
	.page-index .search-btn{
		width: 100px;
		height: 40px;
		font-size: 14px;
	}
	    .kefu {
        right: 3%;
        width: 80px;
    }
	.tuijian{
		/* right: 3%; */
		width: 200px;
        height: 180px;
		font-size: 14px;
	}
	.tuijian img{
		margin: 15px auto;
    width: 120px;
	}
	    .cha {
        right: 9%;
        bottom: 15%;
    }
   }

   @media (max-width: 992px) {

   	.banner-swiper,
   	.banner-swiper .swiper-slide {
   		height: 400px;
   	}

   	.search-box {
   		width: 80%;
   	}

   	.apartment-wrap {
   		grid-template-columns: 1fr;
   	}

   	.page-index .news-list {
   		grid-template-columns: repeat(2, 1fr);
   	}

   }

   @media (max-width: 768px) {
.page-index .news-card{
	width: auto;
}
   	.page-index .banner-swiper,
   	.banner-swiper .swiper-slide {
   		height: 300px;
   	}
.page-index .banner-come{
	font-size: 16px;
}
   	.page-index .banner-title {
   		font-size: 20px;
   	}
.page-index .search-input-wrap{
	width: 100%;
}
   	.page-index .search-tab {
   		font-size: 12px;
   	}

   	.page-index .search-input {
   		padding: 10px;
   		font-size: 10px;
   	}

   	.page-index .input-right-content {
   		display: none;
   	}

   	.page-index .search-btn {
   		padding: 10px;
   		height: 36px;
   	}

   	.page-index .search-box {
   		width: 90%;
   		bottom: 15%;
   	}

   	.module-item {
   		height: 400px;
   		margin-bottom: 10px;
   	}

   	.module-img {
   		width: 100%;
   	}

   	.video-player {
   		height: 300px;
   	}

   	.page-index .news-list {
   		grid-template-columns: 1fr;
   		height: auto;
		max-width: 80%;
   	}

   	.page-index .news-title-sm {
   		margin-top: 10px;
   	}

   	.page-index .news-content {
   		padding: 15px;
   	}

   	.page-index .news-right {
   		margin-top: 10px;
   		margin-bottom: 10px;
   	}

   	.apartment-modules {
   		/* display: flex; */
		gap: 20px;
   	}
	.title-wrapper::after{
		font-size: 36px;
	}
	.title-wrapper2::after{
		font-size: 36px;
	}
   	.apartment-imgs {
   		grid-template-columns: repeat(2, 1fr);
   	}
	.footer-col{
		width: 100px;
	}
	.footer-cols{
		width: 200px;
		margin-left: 0px;
	}
	.kefu{
		right: 6%;
	}
	.tuijian{
		/* right: 6%; */
	}
	.cha{
		right: 15%;
	}
	.footer .container{
		flex-wrap: wrap;
	}
	.link-select select{
		width: 200px;
	}
   }
   @media (max-width: 576px) {
	.page-index .search-input-wrap{
		margin-top: 0px;
	}
	
	.page-index .search-tab.active::after{
		bottom: -9px;
	}
	.page-index .banner-content{
		top: 18%;
	}
	.page-index .banner-swiper, .banner-swiper .swiper-slide{
		height: auto;
	}
	.page-index .logo img{
		width: 120px;
	}
	    .kefu {
        right: 30%;
        bottom: 0;
        top: 13%;
    }
	.tuijian {
        /* right: 30%;
        bottom: 0;
        top: 28%; */
		width: 100px;
        height: 80px;
		font-size: 12px;
        padding: 5px;
        line-height: 14px;
		 white-space: nowrap;
  /* 2. 隐藏超出容器宽度的文字 */
  overflow: hidden;
  /* 3. 给超出部分添加省略号（可选，根据需求决定） */
  text-overflow: ellipsis;
    }
	    .tuijian img {
        margin: 20px auto;
        width: 60px;
    }
	.cha{
		right: 37%;
        bottom: 0;
        top: 38%;
	}
	.cha img{
		width: 20px;
    height: 20px;
	}
	.video-control{
		width: 40px;
		height: 40px;
	}
	.video-control img{
		width: 40px;
		height: 40px;
	}
  
   	.banner-title {
   		font-size: 20px;
   	}

   	.page-index .search-tabs {
   		flex-wrap: wrap;
   	}

   	.video-player {
   		height: 200px;
   	}

   	.apartment-imgs {
   		grid-template-columns: 1fr;
   	}
	.ttok{
		margin-left: 13%;
	}
	.link-select{
		margin-bottom: 10px;
	}
	.bort{
		margin-bottom: 10px !important;
	}
   	.footer .container {
   		/* grid-template-columns: 1fr; */
   	}

   	/* 移动端隐藏轮播导航按钮，保留触摸滑动 */
   	.banner-swiper .swiper-button-prev,
   	.banner-swiper .swiper-button-next,
   	.service-swiper .swiper-button-prev,
   	.service-swiper .swiper-button-next {
   		display: none !important;
   	}
   }

   /* about.html */
   

        /* 全局样式 */
        :root {
            --primary-red: #D90000;
            --light-gray: #F5F5F5;
            --dark-gray: #666;
            --white: #FFFFFF;
            --border-gray: #E0E0E0;
        }
  

    

        /* 主体容器 */
        .page-about .container {
            display: flex;
            position: relative;
            max-width: 1200px;
           
        }
        .about{
 padding: 70px 20px;
 background: #f9f9f9;
        }
        /* 右侧悬浮导航 */
        .right-nav {
            position: fixed;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 999;
        }

        .right-nav-item {
            display: flex;
            align-items: center;
            margin: 10px 0;
            cursor: pointer;
        }

        .right-nav-icon {
            width: 40px;
            height: 40px;
            background-color: var(--primary-red);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            margin-right: 0;
            transition: margin-right 0.3s ease;
        }

        .right-nav-text {
            background-color: var(--primary-red);
            color: white;
            padding: 8px 12px;
            border-radius: 4px;
            margin-left: -100px;
            opacity: 0;
            transition: all 0.3s ease;
            white-space: nowrap;
        }

        .right-nav-item:hover .right-nav-icon {
            margin-right: 10px;
        }

        .right-nav-item:hover .right-nav-text {
            margin-left: 0;
            opacity: 1;
        }

        /* 内容区域 */
        .content {
            flex: 1;
            margin-right: 80px;
        }

        /* 顶部切换标签 */
        .tab-header {
            display: flex;
            /* border-bottom: 1px solid var(--border-gray); */
            margin-bottom: 20px;
        }

        .tab-item {
            color: #333;
            padding: 10px 20px;
            cursor: pointer;
            font-size: 16px;
            position: relative;
            margin-right: 45px;
        }

        .tab-item.active {
            width: 120px;
            height: 45px;
            background: #BC050E;
            border-radius: 23px;
            color: #fff;
            font-weight: bold;
            text-align: center;
        }
        .tab-text{
            width: 100%;
            height: 140px;
            background: url(../img/company.png) no-repeat;
            background-size: contain;
        }
        /* .tab-item.active::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            width: 100%;
            height: 3px;
            background-color: var(--primary-red);
        } */

        /* 标签内容容器 */
        .tab-content {
            display: none;
        }

        .tab-content.active {
            display: block;
            animation: fadeIn 0.3s ease;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        /* 公司简介样式 */
        .company-profile {
            line-height: 1.8;
            color: var(--dark-gray);
        }

        .profile-top {
            display: flex;
            justify-content: space-between;
            margin-bottom: 20px;
            flex-wrap: wrap;
        }

        .contact-card {
            width: 545px;
            height: 240px;
            background-color: #FFF;
            padding: 20px;
            border-radius: 4px;
            width: 48%;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            border-bottom: 3px solid #CE2B0F;
        }

        .contact-card .icon {
            padding: 60px 35px;
        }
        .contact-card h3{
            font-size: 24px;
color: #333333;
        }
        .contact-card p{
            font-size: 18px;
color: #333333;
margin-top: 20px;
font-style: normal;
        }
        .profile-img {
            width: 100%;
            /* height: 600px; */
            background-color: #E0E0E0;
            margin-bottom: 20px;
            background: url('../img/img1.png') no-repeat;
            background-size: 100% 100%;
            background-position: center;
            color: #333;
        }
        .profile-img p{
            padding: 50px 70px 50px 400px;
        }
        .profile-stats {
            display: flex;
            margin: 20px 0;
            padding: 20px 70px 300px 400px;
        }

        .stat-item {
            margin-right: 30px;
        }

        .stat-number {
            font-size: 24px;
            color: var(--primary-red);
            font-weight: bold;
        }

        .stat-text {
            font-size: 14px;
            color: var(--dark-gray);
        }

        /* 意见反馈样式 */
        .feedback-form {
            /* max-width: 800px; */
            background: #FFF;
            padding: 40px 30px;
        }

        .feedback-input {
            width: 100%;
            height: 150px;
            border: 1px solid var(--border-gray);
            border-radius: 4px;
            padding: 10px;
            resize: none;
            outline: none;
            margin-bottom: 20px;
            background: #f9f9f9;
        }

        .char-count {
            text-align: right;
            font-size: 12px;
            color: var(--dark-gray);
            margin-top: -15px;
            margin-bottom: 10px;
        }

        .image-upload {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-bottom: 20px;
        }

        .uploaded-img {
            width: 100px;
            height: 100px;
            background-color: #E0E0E0;
            border-radius: 4px;
            overflow: hidden;
        }

        .uploaded-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .upload-btn {
            width: 100px;
            height: 100px;
            border: 1px dashed var(--border-gray);
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: var(--dark-gray);
        }

        .upload-btn input {
            display: none;
        }

        .submit-btn {
            background: #BC050E;
border-radius: 25px;

            color: white;
            border: none;
            padding: 10px 30px;
            cursor: pointer;
            font-size: 16px;
        }
	#boss{
		font-size: 14px;
color: #666666;
line-height: 24px;
margin-bottom:5vh;
	}
        /* 销售专员样式 */
        .tab-wotk{
            width: 100%;
            height: 140px;
            background: url(../img/work.png) no-repeat;
            background-size: contain;
        }
        .sales-container {
            display: flex;
        }

        .sales-nav {
            width: 200px;
            border-right: 1px solid var(--border-gray);
            padding-right: 20px;
        }

        .sales-nav-item {
           color: #666;
           font-size: 18px;
            background: #F0F0F0;
            border-radius: 12px;
            padding: 18px 20px;
            cursor: pointer;
            margin-bottom: 5px;
            border-radius: 22px;
            transition: all 0.2s ease;
        }

        .sales-nav-item.active {
          background: url(../img/red.png) no-repeat;
            color: white;
        }

        .sales-content {
    flex: 1;
    padding: 30px;
    /* 关键：开启相对定位，为伪元素提供定位参考 */
    position: relative;
    /* 确保文字在最上层 */
    z-index: 1;
}

/* 使用 ::before 伪元素创建独立的背景层 */
.sales-content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* 渐变背景只作用于伪元素 */
    background: linear-gradient(180deg, #CD270F 0%, rgba(204, 36, 15, 0) 30%);
    /* 只调整背景的透明度，不影响文字 */
    opacity: 0.1;
    /* 确保背景层在文字下方 */
    z-index: -1;
}
        
        .sales-card {
            display: none;
        }
        .sales-card h3{
            font-size: 22px;
            color: #CE2B0F;
            border-bottom: 1px solid #CE2B0F ;
            padding-bottom: 30px;
        }
        .sales-card.active {
            display: block;
        }

        .sales-contact {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 10px;
        }

        .contact-item {
            background-color: #F0F0F0;
            border-radius: 4px;
            width: calc(33.33% - 15px);
            padding: 20px;
            margin: 20px 0px;
        }

        .contact-title {
            font-weight: bold;
            margin-bottom: 10px;
            color: #333;
        }
         .contact-item p{
            color: #999;
            font-size: 14px;
            margin-bottom: 10px;
         }
     

        /* 响应式适配 */
        @media(max-width:1440px){
            .footer-cols{
		width: 225px;
	}
	.link-select select{
		width: 225px;
	}
	.footer-cols ul li a{
		font-size: 14px;
	}
	.footer-col h4{
		font-size: 14px;
		margin-bottom: 15px;
		padding-bottom: 0px;
	}
	.footer-col ul li a{
		font-size: 14px;
	}
	.footer .container{
		/* max-width: 782px !important; */
	}
	.footer-cold{
		margin-left: 21% !important;
	}
	.service-swiper .swiper-slide{
		width: 150px !important;
		margin-right: 0px !important;
	}
	.footer-cols{
		margin-left: 60px;
	}
        }
        @media (max-width: 992px) {
            .content{
                margin-right: 0px;
            }
            .footer-column {
                width: 33.33%;
            }

            .contact-item {
                width: calc(50% - 10px);
            }
        }

        @media (max-width: 768px) {
            .nav-list {
                flex-wrap: wrap;
            }

            /* .profile-top {
                flex-direction: column;
            } */

            .contact-card {
                width: 45%;
            }
            .contact-card .icon{
                padding: 10px;
            }
            .contact-card h3{
                font-size: 16px;
            }
            .contact-card p{
                font-size: 14px;
            }
            .sales-container {
                /* flex-direction: column; */
            }
            .profile-img{
                height: 400px;
            }
            .profile-img p {
    padding: 50px 70px 0px 200px;
}
            .sales-nav {
                width: 40%;
                border-right: none;
                border-bottom: 1px solid var(--border-gray);
                padding-bottom: 10px;
                margin-bottom: 20px;
            }

            .footer-column {
                width: 50%;
            }

            .right-nav {
                display: none;
            }

            .content {
                margin-right: 0;
            }
        }

        @media (max-width: 576px) {
            .footer-column {
                width: 100%;
            }

            .contact-item {
                width: 100%;
            }

            .tab-header {
               flex-wrap: wrap;
            }
            .tab-item{
                width: 45%;
                margin-right: 0px;
                text-align: center;
            }
            .tab-item.active{
                width: 45%;
            }
            .contact-card{
                width: 55%;
                height: auto;
                margin: 10px auto;
            }
            .profile-img p{
                padding: 10px 20px;
            }
            .profile-stats{
                padding: 20px;
            }
            .profile-img{
                height: auto;
            }
        }

		/* map.css */
		
    /* 全局样式重置 */
   
  /* 地图图片容器 - 替换原百度地图容器 */
        #mapContainer{
            position: absolute;
            top: 60px; /* 避开顶部筛选栏 */
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 1;
            overflow: hidden;
            background-color: #e5e3df;
        }
        #mapImage {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
        }
        /* 点位容器 */
        #markerContainer {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none; /* 允许点击穿透到底层图片 */
            z-index: 2;
        }
        /* 聚合点样式 */
        .cluster-marker {
            position: absolute;
            width: 3.75vw;
            height: 3.75vw;
            border-radius: 50%;
            background: #C10300;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            color: #fff;
            cursor: pointer;
            transform: translate(-50%, -50%);
            pointer-events: auto;
			font-size: 0.833vw;
        }
        .cluster-marker:hover {
            background: rgba(255, 60, 65, 0.9);
        }
        .cluster-name {
            font-size: 0.625vw;
            font-weight: 600;
            margin-bottom: 0.208vw;
            font-style: normal;
        }
        .cluster-count {
            font-size: 0.625vw;
            font-weight: 600;
            font-style: normal;
        }
        /* 楼盘点位样式 */
        .house-marker {
             display: none !important;
            /* position: absolute;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background-color: #ff5a5f;
            cursor: pointer;
            transform: translate(-50%, -50%);
            pointer-events: auto;
            z-index: 3; */
        }
        /* 地铁圈样式 */
        .subway-circle {
            position: absolute;
            border: 2px solid #ff5a5f;
            border-radius: 50%;
            background: rgba(255, 90, 95, 0.1);
            transform: translate(-50%, -50%);
            pointer-events: none;
            z-index: 1;
        }
        /* 地铁统计标签 */
        .subway-count-label {
            position: absolute;
            background: rgba(255, 90, 95, 0.9);
            color: #fff;
            padding: 8px 12px;
            border-radius: 4px;
            font-size: 14px;
            transform: translate(-50%, -50%);
            pointer-events: auto;
            z-index: 4;
        }
        .subway-count-label .count {
            font-weight: bold;
            font-size: 16px;
        }
        /* 信息窗口样式 */
        .page-map .info-box {
            position: absolute;
            width: 220px;
            background: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
            z-index: 100;
            transform: translate(-50%, -100%);
            pointer-events: auto;
        }
      .page-map .info-content {
            padding: 12px;
        }
        .page-map .info-name {
            font-size: 16px;
            font-weight: bold;
            color: #333;
            margin-bottom: 8px;
        }
        .page-map .info-detail {
            font-size: 14px;
            color: #666;
            margin-bottom: 4px;
        }
        .page-map .info-detail .red {
            color: #E63946;
            font-weight: bold;
        }
        .info-arrow {
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid #fff;
            margin: 0 auto;
        }
        .info-close {
            position: absolute;
            top: 8px;
            right: 8px;
            width: 16px;
            height: 16px;
            cursor: pointer;
            background: url(https://mapopen-pub.baidu.com/svg/close.svg) center/contain no-repeat;
        }
        
        .subway-btn {
            padding: 8px 15px;
            background: #ff5a5f;
            color: #fff;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
            position: relative;
        }
        /* 地铁线路下拉框 */
        .subway-dropdown {
            position: absolute;
            top: 50px;
            right: 0;
            background: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
            padding: 15px;
            z-index: 998;
            display: none;
            min-width: 200px;
        }
        .subway-item {
            padding: 8px 12px;
            font-size: 14px;
            cursor: pointer;
            border-radius: 4px;
            margin-bottom: 8px;
			color: #333;
        }
        .subway-item:last-child {
            margin-bottom: 0;
        }
        .subway-item:hover {
            background: #f8f8f8;
        }
        .subway-item.active {
            background: #ff5a5f;
            color: #fff;
        }
    .page-map .container {
      width: 90%;
      max-width: 1200px;
      margin: 0 auto;
    }

    /* Header 样式 - 核心：整行布局包含logo、搜索、筛选、地图 */
    .page-map header {
      background-color: #fff;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
      padding: 12px 0;
    }

    .page-map .header-wrapper {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
    }

    /* Logo+物业类型区域 */
    .page-map .logo-area {
      display: flex;
      align-items: center;
      gap: 12px;
      flex-shrink: 0;
    }

    .page-map .logo {
      color: #E63946;
      font-weight: bold;
      font-size: 20px;
    }

    .city {
      color: #666;
      font-size: 14px;
    }

    /* 物业类型下拉框 */
    .property-type {
      position: relative;
    }

    .property-btn {
      display: flex;
      align-items: center;
      background: none;
      border: none;
      font-size: 14px;
      color: #333;
      cursor: pointer;
      padding: 4px 8px;
    }

    .property-btn:hover {
      color: #E63946;
    }

    .property-btn .arrow {
      margin-left: 4px;
      font-size: 12px;
    }

    .property-dropdown {
      position: absolute;
      top: 100%;
      left: 0;
      margin-top: 4px;
      background-color: #fff;
      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
      border-radius: 4px;
      width: 120px;
      z-index: 100;
      display: none;
    }

    .property-dropdown a {
      display: block;
      padding: 8px 12px;
      text-decoration: none;
      color: #333;
      font-size: 14px;
    }

    .property-dropdown a:hover {
      background-color: #E63946;
      color: #fff;
    }

    /* 搜索框 - 与筛选按钮同行 */
    .page-map .search-filter-wrapper {
      display: flex;
      align-items: center;
      flex: 1;
      gap: 20px;
    }

    .page-map .search-box {
      flex: 1;
      max-width: 400px;
      position: relative;
    }

    .page-map .search-input {
      /* width: 100%; */
      padding: 8px 12px 8px 32px;
      border: 1px solid #ddd;
      border-radius: 4px;
      font-size: 14px;
      outline: none;
    }

    .page-map .search-input:focus {
      border-color: #E63946;
      box-shadow: 0 0 0 2px rgba(230, 57, 70, 0.2);
    }

    .page-map .search-icon {
      position: absolute;
      left: 10px;
      top: 50%;
      transform: translateY(-50%);
      color: #999;
      font-size: 14px;
    }

    /* 筛选按钮区域 - 与搜索框同行 */
    .filter-btns {
      display: flex;
      align-items: center;
      gap: 20px;
      flex-shrink: 0;
    }

    .filter-btn {
      background: none;
      border: none;
      font-size: 14px;
      cursor: pointer;
      padding: 4px 0;
      border-bottom: 2px solid transparent;
      position: relative;
    }

    .filter-btn.active {
      color: #E63946;
      border-bottom-color: #E63946;
    }
    
    /* 筛选按钮选中标记（小红点） */
    .filter-btn.has-selection::after {
      content: '';
      position: absolute;
      top: -5px;
      right: -8px;
      width: 6px;
      height: 6px;
      background-color: #E63946;
      border-radius: 50%;
    }

    .filter-btn:hover {
      color: #E63946;
    }

    /* 地图/地铁找房功能区 */
    .map-func-area {
      display: flex;
      align-items: center;
      gap: 15px;
      flex-shrink: 0;
    }

    .map-btn, .subway-btn {
      display: flex;
      align-items: center;
      background: none;
      border: none;
      font-size: 14px;
      color: #333;
      cursor: pointer;
      gap: 4px;
    }

    .map-btn:hover, .subway-btn:hover {
      color: #E63946;
    }

    /* 筛选弹窗通用样式 - 统一为目标样式 */
    .filter-popup {
      position: absolute;
      background-color: #fff;
      box-shadow: 0 4px 16px rgba(0,0,0,0.12);
      border-radius: 8px;
      padding: 16px;
      z-index: 100;
      display: none;
      border: 1px solid #f0f0f0;
	  left: 50% !important;
	  transform: translateX(-50%);
    }

    /* 面积筛选弹窗 */
    .area-filter {
      width: 520px;
      margin-top: 8px;
    }

    /* 户型筛选弹窗 */
    .layout-filter {
      width: 520px;
      margin-top: 8px;
    }

    /* 区域筛选弹窗 */
    .region-filter {
      width: 520px;
      margin-top: 8px;
    }

    /* 多选筛选弹窗 */
    .multi-filter {
      width: 520px;
      margin-top: 8px;
    }

    /* 多选弹窗分类标题 */
    .filter-category-title {
      font-size: 15px;
      font-weight: 600;
      color: #666;
      margin: 16px 0 8px 0;
    }
    .filter-category-title:first-child {
      margin-top: 0;
    }

    /* 筛选选项通用样式 */
    .filter-option {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
	  margin-right: 20px;
    }

    .filter-option label {
      font-size: 14px;
      color: #333;
      cursor: pointer;
    }

    .filter-option input[type="checkbox"] {
      width: 16px;
      height: 16px;
      accent-color: #E63946;
      cursor: pointer;
    }
    
    /* 选中的筛选选项高亮样式 */
    .filter-option.selected {
      background-color: #fff0f0;
      border-radius: 4px;
    }

    /* 面积自定义输入 */
    .custom-area {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 16px 0;
    }

    .custom-area input {
      width: 80px;
      padding: 4px 8px;
      border: 1px solid #ddd;
      border-radius: 4px;
      font-size: 14px;
      outline: none;
    }

    .custom-area input:focus {
      border-color: #E63946;
    }

    .custom-area span {
      color: #999;
      font-size: 14px;
    }

    /* 筛选操作按钮 */
    .filter-actions {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 16px;
      padding-top: 16px;
      border-top: 1px solid #f0f0f0;
    }

    .page-map .reset-btn {
      background: none;
      border: none;
      color: #999;
      font-size: 14px;
      cursor: pointer;
    }

    .page-map .reset-btn:hover {
      color: #E63946;
    }

    .page-map .btn-group {
      display: flex;
      gap: 8px;
    }

    .page-map .btn {
      padding: 6px 12px;
      border-radius: 4px;
      font-size: 14px;
      cursor: pointer;
      border: none;
    }

    .cancel-btn {
      background-color: #f5f5f5;
      color: #333;
    }

    .cancel-btn:hover {
      background-color: #eee;
    }

    .confirm-btn {
      background-color: #E63946;
      color: #fff;
    }

    .confirm-btn:hover {
      background-color: #d42f3d;
    }



	/* news.css */
	
    /* 列表页专属样式 */
    .main{
          width: 100%;;
    margin: 0 auto;
   background: #f4f4f4;
   padding-top: 50px;
}
   
.search-container {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 20px;
            border-bottom: 1px solid #E2E2E2;
            margin-bottom: 20px;
        }

        /* 下拉框容器 */
        .dropdowns {
            position: relative;
         
            background: #FFFFFF;
            border-radius: 24px;
            color: #999;
        }

        /* 下拉框触发按钮 */
        .dropdown-btn {
             width: 320px;
            height: 48px;
            padding: 8px 12px;
           border-radius: 24px;
            background: #fff;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 5px;
            font-size: 18px;
            padding: 0px 30px;
        }
        .dropdown-btn::after {
            content: "▼";
            font-size: 12px;
            color: #999;
            margin-left: 65%;
        }
        .dropdowns::after {
          content: none !important;
        }
        /* 下拉选项列表 */
        .dropdown-list {
          width: 140px;
            position: absolute;
            top: 100%;
            left: 0;
            margin-top: 20px;
            padding: 30px;
            list-style: none;
            border: 1px solid #ddd;
            border-radius: 4px;
            background: #fff;
box-shadow: 0px 0px 28px 0px rgba(0,0,0,0.1);
border-radius: 32px;
            min-width: 100px;
            display: none; /* 默认隐藏 */
            z-index: 100; /* 防止被遮挡 */
            font-size: 16px;
            color: #000;
        }
        /* 新增：显示状态的类 */
        .dropdown-list.show {
            display: block;
        }

        /* 下拉选项样式 */
        .dropdown-list li {
            padding: 10px 0px;
            cursor: pointer;
        }
        .dropdown-list li:hover {
            color: red; /* 鼠标移入年份时字体变红 */
            /* background: #f8f8f8; */
        }

        /* 搜索框 */
        .news-search-input {
            width: 700px;
          height: 48px;
          background: #FFFFFF;
          border-radius: 24px;
          padding: 0px 30px;
          font-size: 18px;
          border: none;
          background: #FFF;
          outline: none;
        }
     
        /* 查询按钮 */
        .news-search-btn {
           width: 140px;
            height: 48px;
            background: #F7B500;
            border-radius: 24px;
            color: #fff;
            text-align: center;
            border: none;
        }
        .search-btn:hover {
            background: #f8a50a;
        }

    .news-list {
      width: 1200px;
      display: flex;
      flex-direction: column;
      /* gap: 20px; */
    }

    .news-item {
      height: 260px;
      display: flex;
      align-items: center;
      gap: 20px;
      padding: 15px;
      border-bottom: 1px solid #cac9c7;
      border-radius: 5px;
      transition: all 0.3s;
      position: relative;
      overflow: hidden;
    }

    /* 鼠标移入背景图 */
    .news-item:hover {
      background: url('../img/detail-bg.png') no-repeat center/cover;
      color: #fff;
    }

    .news-date {
      color: #333;
      min-width: 80px;
      text-align: center;
      transition: color 0.3s;
    }
    .date-top{
      font-size: 52px;
    }
    .middle{
      width: 45px;
height: 1px;
border: 1px solid #333333;

    }
    .date-bot{
      font-size: 30px;
      font-style: normal;
    }
    .news-item:hover .news-date {
      color: #fff;
    }

    .news-content {
      flex: 1;
      padding: 60px 40px 60px 0;
      color: #999;
    }
    .shang{
      padding: 10px 0 20px 0;
    }
    .shang span{
      padding: 0 14px;
    }
    .news-title {
      font-size: 24px;
      margin-bottom: 10px;
      color: #333;
      transition: color 0.3s;
    }

    .news-item:hover .news-title {
      color: #d00;
    }

    .news-desc {
      color: #666;
      font-size: 14px;
      line-height: 1.6;
    }

    .news-item:hover .news-desc {
      color: #777;
    }
    .news-item:hover .middle{
      border: 1px solid transparent;
    }

    .news-img {
      width: 320px;
      height: 190px;
      object-fit: cover;
      border-radius: 3px;
    }

    /* 分页样式 */
    .pagination {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 10px;
      margin-top: 40px;
      margin-bottom: 100px;
    }

    .pagination-btn {
      height: 35px;
      width: 35px;
      border: 1px solid #ccc;
      background: #fff;
      border-radius: 3px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s;
    }
.pagination a {
    position: relative;
    display: inline-flex;
    align-items: center;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}
.pagination span{
background-color: #C8102E;
      color: #FFFFFF;
      border-color: #C8102E;
position: relative;
    display: inline-flex;
    align-items: center;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
}
    
.pagination a {
    margin: 0 2px;
    border-radius: 4px;
    border-style: solid;
}
    /* 响应式适配 */
    @media (max-width: 768px) {
      .news-item {
        /* flex-direction: column; */
      }
      .news-desc{
         overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;    /* 显示2行，超出隐藏 */
  -webkit-box-orient: vertical;
      }
      .date-top{
        font-size: 24px;
      }
      .date-bot{
        font-size: 18px;
      }
      .news-img {
        width: 30%;
      }

      .news-filter {
        flex-direction: column;
        align-items: stretch;
      }
      @media(max-width:576px){
        .search-container{
            flex-wrap: wrap;
        }
        .news-search-input{
            width: 320px;
        }
        .news-content{
            padding: 0;
        }
        .news-img{
            width: 60px;
            height: 60px;
        }
        .news-item{
            height: 200px;
        }
      }
    }



    /* news-detail */
    .main {
    background: #f4f4f4;
    padding-top: 50px;
    padding-bottom: 100px;
}
   
.news-detail-position {
    background: #FFF;
    width: 100%;
    height: 58px;
    background: #FFFFFF;
    border-radius: 12px;
    margin: 40px 0 20px 0;
    display: flex;
    align-items: center;
}

.position-img {
    margin-left: 20px;
}

/* 面包屑容器 */
.position-li {
    margin: 20px;
    font-size: 14px;
    color: #333;
}

/* 导航项横向排列 */
.position-li ul {
    display: flex;
    align-items: center;
}

/* 每个导航项样式 */
.position-li li {
    margin-right: 8px;
}

/* 分隔符（>）样式 */
.position-li li:not(:last-child)::after {
    content: ">";
    margin-left: 8px;
    color: #999;
}

/* 详情页专属样式 */
.news-detail-header {
    padding: 20px 0;
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
}

.news-detail-title {
    font-size: 32px;
    margin-bottom: 15px;
    color: #333;
}

.news-detail-meta {
    color: #999;
    font-size: 16px;
}

.news-detail-content {
    line-height: 1.8;
    font-size: 16px;
    color: #333;
}

.news-detail-content img {
    max-width: 80%;
    margin: 20px auto;
    display: block;
    border-radius: 5px;
}

.news-detail-content p {
    margin-bottom: 15px;
    text-indent: 2em;
}

.news-side {
    /* padding: 15px; */

    margin-bottom: 20px;
}

.news-side-title {
    width: 380px;
    height: 80px;
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 22px;
    color: #CE280D;
    line-height: 32px;
    background: url(../img/new-bg.png)no-repeat;
    padding: 40px;
}

.news-side-title img {
    width: 30px;
    height: 30px;
}

.news-side-list li {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #eee;
    padding: 30px 40px 20px 40px;
}

.news-side-list li:last-child {
    border-bottom: none;
    /* 可选：如果想同时去掉最后一个li的底部外边距，取消下面注释 */
    /* margin-bottom: 0; */
}

.news-side-list li a {
    font-size: 20px;
    color: #333333;
    line-height: 28px;
    font-style: normal;
    transition: color 0.3s;
}

.news-side-list li p {
    margin-top: 10px;
    font-size: 16px;
    color: #999999;
}

.news-side-list li a:hover {
    color: #d00;
}

.news-nav {
    max-width: 750px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
    padding-top: 20px;
}

.news-nav a {
    color: #999;
    transition: color 0.3s;
    background: #FFFFFF;
    border-radius: 12px;
    padding: 20px;
}

.news-nav a:hover {
    color: #d00;
}

.news-detail-paper {
    display: flex;
}

.paper-left {
    background: #FFF;
    padding: 40px;
    max-width: 780px;
}

.wuye {
    text-align: right;
    /* right; */
    color: #999;
    padding: 20px 30px;
    height: 70px;
    color: #CE2B0F;
    background: #FFF7F7;
    border-radius: 8px;
}

.paper-right {
    border-radius: 15px;
    margin-left: 40px;
    background: #FFF;
    max-height: 440px;
}

.edit-container{ width: 1500px; margin: 0 auto; position: relative;}

@media (max-width: 1680px) {
	.edit-container{ width: 1200px; margin: 0 auto;}
	.page-index .input-with-hidden{ max-height: 180px;}
	.page-index .input-with-hidden li{ font-size: 12px; padding: 10px;}
	
}

@media (max-width: 1400px) {
	.edit-container{ width: 1050px; margin: 0 auto;}
}

/* 响应式适配 */
@media (max-width: 992px) {
	.edit-container{ width: 100%;}
    .news-side-title {
        width: 220px;
        height: 60px;
    }

    .news-side-list li {
        padding: 10px;
    }

    .news-side-list li a {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .news-detail-content img {
        max-width: 100%;
    }

    .news-detail-title {
        font-size: 20px;
    }

}

@media (max-width: 576px) {
	.page-index .service-title{ margin-left: 0;}
    .position-li ul {
        flex-wrap: wrap;
    }

    .news-detail-paper {
        display: block;
    }

    .paper-left {
        margin-bottom: 20px;
    }

    .paper-right {
        margin-left: 0px;
    }

    .news-side-title {
        width: 100%;
        background-size: cover;
    }

    .news-nav {
        flex-wrap: wrap;
    }
}