@charset "gb2312";
@import "Noto Sans SC.css";
*{ margin:0px; padding:0px; border:0; }
body { -webkit-text-size-adjust: 100%; /*font-family:var(--font); */}
html,body {width:100%;  margin:0px; padding:0; font:16px/1.5  'Noto Sans SC','Microsoft YaHei', arial, \5FAE\8F6F\96C5\9ED1, 'Hiragino Sans GB', sans-serif; background:#f2f8f7; }
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,img,button,font,i {border:0;  padding:0; margin:0;  } 
li{list-style-type:none;list-style:none;}
img{vertical-align:top;border:0;}
h1,h2,h3,h4,h5,h6,p,em,i,b,span,font,div { margin:0; padding:0; font-weight:normal; font-style:normal;}
ol,ul {list-style:none;}
address,cite,code,th {font-weight:normal;font-style:normal;}
img:hover { opacity:1; filter: alpha(opacity=100); }
code, kbd, pre, samp { font-family: courier new, courier, monospace; }
small { font-size: 12px; }
legend { color: #000; }
fieldset, img { border: 0; }
button, input, select, textarea { font-size: 100%; }
.fl { float:left; }
.fr { float:right; }
a { color:#333; text-decoration:none; }
a:hover{ color:#016e59; text-decoration:none;}
.cl { clear:both;}
div,ul,li,h1,h2,h3,h4,h5,h6,dl,dd,dt,p,i,em,b,span,td,tr,font { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }


:root {
--primary: #2d8b6b;
--primary-dark: #1f6b4e;
--primary-deep: #1a5a3f;
--primary-light: #4caf83;
--accent: #e94f3a;
--accent-soft: #f0826f;
--color1:#111;
--color2:#9f2201;  /主体色改这个颜色/ 
--color3:#666;
--bgcolor:#fff;
--gold: #d4a13a;
--cream: #faf6ef;
--paper: #fffaf2;
--line: #e8e0d0;
--text: #2c3e2e;
--text-soft: #6b7a6e;
--shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
--radius: 20px;
--radius2: 20px 20px 0 0;
--radius3: 20px 0 0 20px;
--cards-per-row: 5;   /* 一行显示的卡片数 */
--card-gap: 24px;     /* 卡片之间的间距 */
}


@font-face { font-family: 'roboto'; src: url('Roboto.ttf') format('truetype');}
@font-face { font-family: 'Bebas'; src: url('Bebas.ttf') format('truetype'); }

.reveal { opacity:0; transform:translateY(30px);transition:opacity .7s ease,transform .7s ease; }
.reveal.in {opacity:1; transform:none}

.header { width:100%; height:500px;  background-position: center; background-repeat: no-repeat; background-size:cover;}

.warp { width: 1200px; margin: 0 auto; }

.ejlm { width:100%;float:left; padding:12px 0;  background: #fff; margin-bottom: 30px; box-shadow: 0 0px 1px rgba(1,110,89, .05);}
.ejlm span { margin-right:15px; line-height:30px; font-size:15px; color:#666; font-weight:300;}
.ejlm h3 { float: right;  line-height:30px; font-size:15px; color:#666; font-weight:300;  }
.ejlm h3 a { color:#666; }
.ejlm h3 a:hover { color:var(--color2); }
.ejlm h3 i { padding:0 10px; }

.lm { width:100%; float:left; padding:20px 0 0 0; }
.lm span { font-size:28px; line-height:30px; font-weight:700; color:var(--color2);}
.lm b { width:6px; height:26px; float:left; display:inline-block; border-radius:5px; background:var(--color2); margin-right:12px; margin-top:4px; }



/* —— 轮播容器：应用最大宽度  海报集锦、短视频集锦、热销产品  —— */
.carousel { position: relative;  width: 100%; max-width:1200px; margin: 0 auto;  overflow:hidden; padding:30px 0; }
.track { display:flex; gap:var(--card-gap); transition:transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);  will-change: transform;}

/* —— 卡片：宽度由 --cards-per-row 和 --card-gap 自动计算 —— */
.card { flex: 0 0 calc((100% - (var(--cards-per-row) - 1) * var(--card-gap)) / var(--cards-per-row));  background:var(--bgcolor);  border-radius: var(--radius);  box-shadow:var(--shadow); overflow: hidden;  transition:all ease-out .4s 0s; }
.card:hover { transform: translateY(-5px);  }

/* —— 卡片配图：直接用 img，object-fit 保证裁切不变形 —— */
.card-image { display: block;  width: 100%;  overflow: hidden;  border-radius:var(--radius2);  position:relative; }
.card-image img { width:100%;  aspect-ratio: 9.5 / 16; /*图片比例*/ /* object-fit: cover;  object-position: center; */ /*居中显示*/ transition:all ease-out 2s 0s;}
.card-image em { position:absolute;  width:50px; height:50px; display:block; border-radius:50%; background: url(../images/player.png) rgba(0,0,0,.3); background-size:cover; position:absolute; top:50%; margin-top: -25px; left:50%; margin-left:-25px;  z-index:5;  transform:rotate(0deg); transition:all ease-out .3s 0s;}
.card-image:hover em { transform:rotate(360deg); }
.card-body { padding: 16px 20px 20px 20px; }
.card-title { font-size: 18px; font-weight: 300; line-height: 1.5;  color:var(--color1);  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;  }
.card-desc { font-size: 16px; color:var(--color3);  line-height: 1.6; font-weight: 300;  margin-top: 10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;  }
.card:hover .card-title{ color:var(--color2); }


.card-image2 { width:100%;  margin: 0 2.6% 2.6% 0; border-radius:30px;  background:var(--bgcolor);  border-radius: var(--radius);  box-shadow:var(--shadow); 
 transition:all .4s ease-in-out; aspect-ratio: 1 / 1;} 
.card-body2 { padding:16px 20px 20px 20px; }
.card-title2 { font-size: 20px; font-weight: 600; line-height: 1.5;  color:var(--color1);  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;  }
.card-desc2 { font-size: 16px; color:var(--color3); font-weight: 300;  line-height: 1.6; margin-top: 10px;  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;  }
.card:hover .card-title2 { color:var(--color2); }
.card:hover .card-fz2 {transform: rotateY(180deg); }


/* 翻转盒子 */
.card-fz2 { position: relative; width: 100%; height: 100%; float: left;  transition: transform 0.6s ease; transform-style: preserve-3d; transform: rotateY(0deg);  will-change: transform;   }  
/*.card-fz:hover { transform: rotateY(180deg); }*/
.card-zm2, .card-bm2 {  position: absolute; width: 100%;  backface-visibility: hidden; }
.card-bm2 { transform: rotateY(180deg); }
.card-zm2 img, .card-bm2 img {display: block; width: 100%; object-fit: cover; user-select: none; pointer-events: none;  border-radius:20px 20px 0 0; aspect-ratio: 1 / 1;}
.card-bm2 span { width: 100%; position: absolute;  text-align: center; bottom:0px;  }
.card-bm2 span p { display:inline-block; font-size: 15px; color: #fff; background:rgba(1,110,89, .7); font-weight: 300;  padding:0 10px; line-height:2em;  border-radius:3px; }


/* —— 左右导航箭头 —— */
.nav-btn { position: absolute;  top: calc(50% - 25px); transform: translateY(-50%);  width:44px; height:44px;  border-radius:50%; background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(8px);  -webkit-backdrop-filter: blur(8px); cursor: pointer;  display: flex;  align-items: center; justify-content: center;  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1); transition: background 0.2s, box-shadow 0.2s, transform 0.2s, opacity 0.2s;  z-index: 10; color:#1f1f1f; font-family:"\5B8B\4F53";  font-weight:bold; font-size: 16px; }
.nav-btn:hover { background: #fff;  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16); transform: translateY(-50%) scale(1.06);}
.nav-btn:active { transform: translateY(-50%) scale(0.96); }
.nav-btn:disabled {  opacity: 0;  pointer-events: none; }
.nav-btn.prev { left: 0px; }
.nav-btn.next { right: 0px; }
.nav-btn svg { width: 20px; height: 20px;  }




/* 给每个轮播不同的卡片色调（可选） */
.carousel-section:nth-child(1) .card { border-bottom: 3px solid #2d8b6b; }
.carousel-section:nth-child(2) .card { border-bottom: 3px solid #d4a13a; }
.carousel-section:nth-child(3) .card { border-bottom: 3px solid #e94f3a; }


/*轮播图*/
.w65 { width:65%; float: left; }
.slider { position: relative;   overflow: hidden;  height: 450px;  background:var(--bgcolor);  border-radius: var(--radius);  box-shadow:var(--shadow); margin-bottom: 30px; }
.slide { position: absolute; inset: 0;  opacity:0;  transition: opacity 0.6s ease;  display: flex; align-items: center; padding: 0 70px;  color: #fff; background-repeat: no-repeat; background-position: center; background-size: cover; }
.slide.active { opacity: 1; }
	
.slide::before { content:""; position:absolute; inset:0; z-index:0; border-radius:inherit; pointer-events:none; background:linear-gradient(to top right, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.35) 40%, transparent 65%); } /*inset:0; 等同top:0; right:0; bottom:0; left:0; border-radius:inherit; 继承父元素的设置 \ 起始点(0%), 中间点(40%), 结束区域(65% 及以后) */

.slide-content { position: relative; z-index: 2; max-width: 60%; color: #fff; }
.slide h3 { font-size: 28px; line-height: 1.4; font-weight: 600; margin-bottom: 14px; text-shadow: 0 2px 8px rgba(0,0,0,0.3);}
.slide p { font-size: 15px; line-height: 1.7; opacity: 0.92; font-weight: 300; }

.slider-dots { position: absolute;  bottom: 16px; left: 50%; transform: translateX(-50%);  display: flex; gap: 8px;  z-index: 3; }
.slider-dots span { width: 24px; height: 3px;  background: rgba(255,255,255,0.4);   border-radius: 2px;  cursor: pointer; transition: 0.25s; }
.slider-dots span.active { background: #fff; width: 36px; }

/* ===== 新增：页数指示 ===== */
.slider-counter { position: absolute; bottom: 18px; right: 24px; z-index: 3; background: rgba(0, 0, 0, 0.45);  backdrop-filter: blur(6px); color: #fff; font-size: 14px; padding: 4px 14px; border-radius: 30px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); display: flex; align-items: baseline;  gap: 2px;  pointer-events: none; font-weight: 300;  } /*pointer-events: none; 设置后元素对鼠标"透明"*/
.slider-counter .current-num { font-weight: 600; font-size: 22px;  line-height: 1.2;  margin-right: 2px; color: #fff;  }

.slider-arrow { position: absolute;  top: 50%; transform: translateY(-50%);  width: 36px; height: 36px;  background: rgba(255,255,255,0.2);  backdrop-filter: blur(10px);  border-radius: 50%;  display: grid; place-items: center;  cursor: pointer;  z-index: 3; transition: 0.25s; color:#fff; font-family:"\5B8B\4F53";  font-weight:bold; font-size: 16px; }	
.slider-arrow:hover { background: rgba(255,255,255,0.35); }
.slider-arrow.prev { left: 14px; }
.slider-arrow.next { right: 14px; }



.w34 { width:32%; float:right;  background:var(--bgcolor);  border-radius: var(--radius);  box-shadow:var(--shadow);  padding:15px 0 35px 0; } 
.news { width:95%; float: left;  padding:0 30px;  }
.news ul li { padding:14px 0; display:flex; align-items: center; border-bottom: 1px solid rgba(9,129,68,.15); transition:all ease-out .3s 0s;  }
.news ul li .date { width:50px; margin-right:14px; float: left; text-align: center; color: var(--color2); font-family: 'Bebas'; -webkit-transform:scale(1,.9);}
.news ul li .date h3 { width: 100%;float: left; font-size:32px; line-height:1.1; margin-bottom:6px; }
.news ul li .date h4  { width: 100%;float: left;font-size:12px;line-height:1.5; }
.news ul li .txt { width: calc(100% - 64px); float: left; text-align: left; }
.news ul li .txt a { color:var(--color1);  font-size:18px; line-height:1.6; font-weight: 300; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.news ul li .txt a:hover { color:var(--color2); }
.news ul li:hover { transform: translateX(15px);}

#scroll01 { height: 400px; overflow:auto; }



.buss { width:100%; float: left; height: 380px; background:var(--bgcolor);  border-radius: var(--radius);  box-shadow:var(--shadow); margin: 30px 0; overflow: hidden; }
.buss h3 { width:50%; height:100%; float:left; overflow: hidden; background-position: center; background-repeat: no-repeat; background-size:cover; aspect-ratio: 16 / 9; /*图片比例*/ object-fit: cover;  object-position: center; transition:all ease-out .5s 0s;   }
.buss:hover h3 { opacity:.8;}

.buss h4 { width:50%; float:right;  height:100%;  display: flex; align-items: left; flex-direction:column; justify-content: center; padding:0 4%; }
.buss h4 font { width:100%; float:left; color:var(--color1); line-height:1.5em; font-size:24px; font-weight: 600; -webkit-line-clamp:2; display:-webkit-box;  overflow:hidden;  -webkit-box-orient:vertical; transition:all ease-out .3s 0s;   }

.buss h4 i { display:block; width:50px; height:1px; background:rgba(0,0,0,.5); float:left; margin-top:30px; }
.buss h4 p { width:100%; float:left;  color:#333; line-height:2em; font-size:17px; font-weight: 300; padding:25px 0 0 0;  text-align: justify; -webkit-line-clamp:6;  display:-webkit-box;  overflow:hidden;  -webkit-box-orient:vertical;}
.buss h4 p b { font-weight:500; }
.buss h4 span { width:100%;  float: left; margin-top: 45px;  }
.buss h4 span em { background:#d34f2a; color:#fff; line-height:2.75em; font-size:18px; font-weight:200; padding:0 35px; border-radius:50px; display: inline-block; transition:all ease-out .3s 0s;  }
.buss h4:hover span em  { background:var(--color2); }



.mart30 {  margin-top: 30px; }
.footer { width: 100%; float: left; background:var(--color2);  padding:15px 0;  font-size: 16px; line-height: 1.6em; color:rgba(255,255,255,.9); text-align: center;}
.footer span { font-weight: 200; }
.footer strong { font-weight: 500; margin-left: 10px; }




/* 移动端适配 */
@media (max-width: 820px) {
.header { height:50vw; background-position: center; background-repeat: no-repeat; background-size:cover;}
		
.warp { width:100%;  padding:0 5%; }	

	
.ejlm { padding:2.5vw 0;  margin-bottom: 3%;  box-shadow: 0 0px 1px rgba(1,110,89, .05);}
.ejlm span { margin-right:3vw; line-height:1.5em; font-size:3.25vw; }
.ejlm h3 {  line-height:1.5em; font-size:3.25vw;  display: none;}
.ejlm h3 a:hover { color:#666; }
.ejlm h3 i { padding:0 2vw; }
	
.lm { width:100%; float:left; padding:2% 0 4% 0; }
.lm span { font-size:1.375rem; line-height:2rem; }
.lm b { width:6px; height:1.3rem; margin-right:.7rem; margin-top:.4rem; }	

	
:root { 
--cards-per-row: 2; 
--card-gap: 16px; 
} 

	
/* —— 轮播容器：应用最大宽度 —— */
.carousel { padding:0 0 5% 0;  }

/* —— 卡片配图：直接用 img，object-fit 保证裁切不变形 —— */
.card-image { display: block;  width: 100%;  overflow: hidden;  border-radius:var(--radius2);  position:relative; }
.card-image img { width:100%;  aspect-ratio: 9.5 / 16; /*图片比例*/ /* object-fit: cover;  object-position: center; */ /*居中显示*/ transition:all ease-out 2s 0s;}
.card-image em { position:absolute;  width:50px; height:50px; display:block; border-radius:50%; background: url(../images/player.png) rgba(0,0,0,.3); background-size:cover; position:absolute; top:50%; margin-top: -25px; left:50%; margin-left:-25px;  z-index:5;  transform:rotate(0deg); transition:all ease-out .3s 0s;}
.card-image:hover em { transform:rotate(0); }
	
.card-body { padding:3vw 4.5vw 3.5vw 4.5vw; }
.card-title { font-size:4vw; line-height: 1.5; -webkit-line-clamp:3; }
.card-desc { font-size:3.25vw;  margin-top: 1.5vw; -webkit-line-clamp:3; }
.card:hover .card-title{ color:var(--color1); }



.card-image2 { width:100%;  margin: 0 2.6% 2.6% 0;} 
.card-body2 { padding:3vw 4.5vw 3.5vw 4.5vw;}
.card-title2 { font-size:4vw; line-height: 1.5; -webkit-line-clamp:3;  }
.card-desc2 { font-size:3.25vw;  margin-top: 1.5vw; -webkit-line-clamp:3; }
.card:hover .card-title2 { color:var(--color1); }
.card:hover .card-fz2 {transform: rotateY(180deg); }


/* 翻转盒子 */
.card-fz2 { position: relative; width: 100%; height: 100%; float: left;  transition: transform 0.6s ease; transform-style: preserve-3d; transform: rotateY(0deg);  will-change: transform;   }  
/*.card-fz:hover { transform: rotateY(180deg); }*/
.card-zm2, .card-bm2 {  position: absolute; width: 100%;  backface-visibility: hidden; }
.card-bm2 { transform: rotateY(180deg); }
.card-zm2 img, .card-bm2 img {display: block; width: 100%; object-fit: cover; user-select: none; pointer-events: none;  border-radius:20px 20px 0 0; aspect-ratio: 1 / 1;}
.card-bm2 span { width: 100%; position: absolute;  text-align: center; bottom:0px;  }
.card-bm2 span p { display:inline-block; font-size: 15px; color: #fff; background:rgba(1,110,89, .7); font-weight: 300;  padding:0 10px; line-height:2em;  border-radius:3px; }	
	
	
	
/*轮播图*/
.w65 { width:100%; float: left; }
.slider { height: 56vw;  margin-bottom: 0%; margin-top: 2%; }
.slide {  display: flex; align-items: flex-end; padding:7.5vw 7%;  }
.slide.active { opacity: 1; }

.slide-content {  max-width: 100%; }
.slide h3 { font-size:4.5vw;  margin-bottom: 1vw; }
.slide p {  display: none; }

.slider-dots { bottom: 4.5vw;  }
.slider-dots span { width:4vw;  }
.slider-dots span.active { background: #fff; width: 6vw; }

/* ===== 新增：页数指示 ===== */
.slider-counter {  bottom: 4vw; right: 4vw; font-size: 3.25vw; padding: 4px4vw; border-radius: 50vw; }
.slider-counter .current-num {  font-size: 4.5vw; }

.slider-arrow {  width: 8vw; height: 8vw;  font-size: 4vw; }	
.slider-arrow:hover { background: rgba(255,255,255,0.35); }
.slider-arrow.prev { left: 3vw; }
.slider-arrow.next { right: 3vw; }	
	
	
.w34 { width:100%; float:left;  padding:2.5vw 0 7vw 0; margin: 4% 0; } 
.news { width:95%; float: left;  padding:0 5vw;  }
.news ul li { padding:2.5vw 0; }
.news ul li .date { width:16vw; margin-right:1vw; float: left; text-align: center; color: var(--color2); font-family: 'Bebas'; -webkit-transform:scale(1,.8);}
.news ul li .date h3 { font-size:6vw; line-height:1.2em; margin-bottom:8px; }
.news ul li .date h4  { font-size:3.25vw; line-height:1.2em; }
	
.news ul li .txt { width: calc(100% - 18vw);  }
.news ul li .txt a { c font-size:3.5vw;  }
.news ul li .txt a:hover { color:var(--color1); }
.news ul li:hover { transform: translateX(0); }

#scroll01 { height:42vh; overflow:auto; }
	
	

.buss {  height: auto;  margin: 0 0 5% 0; }
.buss h3 { width:100%; aspect-ratio: 16 / 9.5;   }
.buss:hover h3 { opacity:1;}
.buss h4 { width: 100%;  height:auto;  padding:5vw 8.5vw; }
.buss h4 font { line-height:1.5; font-size:4vw;  -webkit-line-clamp:2;   }
.buss:hover h4 font { color:var(--color1); }
.buss h4 i { display:block; width:50px; height:1px; background:rgba(0,0,0,.5); float:left; margin-top:4vw; }
.buss h4 p { font-size:3.25vw; padding:4vw 0 0 0; line-height: 2;  -webkit-line-clamp:10;  }


		

	
.mart30 {  margin-top: 1%; }	
.footer { padding:2.75vw 5%;  font-size: 3.5vw; line-height:5vw;  }
.footer strong {  margin-left: 2vw; }
	
}