#hero-section { position: relative; width: 100%; height: 100vh; min-height: 600px; background: url('https://images.unsplash.com/photo-1511632765486-a01c80cf59b4?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80') center/cover no-repeat; display: flex; align-items: center; margin-top: 0; }
#hero-section::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg,rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.1) 60%,rgba(0,0,0,0) 100%); }
#hero-section .container { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: flex-end; width: 100%; height: 100%; padding-bottom: 120px; }
#hero-section .hero-content { display: flex; flex-direction: column; gap: 10px; position: absolute; bottom: 5vw; margin-left: 10vw; }
#hero-section .main-slogan { color: #fff; font-size: 3.5rem; font-weight: 900; line-height: 1.3; text-shadow: 0 2px 10px rgba(0,0,0,0.3); letter-spacing: 2px; }
#hero-section .highlight-text { color: #FFD700; font-size: 3.5rem; }
#hero-section .eye-icon { width: 60px; height: 60px; stroke: #fff; stroke-width: 1.5; fill: none; opacity: 0.9; margin-bottom: 20px; z-index: 9; bottom: 5vw; right: 11vw; position: absolute; fill: white; }
#hero-section .curve-bottom { position: absolute; bottom: -2px; left: 0; width: 100%; overflow: hidden; line-height: 0; z-index: 2; pointer-events: none; }
#hero-section .curve-bottom svg { display: block; width: calc(100% + 1.3px); height: 90px; }
#hero-section .curve-bottom svg path { fill: #fff; }
#hero-section .bannerslide { width: 100%; height: 100%; }
#hero-section .bannerslide .slick-track {   }
#hero-section .banner_item  img { height: 100%; }
#hero-section .slick-list { height: 100%; }
#hero-section .banner_item a.photo { background-size: cover; height: 100vh; background-position: 50% 50%; }
/* 輪流跳動動畫樣式 */
.bounce-char { display: inline-block; animation: jumpText 3s infinite; }
@keyframes jumpText {
  0%,15%,100% { transform: translateY(0); }
  7.5% { transform: translateY(-15px); }
}
@media (max-width:1024px) {
  #hero-section .banner_item a.photo { background-position: 90% 50%; }
}
@media (max-width:768px) {
  #hero-section { margin-top: 80px; }
  #hero-section .container { flex-direction: column; justify-content: center; align-items: center; text-align: center; padding-bottom: 60px; }
  #hero-section .main-slogan { font-size: 36px; }
  #hero-section .eye-icon { display: none; }
}
@media (max-width:480px) {
  #hero-section { height: 500px; min-height: 500px; }
  #hero-section .banner_item a.photo { height: 500px; }
  #hero-section .hero-content { width: 100vw; margin-left: 0; margin: 0 auto; }
}
