
*{
  -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

a{
  color:#000;
  text-decoration:none;
}
img{max-width:100%;}
body{
    overflow:auto;overflow-x: hidden;
     -webkit-text-size-adjust: 100% !important;
     margin:0 auto;
  min-width: 320px;

  position: relative;
}


p,h2,h3,h4,h5,h6,span,td,th,tr{
  font-family:'PingFang SC',"Source Han Sans CN" !important;
}

#app {
  font-family: "PingFang SC", miui, system-ui, -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, sans-serif;
  height: 100%;
  margin: 0 auto;
  font-size: 12px;
  overflow-x: hidden;
}

.tab_vr{
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    position: relative;
    position: fixed;
    top: 0;
    background: #fff;
    width: 100%;
	max-width: 7.5rem;
	    z-index: 100;
}
.tab_vr ul li{
	float: left;
	width: 25%;
	height:0.8rem;
	text-align: center;
	font-size: 0.26rem;
	color: rgba(117, 117, 117, 1);
	position: relative;
}
.tab_vr ul{
	height: 0.8rem;
	    box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12);
}
.tab_vr ul li a{
	line-height: 0.8rem;
}
.tab_vr ul li.active a{
	color: rgba(255, 110, 0, 1);
}
.tab_vr ul li.active:after{
position: absolute;
content: '';
bottom: 0;
width: 0.8rem;
height: 0.07rem;
background: rgba(255, 110, 0, 1);
border-radius: 0.4rem;
left: 50%;
margin-left: -.4rem;
}
.banner{
	width: 100%;
	margin-top: 0.8rem;
}
.banner img{
	width: 100%;
}
.page0{
	background-color: rgba(248, 250, 254, 1);
	height: 2.1rem;
	padding-top: 1px;
}
.page0 ul{
	display: flex;
	    flex-wrap: wrap;
	    justify-content: center;
	    flex-direction: row-reverse;
}
.page0 ul li{

	width: 33%;
	text-align: center;
	margin-top: 0.2rem;
}
.page0 ul li h3{
	font-size: 0.24rem;
	font-weight: bold;
}
.page0 ul li h4{
	font-size: 0.24rem;
	color: rgba(117, 117, 117, 1);
}
.tit h2{
	    font-weight: 600;
	    font-size: 0.32rem;
	    color: rgba(50, 50, 51, 1);
	    margin-top: 0.6rem;
	    text-align: center;
}
.tit p{
	    color: #B3B3B3;
	    font-size: 0.22rem;
	    letter-spacing: 4px;
	    text-transform: uppercase;
	    font-weight: 400;
		text-align: center;
}
.page01 .container {
    display: flex;
    align-items: flex-start;
    max-width: 7.4rem;
    margin: 0 auto;
    padding:20px 20px 0 20px;
        }
.page01 .text-content {
            flex: 1;
            padding-right: 20px;
        }
.page01 .title {
            font-size: 0.28rem;
            font-weight: bold;
			position: relative;
			margin-bottom: 0.2rem;
			padding-left: 0.2rem;
        }
.page01 .title:after{
	position: absolute;
	left: 0;
	top: 0.08rem;
	content: '';
	width: 0.1rem;
	height: 0.3rem;
	background: rgba(255, 110, 0, 1);
	border-radius: 20px;
}
.page01 .para {
            margin-bottom: 10px;
            line-height: 1.5;
			font-size: 0.23rem;
			width: 2.9rem;
        }
     .page01   .highlight {
            color: #ff6600;
        }
    .page01 .image-content {
            flex: 1;
        }
    .page01 .image-content img {
            width: 100%;
            height: auto;
            border-radius: 8px;
			margin-top: 0.6rem;
        }
.page01 .para1{
    display: flex;
    align-items: flex-start;
    max-width: 7.4rem;
    margin: 0 auto;
    padding:0 20px;
	line-height: 1.5;
	font-size: 0.23rem;
}


.page02 {
	margin-top: 0.6rem;
	padding-top: 1px;
	background: rgba(245, 246, 247, 1);
	padding-bottom: 0.6rem;
}
.page02_cont {
  max-width: 7.4rem;
  margin: 0 auto;
  padding: 20px 20px 0;
}

.page02_cont ul {
  display: flex;
  flex-wrap: wrap; 
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.page02_cont ul li {
  flex: 1;
  min-width: calc(50% - 15px); 
  box-sizing: border-box;
  background: #fff;
  border-radius: 10px;
  padding-bottom: 0.2rem;
  
  
}

.page02_cont ul li ol{
	height:1.8rem;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}

.page02_cont ul li p{
 display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; 
  overflow: hidden; 
  text-overflow: ellipsis; 
  	font-size: 0.23rem;
	padding: 0.2rem 0.2rem 0;
  line-height: 1.5; }
  
  .page04{
	  width: 7.2rem;
	  margin: 0 auto ;
	  position: relative;
  }
  
.page04 .carousel-container {
       width: 100%;
       overflow: hidden;
       position: relative;
	   margin-top: 0.4rem;
     }
 
    .page04  .carousel-container h2 {
       font-size: 18px;
       color: #333;
       text-align: center;
       margin-bottom: 5px;
     }
 
     .page04 .carousel-container p {
       font-size: 12px;
       color: #999;
       text-align: center;
       margin-bottom: 20px;
     }
 
     
     .page04 .carousel-wrapper {
       display: flex;
       align-items: center;
       justify-content: center;
       min-height: 3.8rem; 
       position: relative;
     }
 
     .page04 .carousel-item {
       position: absolute;
       width: 75%;
       transition: all 0.3s ease-out;
       transform: scale(0.6); 
       opacity: 0.6;
       pointer-events: none; 
	   border-radius: 8px;
       z-index: 1;
     }
 
    .page04  .carousel-item.active {
       transform: scale(1); 
       opacity: 1;
       pointer-events: auto;
       z-index: 3;
     }
    .page04  .carousel-item.prev {
       transform: translateX(-70%) scale(0.6);
       z-index: 2;
     }
 
     
     .page04 .carousel-item.next {
       transform: translateX(70%) scale(0.6);
       z-index: 2;
     }
 
     .page04 .carousel-item img {
       width: 100%;
       height: 200px;
       object-fit: cover;
       border-radius: 10px;
       box-shadow: 0 3px 10px rgba(0,0,0,0.1);
     }
 
     .page04 .carousel-text {
       
           text-align: left;
           padding: 1px 10px;
           position: absolute;
           bottom: 0;
           background: #0303036b;
		   border-radius: 0 0 8px 8px;
           width: 100%;
     }
 
     .page04 .carousel-text h3 {
       font-size: 0.32rem;
       color: #fff;
       white-space: nowrap;
       overflow: hidden;
	   margin-top: 10px;
       text-overflow: ellipsis;
     }
 
    .page04  .carousel-text p {
       font-size: 0.24rem;
       color: #fff;
       margin-top: 3px;
       display: -webkit-box;
       -webkit-line-clamp: 1;
       -webkit-box-orient: vertical;
       overflow: hidden;
       text-align: center; 
     }
 
     
    .page04 .progress-bar {
       display: flex;
       justify-content: center;
       margin-top: 20px;
       
     }
 
    .page04 .progress {
       width: 24px;
       height: 4px;
       
       background-color: #ddd;
       transition: all 0.3s ease;
     }
 
     .page04 .progress.active {
       width: 24px;
       border-radius: 4px;
       background-color:rgba(255, 110, 0, 1);
     }
 
     
    .page04 .swipe-hint {
       text-align: center;
       margin-top: 10px;
       font-size: 12px;
       color: #999;
     }
  
  .page05{
  	height: 13.30rem;
  	background: #F5F6F7;
  	padding-top: 0.1rem;
  		margin: .8rem auto 0;
  		
  }
  .page05 .page05_cont2{
  	width: 7.2rem;
  	margin: 0.4rem auto 0;
  
  	
  	
  }
  .page05_cont3{
  
  	    padding-left: 0.2rem;
  	position: relative;
  	padding-bottom: 0.4rem;
  
  }
  .page05_cont3:after{
  	content: '';;
  	height: 100%;
  	width: 2px;
  	left: .2rem;
  	top: 0.6rem;
  	background:rgba(0,0,0,0.1);;
  	position: absolute
  }
  .page05_cont3 .inner{
  	width:6.6rem;
  	padding-bottom: 0.4rem;
  	background: #FFFFFF;
  	box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.05);
  	border-radius: 16px 16px 16px 16px;
  	margin-left: 0.35rem;
  	position: relative;
  }
  .page05_cont3 .inner h3{
  	font-weight: bold;
  	font-size: ;
  	color:  rgba(255, 110, 0, 1);
  	font-size: 0.4rem;
  	position: relative;
  	top: -0.6rem;
  }
  .page05_cont3 .inner h3:after{
  	position: absolute;
      left: -0.42rem;
  	top: 0.16rem;
  	width: 0.2rem;
  	height: 0.2rem;
  	background:  rgba(255, 110, 0, 1);
  	border-radius: 50%;
  	content: '';
  }
  .page05_cont3 .swiper-slide{
  		height: auto;
  		margin-top: 0.8rem;
  		padding-top: 0.2rem;
  		
  }
  .page05_cont2 .swiper-wrapper{
  	height: 9.7rem;
  	
  	
  }
  
  .page05_cont3 .inner h4{
  font-family: PingFang SC, PingFang SC;
  font-weight: bold;
  font-size: 0.28rem;
  color: #1E1E1E;	
  position: relative;
  top: -.2rem;
  margin-left: 0.3rem;
  }
  .page05_cont3 .inner p{
  	font-weight: 400;
  	font-size: 0.24rem;
  	color: #757575;
  	line-height: 0.36rem;
  	text-align: left;
  	font-style: normal;
  	padding: 0 0.3rem;;
  }
  .page05_cont3 .inner p span{
  	color: rgba(255, 110, 0, 1) ;
  }
  .page05_bottom p{
  	text-align: center;
  	font-size: 0.24rem;
  	color:  rgba(255, 110, 0, 1);
  	line-height: 0.36rem;
  	margin-top: .3rem;
  
  }

.page06{
  width: 100%;           
  max-width: 720px;        
  margin: 0.3rem auto 0;
  box-sizing: border-box;
  padding: 0 0.15rem;      
  font-size: 14px;
}

 .page06{padding:30px 0;text-align:center}
  .page06 .tit h2{font-size:20px;margin:0 0 6px}
  .page06 .tit p{margin:0 0 18px;color:#999}

  .page06  .video-carousel{width:100%;max-width:720px;margin:0 auto;padding:0}

  
  .page06  .carousel-viewport{overflow:hidden;width:100%}

.page06   .carousel-wrapper{
    display:flex;
    align-items:center;
    transition:transform 0.38s cubic-bezier(.22,.9,.32,1);
    will-change:transform;
  }

.page06 .carousel-item{
    flex:0 0 80%;
    padding:0 8px;      
    list-style:none;
	
  }

 .page06  .card{
    border-radius:10px;
    overflow:hidden;
    background:#000;
    position:relative;
  }

  .page06  .video-container{position:relative;
  padding-bottom:56.25%;
  height:0;background:#111;  }
  .page06 .video-container img.cover,
  .page06 .video-container video{
    position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;display:block;
  }
  .page06 .video-container video{display:none} /* 点击后显示 */

  .page06 .play-btn{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,0.9);z-index:5;
    box-shadow:0 4px 12px rgba(0,0,0,0.25);cursor:pointer;
  }
  .page06 .play-btn:after{content:"";    margin-left: 22px;
    margin-top: 17px;display:block;width:0;height:0;border-left:18px solid #333;border-top:12px solid transparent;border-bottom:12px solid transparent}

  .page06 .caption{
    position:absolute;left:8px;right:8px;bottom:8px;color:#fff;font-size:13px;
    background:linear-gradient(180deg,rgba(0,0,0,0) 0%, rgba(0,0,0,0.55) 100%);
    padding:8px 10px;border-radius:6px;z-index:6;
  }

 .page06  .carousel-controls{margin-top:12px;display:flex;justify-content:center;align-items:center;gap:12px}
  .page06 .ctrl-btn{width:34px;height:34px;border-radius:50%;border:none;background:#fff;color:#f47a1c;font-size:18px;box-shadow:0 2px 6px rgba(0,0,0,0.12);cursor:pointer}
 .page06  .page-indicator{min-width:60px;color:#666}

  @media (max-width:420px){
    .page06 .carousel-item{flex:0 0 84%;}
    .page06 .play-btn{width:52px;height:52px}
    .page06 .play-btn:after{border-left-width:14px;border-top-width:10px;border-bottom-width:10px;    margin-left: 22px;
    margin-top: 17px;}
  }


.page07{
  width: 100%;           
  max-width: 720px;        
  box-sizing: border-box;
  padding: 0 0.15rem;      
  font-size: 14px;
}

 .page07{padding:30px 0;text-align:center}
  .page07 .tit h2{font-size:20px;margin:0 0 6px}
  .page07 .tit p{margin:0 0 18px;color:#999}

  .page07  .video-carousel{width:100%;max-width:720px;margin:0 auto;padding:0}

  
  .page07  .carousel-viewport{overflow:hidden;width:100%}

.page07   .carousel-wrapper{
    display:flex;
    align-items:center;
    transition:transform 0.38s cubic-bezier(.22,.9,.32,1);
    will-change:transform;
  }

.page07 .carousel-item{
    flex:0 0 80%;
    padding:0 8px;      
    list-style:none;
	
  }

 .page07  .card{
    border-radius:10px;
    overflow:hidden;
    background:#000;
    position:relative;
  }

  .page07  .video-container{position:relative;
  padding-bottom:56.25%;
  height:0;background:#111;  }
  .page07 .video-container img.cover,
  .page07 .video-container video{
    position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;display:block;
  }
  .page07 .video-container video{display:none} /* 点击后显示 */

  .page07 .play-btn{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,0.9);z-index:5;
    box-shadow:0 4px 12px rgba(0,0,0,0.25);cursor:pointer;
  }
  .page07 .play-btn:after{content:"";    margin-left: 22px;
    margin-top: 17px;display:block;width:0;height:0;border-left:18px solid #333;border-top:12px solid transparent;border-bottom:12px solid transparent}

  .page07 .caption{
    position:absolute;left:8px;right:8px;bottom:8px;color:#fff;font-size:13px;
    background:linear-gradient(180deg,rgba(0,0,0,0) 0%, rgba(0,0,0,0.55) 100%);
    padding:8px 10px;border-radius:6px;z-index:6;
  }
.page07_txt{
	margin-top: 10px;
	font-size: 0.24rem;
}
 .page07  .carousel-controls{margin-top:12px;display:flex;justify-content:center;align-items:center;gap:12px}
  .page07 .ctrl-btn{width:34px;height:34px;border-radius:50%;border:none;background:#fff;color:#f47a1c;font-size:18px;box-shadow:0 2px 6px rgba(0,0,0,0.12);cursor:pointer}
 .page07  .page-indicator{min-width:60px;color:#666}

  @media (max-width:420px){
    .page07 .carousel-item{flex:0 0 84%;}
    .page07 .play-btn{width:52px;height:52px}
    .page07 .play-btn:after{border-left-width:14px;border-top-width:10px;border-bottom-width:10px;    margin-left: 22px;
    margin-top: 17px;}
  }

    .page08_cont {
              width: 100%;
              height: 7rem; 
              overflow: hidden;
              position: relative;
              background: #fff;
          }
  
          
          .page08_cont ul {
              list-style: none;
              margin: 0;
              padding: 0;
              width: 100%;
              position: absolute;
              display: flex;
              align-items: center;
          }
  
          
          .page08_cont ul:first-child {
              top: 0;
              height: 50%;
          }
  
          
          .page08_cont ul:last-child {
              bottom: 0;
              height: 50%;
          }
  
          
          .page08_cont li {
              flex: 0 0 auto;
             height: 3rem;
              padding: 15px;
              box-sizing: border-box;
              background: #f5f7fa;
			  margin-right: .3rem;
              border-radius: 8px;
              text-align: center;
			  background: url(../images/page08_1.png) no-repeat center;
			  background-size: 100%;
			  margin-top: 0.3rem;
			  width: 3.8rem;
          }
  
          .page08_cont h3 {
              font-size: 0.32rem;
              color: #2d3748;
              margin: 0 0 4px 0;
			      margin-top: 1.2rem;
          }
  
          .page08_cont h4 {
              font-size: 0.28rem;
              color: #4a5568;
              margin: 0 0 3px 0;
              font-weight: normal;
			  display: -webkit-box;
			  -webkit-line-clamp: 1;
			  -webkit-box-orient: vertical;
			  overflow: hidden;
			  text-align: center; 
          }
  
          .page08_cont p {
              font-size: 0.24rem;
              color: #718096;
              margin: 0;
			  display: -webkit-box;
			  -webkit-line-clamp: 1;
			  -webkit-box-orient: vertical;
			  overflow: hidden;
			  text-align: center; 
          }
  
          
          @keyframes scrollLeft {
              0% {
                  transform: translateX(0%); 
              }
              100% {
                  transform: translateX(-1200%); 
              }
          }
  
          
          .page08_cont ul:first-child {
              animation: scrollLeft 60s linear infinite; 
          }
  
          .page08_cont ul:last-child {
              animation: scrollLeft 60s linear infinite 0.5s; 
          }
  
          
  
.page09 .carousel-container {
       width: 100%;
       overflow: hidden;
       position: relative;
	   margin-top: 0.4rem;
     }
 
    .page09  .carousel-container h2 {
       font-size: 18px;
       color: #333;
       text-align: center;
       margin-bottom: 5px;
     }
 
     .page09 .carousel-container p {
       font-size: 12px;
       color: #999;
       text-align: center;
       margin-bottom: 20px;
     }
 
     
     .page09 .carousel-wrapper {
       display: flex;
       align-items: center;
       justify-content: center;
       min-height: 3.8rem; 
       position: relative;
     }
 
     .page09 .carousel-item {
       position: absolute;
       width: 75%;
       transition: all 0.3s ease-out;
       transform: scale(0.6); 
       opacity: 0.6;
       pointer-events: none; 
       z-index: 1;
	       border-radius: 10px;
     }
 
    .page09 .carousel-item.active {
       transform: scale(1); 
       opacity: 1;
       pointer-events: auto;
	   border-radius: 10px;
       z-index: 3;
     }
    .page09  .carousel-item.prev {
       transform: translateX(-70%) scale(0.6);
       z-index: 2;
     }
 
     
     .page09 .carousel-item.next {
       transform: translateX(70%) scale(0.6);
       z-index: 2;
     }
 
     .page09 .carousel-item img {
       width: 100%;
     display: block;
       object-fit: cover;
       border-radius: 10px;
       box-shadow: 0 3px 10px rgba(0,0,0,0.1);
     }
 
     .page09 .carousel-text {
       
           text-align: left;
           padding: 1px 10px;
           position: absolute;
           bottom: 0;
           background: #0303036b;
		   border-radius: 0 0 8px 8px;
           width: 100%;
     }
 
     .page09 .carousel-text h3 {
       font-size: 0.32rem;
       color: #fff;
       white-space: nowrap;
       overflow: hidden;
	   margin-top: 10px;
       text-overflow: ellipsis;
     }
 
    .page09  .carousel-text p {
       font-size: 0.24rem;
       color: #fff;
       margin-top: 3px;
       display: -webkit-box;
       -webkit-line-clamp: 1;
       -webkit-box-orient: vertical;
       overflow: hidden;
       text-align: center; 
     }
 
     
    .page09 .progress-bar {
       display: flex;
       justify-content: center;
       margin-top: 20px;
       
     }
 
    .page09 .progress {
       width: 24px;
       height: 4px;
       
       background-color: #ddd;
       transition: all 0.3s ease;
     }
 
     .page09 .progress.active {
       width: 24px;
       border-radius: 4px;
       background-color:rgba(255, 110, 0, 1);
     }
 
     
    .page09 .swipe-hint {
       text-align: center;
       margin-top: 10px;
       font-size: 12px;
       color: #999;
     }
    .page10,.page09{
		width: 7.2rem;
		  margin: 0px auto;
		
	}
  .page10 .container {
  width: 100%;
  margin-top: 0.4rem;

  overflow: hidden;
}

  .page10 .slider-wrapper {
  display: flex;
  transition: transform 0.5s ease;
  width: 100%;
}

  .page10 .slider-item {
  flex: 0 0 100%;
  display: flex;
  align-items: flex-start;

}
  .page10 .slider-item .left{
	  background: #fff;
	  padding: 0.1rem;
	       width: 2.4rem;
		   margin-left: 10px;
	    border-radius: 12px;
  box-shadow: rgb(151 146 146 / 20%) -1px 1px 7px 2px;
  }
  .page10 .slider-item .left img {
     width: 2.4rem;
  height: auto;
  
  border-radius:12;
}

  .page10 .slider-item .right {
  flex: 1;
  margin-left: 20px;
}

  .page10 .slider-item .right h3 {
  font-size: 24px;
  margin-bottom: 10px;
}

  .page10 .slider-item .right p {
  line-height: 1.8;
  margin-bottom: 15px;
  font-size: 0.24rem;
}

  .page10 .slider-item .right a {
  color:rgba(255, 110, 0, 1);
  text-decoration: none;
}

  .page10 .progress-bar {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

  .page10 .progress {
  width: 50px;
  height: 3px;
  background-color: #ccc;

  cursor: pointer;
  transition: background-color 0.3s ease;
}

  .page10 .progress.active {
  background-color:rgba(255, 110, 0, 1);
}
    .page11{
		width: 7.2rem;
		margin: 0.6rem auto 0;
	}
	.page11_cont2{
		margin-top: 0.3rem;
	}
  .page11 .tab-container {
    width: 100%;
    
    margin: 0.4rem auto 0;
  }
 .page11 .tab-list {
	 float: left;
    
  }
  
 .page11 .tab-item {
    padding: 10px 15px;
    white-space: nowrap;
    cursor: pointer;
	color: rgba(179, 179, 179, 1);
	font-size: 0.24rem;
  }

 .page11 .tab-item.active {
    color: #fff;
   background:rgba(255, 110, 0, 1) ;
   border-radius: 12px;
  }
 .page11 .tab-content {
    margin-top: 15px;
  }
 .page11 .content-item {
    display: none;
	float: left;
    width: 4.7rem;
    margin-left: 0.5rem;
  }
   .page11 .content-item h3{
	   font-size: 0.34rem;
	   font-weight: bold;
   }
      .page11 .content-item li{
		  margin-top: 0.3rem;
		  font-size: 0.24rem;
		  line-height: 0.36rem;
		  list-style: disc;
	  }
 .page11 .content-item.active {
    display: block;
  }
  .page12{
  	  background: url(../images/page12_bg.png) no-repeat center;
	  background-size: 100%;
  	  padding-bottom: 0.6rem;
  	  padding-top: 1px;
  }
  .page12_cont{
  	  width: 7.2rem;
  	  margin: 0 auto;
   }
   .page12 ul {
   	      list-style: none;
   		  
   	      padding: 0;
   	      margin-top: 0.4rem;
   	      display: flex;
   	      gap: 0.3rem;
   	      overflow-x: auto;
   	      scroll-snap-type: x mandatory;
   	      -webkit-overflow-scrolling: touch;
   	    }
   	    .page12 ul::-webkit-scrollbar { width: 0; height: 0; }
   	    .page12 ul { scrollbar-width: none; }
   	    .page12 li {
   	      flex: 0 0 auto;
   	      width: 4rem;
   	      min-height: 5rem;
   	      border-radius: 12px;
   	      box-shadow: 0 6px 18px rgba(0,0,0,0.06);
   	          overflow: hidden;
   	      position: relative;
   	      scroll-snap-align: start;
   	      cursor: pointer;
   	      font-size: 0.55rem;
   	      display: flex;
   	      flex-direction: column;
   		  background: rgba(73, 162, 97, 0.10);
   	      gap: 4px;
   	    }
   	    .page12 li img {
   	      width: 100%;
   	      border-radius: 0.4rem;
   	      object-fit: cover;
   	    }
   	    .page12_cot {
   	      flex: 1;
   		  position: absolute;
   		  bottom: 0;
   		  left: 0;
   		  width: 4rem;
   		  height: 3.2rem;
  		  overflow: hidden;
   		      background: linear-gradient(0deg,rgba(255, 110, 0, 1), rgba(255, 167, 101, 1));
  		  box-shadow:rgb(255 255 255 / 20%) 0px -2px 12px 5px;
   		  border-radius:12px ;
   	    }
   .page12 .detail-template {
	 background: linear-gradient(0deg,rgba(255, 110, 0, 1), rgba(255, 167, 101, 1));  
   }
     .page12 .detail-template p{
		 color:#fff
	 }
   	    .page12_cont h3 {
   	      margin-left: 0.24rem;
   		  margin-top: 0.24rem;
   	      font-size: 0.36rem;
   		  color: #fff;
  		      display: -webkit-box;
  		      -webkit-box-orient: vertical;
  		      -webkit-line-clamp: 2;
  		      overflow: hidden;
  		      text-overflow: ellipsis;
			  height: 1.2rem;
   	
   	    }
   	    .page12_cot span {
   	     font-weight: 400;
   	     font-size: 0.2rem;
  		 color: #fff;
   		 border-radius: 12px;
   		 padding: 0 0.2rem;
   		
   			 position: relative;
   		
  		
  			 float: right;
			     display: -webkit-box;
			     -webkit-box-orient: vertical;
			     -webkit-line-clamp: 5;
			     overflow: hidden;
			     text-overflow: ellipsis;
   		
   	    }
   	    .page12 .clear {
   	      clear: both;
   	      height: 0;
   	    }
   	    .page12_cont li p {
   	      margin: 4px 0 0;
   	      font-size: 0.22rem;
   	      line-height: 0.3rem;
   	
   		   position: relative;
   		   color: rgba(0, 0, 0, 0.8);
   		   padding: 0 0.24rem;
   		   
   	    }
  
  		.page12 .progress-container {
  		  height: 4px;         
  		  background: #e0e0e0; 
  		  border-radius: 2px; 
  		  margin: 0.3rem auto 0;    
  		  overflow: hidden;    
  		  width: 50%;
  		}
  		
  		.page12 .progress-bar {
  		  height: 100%;        
  		  background: #ff6600;  
  		  width: 0;            
  		  transition: width 0.3s ease;
  		  border-radius: 2px;  
  		}
  		

  		
  
  .page13{
	  background: #f9f9fc;
	  padding-bottom: 0.6rem;
	  padding-top: 1px;
  }
  .page13_cont{
	  width: 7.2rem;
	  margin: 0 auto;
  }
  .page13 ul {
  	      list-style: none;
  		  
  	      padding: 0;
  	      margin-top: 0.4rem;
  	      display: flex;
  	      gap: 0.3rem;
  	      overflow-x: auto;
  	      scroll-snap-type: x mandatory;
  	      -webkit-overflow-scrolling: touch;
  	    }
  	    .page13 ul::-webkit-scrollbar { width: 0; height: 0; }
  	    .page13 ul { scrollbar-width: none; }
  	    .page13 li {
  	      flex: 0 0 auto;
  	      width: 4rem;
  	      min-height: 4rem;
  	      border-radius: 12px;
  	      
  	          overflow: hidden;
  	      position: relative;
  	      scroll-snap-align: start;
  	      cursor: pointer;
  	      font-size: 0.55rem;
  	      display: flex;
  	      flex-direction: column;
  		  background: rgba(73, 162, 97, 0.10);
  	      gap: 4px;
  	    }
  	    .page13 li img {
  	      width: 100%;
  	      border-radius: 0.4rem;
  	      object-fit: cover;
  	    }
  		.page13_icon{
  			width:0.64rem !important;
  			height: 0.64rem;
  			float: right;
  			position: relative;
  			top: -0.5rem;
  			right: 0.3rem;
  		}
  	    .page13_cot {
  	      flex: 1;
  		  position: absolute;
  		  bottom: 0;
  		  left: 0;
  		  width: 4rem;
  		  height: 2.1rem;
		  overflow: hidden;
  		  background: #fff;
		  
  		  border-radius:0 0 12px 12px ;
  	    }
  	    .page13_cont h3 {
  	      margin-left: 0.24rem;
  		  margin-top: 0.24rem;
  	      font-size: 0.36rem;
  		  color: rgba(197, 12, 18, 1);
		      display: -webkit-box;
		      -webkit-box-orient: vertical;
		      -webkit-line-clamp: 2;
		      overflow: hidden;
		      text-overflow: ellipsis;
  	
  	    }
  	    .page13_cot span {
  	     font-weight: 400;
  	     font-size: 0.2rem;
		 color: rgba(0, 0, 0, 0.45);
  		 border-radius: 12px;
  		 padding: 0 0.1rem;
  		margin-left: 0.24rem;
  			 position: relative;
  			 bottom: -.25rem;
			 right: .3rem;
			 float: right;
  		
  	    }
  	    .page13 .clear {
  	      clear: both;
  	      height: 0;
  	    }
  	    .page13_cont li p {
  	      margin: 4px 0 0;
  	      font-size: 0.22rem;
  	      line-height: 0.3rem;
  	
  		   position: relative;
  		   color: rgba(0, 0, 0, 0.8);
  		   padding: 0 0.24rem;
  		   
  	    }
  	    .page13 #modal-overlay {
  	      position: fixed;
  	      inset: 0;
  	      background: rgba(0,0,0,0.55);
  	      display: flex;
  	      align-items: center;
  	      justify-content: center;
  	      z-index: 10000;
  	      padding: 0.5rem;
  	    }
  	    .page13 .hidden { display: none; }
  	    .page13 #modal-overlay.hidden { display: none !important; }
  	
  	  
  	    .page13 .page02_1 {
  	      margin-top: 6px;
  	      height: auto;
  	    }
  	    .page13 .page02_1 p {
  	      margin: 6px 0;
  	      padding: 0 0.4rem;
  	      color: #fff;
  	      line-height: 0.36rem;
  	      font-size: 0.24rem;
  	    }
  	    .page13 .page02_1 span { font-weight: 600; }
  	    .page13 .consult {
  	      display: block;
  	      background: rgba(240,255,242,0.6);
  	      width: 2.86rem;
  	      height: 0.72rem;
  	      box-shadow: 0px 0px 15px 0px rgba(13,80,31,0.2);
  		  border: 1px solid rgba(255,255,255,0.5);
  	      color: #136D2B;
  	      line-height: 0.72rem;
  	      border-radius: 12px;
  	      margin: 0.2rem auto 0;
  	      padding-left: 0.6rem;
  	      font-size: 0.28rem;
  	      cursor: pointer;
  	      text-align: center;
  	      position: relative;
  	    }
  	    .page13 .consult:after {
  	      position: absolute;
  	      left: 0.7rem;
  	      top: 0.16rem;
  	      content: '';
  	      width:0.4rem ;
  	      height: 0.4rem;
  	      background: url(../images/page02_7.png) no-repeat center;
  	      background-size: 100%;
  	    }
  	  
  	    .page13 .modal-inner::-webkit-scrollbar { width: 0; }
  	    .page13 .modal-inner { -ms-overflow-style: none; scrollbar-width: none; }
  		
  		.page13 li,
  		.page13 .consult,
  		.page13 button {
  		  -webkit-tap-highlight-color: transparent;
  		}
  		
  		
  		.page13 li:focus,
  		.page13 .consult:focus,
  		.page13 button:focus {
  		  outline: none;
  		}
  		
  		.page13 li:focus:not(:focus-visible),
  		.page13 .consult:focus:not(:focus-visible),
  		.page13 button:focus:not(:focus-visible) {
  		  outline: none;
  		}
		.page13 .progress-container {
		  height: 4px;         
		  background: #e0e0e0; 
		  border-radius: 2px; 
		  margin: 0.3rem auto 0;    
		  overflow: hidden;    
		  width: 50%;
		}
		
		.page13 .progress-bar {
		  height: 100%;        
		  background: #ff6600;  
		  width: 0;            
		  transition: width 0.3s ease;
		  border-radius: 2px;  
		}
.detail-template {
  min-height: 4rem;
  position: absolute;
  bottom: -4rem; 
  left: 0;
  right: 0;
  background: #fff;
  margin: 0;
  overflow: hidden;
  opacity: 0; 
  
  pointer-events: none; 
  transition: all 0.5s ease-out; 
}

.detail-template.active {
  bottom: 0rem; 
  opacity: 1;
  pointer-events: auto; 
  border-radius: 12px;

}
.footer{
	
	height: 5.7rem;
	background: #2C2C2C;
	border-radius: 0px 0px 0px 0px;
	padding-top: 1px;
}
.footer_cont {
	width: 7rem;
	margin: 0rem auto 0;
}
.footer_1{
	width: 2.44rem;
	margin-top: 0.6rem;
}
.footer_3{
	float: left;
	width: 3.04rem;
	height: 1.76rem;
	margin-top: 0.4rem;
}
.footer_tit1{
	float: left;
	margin-top: 0.4rem;
	margin-left: 0.8rem;
}
.footer_tit1 h3,.footer_tit0 h3{
	font-weight: 500;
	font-size: 0.28rem;
	color:  rgba(255, 110, 0, 1);
	text-align: left;
	margin-bottom: 0.22rem;
}
.footer_tit1 a{
	font-size: 0.24rem;
	color: #FFFFFF;
	line-height: 20px;
	margin-top: 0.1rem;
	display: block;
}
.footer_bottom_left {
	margin-top: 0.5rem ;
	border-top: 1px solid  rgba(255,255,255,0.2);;
}
.footer_bottom_left p{
		margin-top: 0.5rem;
}
.footer_bottom_left a{
	font-weight: 400;
	font-size: 0.2rem;
	text-align: center;
	color: #B3B3B3;
	display: block;

}
.footer_bottom_left img{
	width: 1.28rem;
	height: 0.32rem;
	margin: 0.3rem auto 0;
}

.footer_tit0 {
float: left;
    width: 3.04rem;
	margin-top: 0.4rem;
  }
  .footer_tit0 li {
    position: relative;
    cursor: pointer;

	float: left;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    -webkit-tap-highlight-color: transparent;
  }
  .footer_tit0 li:focus { outline: none; }
  .footer_tit0 img { width:0.8rem; height: auto; display: block; }
    .footer_tit0 li p{
	font-size: 0.24rem;
	padding-top: 0.2rem;
	color: #fff;
	text-align: center;
		
	}
  #footer-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    z-index: 10000;
  }
  .hidden { display: none !important; }

  .footer-modal {
    background: #fff;
    border-radius: 12px;
    max-width: 90%;
    width: 14rem;
    padding: 0.5rem;
    position: relative;
    box-sizing: border-box;
  }
  .footer-modal-inner {
    font-size: 0.9rem;
  }
  .footer-modal-close {
   position: absolute;
   top: 12px;
   right: 8px;
   width: 0.64rem;
   height: 0.64rem;
   color: #fff;
   border: none;
   font-size:0.54rem;
   line-height: 0.64rem;
   background: rgba(0,9,0,0.3);
   border-radius: 50px;
   font-weight: 400;
   cursor: pointer;
  }
  
   #footer-modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.55);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0.5rem;
      z-index: 10000;
    }
    .hidden { display: none !important; }
  
    .footer-modal {
      background: #fff;
      border-radius: 12px;
      max-width: 90%;
      width: 14rem;
      padding: 0.5rem;
      position: relative;
      box-sizing: border-box;
    }
    .footer-modal-inner {
      font-size: 0.9rem;
    }
    .footer-modal-close {
     position: absolute;
     top: 12px;
     right: 8px;
     width: 0.64rem;
     height: 0.64rem;
     color: #fff;
     border: none;
     font-size:0.54rem;
     line-height: 0.64rem;
     background: rgba(0,9,0,0.3);
     border-radius: 50px;
     font-weight: 400;
     cursor: pointer;
    }
    /* 防止滚动穿透 */
    body.modal-open { overflow: hidden; }
    .footer_tit0 .detail-template {
      display: none !important;
    }
    .detail-template1 p{
  	  font-size: 0.4rem;
  	  text-align: center;
  	  margin-top: 0.2rem;
  	  font-weight: bold;
    }