* {
			padding: 0;
			margin: 0;
			
		}

		.bg {
			width: 100%;
			height: 100vh;
			background: url(../img/bg.jpg);
			background-size: 100% 100%;
			margin: auto;
			overflow: hidden;
			color:#465f5f;
			position: fixed;
			top: 0;
			 left: 0;
			 right: 0;
			 bottom: 0;
			 touch-action: none;/* 禁止背景放大 */
			

		}





















		.bk {
			width: 1100px;
			height: 850px;
			background: url(../img/bk2.png) 100% 100%;
			background-size: 100% 100%;
			margin: auto;
			transition: transform 0.1s;
			/* 平滑过渡效果 */
			transform-origin: center center;
			/* 设置变换的中心点 */
			 margin-top:10px;
			 cursor: grab;
			position: relative; /* 确保拖拽可以定位 */
			
			 -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  user-select: none; /* Standard syntax */
			
			
		}


.container {
            width: 100vw; /* 占满整个视口宽度 */
            height: 100vh; /* 占满整个视口高度 */
            overflow: hidden; /* 隐藏超出容器的内容 */
            position: relative; /* 容器相对定位 */
            border: 1px solid #ccc;
        }








		.cate {
			position: absolute;
			right: 2%;
			top: 8%;
			 -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
  user-select: none; /* Standard syntax */
		}
		
		.cate-item{
			display: flex;
			background-color: #ffffff;
			margin-top: 10px;
			padding: 5px;
			border-radius: 15px;
			justify-content: space-around;
			font-size: 15px;
			width:150px;
			
			
		}
		
		.cate-item img{
			width: 20px;
			height: 20px;
			float:left;
		}


		.alert_a {
			width: 100%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			position: fixed;
			top: 0%;
			left: 0%;
		}

		.alert_a-content {
			width: 1200px;
			height: 600px;
			background-color: #ffffff;
			margin: auto;
			border-radius: 15px;
			margin-top: 12%;
			border: 5px solid #b0dcf5;
		}

		.alert_a_close {
			width: 100px;
			height: 40px;
			background-color: aqua;
			border: 1px solid gray;
			line-height: 40px;
			text-align: center;
			margin-top: 40%;
			margin-left: 47%;
			cursor: pointer;
		}

		.alert_b {
			width: 100%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			position: fixed;
			top: 0%;
			left: 0%;
			z-index: 9999;
			max-width: 100%;
			
			
			
		}

		.alert_b-content {
			width: 1200px;
			height: 800px;
			background-color: #ffffff;
			margin: auto;
			border-radius: 15px;
			margin-top: 5%;
		}

		.alert_b_close {
			width: 100px;
			height: 40px;
			background-color: aqua;
			border: 1px solid gray;
			line-height: 40px;
			text-align: center;
			margin-top: 58%;
			margin-left: 45%;
			cursor: pointer;
		}
		
				/* 标题样式 */
		.alert_b-content h2 {
			font-size: 34px;
			text-align: center;
			color:#fff;
			vertical-align: top;
			margin-top:-32.5%;
			letter-spacing: 2px;
		}

		/* 数据内容的样式 */
		.alertB-content ul {
			list-style: none;
			padding: 0;
			margin: 0;
		}

		.alertB-content li {
			font-size: 16px;
			margin-bottom: 10px;
			display: flex;
			justify-content: space-between; /* 左右分开显示 */
			align-items: center;
		}

		.type_1 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
			font-weight: 600;
			color:#163b5c;
			font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
		}

		.type_1 img {
			margin-left: 10px;
			width: 20px;
			/* height: 50px; */
		}
		.type_2 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
		}

		.type_2 img {
			margin-left: 10px;
			width: 40px;
			/* height: 50px; */
		}
		
		.type_3 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
		}

		.type_3 img {
			margin-left: 10px;
			width: 80px;
			/* height: 50px; */
		}
		.type_4 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
		}

		.type_4 img {
			margin-left: 10px;
			width: 60px;
			/* height: 50px; */
		}
		.type_5 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
		}

		.type_5 img {
			margin-left: 10px;
			width: 50px;
			/* height: 50px; */
		}
		.type_6 {
			display: inline-block;
			position: relative;
			font-size: 10px;
			cursor: pointer;
		}

		.type_6 img {
			margin-left: 10px;
			width: 35px;
			/* height: 50px; */
		}

		.a1 {
			left: 3%;
			top: 44%;
		}
		.a2 {
			left: 4%;
			top: 33.5%;
		}
		.a3 {
			left: 0%;
			top: 53%;
		}
		.a {
			left: -3%;
			top: 44%;
		}

		.b {
			left: 0%;
			top: 25%;
		}
		.b2 {
			left: -8%;
			top: 2%;
		}
		.b3 {
			left: -6.0%;
			top: 5.5%;
		}
		.b4 {
			left: -11.5%;
			top: 20.4%;
		}
		.b5 {
			left: -8.5%;
			top: 10%;
		}
		

		.c {
			left: -11%;
			top: 17%;
		}
		.c2 {
			left: -12.5%;
			top: 4%;
		}
		.d {
			left: -15%;
			top: 11%;
		}
		.d2 {
			left: -16%;
			top: 9%;
		}
		.d3 {
			left: -18%;
			top: 17.5%;
		}
		.d4 {
			left: -28%;
			top: 22.5%;
		}
		.d5 {
			left: -33.5%;
			top: 33%;
		}

		.n {
			left: -24.5%;
			top: 3.5%;
		}
		.n2 {
			left: -25%;
			top: 8%;
		}


		.e {
			left: 55%;
			top: -3%;
		}

		.f {
			left: 44%;
			top: 1%;
		}

		.g {
			left: 42%;
			top: 9%;
		}

		.h {
			left: 28%;
			top: 11%;
		}

		.i {
			left: 17%;
			top: 21%;
		}
		.i2 {
			left: 18%;
			top: 19%;
		}
		.i3 {
			left: 23%;
			top: 15%;
		}
		.i4 {
			left: 1%;
			top: 30%;
		}
		.i5 {
			left: 10%;
			top: 28.5%;
		}
		.i6 {
			left: 10%;
			top: 25%;
		}

		.j {
			left: 15%;
			top: 22%;
		}
		.j2 {
			left: 3%;
			top: 18%;
		}
		.j3 {
			left: 6%;
			top: 18.5%;
		}
		.j4 {
			left: -4%;
			top: 30%;
		}



		.k {
			left: 68%;
			top: 28%;
		}

		.l {
			left: 41%;
			top: 34%;
		}
		.l2 {
			left: 44%;
			top: 37%;
		}
		.l3 {
			left: 38.5%;
			top: 48%;
		}

		.m {
			left: 45.5%;
			top: 54%;
		}
		.m2 {
			left: 39%;
			top: 44%;
		}
		.m3 {
			left: 35%;
			top: 62%;
		}
		.m4 {
			left: 31%;
			top: 51%;
		}
		#title {
			position: relative;
            margin: 0px 0;
            font-size: 34px;
            font-weight: bold;
            text-align: center;
            z-index: 1000;
            background: rgba(255, 255, 255, 1.0);
            width: 100%;
            padding: 10px 0;
        }
		
		
		.list {
			position: absolute;
			right: 5%; /* 距离右侧的距离，可以根据需要调整 */
			top: 15%;   /* 距离顶部的距离，可以根据需要调整 */
			display: flex;
			flex-direction: column; /* 按钮垂直排列 */
			align-items: center; /* 按钮水平居中 */
			-webkit-user-select: none; /* Safari */
			  -moz-user-select: none; /* Firefox */
			  -ms-user-select: none; /* IE10+ */
			  user-select: none; /* Standard syntax */

		}

		/* 修改右侧所有按钮的大小和样式 */
		.list .item {
			width: 120px; /* 按钮的宽度 */
			height: 40px; /* 按钮的高度 */
			background-color: #d5ecfa; /* 例如，设置为番茄红色 */
			color: #4b7b96; /* 设置文字颜色为白色 */
			border: 3px solid #b0dcf5;/* 修改边框颜色 */
			border-radius: 5px; /* 圆角边框 */
			margin:2px 0; /* 按钮之间的垂直间距 */
			font-size: 16px; /* 字体大小 */
			text-align: center; /* 文本居中 */
			line-height: 33px; /* 使文本垂直居中 */
			cursor: pointer; /* 鼠标悬停时显示为指针 */
			letter-spacing: 2px;
			font-weight: bold;

		}
		







		
	.alert_b-content {
			width: 980px; /* 设置弹出框的宽度 */
			height: 580px; /* 设置弹出框的高度 */
			background-color: transparent;
			background-image: url(../img/tcbj.png); /* 背景图片 */
			background-size: cover; /* 背景图片覆盖整个容器 */
			background-position: center; /* 背景图片居中显示 */
			padding: 20px; /* 添加一些内边距 */
			border-radius: 10px; /* 边框圆角 */
			box-shadow: 0 4px 8px rgba(0,0,0,0); /* 阴影效果 */
			display: flex; /* 使用flex布局 */
			flex-direction: column; /* 子元素垂直排列 */
			justify-content: center; /* 内容垂直居中 */
			align-items: center; /* 内容水平居中 */
			position: fixed; /* 固定定位 */
			left: 50%; /* 水平居中 */
			top: 40%; /* 垂直居中 */
			transform: translate(-50%, -50%); /* 偏移自身尺寸的一半，以确保完全居中 */
			z-index: 100; /* 确保弹出框位于其他内容之上 */
			
		}
	.alert_b-content h1{top:110px;color:blue;}
    .alert_b_close {
        cursor: pointer;
        position: absolute;
        top: -45px;
        left: -73px;
        font-size: 24px;
        color: #fff;
		width: 245px;
		height: 63px;
		line-height:63px;
		border-radius: 30px;
		background-color:#aaeba9;
		border:0px;
		letter-spacing: 2px;
		font-weight: 600;
		font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
    }
    
    .alert_b_close:hover {
        color: #96b995;
    }
	
		.app-content {
			/* width: 1100px;
			height: 800px; */
			margin:0 auto;
			position: relative;
		}
		.modal-content {
			min-width: 99%; /* 设置子元素的最小宽度 */
			max-width: 99%; /* 设置子元素的最大宽度 */
			width: 99%;
			padding:10px;			
			height: auto;
			background-color:  rgba(255, 255, 255,);
			margin: auto;
			margin-top:10%;
			margin-bottom:10%;
			border-radius: 15px;
			border: 5px solid #b0dcf5;
			-webkit-user-select: none; /* Safari */
		  -moz-user-select: none; /* Firefox */
		  -ms-user-select: none; /* IE10+ */
		  user-select: none; /* Standard syntax */
		}
		.address-list {
			display: flex;
			flex-direction: wrap;
			width: 100%;
			flex-wrap: wrap;
			display: flex;
		  justify-content: center;
		  align-items: center;
		
		}
		
		
		.item-address {
			font-size:16px;
			background-color: #e4f8ff;
			line-height: 20px;
			color:#68899c;
			border-radius: 4px;
			min-width: 140px;
			padding: 10px 10px;
			box-sizing: border-box;
			margin: 6px;
			cursor: pointer;
			text-align:center;
			
		}
		
		
		
		.list .tag-item-class {
			background-color: #d6ecfa;
			/* line-height: 16px; */
			color: #68899c;
		}

		 @media {
		.modal-details {

			
				width: 100%;
				max-width: 750px;
				min-height: 660px;


			box-sizing: border-box;
			background: url(../img/stcbj2.png) 100% 100%;
			background-size: 100% 100%;
			border:none;
			padding:20px;
			position: relative;
			-webkit-user-select: none; /* Safari */
			  -moz-user-select: none; /* Firefox */
			  -ms-user-select: none; /* IE10+ */
			  user-select: none; /* Standard syntax */

			/*	position: absolute; 
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%); */
		}
		.modal-details2 {

			
				width: 100%;
				max-width: 750px;
				min-height: 400px;

			box-sizing: border-box;
			background: url(../img/stcbj3.png) 100% 100%;
			background-size: 100% 100%;
			border:none;
			padding:20px;
			position: relative;
			-webkit-user-select: none; /* Safari */
			  -moz-user-select: none; /* Firefox */
			  -ms-user-select: none; /* IE10+ */
			  user-select: none; /* Standard syntax */

			/*	position: absolute; 
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%); */
		}
		.model-tag {
			left: 7%;
				top:9.4%;
				font-weight: bold;
				font-size: 16px;
				color:#fff;
				font-weight: bold;
				position: absolute;
				width:30%;
				text-align: center;
			
		}
		.model-title {
			color:#fff;
			font-weight: bold;
			font-size: 18px;
			position: absolute;
			/* left:125px; */
			left:42%;
			top:9.2%;
		}
		.model-tag2 {
			left: 7%;
				top:11.5%;
				font-weight: bold;
				font-size: 16px;
				color:#fff;
				font-weight: bold;
				position: absolute;
				width:30%;
				text-align: center;
			
		}
		.model-title2 {
			color:#fff;
			font-weight: bold;
			font-size: 18px;
			position: absolute;
			/* left:125px; */
			left:42%;
			top:11.5%;
		}
		.address-text {
			position: absolute;
			width:80%;
			left: 7%;
			top: 80%;
			color:#413f40;
			font-size:16px;
			line-height:25px;
			
		}
		.address-text p{
			color:#7ac19c;
			height:25px;
			line-height:25px;
			font-weight:bold;
			font-size:16px;
			float:left;
		}
		
		.address-text2 {
			position: absolute;
			width:77%;
			left: 12%;
			top: 35%;
			color:#413f40;
			line-height:25px;
			font-size:16px;
			
		}
		.address-text2 p{
			color:#7ac19c;
			height:25px;
			line-height:25px;
			font-weight:bold;
			font-size:18px;
			float:left;
		}
		
		.address-phone {
			position: absolute;
			width:450px;
			left: 7%;
			top: 88%;
			color:#413f40;
			line-height:25px;
			font-size:16px;
		}
		.address-phone p{
			color:#7ac19c;
			height:25px;
			line-height:25px;
			font-weight:bold;
			font-size:16px;
			float:left;
		}
		.address-phone2 {
			position: absolute;
			width:450px;
			left: 12%;
			top: 49%;
			color:#413f40;
			line-height:25px;
			font-size:16px;
		}
		.address-phone2 p{
			color:#7ac19c;
			height:25px;
			line-height:25px;
			font-weight:bold;
			font-size:18px;
			float:left;
		}
		.text-wrap {
			width:350px;
			height:250px;
			position: absolute;
			left: 6%;
			top: 14%;
		}
		.code-wrap{
			width:50px;
			height:50px;
			position: absolute;
			left: 46%;
			top: 61%;
		}
		.code-wrap2{
			width:100px;
			height:100px;
			position: absolute;
			left: 46%;
			top: 42%;
		}
		.code-wrap img{width:50px;
			height:50px;}
		.address-wrap {
			width:25px;
			height:25px;
			position: absolute;
			/*right:6%;
			top: 72%;*/
		}
		.phone-wrap{
			width:25px;
			height:25px;
			position: absolute;
			/*right:6%;
			top: 82%;*/
		}
		.introduction {
			width:86%;
			position: absolute;
			left: 7%;
			top: 45%;
			font-size:16px;
			color:#413f40;
			
			 display: -webkit-box;
			  -webkit-line-clamp: 7;
			  -webkit-box-orient: vertical;
			  overflow: hidden;
			  text-overflow: ellipsis;
			  max-height: 13.7em; /* 行高1.5em的3行 */
			  line-height: 1.5em;
			  font-size:14px;
		}
		
		.introduction p {
			color:#7ac19c;
			height:25px;
			line-height:25px;
			font-weight:bold;
			font-size:16px;
		}
				
		.introduction span {
			margin-top:-15px;
			display: -webkit-box;
			  -webkit-box-orient: vertical;
			  -webkit-line-clamp: 8;
			  overflow: hidden;
			  text-overflow: ellipsis;
			  font-size:16px;
		}
		.details-btn {
			width: 140px;
			height: 40px;
			/* background-color: red; */
			bottom: 0;
			left:50%;
			position: absolute;
			transform: translate(-50%,0);
			cursor: pointer;
			z-index: 10;
		}
		.modal-dialog {
			/*min-width: 800px;*/
		}	
	
	}




/* focus */

#focus{width:350px;height:180px;overflow:hidden;margin-top:0%;}
#focus ul{width:350px;height:100%;position:absolute;}
#focus ul li{float:left;width:350px;height:180px;overflow:hidden;position:relative;background:#000;}
#focus ul li div{position:absolute;overflow:hidden;}
#focus ul li img{width:350px;height:180px;}
#focus .btnBg{position:absolute;width:350px;height:20px;left:0;bottom:0;background:#000;}
#focus .btn{position:absolute;width:350px;height:10px;padding:5px 10px;right:0;bottom:0;text-align:right;}
#focus .btn span{display:inline-block;_display:inline;_zoom:1;width:25px;height:10px;_font-size:0;margin-left:5px;cursor:pointer;background:#fff;}
#focus .btn span.on{background:#fff;}
#focus .preNext{width:25px;height:80px;position:absolute;top:25%;background:url(../img/sprite.png) no-repeat 0 0;cursor:pointer;}
#focus .pre{left:0;}
#focus .next{right:0;background-position:right top;}



 .btn-custom {
        background-color: #b6dbf6; /* 自定义背景颜色 */
        color:#3d7f97; /* 自定义字体颜色 */
        border-radius: 5px; /* 圆角 */
        padding: 10px 10px; /* 内边距 */
        font-size: 18px; /* 字体大小 */
		
	}
	
	 .modal-footer {
       border-top:0px;
	   margin-left:-20px;
    }
	
	
	
/*浮动客服*/
#floatDivBoxs{width:140px;background:#fff;position:fixed;top:20%;right:0;z-index:999;}
.floatShadow{ background:#fff;box-shadow:-2px 0 3px rgba(0,0,0,0.25);}
#rightArrow{width:50px;height:45px;background:url(../img/jt3.gif) no-repeat;position:fixed;right:140px;z-index:999;}
#rightArrow a{display:block;height:45px;}

#floatDivBoxs {
    right: -175px; /* 默认隐藏 */
}

#rightArrow {
    right: 0px; /* 调整箭头位置 */
    background-position: -50px 0; /* 显示关闭箭头的图标 */
}

	

	
	
        .slider-container {
            width: 96%;
            max-width: 1000px; /* 最大宽度 */
            margin: 20px auto;
            position: relative;
            overflow: hidden;
			height:185px; 
			margin-top:75px;
			 border-radius: 5px; 
        }
        .slider-wrapper {
            display: flex;
            transition: transform 0.5s ease;
			 
        }
        .slider-wrapper img {
            width: 99.9%;  /* 让图片宽度占满父容器 */
            height:auto; /* 图片高度自适应 */
        }
        .prev2, .next2 {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: rgba(0, 0, 0, 0.5);
            color: white;
            border: none;
            padding: 10px;
            cursor: pointer;
			
        }
        .prev2 {
            left: 10px;
        }
        .next2 {
            right: 10px;
        }
        .dots {
            text-align: center;
            padding: 10px 0;
        }
        .dots span {
            display: inline-block;
            width: 15px;
            height: 15px;
            background-color: #ddd;
            border-radius: 50%;
            margin: 0 5px;
            cursor: pointer;
        }
        .dots span.active {
            background-color: #333;
        }
			

.collapsed {
  display: -webkit-box;
  -webkit-line-clamp: 8; /* 显示6行 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;

  width: 100%; /* 固定宽度 */
  transition: -webkit-line-clamp 0.3s ease-out, width 0.3s ease-out; /* 添加过渡效果 */
  text-indent: 2em;
	margin-top:-15px;
	font-size:16px;
	


}

/* 展开时显示所有内容，并自动调整宽度 */
.expanded {
  display: block;
  white-space: normal;
  width: auto; /* 自动宽度 */
  background-color: #f1ffff; /* 展开时的背景色 */
  height:auto;


  

}		
		
		.introduction5 {
			width:86%;
			position: absolute;
			left: 7%;
			top: 43%;
			font-size:16px;
			color:#413f40;
			  line-height: 1.6em;
			  font-size:14px;
			  z-index:99999; 
			  	border-radius: 10px;
			  
		}
		
		.introduction5 p {
			color:#7ac19c;
			font-weight:bold;
			font-size:16px;
		}
				
		.introduction5 span {
			margin-top:-15px;
			font-size:16px;
			text-indent: 2em;
				
		}
		
 .expand-button {
      /* (***) 设置定位，使按钮与最后一行平行并覆盖在最后一行上方 */
      position: absolute;
      /* 设置按钮浮动在右方 */
      /* float: right; */
      /* 默认隐藏按钮 */

      /* 将按钮向上移动一行 */
      right: 0px;
      bottom: -18px;
      color: skyblue;
      /* 此处背景一定要设置， */
      
    }	
			
	.expanded-background {
        background-color: #f1ffff; /* 你可以修改为任何颜色 */
        
    }
	
	.text-expanded-style {
		font-size:16px;
		text-indent: 2em;
		background-color: #f1ffff; 
		margin-top:-15px;
		min-height:130px;
		margin-bottom:10px;
	
    }
	
	.music-icon {
					position: fixed;
					top: 6%;
					left: 2%;
					width: 35px;
					height: 35px;
					cursor: pointer;
					animation: rotate 2s linear infinite; /* 设置动画持续时间 */
					transform-origin: center; /* 确保旋转中心在元素的中心 */
					z-index:9999;
				}
				
				.paused {
			
					 animation: none; /* 暂停时去掉旋转动画 */		
					}
				@keyframes rotate {
					from {
						transform: rotate(0deg);
					}
					to {
						transform: rotate(360deg);
					}
				}