@charset "utf-8";
/* CSS 租车 */
.charter-crumb { padding: 15px 0; font-size: 14px; color: #475569; }
.charter-banner { position: relative; width: 1200px; height: 380px; margin: 0 auto; overflow: hidden; }
.banner-slideshow-stacked { position: absolute; inset: 0; z-index: 0; }
.banner-slideshow-stacked .slide { position: absolute; inset: 0; opacity: 0; animation: slideBgFadeIn_Stacked 15s ease-in-out infinite; }
.banner-slideshow-stacked .slide img { width: 100%; height: 100%; object-fit: cover; }
.banner-slideshow-stacked .slide:nth-child(1) { animation-delay: 0s; }
.banner-slideshow-stacked .slide:nth-child(2) { animation-delay: 5s; }
.banner-slideshow-stacked .slide:nth-child(3) { animation-delay: 10s; }
@keyframes slideBgFadeIn_Stacked { 0% { opacity: 0; } 5% { opacity: 1; } 30% { opacity: 1; } 35% { opacity: 1; } 40% { opacity: 0; } 100% { opacity: 0; } }

.banner-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.15); z-index: 10; }
.banner-content { position: relative; z-index: 20; text-align: center; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; }
.banner-content h2 { font-size: 40px; font-weight: bold; margin-bottom: 20px; letter-spacing: 2px; text-shadow: 0 4px 8px rgba(0,0,0,0.3); }
.banner-content p { font-size: 20px; margin-bottom: 30px; opacity: 0.9; }
.banner-tel { display: inline-block; background: #c62828; color: #fff; padding: 12px 35px; border-radius: 50px; font-size: 20px; font-weight: bold; box-shadow: 0 10px 20px rgba(198, 40, 40, 0.3); transition: transform 0.3s ease; }
.banner-tel:hover { transform: translateY(-3px); color: #fff; }
.section-title { text-align: center; margin: 60px 0 40px; }
.section-title h3 { font-size: 32px; color: #1e293b; font-weight: bold; margin-bottom: 10px; }
.section-title p { font-size: 16px; color: #475569; }
.section-title span { display: inline-block; width: 60px; height: 3px; background: #0277bd; margin-top: 15px; border-radius: 2px; }
.charter-features { background: #fff; border-radius: 12px; padding: 40px; margin-top: -50px; position: relative; z-index: 10; box-shadow: 0 10px 30px rgba(0,0,0,0.05); display: flex; justify-content: space-around; }
.feature-item { text-align: center; width: 22%; }
.feature-icon { width: 60px; height: 60px; background: #f0f9ff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; color: #0277bd; font-size: 24px; font-weight: bold; border: 2px solid #bae6fd; }
.feature-item h3 { font-size: 18px; font-weight: bold; color: #1e293b; margin-bottom: 8px; }
.feature-item p { font-size: 13px; color: #475569; line-height: 1.6; }
.vehicle-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 60px; }
.car-card { background: #fff; border-radius: 8px; overflow: hidden; transition: all 0.3s ease; box-shadow: 0 4px 6px rgba(0,0,0,0.03); }
.car-card:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
.car-pic { width: 100%; height: 180px; overflow: hidden; }
.car-pic img { width: 100%; height: 100% !important; object-fit: cover !important; transition: transform 0.5s; }
.car-card:hover .car-pic img { transform: scale(1.05); }
.car-info { padding: 20px; }
.car-name { font-size: 18px; font-weight: bold; color: #1e293b; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center; }
.car-tag { font-size: 12px; background: #f0f9ff; color: #0277bd; padding: 3px 8px; border-radius: 4px; font-weight: bold; border: 1px solid #bae6fd; white-space: nowrap; }
.car-desc { font-size: 13px; color: #475569; margin-bottom: 15px; height: 40px; overflow: hidden; line-height: 1.5; }
.car-price-row { display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px dashed #e2e8f0; padding-top: 15px; }
.car-price span { color: #c62828; font-size: 22px; font-weight: bold; }
.car-price em { font-style: normal; font-size: 12px; color: #555555; }
.btn-book { background: #0277bd; color: #fff; padding: 6px 15px; border-radius: 4px; font-size: 13px; transition: background 0.3s; border: none; }
.btn-book:hover { background: #01579b; color: #fff; }
.route-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 60px; }
.route-card { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 6px rgba(0,0,0,0.03); transition: all 0.3s; }
.route-card:hover { transform: translateY(-5px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
.route-pic { height: 220px; position: relative; }
.route-pic img { width: 100%; height: 100%; object-fit: cover; }
.route-days { position: absolute; top: 15px; left: 15px; background: rgba(0,0,0,0.75); color: #fff; padding: 4px 10px; border-radius: 4px; font-size: 12px; font-weight: bold; }
.route-info { padding: 20px; }
.route-info h4 { font-size: 18px; font-weight: bold; color: #1e293b; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.route-info p { font-size: 13px; color: #475569; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.route-info div[style*="color: #ff6b6b"] { color: #c62828 !important; }
.route-info em[style*="color: #94a3b8"] { color: #555555 !important; }
.route-info div span { background-color: #0277bd !important; }
.zc-cat-nav-wrapper { position: relative; z-index: 10; margin-top: -40px; margin-bottom: 40px; }
.zc-cat-nav { display: flex; justify-content: space-around; align-items: center; background: #ffffff; padding: 20px 30px; border-radius: 12px; box-shadow: 0 8px 25px rgba(0,0,0,0.08); }
.zc-cat-nav a { display: flex; align-items: center; justify-content: center; font-size: 16px; color: #334155; font-weight: bold; text-decoration: none; padding: 12px 28px; border-radius: 30px; transition: all 0.3s ease; border: 1px solid transparent; }
.zc-cat-nav a:hover { color: #0277bd; background: #f0f9ff; border-color: #bae6fd; }
.zc-cat-nav a.active { background: #0277bd !important; color: #ffffff !important; box-shadow: 0 4px 12px rgba(2, 119, 189, 0.3) !important; }
.epages { text-align: center; margin: 40px 0 60px; font-size: 14px; }
.epages a, .epages span { display: inline-block; padding: 8px 16px; margin: 0 4px; border-radius: 4px; background: #ffffff; color: #475569; border: 1px solid #e2e8f0; text-decoration: none; transition: all 0.3s ease; }
.epages a:hover { color: #0277bd; border-color: #0277bd; }
.epages span.current, .epages a.current, .epages b { background: #0277bd; color: #ffffff; border-color: #0277bd; font-weight: bold; }