*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;background-color:#090505;overflow:hidden}
body{font-size:0;line-height:0;position:relative}
img{display:block;width:100%;height:auto;border:0;vertical-align:top}
/* 背景层 */
.bg-layer{position:fixed;left:0;top:0;width:100%;height:100%;z-index:0;background-color:#090505;overflow:hidden}
.bg-top{position:absolute;left:0;top:0;width:100vw;height:48.70vw;background:url(../imgs/all_bgtop.jpg) center top no-repeat;background-size:100vw 48.70vw}
.bg-gap{position:absolute;left:0;top:48.70vw;bottom:89.81vw;background-color:#090505}
.bg-bottom{position:absolute;left:-2vw;bottom:0;width:104vw;height:93.4vw;background:url(../imgs/all_bgbuttom.jpg) center bottom no-repeat;background-size:100% 100%;transform-origin:center bottom;animation:bgBottomPulse 4s ease-in-out infinite}
/* 用 vh 定位，避免高屏机型（iPhone 15/15 Pro）因宽高比变大而下沉压住底部内容 */
.bg-bigtitle{position:absolute;left:50%;bottom:13.5vh;transform:translateX(-50%);width:31vw;transition:bottom .9s ease,width .9s ease;animation:bigtitlePulse 4s ease-in-out infinite}
/* 第五页：主标题上移至页面中上部并放大，并停止浮动（on-p5 由 JS 同步到 body） */
body.on-p5 .bg-bigtitle{bottom:58vh;width:52vw;animation:none}
@keyframes bigtitlePulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(0.96)}}
@keyframes bgBottomPulse{0%,100%{transform:scale(1)}50%{transform:scale(0.97)}}
/* 固定头部 */
.site-header{position:fixed;left:0;top:0;width:100%;z-index:20;padding:3.8vh 2vw 0 6.7vw;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}
.logo-left{width:35vw}
.logo-right{width:22vw;margin-top:0.4vh;margin-right: 3vw;}
/* 页面容器 */
.pages{position:relative;z-index:10}
.page{position:relative;width:100%;overflow:hidden}
.page1{height:100vh;height:calc(var(--vh,1vh)*100)}
.page1 img{position:absolute;left:50%;max-width:none}
.p1-topic{width:86vw;margin-left:-43vw;top:17vh}
.p1-city{width:19vw;margin-left:-9.5vw;top:31vh}
.p1-succre{width:52.35vw;margin-left:-26.17vw;top:36vh}
.p1-invitation{width:19vw;margin-left:-9.5vw;top:41vh}
.p1-date{width:60vw;margin-left:-30vw;top:46vh}
.p1-citytopic{width:76vw;margin-left:-38vw;top:53vh}
.p1-address{width:80.54vw;margin-left:-40.27vw;bottom:2.4vh}
/* 入场动画由 index.html 的 data-wow-delay 控制 */
/* ===== 第二页：日程安排 ===== */
.page2{position:absolute;left:0;top:0;width:100%;height:100vh;height:calc(var(--vh,1vh)*100);visibility:hidden;opacity:0;transition:opacity .45s ease}
.pages.on-p2 .page1{opacity:0;visibility:hidden;transition:opacity .35s ease}
.pages.on-p2 .page2{visibility:visible;opacity:1}
.p2-title{position:absolute;left:50%;margin-left:-16vw;width:32vw;top:13vh}
/* 表格容器：宽度由排版决定，高度按 9 行内容铺开 */
.p2-table{position:absolute;left:50%;margin-left:-35.5vw;top:17vh;width:72vw;height:43vh}
.p2-kuang{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}
/* 行：左列时间 / 右列课程，均与框等比例 对齐 */
.p2-row{position:absolute;left:4.2%;right:4.2%;height:0;display:flex;justify-content:space-between;align-items:flex-start;z-index:1}
.p2-row .p2-l{width:30.1%}
.p2-row .p2-r{width:35.1%;margin-right:13vw;margin-top: -0.2vh;}
.p2-row:nth-of-type(1){top:4.5%}
.p2-row:nth-of-type(2){top:15.5%}
.p2-row:nth-of-type(3){top:26.5%}
.p2-row:nth-of-type(4){top:37.5%}
.p2-row:nth-of-type(5){top:49%}
.p2-row:nth-of-type(6){top:60%}
.p2-row:nth-of-type(7){top:71%}
.p2-row:nth-of-type(8){top:82%}
.p2-row:nth-of-type(9){top:93%}
/* ===== 第三页：注意事项 ===== */
.page3{position:absolute;left:0;top:0;width:100%;height:100vh;height:calc(var(--vh,1vh)*100);visibility:hidden;opacity:0;transition:opacity .45s ease}
.pages.on-p3 .page1,.pages.on-p3 .page2{opacity:0;visibility:hidden;transition:opacity .35s ease}
.pages.on-p3 .page3{visibility:visible;opacity:1}
/* 切图 1548x1332，含标题与 8 条内容，等比缩放居中 */
.p3-attention{position:absolute;left:50%;margin-left:-42vw;width:84vw;top:13vh}
.page3.is-in .p3-attention{animation:fadeInUp .7s both;animation-delay:.1s}
/* ===== 第四页：课程地点 ===== */
.page4{position:absolute;left:0;top:0;width:100%;height:100vh;height:calc(var(--vh,1vh)*100);visibility:hidden;opacity:0;transition:opacity .45s ease}
.pages.on-p4 .page1,.pages.on-p4 .page2,.pages.on-p4 .page3{opacity:0;visibility:hidden;transition:opacity .35s ease}
.pages.on-p4 .page4{visibility:visible;opacity:1}
.p4-wrap{position:absolute;left:0;top:13vh;width:100%}
.p4-title{width:32vw;margin:0 auto}
/* 地图 1052x1475，与按钮一起定位 */
.p4-map-wrap{position:relative;height:39vh;margin:3vh auto 0}
.p4-map{width:auto;height: 100%; margin: 0 auto;}
/* 路线按钮贴在地图上方、居中偏右（百分比定位，随地图缩放） */
.p4-btn{position:absolute;top:60%;left:65%;transform:translateX(-50%);width:13vw;max-width:60px;cursor:pointer}
.p4-address{width:54vw;margin:2vh auto 0}
.page4.is-in .p4-title{animation:fadeInDown .6s both;animation-delay:.1s}
.page4.is-in .p4-map-wrap{animation:fadeInUp .7s both;animation-delay:.2s}
.page4.is-in .p4-address{animation:fadeInUp .7s both;animation-delay:.3s}
/* 导航选择弹层 */
.nav-mask{position:fixed;left:0;top:0;width:100%;height:100%;z-index:60;background:rgba(0,0,0,.65);display:none;align-items:flex-end}
.nav-mask.show{display:flex}
.nav-sheet{width:100%;background:#100b08;border-top:1px solid rgba(198,161,90,.5);padding:2.4vh 4vw 3vh;font-size:0;animation:sheetUp .25s ease both}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.nav-title{font-size:3.6vw;color:#c6a15a;letter-spacing:1px;text-align:center;margin-bottom:2vh;line-height:1.6}
.nav-tip{display:none;font-size:3vw;color:#8d7c5f;text-align:center;margin:-0.6vh 0 1.6vh;line-height:1.6}
.nav-tip.show{display:block}
.nav-item{display:block;width:100%;height:11vw;line-height:11vw;font-size:3.8vw;color:#f2e2c4;background:linear-gradient(90deg,rgba(198,161,90,.12),rgba(198,161,90,.02));border:1px solid rgba(198,161,90,.45);text-align:center;margin-bottom:2vh}
.nav-cancel{display:block;width:100%;height:10vw;line-height:10vw;font-size:3.6vw;color:#9d8a6c;background:none;border:0;text-align:center}
/* ===== 第五页：结尾 ===== */
.page5{position:absolute;left:0;top:0;width:100%;height:100vh;height:calc(var(--vh,1vh)*100);visibility:hidden;opacity:0;transition:opacity .45s ease}
.pages.on-p5 .page1,.pages.on-p5 .page2,.pages.on-p5 .page3,.pages.on-p5 .page4{opacity:0;visibility:hidden;transition:opacity .35s ease}
.pages.on-p5 .page5{visibility:visible;opacity:1}
/* 竖线 2x451，展开动画自上而下 */
.p5-line{position:absolute;left:50%;top:45vh;height:12vh;width:auto;transform:translateX(-50%)}
@keyframes lineGrow{from{transform:translateX(-50%) scaleY(0)}to{transform:translateX(-50%) scaleY(1)}}
.p5-qd{position:absolute;left:50%;margin-left:-26vw;width:52vw;top:60vh}
.page5.is-in .p5-line{animation:lineGrow .8s ease .7s both}
.page5.is-in .p5-qd{animation:fadeInUp .7s both;animation-delay:1.6s}
/* 第二页入场动画（切换后由 JS 加类触发） */
.page2.is-in .p2-title{animation:fadeInDown .6s both;animation-delay:.1s}
.page2.is-in .p2-table{animation:fadeInUp .7s both;animation-delay:.2s}
/* ===== 背景音乐开关 ===== */
/* 顶在右侧 logo 下方：logo 顶边 4.2vh + 高 5.1vw，再留 2vw 间距 */
.bgm-btn{position:fixed;right:5vw;top:calc(4.2vh + 7.1vw);width:8.5vw;height:8.5vw;z-index:30;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bgm-btn img{width:100%;height:100%}
.bgm-btn .bgm-on{display:none}
.bgm-btn.is-playing .bgm-off{display:none}
.bgm-btn.is-playing .bgm-on{display:block;animation:bgmRotate 2s linear infinite}
@keyframes bgmRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
