/*轮播图*/
  .carousel { width: 940px;height: 360px;position: relative; overflow: hidden; float: left;}
  .slides{display: flex;transition: transform 0.5s ease;}
  .slide {min-width: 100%;height: 360px;background-size: cover;}
/* 导航箭头 */ 
  .arrow { position: absolute;top: 50%; transform: translateY(-50%); width: 40px; height: 40px;background: rgba(0,0,0,0.5);color: white;border: none;
border-radius: 50%;font-size: 20px;cursor: pointer;transition: 0.3s;}
 .arrow:hover {background: rgba(0,0,0,0.8);}
  .prev {left: 20px;}
  .next {right: 20px;}
  /* 焦点指示器 */
  .dots {position: absolute; bottom: 20px;left: 50%;transform: translateX(-50%);display: flex; gap: 10px;}
  .dot {width: 12px;height: 12px;border-radius: 50%;background: rgba(255,255,255,0.5);border: none;cursor: pointer;transition: 0.3s;}
  .dot.active { background: white;transform: scale(1.2);}
/*手风琴*/
 .container {display: flex;flex-direction: column; /* 核心改动：垂直布局 */width: 220px;height: 360px;gap: 10px;overflow: hidden;float: left;margin-left: 15px;}
 .panel {position: relative;width: 100%;height: 15%; /* 初始高度 *//*border-radius: 15px;*/cursor: pointer;transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);overflow: hidden;}
.panel.active {height: 60%; /* 展开后的高度 */}
.panel img {width: 100%;height: 100%; object-fit: cover;transition: transform 0.3s ease;}
.panel:hover img {transform: scale(1.05);}
.panel h3 {position: absolute;bottom: 15px;left: 20px;color: white;font-size: 1.5em;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6);opacity: 0;transition: opacity 0.3s ease 0.4s;}
.panel.active h3 { opacity: 1;}
 @media (max-width: 768px) {.container {width: 95vw; height: 95vh; }
 .panel.active {height: 70%;} }
 
/*三个轮播图*/
.carousel-container {display: flex;width: 1180px;height: 330px;margin: 0 auto;border: 1px solid #ddd; border-radius: 5px; overflow: hidden;}
.thumbnails { width: 180px; height: 330px;background: #f5f5f5; padding: 10px 0;}
.thumbnail { width: 120px;height: 80px; margin: 5px auto; cursor: pointer; opacity: 0.6; transition: opacity 0.3s;border-radius: 5px;margin-left: 20px; }
.thumbnail.active { opacity: 1;border: 10px solid #ffcb00;}
.main-image {width: 587px; height: 330px; position: relative;}
.main-image video{ width: 100%;height: 100%;object-fit: cover;}
.description {width: 401px;height: 330px;padding: 20px;background: #f9f9f9;float: right;}
.description h3 {margin-top: 0;font-size: 24px;color: #333;border-bottom: 1px solid #efefef;margin-bottom: 20px;}
.nav-buttons { position: absolute;bottom: 10px;left: 0;right: 0;text-align: center;}
.nav-buttons button { background: rgba(0,0,0,0.5);color: white;border: none;padding: 5px 10px;margin: 0 5px;cursor: pointer;border-radius: 3px;}

/*双层选项卡*/
.tab-container {margin: 20px;}
.outer-tabs {display: flex;}
.outer-tab{padding: 20px 15px;cursor: pointer;margin-right: 5px;font-size: 18px;}
.outer-tab:hover{color: orange;}
.outer-tab.active {color: orange;font-weight: bold;font-size: 20px;}
.inner-tab-container {display: none;padding: 15px;}
.inner-tab-container.active {display: block;}
.inner-tabs{display: flex;margin-bottom: 10px;}
.inner-tab {padding: 2px 7px;cursor: pointer;margin-right: 5px;border: 1px solid #666;border-radius:20px;}
.inner-tab:hover{color: orange;border: 1px solid orange;}
.inner-tab.active {background: orange;color: white;border: none;}
.inner-tab-content {display: none;}
.inner-tab-content.active {display: block;}

/*轮播*/
.notice-box {width: 860px;height: 40px;overflow: hidden;position: relative;background:#fff;color: #999;line-height: 40px;}
.notice-item {position: absolute;white-space: nowrap;opacity: 0;transform: translateX(100%);transition: all 0.5s ease;margin-left: 60px;}
.notice-item.active {opacity: 1;transform: translateX(0);}
.notice-item.leaving {opacity: 0;transform: translateX(-100%);}