重走西南联大之路旅行团开幕式暨开幕论�?/title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="icon" type="image/svg+xml" href="../../../pic/ico/pku-favicon.ico" /> <link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet"> <script> tailwind.config = { theme: { extend: { colors: { primary: '#8B0000', // 采用深红色系，体现历史厚重感 secondary: '#CD5C5C', accent: '#D2691E', light: '#F8F9FA', dark: '#343A40', highlight: '#DEB887' }, fontFamily: { serif: ['Noto Serif SC', 'serif'], sans: ['Inter', 'sans-serif'] } } } } </script>  <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet"> <style> .chart-wrapper { position: relative; margin-bottom: 20px; } .chart-container { position: relative; height: 600px; width: 100%; transition: all 0.3s ease; } .chart-controls { position: absolute; top: 10px; right: 10px; z-index: 10; } .maximize-btn { background-color: rgba(255, 255, 255, 0.8); border: none; border-radius: 4px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.2); transition: all 0.2s ease; } .maximize-btn:hover { background-color: white; transform: scale(1.05); } .maximize-btn i { color: #333; font-size: 18px; } /* 全屏模式样式 */ .fullscreen-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: white; z-index: 1000; padding: 20px; box-sizing: border-box; display: none; } .fullscreen-overlay.active { display: block; } .fullscreen-overlay .chart-container { height: calc(100vh - 40px); } .info { text-align: center; margin-top: 20px; color: #666; font-size: 14px; } /* 图片查看器样�?*/ .image-viewer { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.9); z-index: 2000; display: none; justify-content: center; align-items: center; padding: 20px; } .image-viewer.active { display: flex; } .image-viewer img { max-width: 90%; max-height: 90%; object-fit: contain; } .close-viewer { position: absolute; top: 20px; right: 20px; color: white; font-size: 30px; cursor: pointer; background: none; border: none; } </style> <style type="text/tailwindcss"> @layer utilities { .text-shadow { text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); } .bg-blur { backdrop-filter: blur(8px); } .animate-float { animation: float 6s ease-in-out infinite; } @keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-15px); } 100% { transform: translateY(0px); } } } </style> <style type="text/tailwindcss"> @layer utilities { .content-auto { content-visibility: auto; } .hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; } .hover-lift:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(139, 0, 0, 0.15); } .animate-fade-in { animation: fadeIn 0.8s ease-in-out; } .animate-slide-up { animation: slideUp 0.8s ease-out; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes slideUp { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .venue-image { transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer; } .venue-image:hover { transform: scale(1.03); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); } } </style> </head> <body class="bg-light font-sans text-dark antialiased">  <nav class="bg-white shadow-md fixed w-full z-10 transition-all duration-300" id="navbar"> <div class="container mx-auto px-4 py-3 flex justify-between items-center"> <a href="#" class="flex items-center space-x-2"> <i class="fa fa-university text-primary text-2xl"></i> <span class="text-xl font-bold text-primary">重走西南联大之路</span> </a> <div class="hidden md:flex space-x-8"> <a href="#about" class="text-dark/80 hover:text-primary transition-colors">关于活动</a> <a href="#guests" class="text-dark/80 hover:text-primary transition-colors">特邀嘉宾</a> <a href="#agenda" class="text-dark/80 hover:text-primary transition-colors">活动议程</a> <a href="#organizers" class="text-dark hover:text-primary transition-colors">主办单位</a> <a href="#journey" class="text-dark hover:text-primary transition-colors">旅行行程</a> <a href="#contact" class="text-dark hover:text-primary transition-colors">报名咨询</a> </div> <button class="md:hidden text-primary text-xl" id="menuToggle"> <i class="fa fa-bars"></i> </button> </div>  <div class="md:hidden bg-white shadow-lg absolute w-full left-0 top-full transform -translate-y-full opacity-0 transition-all duration-300 invisible" id="mobileMenu"> <div class="container mx-auto px-4 py-4 flex flex-col space-y-4"> <a href="#about" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">关于活动</a> <a href="#guests" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">特邀嘉宾</a> <a href="#agenda" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">活动议程</a> <a href="#organizers" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">主办单位</a> <a href="#journey" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">旅行行程</a> <a href="#contact" class="text-dark hover:text-primary transition-colors py-2 border-b border-gray-100">报名咨询</a> </div> </div> </nav>  <section class="pt-24 pb-16 md:py-24 bg-gradient-to-b from-red-50 to-white overflow-hidden"> <div class="container mx-auto px-4"> <div class="flex flex-col md:flex-row items-center justify-between gap-8 relative">  <div class="absolute -top-10 -left-10 w-40 h-40 bg-primary/5 rounded-full blur-2xl"></div> <div class="absolute -bottom-10 -right-10 w-60 h-60 bg-accent/5 rounded-full blur-3xl"></div> <div class="md:w-1/2 space-y-6 relative z-10"> <h1 class="font-serif font-bold text-[clamp(2.5rem,5vw,3.5rem)] leading-tight text-primary animate-fade-in"> 重走西南联大之路<br> <span class="text-secondary">开幕式暨论�?/span> </h1> <p class="text-lg text-dark/70 max-w-lg animate-slide-up" style="animation-delay: 0.1s"> 传承刚毅坚卓精神，连接历史与未来，融合历史与传承，探讨金融与AI前沿趋势，开启文化与思想的寻根之旅�? </p> <div class="flex flex-wrap items-center gap-x-6 gap-y-3 pt-4 animate-slide-up" style="animation-delay: 0.3s"> <div class="flex items-center gap-2"> <i class="fa fa-calendar text-accent w-5 text-center"></i> <span>2025�?1�?6�?/span> </div> <div class="flex items-center gap-2"> <i class="fa fa-map-marker text-accent w-5 text-center"></i> <span>长沙中南大学鸿业学术交流中心 </span> </div> <div class="flex items-center gap-2"> <i class="fa fa-lightbulb-o text-accent w-5 text-center"></i> <span>主题：历史与传承,金融与AI</span> </div> </div> <div class="mt-6 md:mt-8 flex flex-wrap gap-4 animate-slide-up" style="animation-delay: 0.2s"> <button class="px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/90 transition-all hover-lift flex items-center"> <i class="fa fa-share-alt mr-2"></i>分享 </button> <button class="px-6 py-3 bg-white text-primary border border-primary rounded-lg hover:bg-primary/5 transition-all hover-lift flex items-center"> <i class="fa fa-bookmark-o mr-2"></i>收藏 </button> </div> </div> <div class="md:w-1/2 relative z-10 mt-8 md:mt-0"> <div class="relative bg-white rounded-2xl shadow-2xl overflow-hidden animate-float hover:shadow-3xl transition-all duration-500"> <img src="../../../pic/s/pku/cul/1019/top.jpg" alt="西南联大旧址，历史与现代交融" class="w-full h-auto transform hover:scale-105 transition-transform duration-700"> <div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/20 to-transparent flex items-end"> <div class="p-6 text-white"> <p class="font-serif text-xl md:text-2xl">刚毅坚卓，矢志不�?/p> </div> </div> </div> </div> </div> </section>  <main class="py-12 px-4 md:px-8 max-w-6xl mx-auto">  <section id="about" class="py-16 bg-white rounded-2xl shadow-lg p-6 md:p-10 mb-16"> <div class="container mx-auto px-4"> <div class="text-center max-w-3xl mx-auto mb-12"> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">活动背景与意�?/h2> <p class="text-dark/70">传承西南联大精神，融合历史人文与金融创新</p> </div> <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> <div class="bg-red-50 p-6 rounded-lg hover-lift"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center"> <i class="fa fa-history text-primary mr-2"></i>历史传承 </h3> <p class="text-dark/70">本次活动举办地中南大学鸿业学术交流中心。我们将在这里追溯历史足迹，传承"刚毅坚卓"的西南联大精神�?/p> </div> <div class="bg-red-50 p-6 rounded-lg hover-lift"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center"> <i class="fa fa-comments text-primary mr-2"></i>论坛主题 </h3> <p class="text-dark/70">本次开幕论坛以"历史与传�?金融与AI"为主题，汇聚各界贤达，探讨人工智能时代金融行业的发展趋势与创新机遇，连接历史智慧与未来科技�?/p> </div> <a href="../fi/notice816.html" class="block bg-red-50 p-6 rounded-lg hover-lift transition-all duration-300 hover:shadow-md hover:bg-red-100 relative overflow-hidden group"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center text-primary"> <i class="fa fa-trophy text-primary mr-2"></i> 5·20"刚毅坚卓�?证券精英选拔�? </h3> <p class="text-dark/70">今年5�?0日启动的"刚毅坚卓�?高校校友证券投资精英选拔赛，历经68天实盘交易比拼，通过平安证券授权复核确保公平公正，于8�?6日正式公布获奖名单。赛事展现了投资精英的专业素养，为行业选拔了优秀人才�?/p>  <span class="absolute bottom-3 left-1/2 -translate-x-1/2 bg-primary text-white text-sm py-1 px-3 rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none"> 点击查看详情 </span> </a> <a href="../fi/doc903.html" class="block bg-red-50 p-6 rounded-lg hover-lift transition-all duration-300 hover:shadow-md hover:bg-red-100 relative overflow-hidden group"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center"> <i class="fa fa-calendar-check-o text-primary mr-2"></i>9·3"致敬西南联大"纪念活动 </h3> <p class="text-dark/70">9�?日在上海举办�?致敬西南联大88周年、庆祝抗战胜�?0周年"活动，包含八字桥抗战遗址参访、袁帆学长主题演讲�?刚毅坚卓�?颁奖及新赛事启动仪式，以"刚毅坚卓·弦歌不辍"为主线，传承民族精神�?/p> <span class="absolute bottom-3 left-1/2 -translate-x-1/2 bg-primary text-white text-sm py-1 px-3 rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none"> 点击查看详情 </span> </a> <div class="bg-red-50 p-6 rounded-lg hover-lift"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center"> <i class="fa fa-handshake-o text-primary mr-2"></i>湘沪协作 </h3> <p class="text-dark/70">本次活动搭建起湖南与上海两地交流合作的桥梁，依托湖南作为西南联大历史发源地的文化底蕴，结合上海金融中心的创新资源，推动两地在金融实践、历史传承、人才培养等领域深度联动，共谱跨区域协作新篇章�?/p> </div> <div class="bg-red-50 p-6 rounded-lg hover-lift"> <h3 class="font-serif font-semibold text-xl mb-3 flex items-center"> <i class="fa fa-road text-primary mr-2"></i>旅行意义 </h3> <p class="text-dark/70">"重走西南联大之路"不仅是一次历史文化之旅，更是一次精神寻根之旅。通过追溯先辈足迹，感悟烽火岁月中的学术坚守与家国情怀，激励当代精英在新时代勇于担当、追求卓越�?/p> </div> </div> </div> </section>  <section id="agenda" class="py-16 bg-white rounded-2xl shadow-lg p-6 md:p-10 mb-16"> <div class="container mx-auto px-4"> <div class="text-center mb-16"> <h2 class="font-serif font-bold text-3xl md:text-5xl text-primary mb-4">论坛主题：迈向世界的创新与投�?/h2> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">论坛活动议程</h2> <p class="text-dark/70">2025�?1�?6日（星期日）· 长沙</p> <p class="text-dark/70">下午 13:00 �?17:30</p> <div class="w-24 h-1 bg-accent mx-auto mt-4"></div> </div> <div class="space-y-8 max-w-3xl mx-auto">  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 13:00 �?13:30 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">嘉宾签到</h4> <p class="text-dark/70">交流互动</p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 13:30 �?13:45 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">主办方致�?/h4> <p class="text-dark/70">北大上海金融家俱乐部领导</p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 13:45 �?14:00 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">联合主办方致�?/h4> <p class="text-dark/70">北大湖南校友会领�?/p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 14:00 �?14:45 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">主题演讲一：西南联大精神的当代价�?/h4> <p class="text-dark/70">张戟</p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 14:45 �?15:30 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">主题演讲二：大学精神的于斯为盛之�?/h4> <p class="text-dark/70">谭忠�?/p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 15:30 �?16:15 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">主题演讲三：拥抱AI,与时俱进</h4> <p class="text-dark/70">张宏</p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 16:15 �?17:00 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">主题演讲四：AI时代下的金融创新</h4> <p class="text-dark/70">李利凯博�?/p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 17:00 �?17:45 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">圆桌论坛：历史与传承金融与AI的未来展�?/h4> <p class="text-dark/70">全体嘉宾及特邀嘉宾</p> </div> </div> </div>  <div class="bg-red-50 p-6 rounded-xl hover-lift"> <div class="flex flex-col md:flex-row md:items-center gap-4"> <div class="bg-primary text-white px-4 py-2 rounded-lg font-medium min-w-[180px]"> 17:45 �?18:00 </div> <div> <h4 class="font-bold text-lg mb-1 text-secondary">旅行团授旗仪式与合影留念</h4> <p class="text-dark/70">所有参会人�?/p> </div> </div> </div> </div> </div> </section>  <section id="guests" class="max-w-5xl mx-auto mb-16"> <div class="container mx-auto px-4"> <div class="text-center mb-12"> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">主办方及嘉宾</h2> <div class="w-24 h-1 bg-accent mx-auto"></div> </div> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8">   <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <img src="../../../pic/s/pku/vip/zj.jpg" alt="张戟学长照片" class="w-40 h-40 rounded-full object-cover border-4 border-white shadow-md mb-4"> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-green-600">张戟</h3> <p class="text-gray-600">北大上海金融家俱乐部秘书�?/p> <p class="text-gray-600">北大上海文创与城市更新副会长</p> </div> </div> <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <img src="../../../pic/s/pku/cul/1019/zhh.jpg" alt="张宏学长照片" class="w-40 h-40 rounded-full object-cover border-4 border-white shadow-md mb-4"> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-green-600">张宏</h3> <p class="text-gray-600">北大77级校�?/p> <p class="text-gray-600">科技业界资深从业者，硅谷企业家及VC合伙�?/p> </div> </div>  <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <img src="../../../pic/s/pku/cul/1019/tzc.png" alt="谭忠诚照�? class="w-40 h-40 rounded-full object-cover border-4 border-white shadow-md mb-4"> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-indigo-600">谭忠�?/h3> <p class="text-gray-600">中南大学哲学系副教授、硕士生导师</p> <p class="text-gray-600">中南大学家文化研究中心执行主�?/p> </div> </div>   <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <img src="../../../pic/s/pku/cul/1019/llk.jpg" alt="李利凯博士照�? class="w-40 h-40 rounded-full object-cover border-4 border-white shadow-md mb-4"> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-indigo-600">李利�?/h3> <p class="text-gray-600">著名投资�?/p> <p class="text-gray-600">云研资本创始及管理合伙人、北京广盛律师事务所创始合伙人、雨林荟创始�?/p> <p class="text-gray-600">中关村股权投资协会副会长</p> </div> </div>   <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <img src="../../../pic/s/pku/cul/1019/cm.jpg" alt="陈名先生照片" class="w-40 h-40 rounded-full object-cover border-4 border-white shadow-md mb-4"> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-purple-600">陈名</h3> <p class="text-gray-600">紫莺资产董事�?/p> <p class="text-gray-600">北大上海校友会国发院分会理事</p> <p class="text-gray-600">圆桌论坛嘉宾</p> </div> </div>  <div class="guest-card flex flex-col items-center text-center bg-light rounded-lg p-6 shadow-sm hover:shadow-md transition-all duration-300"> <div class="w-40 h-40 rounded-full bg-gray-200 flex items-center justify-center border-4 border-white shadow-md mb-4"> <i class="fa fa-user-circle text-5xl text-gray-400"></i> </div> <div class="flex-1"> <h3 class="font-bold text-xl mb-3 text-red-600">行业领袖</h3> <p class="text-gray-600">圆桌论坛嘉宾</p> </div> </div> </div> </div> </section>  <section id="journey" class="py-16 bg-gradient-to-b from-white to-red-50 rounded-2xl shadow-lg p-6 md:p-10 mb-16"> <div class="container mx-auto px-4"> <div class="text-center mb-16"> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">重走西南联大之路行程</h2> <p class="text-dark/70">11�?7�?�?21�?/p> <div class="w-24 h-1 bg-accent mx-auto"></div> </div> <div class="relative">  <div class="hidden md:block absolute left-1/2 top-0 bottom-0 w-1 bg-primary/20 transform -translate-x-1/2"></div> <div class="space-y-12 relative">  <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <img src="../../../pic/s/pku/cul/1019/jzzt.jpg" alt="橘子洲头" class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">2</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">长沙�?1�?5日）</h3> <p class="text-dark/70 mb-2">下午：橘子洲�?/p> <p class="text-dark/70">晚上：游览天心阁夜景</p> </div> </div>  <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">长沙�?1�?6日）</h3> <p class="text-dark/70 mb-2">上午：岳麓山岳麓书院</p> <p class="text-dark/70 mb-2">下午：论�?/p> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">1</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <img src="../../../pic/s/pku/cul/1019/awt.jpg" alt="长沙临时大学旧址" class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> </div>  <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <img src="../../../pic/s/pku/cul/1019/thy.jpg" alt="常德风光" class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">2</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">常德�?1�?7日）</h3> <p class="text-dark/70 mb-2">上午：参观常德会战抗日纪念碑，缅怀先烈</p> <p class="text-dark/70 mb-2">下午：前往桃花源景区，感受自然与人文之�?/p> <p class="text-dark/70">晚上：桃花源文化体验活动</p> </div> </div>  <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">芷江�?1�?8日）</h3> <p class="text-dark/70 mb-2">上午：参观凰山公园，了解抗战历史</p> <p class="text-dark/70 mb-2">下午：游览抗战受降城纪念馆、飞虎队纪念�?/p> <p class="text-dark/70">晚上：抗战历史专题讲�?/p> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">3</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <img src="../../../pic/s/pku/cul/1019/zj.jpg" alt="芷江受降纪念�? class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> </div>   <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <img src="../../../pic/s/pku/cul/1019/fh.jpg" alt="凤凰古城" class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">4</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">凤凰�?1�?9日）</h3> <p class="text-dark/70 mb-2">上午：凤凰古城赏边城美景，拜谒沈从文故居</p> <p class="text-dark/70 mb-2">下午：参访陈寅恪祖居，感受文人风�?/p> <p class="text-dark/70">晚上：旅行团闭幕式及总结分享�?/p> </div> </div>  <div class="flex flex-col md:flex-row items-center"> <div class="md:w-1/2 md:pr-12 md:text-right order-2 md:order-1 mt-6 md:mt-0"> <h3 class="font-serif font-bold text-xl mb-2 text-primary">衡阳�?1�?0日）</h3> <p class="text-dark/70 mb-2">上午：衡阳忠烈祠</p> <p class="text-dark/70 mb-2">下午：返�?/p> </div> <div class="md:w-12 flex justify-center order-1 md:order-2"> <div class="w-8 h-8 rounded-full bg-primary text-white flex items-center justify-center z-10 shadow-md">5</div> </div> <div class="md:w-1/2 md:pl-12 order-3"> <img src="../../../pic/s/pku/cul/1019/zlc.jpg" alt="凤凰古城" class="rounded-lg shadow-md w-full h-48 object-cover venue-image"> </div> </div> </div> </div> </div> </section>  <section id="registration" class="py-16 bg-gradient-to-r from-primary/5 to-secondary/5 rounded-2xl shadow-lg p-6 md:p-10 mb-16"> <div class="container mx-auto px-4"> <div class="text-center mb-12"> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">扫码报名</h2> <p class="text-dark/70">自由旅游，欢迎加�?/p> <div class="w-24 h-1 bg-accent mx-auto mt-4"></div> </div> <div class="flex flex-col md:flex-row items-center justify-center gap-12"> <div class="bg-white p-6 rounded-xl shadow-md hover-lift"> <div class="text-center mb-4"> <h3 class="font-bold text-xl text-primary">微信扫码报名</h3> </div> <div class="bg-gray-100 p-4 rounded-lg flex justify-center"> <img src="../../../pic/s/pku/cul/1019/qr.jpg" alt="活动报名二维�? class="w-64 h-64 object-contain"> </div> <p class="text-center text-sm text-gray-500 mt-4">有兴趣扫码报�?/p> </div> <div class="max-w-md"> <h3 class="font-serif font-bold text-2xl text-primary mb-6">报名须知</h3> <ul class="space-y-4"> <li class="flex items-start gap-3"> <i class="fa fa-check-circle text-accent mt-1"></i> <span>报名后将进行资格审核，确认后可加�?/span> </li> <li class="flex items-start gap-3"> <i class="fa fa-check-circle text-accent mt-1"></i> <span>报名后论坛当天方可入�?/span> </li> <li class="flex items-start gap-3"> <i class="fa fa-check-circle text-accent mt-1"></i> <span>如有疑问，请联系�?3916598493</span> </li> </ul> </div> </div> </div> </section>  <section id="organizers" class="py-16 bg-white rounded-2xl shadow-lg p-6 md:p-10 mb-16"> <div class="container mx-auto px-4"> <div class="text-center mb-16"> <h2 class="font-serif font-bold text-3xl md:text-4xl text-primary mb-4">主办方与合作单位</h2> <div class="w-24 h-1 bg-accent mx-auto"></div> </div> <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> <div class="bg-white rounded-xl shadow-md hover:shadow-xl transition-all p-6 border-t-4 border-primary group"> <div class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center mb-6 text-primary text-2xl group-hover:bg-primary group-hover:text-white transition-all"> <i class="fa fa-university"></i> </div> <h3 class="font-serif font-bold text-xl mb-3 text-primary">北大上海金融家俱乐部</h3> <p class="text-dark/70">活动主办方，汇聚北大金融领域校友，搭建金融交流平台，促进金融创新与合作，传承北大精神，服务社会发展�?/p> </div>  <div class="bg-white rounded-xl shadow-md hover:shadow-xl transition-all p-6 border-t-4 border-primary group"> <div class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center mb-6 text-primary text-2xl group-hover:bg-primary group-hover:text-white transition-all"> <i class="fa fa-university"></i> </div> <h3 class="font-serif font-bold text-xl mb-3 text-primary">北大国发院湖南校友分�?/h3> <p class="text-dark/70">联合主办方，汇聚北京大学国发院各个领域的在湘校友及在湘投资校友，致力于搭建高水平的交流合作平台，推动产业创新与地方发展。活动秉承并弘扬北大精神，促进校友间的紧密联系与协作，以服务社会进步和湖南区域发展为宗旨�?/p> </div>  <div class="bg-white rounded-xl shadow-md hover:shadow-xl transition-all p-6 border-t-4 border-secondary group"> <div class="w-14 h-14 bg-secondary/10 rounded-full flex items-center justify-center mb-6 text-secondary text-2xl group-hover:bg-secondary group-hover:text-white transition-all"> <i class="fa fa-users"></i> </div> <h3 class="font-serif font-bold text-xl mb-3 text-secondary">北大湖南校友�?/h3> <p class="text-dark/70">联合主办方，连接北京大学在湘校友，促进校友间的交流与合作，传承和发扬北大精神，服务湖南地方发展�?/p> </div>  <div class="bg-white rounded-xl shadow-md hover:shadow-xl transition-all p-6 border-t-4 border-accent group"> <div class="w-14 h-14 bg-accent/10 rounded-full flex items-center justify-center mb-6 text-accent text-2xl group-hover:bg-accent group-hover:text-white transition-all"> <i class="fa fa-handshake-o"></i> </div> <h3 class="font-serif font-bold text-xl mb-3 text-accent">上海振兴湖南经济联谊会金融协�?/h3> <p class="text-dark/70">合作单位，致力于促进沪湘两地经济交流与合作，搭建金融领域沟通桥梁，助力湖南经济发展�?/p> </div> </div> </div> </section> </main>  <footer class="bg-dark text-white py-12"> <div class="container mx-auto px-4"> <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> <div> <h3 class="font-serif font-bold text-xl mb-4">重走西南联大之路</h3> <p class="text-gray-400 mb-4">传承刚毅坚卓精神，连接历史与未来，融合历史与传承，探讨金融与AI前沿趋势�?/p> <div class="flex space-x-4"> <a href="../index.html" class="text-white hover:text-highlight transition-colors text-xl"> <i class="fa fa-home"></i> </a> <a href="#" class="text-gray-400 hover:text-white transition-colors"> <i class="fa fa-weixin text-xl"></i> </a> <a href="#" class="text-gray-400 hover:text-white transition-colors"> <i class="fa fa-weibo text-xl"></i> </a> <a href="#" class="text-gray-400 hover:text-white transition-colors"> <i class="fa fa-linkedin text-xl"></i> </a> </div> </div> <div> <h3 class="font-serif font-bold text-xl mb-4">快速链�?/h3> <ul class="space-y-2"> <li><a href="#about" class="text-gray-400 hover:text-white transition-colors">关于活动</a></li> <li><a href="#guests" class="text-gray-400 hover:text-white transition-colors">特邀嘉宾</a></li> <li><a href="#agenda" class="text-gray-400 hover:text-white transition-colors">活动议程</a></li> <li><a href="#journey" class="text-gray-400 hover:text-white transition-colors">旅行行程</a></li> <li><a href="./xyc.html" class="text-gray-400 hover:text-white transition-colors">许渊冲研�?/a></li> </ul> </div> <div> <h3 class="font-serif font-bold text-xl mb-4">联系我们</h3> <ul class="space-y-2"> <li class="flex items-center"> <i class="fa fa-phone text-gray-400 mr-2"></i> <span class="text-gray-400">18621967957</span> </li> <li class="flex items-center"> <i class="fa fa-phone text-gray-400 mr-2"></i> <span class="text-gray-400">15796580260</span> </li> <li class="flex items-start"> <i class="fa fa-map-marker text-gray-400 mr-2 mt-1"></i> <span class="text-gray-400">上海市浦东新区浦东南�?888�?601-1�?/span> </li> </ul> </div> </div> <div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-500 text-sm"> <p>© 2025 重走西南联大之路活动组委�?版权所�?/p> </div> </div> </footer>  <div class="image-viewer" id="imageViewer"> <button class="close-viewer" id="closeViewer"> <i class="fa fa-times"></i> </button> <img src="" alt="大图预览" id="viewerImage"> </div> <script> // 导航栏滚动效�? window.addEventListener('scroll', function() { const navbar = document.getElementById('navbar'); if (window.scrollY > 50) { navbar.classList.add('py-2', 'shadow-lg', 'bg-white/95', 'bg-blur'); navbar.classList.remove('py-3', 'shadow-md'); } else { navbar.classList.add('py-3', 'shadow-md'); navbar.classList.remove('py-2', 'shadow-lg', 'bg-white/95', 'bg-blur'); } }); // 移动端菜单切�? const menuToggle = document.getElementById('menuToggle'); const mobileMenu = document.getElementById('mobileMenu'); menuToggle.addEventListener('click', function() { if (mobileMenu.classList.contains('invisible')) { mobileMenu.classList.remove('-translate-y-full', 'opacity-0', 'invisible'); mobileMenu.classList.add('translate-y-0', 'opacity-100', 'visible'); menuToggle.innerHTML = '<i class="fa fa-times"></i>'; } else { mobileMenu.classList.add('-translate-y-full', 'opacity-0', 'invisible'); mobileMenu.classList.remove('translate-y-0', 'opacity-100', 'visible'); menuToggle.innerHTML = '<i class="fa fa-bars"></i>'; } }); // 平滑滚动 document.querySelectorAll('a[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function (e) { e.preventDefault(); // 关闭移动菜单（如果打开�? if (!mobileMenu.classList.contains('invisible')) { mobileMenu.classList.add('-translate-y-full', 'opacity-0', 'invisible'); mobileMenu.classList.remove('translate-y-0', 'opacity-100', 'visible'); menuToggle.innerHTML = '<i class="fa fa-bars"></i>'; } const targetId = this.getAttribute('href'); const targetElement = document.querySelector(targetId); if (targetElement) { window.scrollTo({ top: targetElement.offsetTop - 80, behavior: 'smooth' }); } }); }); // 图片查看器功�? const imageViewer = document.getElementById('imageViewer'); const viewerImage = document.getElementById('viewerImage'); const closeViewer = document.getElementById('closeViewer'); const venueImages = document.querySelectorAll('.venue-image'); venueImages.forEach(image => { image.addEventListener('click', function() { viewerImage.src = this.src; imageViewer.classList.add('active'); document.body.style.overflow = 'hidden'; }); }); closeViewer.addEventListener('click', function() { imageViewer.classList.remove('active'); document.body.style.overflow = 'auto'; }); imageViewer.addEventListener('click', function(e) { if (e.target === imageViewer) { imageViewer.classList.remove('active'); document.body.style.overflow = 'auto'; } }); // 页面加载动画 document.addEventListener('DOMContentLoaded', function() { document.body.classList.add('loaded'); }); </script> </body> </html>