/* 样式 */
html, body, .app { display:block; width:100%; height:100%; overflow:hidden; }

.app-header { position:fixed; top:0px; left:0px; right:0px; z-index:2; display:block; width:100%; height:140px; background-color:rgba(0,0,0,0.2); }
.app-header .logo { position:absolute; top:25px; left:40px; display:block; width:164px; height:164px; }
.app-header .logo a,
.app-header .logo img { display:block; width:100%; height:100%; }
.app-header .name { position:absolute; top:25px; left:228px; }
.app-header .name h4 { display:block; color:#fff; font-size:48px; font-weight:700; text-align:left; line-height:1; }
.app-header .name p { display:block; margin-top:12px; color:#fff; font-size:30px; text-align:left; line-height:1; }
.app-header .btn-download { position:absolute; top:23px; right:138px; display:block; width:294px; height:96px; background:url("../images/btn-download.png?v=20250528") no-repeat 0px 0px; color:transparent; font-size:0px; text-align:center; line-height:96px; }
.app-header .btn-menu { position:absolute; top:41px; right:40px; display:block; width:58px; height:58px; background:url("../images/btn-menu.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:0px; text-align:center; line-height:58px; }

.app-body { position:relative; z-index:1; display:block; width:100%; height:100%; }
.app-body .swiper { display:block; width:100%; height:100%; }
.app-body .swiper .swiper-wrapper .swiper-slide:last-child { height:256px; }
.app-body .scroll-tips { position:absolute; bottom:64px; left:50%; z-index:2; display:block; width:258px; height:50px; background:url("../images/scroll-tips.png?v=20250528") no-repeat 50% 50%; margin-left:-129px; color:transparent; font-size:0px; text-align:center; line-height:50px; animation:floating 2s linear infinite; }
.app-body .page { position:relative; display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; }
.app-body .page.page1 { background-image:url("../images/bg1.jpg?v=20250528"); }
.app-body .page.page1 .slogan { position:absolute; bottom:500px; left:50%; display:block; width:1080px; height:440px; background:url("../images/slogan.png?v=20250528") no-repeat 50% 50%; transform:translate(-50%,0%); }
.app-body .page.page1 .btn-cadpa { position:absolute; top:180px; right:40px; z-index:3; display:block; width:146px; height:190px; background:url("../images/cadpa.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:0px; text-align:center; line-height:190px; }
.app-body .page.page1 .btn-movie { position:absolute; bottom:730px; left:50%; display:block; width:160px; height:160px; border-radius:50%; background:url("../images/icon-play-movie.png?v=20250528") no-repeat 50% 50%; transform:translate(calc(-50% + 24px),0%) scale(1); animation:breathing 2s linear infinite; }
.app-body .page.page1 .btn-download { position:absolute; bottom:240px; left:50%; display:block; width:518px; height:152px; background:url("../images/btn-download.png?v=20250528") no-repeat 0px -106px; margin-left:-259px; color:transparent; font-size:0px; text-align:center; line-height:152px; }
.app-body .page.page2 { background-image:url("../images/bg2.jpg?v=20250528"); }
.app-body .page.page2 .content { position:absolute; top:50%; left:50%; display:block; width:1000px; background:url("../images/page-content2.png?v=20250528") no-repeat 50% 0%; padding-top:220px; transform:translate(-50%,-50%); }
.app-body .page.page2 .prev-swiper { position:absolute; top:50%; left:0px; z-index:1; display:block; width:868px; height:516px; margin-top:-258px; transform-origin:left center; transform:scale(0.8); filter:brightness(0.50); pointer-events:none; }
.app-body .page.page2 .prev-swiper .swiper { border-radius:48px; }
.app-body .page.page2 .prev-swiper .swiper .swiper-wrapper {  }
.app-body .page.page2 .prev-swiper .swiper .swiper-wrapper .swiper-slide {  }
.app-body .page.page2 .next-swiper { position:absolute; top:50%; right:0px; z-index:1; display:block; width:868px; height:516px; margin-top:-258px; transform-origin:right center; transform:scale(0.8); filter:brightness(0.50); pointer-events:none; }
.app-body .page.page2 .next-swiper .swiper { border-radius:48px; }
.app-body .page.page2 .next-swiper .swiper .swiper-wrapper {  }
.app-body .page.page2 .next-swiper .swiper .swiper-wrapper .swiper-slide {  }
.app-body .page.page2 .current-swiper { position:relative; z-index:2; display:block; width:868px; height:516px; margin:0px auto; }
.app-body .page.page2 .current-swiper .swiper { border-radius:48px; }
.app-body .page.page2 .current-swiper .swiper .swiper-wrapper {  }
.app-body .page.page2 .current-swiper .swiper .swiper-wrapper .swiper-slide {  }
.app-body .page.page2 .current-swiper .swiper-pagination { bottom:112px; left:50%; width:auto; font-size:0px; transform:translate(-50%,0%); }
.app-body .page.page2 .current-swiper .swiper-pagination .swiper-pagination-bullet { width:18px; height:18px; border-radius:18px; background-color:#fff; margin:0 8px; opacity:1; transition:width 0.8s cubic-bezier(0.23,1,0.32,1), background-color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .current-swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width:40px; background-color:#ffd02d; }
.app-body .page.page2 .current-swiper .swiper-button-prev,
.app-body .page.page2 .current-swiper .swiper-button-next { position:absolute; top:50%; width:60px; height:88px; background-image:url("../images/top-news-list-swiper-button.png?v=20250528"); background-repeat:no-repeat; margin:0px; margin-top:-44px; color:transparent; }
.app-body .page.page2 .current-swiper .swiper-button-prev { left:-68px; background-position:0px 0px; }
.app-body .page.page2 .current-swiper .swiper-button-next { right:-68px; background-position:-60px 0px; }
.app-body .page.page2 .top-news-list { position:relative; display:block; width:100%; height:516px; margin-bottom:48px; }
.app-body .page.page2 .top-news-list .empty { position:relative; z-index:1; display:block; width:868px; height:516px; margin:0px auto; }
.app-body .page.page2 .top-news-list .empty::before { content:""; position:absolute; top:50%; left:-68px; z-index:1; display:block; width:868px; height:516px; border-radius:48px; background-color:rgba(255,255,255,0.75); box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); margin-top:-258px; transform-origin:left center; transform:scale(0.8); }
.app-body .page.page2 .top-news-list .empty::after { content:""; position:absolute; top:50%; right:-68px; z-index:1; display:block; width:868px; height:516px; border-radius:48px; background-color:rgba(255,255,255,0.75); box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); margin-top:-258px; transform-origin:right center; transform:scale(0.8); }
.app-body .page.page2 .top-news-list .empty .empty-message { position:relative; z-index:2; display:flex; justify-content:center; align-items:center; width:868px; height:516px; border-radius:48px; background-color:rgba(255,255,255,1.00); box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); padding:20px; color:#bfbfbf; font-size:32px; text-align:center; line-height:48px; }
.app-body .page.page2 .top-news { display:block; width:868px; height:516px; border-radius:48px; background-color:#fff; box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); padding:20px; overflow:hidden; }
.app-body .page.page2 .top-news .top-news-body { display:block; width:100%; height:420px; border-radius:32px; overflow:hidden; }
.app-body .page.page2 .top-news .top-news-body img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.0); transition:transform 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .top-news .top-news-footer { display:block; width:100%; height:40px; margin-top:16px; overflow:hidden; color:#333; font-size:32px; white-space:nowrap; text-align:center; text-overflow:ellipsis; line-height:40px; }
.app-body .page.page2 .news-tabs { display:block; border-radius:48px; background-color:#fff; box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); margin-bottom:48px; padding:24px; overflow:hidden; }
.app-body .page.page2 .news-tabs-header { display:flex; justify-content:flex-start; align-items:center; width:100%; height:88px; border-radius:32px; background-color:#ffcf26; }
.app-body .page.page2 .news-tabs-header-scroller { flex:1; display:flex; justify-content:flex-start; align-items:center; }
.app-body .page.page2 .news-tabs-body { display:block; }
.app-body .page.page2 .news-tabs-tab { flex:1; position:relative; display:flex; justify-content:center; align-items:center; width:auto; height:88px; background:url("../images/news-tabs-tab-texture.png?v=20250528") no-repeat 50% -76px; overflow:hidden; transition:background-position 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .news-tabs-tab .icon { display:block; width:0px; height:60px; background-image:url("../images/news-tabs-tab-icons.png?v=20250528"); background-repeat:no-repeat; margin-right:0px; transition:width 0.8s cubic-bezier(0.23,1,0.32,1), margin-right 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .news-tabs-tab .icon.icon-new { background-position:0px 0px; }
.app-body .page.page2 .news-tabs-tab .icon.icon-notice { background-position:-60px 0px; }
.app-body .page.page2 .news-tabs-tab .icon.icon-news { background-position:-120px 0px; }
.app-body .page.page2 .news-tabs-tab .icon.icon-strategy { background-position:-180px 0px; }
.app-body .page.page2 .news-tabs-tab span { display:block; color:#333; font-size:36px; font-weight:700; text-align:center; line-height:1; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .news-tabs-tab::after { content:""; position:absolute; top:50%; right:0px; display:block; width:2px; height:48px; background-image:linear-gradient(transparent, #f2a91c, transparent); margin-top:-24px; }
.app-body .page.page2 .news-tabs-tab:last-child {  }
.app-body .page.page2 .news-tabs-tab:last-child .icon {  }
.app-body .page.page2 .news-tabs-tab:last-child .icon.icon-new {  }
.app-body .page.page2 .news-tabs-tab:last-child .icon.icon-notice {  }
.app-body .page.page2 .news-tabs-tab:last-child .icon.icon-news {  }
.app-body .page.page2 .news-tabs-tab:last-child .icon.icon-strategy {  }
.app-body .page.page2 .news-tabs-tab:last-child span {  }
.app-body .page.page2 .news-tabs-tab:last-child::after { content:none; }
.app-body .page.page2 .news-tabs-tab.active { background-position:50% 0px; }
.app-body .page.page2 .news-tabs-tab.active .icon { width:60px; margin-right:4px; }
.app-body .page.page2 .news-tabs-tab.active .icon.icon-new {  }
.app-body .page.page2 .news-tabs-tab.active .icon.icon-notice {  }
.app-body .page.page2 .news-tabs-tab.active .icon.icon-news {  }
.app-body .page.page2 .news-tabs-tab.active .icon.icon-strategy {  }
.app-body .page.page2 .news-tabs-tab.active span { color:#9d3e1e; }
.app-body .page.page2 .news-tabs-tab.active::after {  }
.app-body .page.page2 .news-list { display:flex; flex-direction:column; justify-content:flex-start; align-items:stretch; gap:20px; width:100%; height:412px; margin-top:20px; }
.app-body .page.page2 .news-list .empty { display:flex; justify-content:center; align-items:center; width:100%; height:100%; color:#bfbfbf; font-size:32px; text-align:center; line-height:48px; }
.app-body .page.page2 .news { display:flex; justify-content:flex-start; align-items:center; width:100%; height:88px; border-radius:32px; background-color:#ecf0f3; padding:0px 32px; }
.app-body .page.page2 .news .news-header { position:relative; display:block; margin-right:32px; padding-right:32px; color:#333; font-size:32px; font-weight:700; line-height:48px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .news .news-header::after { content:""; position:absolute; top:50%; right:0px; display:block; width:2px; height:48px; background-image:linear-gradient(transparent, #c3c4c5, transparent); margin-top:-24px; }
.app-body .page.page2 .news .news-body { flex:1; display:block; overflow:hidden; color:#333; font-size:32px; white-space:nowrap; text-overflow:ellipsis; line-height:48px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .news .news-footer { display:block; margin-left:32px; color:#666; font-size:32px; line-height:48px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page2 .btn-more-news { display:block; width:440px; height:88px; background:url("../images/btn-more-news.png?v=20250528") no-repeat 50% 50%; margin:0px auto; color:#fff; font-size:40px; font-weight:700; text-align:center; line-height:88px; }
.app-body .page.page3 { background-image:url("../images/bg3.jpg?v=20250528"); }
.app-body .page.page3 .content { position:absolute; top:50%; left:50%; display:block; width:1000px; background:url("../images/page-content3.png?v=20250528") no-repeat 50% 0%; padding-top:220px; transform:translate(-50%,-50%); }
.app-body .page.page3 .gameplay-tabs { display:block; }
.app-body .page.page3 .gameplay-tabs-header { display:flex; justify-content:flex-start; align-items:center; width:100%; height:70px; }
.app-body .page.page3 .gameplay-tabs-header-scroller { flex:1; display:flex; justify-content:flex-start; align-items:center; gap:64px; overflow:hidden; }
.app-body .page.page3 .gameplay-tabs-body { display:block; margin-top:32px; }
.app-body .page.page3 .gameplay-tabs-tab { position:relative; z-index:1; display:flex; justify-content:center; align-items:center; width:252px; height:70px; color:#fff; font-size:40px; font-weight:700; text-align:center; line-height:70px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .gameplay-tabs-tab::before { content:""; position:absolute; top:0px; left:0px; z-index:-1; display:block; width:100%; height:100%; background:url("../images/gameplay-tabs-tab.png?v=20250528") no-repeat 50% 50%; opacity:0; transition:opacity 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .gameplay-tabs-tab::after { content:""; position:absolute; top:50%; right:-32px; display:block; width:2px; height:48px; background-image:linear-gradient(transparent, #fff, transparent); margin-top:-24px; }
.app-body .page.page3 .gameplay-tabs-tab:last-child {  }
.app-body .page.page3 .gameplay-tabs-tab:last-child::before {  }
.app-body .page.page3 .gameplay-tabs-tab:last-child::after { content:none; }
.app-body .page.page3 .gameplay-tabs-tab.active {  }
.app-body .page.page3 .gameplay-tabs-tab.active::before { opacity:1; }
.app-body .page.page3 .gameplay-tabs-tab.active::after {  }
.app-body .page.page3 .gameplay-sub-tabs { display:block; border-radius:48px; background-color:#fff; box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); padding:20px; }
.app-body .page.page3 .gameplay-sub-tabs-header { display:flex; justify-content:flex-start; align-items:center; gap:20px; width:100%; height:70px; }
.app-body .page.page3 .gameplay-sub-tabs-header-scroller { flex:1; display:flex; justify-content:flex-start; align-items:center; gap:12px; overflow:hidden; }
.app-body .page.page3 .gameplay-sub-tabs-header-scroller .empty { flex:1; display:block; width:100%; height:70px; border-radius:24px; background-color:#e3e4eb; padding:0px 20px; overflow:hidden; color:#bfbfbf; font-size:32px; white-space:nowrap; text-align:center; text-overflow:ellipsis; line-height:70px; }
.app-body .page.page3 .gameplay-sub-tabs-body { display:block; margin-top:20px }
.app-body .page.page3 .gameplay-sub-tabs-body .empty { display:flex; justify-content:center; align-items:center; width:100%; height:564px; color:#bfbfbf; font-size:32px; text-align:center; line-height:48px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-prev,
.app-body .page.page3 .gameplay-sub-tabs-btn-next { display:block; width:40px; height:48px; background-image:url("../images/gameplay-sub-tabs-btns.png?v=20250528"); background-repeat:no-repeat; }
.app-body .page.page3 .gameplay-sub-tabs-btn-prev { background-position:0px 0px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-prev:hover { background-position:0px -48px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-prev.disabled,
.app-body .page.page3 .gameplay-sub-tabs-btn-prev.disabled:hover { cursor:not-allowed; background-position:0px 0px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-next { background-position:-40px 0px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-next:hover { background-position:-40px -48px; }
.app-body .page.page3 .gameplay-sub-tabs-btn-next.disabled,
.app-body .page.page3 .gameplay-sub-tabs-btn-next.disabled:hover { cursor:not-allowed; background-position:0px 0px; }
.app-body .page.page3 .gameplay-sub-tabs-tab { flex:0 0 auto; position:relative; display:flex; justify-content:center; align-items:center; width:208px; height:70px; border-radius:24px; background-color:#e3e4eb; background-image:url("../images/gameplay-sub-tabs-tab-texture.png?v=20250528"); background-repeat:no-repeat; background-position:100% -58px; color:#333; font-size:32px; font-weight:700; text-align:center; line-height:70px; transition:background-color 0.8s cubic-bezier(0.23,1,0.32,1), background-position 0.8s cubic-bezier(0.23,1,0.32,1), color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .gameplay-sub-tabs-tab.active { background-color:#ffcf26; background-position:100% 0px; color:#9d3e1e; }
.app-body .page.page3 .top-gameplay { display:block; }
.app-body .page.page3 .top-gameplay .top-gameplay-body { position:relative; display:block; height:500px; border-radius:32px; overflow:hidden; }
.app-body .page.page3 .top-gameplay .top-gameplay-body img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.0); transition:transform 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .top-gameplay .top-gameplay-body::after { content:""; position:absolute; top:0px; bottom:0px; left:0px; right:0px; display:block; background-color:rgba(0,0,0,0.45); background-image:url("../images/icon-play-big.png?v=20250528"); background-repeat:no-repeat; background-position:50% 50%; }
.app-body .page.page3 .top-gameplay .top-gameplay-footer { display:block; margin-top:16px; overflow:hidden; color:#333; font-size:32px; white-space:nowrap; text-align:center; text-overflow:ellipsis; line-height:48px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .gameplay-list { display:flex; justify-content:flex-start; align-items:center; gap:32px; margin-top:32px; }
.app-body .page.page3 .gameplay-list .empty { display:flex; justify-content:center; align-items:center; width:100%; height:358px; border-radius:48px; background-color:#fff; box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); padding:20px; color:#bfbfbf; font-size:32px; text-align:center; line-height:48px; }
.app-body .page.page3 .gameplay { display:block; width:484px; border-radius:48px; background-color:#fff; box-shadow:0px 3px 0px 0px rgba(255,255,255,0.45); padding:20px; }
.app-body .page.page3 .gameplay .gameplay-body { position:relative; display:block; width:100%; height:254px; border-radius:32px; overflow:hidden; }
.app-body .page.page3 .gameplay .gameplay-body img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.0); transition:transform 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page3 .gameplay .gameplay-body::after { content:""; position:absolute; top:0px; bottom:0px; left:0px; right:0px; display:block; background-color:rgba(0,0,0,0.45); background-image:url("../images/icon-play-small.png?v=20250528"); background-repeat:no-repeat; background-position:50% 50%; }
.app-body .page.page3 .gameplay .gameplay-footer { display:block; margin-top:16px; overflow:hidden; color:#333; font-size:32px; white-space:nowrap; text-align:center; text-overflow:ellipsis; line-height:48px; transition:color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page4 { background-image:url("../images/bg4.jpg?v=20250528"); }
.app-body .page.page4 .content { position:absolute; top:50%; left:50%; display:block; width:1080px; height:1920px; background:url("../images/page-content4.png?v=20250528") no-repeat 50% 456px; transform:translate(-50%,-50%); }
.app-body .page.page4 .hero-swiper { display:block; width:100%; height:100%; }
.app-body .page.page4 .hero-swiper .swiper { display:block; width:100%; height:100%; }
.app-body .page.page4 .hero-swiper .swiper .swiper-button-prev,
.app-body .page.page4 .hero-swiper .swiper .swiper-button-next { position:absolute; top:924px; width:96px; height:140px; background-image:url("../images/hero-swiper-button.png?v=20250528"); background-repeat:no-repeat; margin:0px; color:transparent; }
.app-body .page.page4 .hero-swiper .swiper .swiper-button-prev { left:30px; background-position:0px 0px; }
.app-body .page.page4 .hero-swiper .swiper .swiper-button-next { right:30px; background-position:-96px 0px; }
.app-body .page.page4 .hero-avatar-swiper { position:absolute; bottom:88px; left:50%; display:block; width:1040px; height:212px; margin-left:-520px; }
.app-body .page.page4 .hero-avatar-swiper .swiper { display:block; width:100%; height:100%; overflow:visible; }
.app-body .page.page4 .hero-avatar-swiper .swiper .swiper-wrapper .swiper-slide { position:relative; display:flex; justify-content:center; align-items:center; width:216px; height:212px; }
.app-body .page.page4 .hero-avatar-swiper .swiper .swiper-wrapper .swiper-slide img { cursor:pointer; display:block; width:160px; height:164px; border:8px solid #fff; box-shadow:0px 5px 0px 0px #d3d3d3; border-radius:56px; transition:width 0.8s cubic-bezier(0.23,1,0.32,1), height 0.8s cubic-bezier(0.23,1,0.32,1), box-shadow 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page4 .hero-avatar-swiper .swiper .swiper-wrapper .swiper-slide-active {  }
.app-body .page.page4 .hero-avatar-swiper .swiper .swiper-wrapper .swiper-slide-active img { width:208px; height:212px; box-shadow:0px 0px 0px 10px #ffcf26; }
.app-body .page.page4 .hero { position:relative; display:block; width:100%; height:100%; }
.app-body .page.page4 .hero .hero-image { position:absolute; top:0px; bottom:0px; left:0px; right:0px; display:block; width:100%; height:100%; }
.app-body .page.page4 .hero .hero-image img { display:block; width:100%; height:100%; }
.app-body .page.page4 .hero .hero-info { position:absolute; bottom:500px; left:50%; display:block; width:638px; margin-left:-319px; }
.app-body .page.page4 .hero .hero-info .skill-list { display:flex; justify-content:flex-start; align-items:center; gap:32px; width:638px; height:234px; border-radius:234px; background-color:rgba(0,0,0,0.25); padding:32px; }
.app-body .page.page4 .hero .hero-info .skill { position:relative; cursor:pointer; display:flex; justify-content:center; align-items:center; width:170px; height:170px; border:8px solid #fff; border-radius:50%; background-color:#088bc1; transition:border-color 0.8s cubic-bezier(0.23,1,0.32,1), background-color 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page4 .hero .hero-info .skill .skill-icon { display:flex; justify-content:center; align-items:center; width:130px; height:130px; transition:transform 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .page.page4 .hero .hero-info .skill .skill-icon img { display:block; width:100%; height:100%; }
.app-body .copyright { display:block; width:100%; background-color:#141414; padding:64px 0px; transition:bottom 0.8s cubic-bezier(0.23,1,0.32,1); }
.app-body .copyright p { display:block; color:#fff; font-size:24px; text-align:center; line-height:32px; }

.menu-backdrop { position:fixed; top:0px; bottom:0px; left:0px; right:0px; z-index:2; display:block; visibility:hidden; opacity:0; transition:opacity 0.8s cubic-bezier(0.23,1,0.32,1); }
.menu-backdrop.active { visibility:visible; opacity:1; }
.menu { position:fixed; bottom:-100%; left:0px; right:0px; z-index:2; display:block; transition:bottom 0.8s cubic-bezier(0.23,1,0.32,1); }
.menu .btn-close { position:absolute; top:0px; left:50%; display:block; width:296px; height:76px; background:url("../images/menu-btn-close.png?v=20250528") no-repeat 50% 50%; margin-left:-148px; }
.menu .content { display:block; width:100%; background:url("../images/menu-content.png?v=20250528") no-repeat 50% 0%; padding:100px 0px 60px 0px; }
.menu .content .nav { display:flex; flex-direction:column; justify-content:center; align-items:center; background:url("../images/nav-wrapper-separator.png?v=20250528") no-repeat 50% 100%; padding:56px 0px; }
.menu .content .nav .nav-link { display:block; width:auto; height:64px; background:url("../images/icon-nav.png?v=20250528") no-repeat -56px 50%; padding-left:0px; color:#fff; font-size:42px; font-weight:700; text-align:left; line-height:64px; transition:background-position 0.8s cubic-bezier(0.23,1,0.32,1), padding-left 0.8s cubic-bezier(0.23,1,0.32,1); }
.menu .content .nav:last-child { background:none; }
.menu .content .nav:last-child .nav-link {  }
.menu .content .nav.active {  }
.menu .content .nav.active .nav-link { background-position:0px 50%; padding-left:80px; }
.menu .content .contact-qrcode-list { display:flex; justify-content:center; align-items:flex-start; gap:30px; height:0px; margin-top:0px; overflow:hidden; transition:height 0.8s cubic-bezier(0.23,1,0.32,1), margin-top 0.8s cubic-bezier(0.23,1,0.32,1); }
.menu .content .contact-qrcode-list.active { height:252px; margin-top:56px; }
.menu .content .contact-qrcode { display:block; }
.menu .content .contact-qrcode .contact-qrcode-body { display:block; width:224px; height:210px; }
.menu .content .contact-qrcode .contact-qrcode-body img { display:block; width:100%; height:100%; }
.menu .content .contact-qrcode .contact-qrcode-footer { display:block; margin-top:12px; color:#fff; font-size:30px; text-align:center; line-height:1; }
.menu.active { bottom:0%; }
.menu.active {  }
.menu.active .btn-close {  }
.menu.active .content {  }
.menu.active .content .nav {  }
.menu.active .content .nav .nav-link {  }
.menu.active .content .nav:last-child {  }
.menu.active .content .nav:last-child .nav-link {  }
.menu.active .content .nav.active {  }
.menu.active .content .nav.active .nav-link {  }
.menu.active .content .contact-qrcode-list {  }
.menu.active .content .contact-qrcode-list.active {  }
.menu.active .content .contact-qrcode {  }
.menu.active .content .contact-qrcode .contact-qrcode-body {  }
.menu.active .content .contact-qrcode .contact-qrcode-body img {  }
.menu.active .content .contact-qrcode .contact-qrcode-footer {  }

/* 适龄提示 */
.dialog-cadpa { position:relative; display:block; width:1002px; height:978px; background:url("../images/dialog-cadpa.png?v=20250528") no-repeat 50% 0%; padding:100px 60px 60px 60px; }
.dialog-cadpa .title { display:block; color:#eb832d; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-cadpa .content { display:block; height:660px; margin-top:80px; overflow:auto; }
.dialog-cadpa .content p { display:block; color:#47586e; font-size:30px; text-align:left; line-height:48px; }
.dialog-cadpa .content p + p { margin-top:16px; }
.dialog-cadpa .btn-close { position:absolute; top:0px; right:0px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 视频播放 */
.dialog-player { position:relative; display:block; width:1022px; height:594px; background:url("../images/dialog-player.png?v=20250528") no-repeat 50% 0%; padding:39px 29px 39px 29px; }
.dialog-player .content { display:block; width:100%; height:100%; }
.dialog-player .content video { display:block; width:100%; height:100%; border-radius:40px; border:none; background-color:#000; overflow:hidden; }
.dialog-player .content iframe { display:block; width:100%; height:100%; border-radius:40px; border:none; background-color:#000; overflow:hidden; }
.dialog-player .btn-close { position:absolute; top:-100px; right:0px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 预约 */
.dialog-subscribe { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-subscribe .content { display:block; }
.dialog-subscribe .content .subscribe-form { display:block; }
.dialog-subscribe .content .subscribe-form-body { display:flex; flex-direction:column; justify-content:flex-start; align-items:stretch; gap:24px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item { display:block; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control { display:flex; justify-content:flex-start; align-items:center; gap:24px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .radio-group { display:flex; justify-content:flex-start; align-items:center; gap:40px; width:100%; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .radio { display:flex; justify-content:flex-start; align-items:center; gap:10px; color:#678391; font-size:32px; text-align:left; line-height:1; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .radio input[type="radio"] { -webkit-appearance:radio; cursor:pointer; display:block; width:28px; height:28px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .input { flex:1; display:block; width:auto; height:76px; border:none; border-radius:10px; background:linear-gradient(to right,#e8e2fd,#d6f5fd); padding:0px 24px; color:#47586e; font-size:32px; text-align:left; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .btn-code { cursor:pointer; display:block; width:196px; height:76px; border:none; background:url("../images/btn-code.png?v=20250528") no-repeat 0px 0px; color:#fff; font-size:32px; text-align:center; line-height:76px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .btn-code span { font-size:24px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .btn-code.disabled { background-position:0px -76px; }
.dialog-subscribe .content .subscribe-form-body .subscribe-form-item .subscribe-form-item-control .btn-code.disabled span {  }
.dialog-subscribe .content .subscribe-form-footer { display:block; margin-top:40px; }
.dialog-subscribe .content .subscribe-form-footer .btn-subscribe { cursor:pointer; display:block; width:342px; height:88px; border:none; background:url("../images/btn-subscribe.png?v=20250528") no-repeat 0px -448px; margin:0px auto; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-subscribe .content .subscribe-form-footer .agreement { display:flex; justify-content:flex-start; align-items:center; gap:10px; margin-top:24px; color:#678391; font-size:28px; text-align:left; line-height:1; }
.dialog-subscribe .content .subscribe-form-footer .agreement input[type="checkbox"] { -webkit-appearance:checkbox; cursor:pointer; display:block; width:28px; height:28px; }
.dialog-subscribe .content .subscribe-form-footer .agreement a { color:inherit; text-decoration:underline; }
.dialog-subscribe .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 预约提示 */
.dialog-subscribe-card { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-subscribe-card .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-subscribe-card .content { display:block; background:url("../images/dialog-content-border.png?v=20250528") repeat-x 50% 0%; margin-top:40px; padding-top:52px; }
.dialog-subscribe-card .content p { display:block; color:#47586e; font-size:30px; text-align:center; line-height:48px; }
.dialog-subscribe-card .content .btn-group { cursor:pointer; display:block; width:344px; height:88px; border:none; background:url("../images/btn-group.png?v=20250528") no-repeat 50% 50%; margin:40px auto 0px; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-subscribe-card .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 抽奖结果 */
.dialog-lottery-result { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-lottery-result .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-lottery-result .content { display:block; margin-top:40px; }
.dialog-lottery-result .content .prize { display:block; }
.dialog-lottery-result .content .prize-body {  }
.dialog-lottery-result .content .prize-body img { display:block; width:320px; height:222px; margin:0 auto; }
.dialog-lottery-result .content .prize-footer { display:flex; justify-content:center; align-items:center; margin-top:40px; }
.dialog-lottery-result .content .prize-footer .btn-address { cursor:pointer; display:block; width:342px; height:88px; border:none; background:url("../images/btn-address.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-lottery-result .content .prize-footer .btn-details { cursor:pointer; display:block; width:342px; height:88px; border:none; background:url("../images/btn-details.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-lottery-result .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 抽奖结果表单 */
.dialog-lottery-form { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-lottery-form .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-lottery-form .content { display:block; margin-top:40px; }
.dialog-lottery-form .content .form { display:block; }
.dialog-lottery-form .content .form-body { display:flex; flex-direction:column; justify-content:flex-start; align-items:stretch; gap:24px; }
.dialog-lottery-form .content .form-body .form-item { display:block; }
.dialog-lottery-form .content .form-body .form-item .form-item-control { display:flex; justify-content:flex-start; align-items:center; gap:24px; }
.dialog-lottery-form .content .form-body .form-item .form-item-control .input { flex:1; display:block; width:auto; height:76px; border:none; border-radius:24px; background:linear-gradient(to right,#e8e2fd,#d6f5fd); padding:0px 24px; color:#47586e; font-size:32px; text-align:left; }
.dialog-lottery-form .content .form-footer { display:flex; justify-content:center; align-items:center; margin-top:40px; }
.dialog-lottery-form .content .form-footer .btn-confirm { cursor:pointer; display:block; width:342px; height:88px; border:none; background:url("../images/btn-confirm.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-lottery-form .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 抽奖结果详情 */
.dialog-lottery-details { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-lottery-details .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-lottery-details .content { display:block; max-height:360px; margin-top:40px; overflow:auto; }
.dialog-lottery-details .content table { table-layout:fixed; max-width:100%; border-collapse:collapse; border-spacing:0; }
.dialog-lottery-details .content td { padding:4px 0px; color:#47586e; font-size:40px; text-align:left; line-height:1.5; vertical-align:top; }
.dialog-lottery-details .content td:first-child { width:230px; }
.dialog-lottery-details .content p { display:block; color:#47586e; font-size:40px; text-align:left; line-height:1.5; }
.dialog-lottery-details .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 预约抽奖活动规则 */
.dialog-lottery-rule { position:relative; display:block; width:1002px; height:978px; background:url("../images/dialog-lottery-rule.png?v=20250528") no-repeat 50% 0%; padding:100px 60px 60px 60px; }
.dialog-lottery-rule .title { display:block; color:#eb832d; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-lottery-rule .content { display:block; height:660px; margin-top:80px; overflow:auto; }
.dialog-lottery-rule .content p { display:block; color:#47586e; font-size:30px; text-align:left; line-height:48px; }
.dialog-lottery-rule .content p + p { margin-top:16px; }
.dialog-lottery-rule .content span { color:#2daaeb; }
.dialog-lottery-rule .btn-close { position:absolute; top:0px; right:0px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 关注 */
.dialog-follow { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-follow .content { display:block; }
.dialog-follow .content .follow { display:block; }
.dialog-follow .content .follow-header { display:block; margin-bottom:32px; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-follow .content .follow-body { display:block; width:280px; height:280px; border:8px solid #38bef0; border-radius:16px; margin:0 auto; overflow:hidden; }
.dialog-follow .content .follow-body img { display:block; width:100%; height:100%; }
.dialog-follow .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 邀请好友 */
.dialog-invite { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-invite .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-invite .content { display:block; margin-top:40px; }
.dialog-invite .content .way { display:block; }
.dialog-invite .content .way + .way { margin-top:40px; }
.dialog-invite .content .way-header { display:block; color:#678391; font-size:32px; text-align:left; line-height:1; }
.dialog-invite .content .way-body { display:flex; justify-content:flex-start; align-items:center; gap:20px; margin-top:20px; }
.dialog-invite .content .way-body .input { flex:1; display:block; width:auto; height:72px; border:none; border-radius:72px; background:linear-gradient(to right,#e8e2fd,#d6f5fd); padding:0px 24px; color:#47586e; font-size:32px; text-align:left; }
.dialog-invite .content .way-body .btn-copy { cursor:pointer; display:block; width:176px; height:72px; border:none; background:url("../images/btn-copy.png?v=20250528") no-repeat 50% 50%; color:transparent; font-size:32px; text-align:center; line-height:72px; }
.dialog-invite .content .way-body .qrcode { display:block; width:178px; height:178px; border:6px solid #77d6e6; border-radius:5px; overflow:hidden; }
.dialog-invite .content .way-body .qrcode img { display:block; width:100%; height:100%; }
.dialog-invite .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 邀请函 */
.dialog-invite-card { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:1008px; height:680px; background:url("../images/dialog-common.png?v=20250528") no-repeat 50% 0%; padding:80px 130px 0px 130px; }
.dialog-invite-card .title { display:block; color:#47586e; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-invite-card .content { display:block; background:url("../images/dialog-content-border.png?v=20250528") repeat-x 50% 0%; margin-top:40px; padding-top:52px; }
.dialog-invite-card .content p { display:block; color:#47586e; font-size:30px; text-align:center; line-height:48px; }
.dialog-invite-card .content .btn-subscribe { cursor:pointer; display:block; width:342px; height:88px; border:none; background:url("../images/btn-subscribe.png?v=20250528") no-repeat 0px -360px; margin:40px auto 0px; color:transparent; font-size:40px; text-align:center; line-height:88px; }
.dialog-invite-card .btn-close { position:absolute; top:20px; right:20px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 邀请好礼活动规则 */
.dialog-invite-rule { position:relative; display:block; width:1002px; height:978px; background:url("../images/dialog-invite-rule.png?v=20250528") no-repeat 50% 0%; padding:100px 60px 60px 60px; }
.dialog-invite-rule .title { display:block; color:#eb832d; font-size:48px; font-weight:700; text-align:center; line-height:1; }
.dialog-invite-rule .content { display:block; height:660px; margin-top:80px; overflow:auto; }
.dialog-invite-rule .content p { display:block; color:#47586e; font-size:30px; text-align:left; line-height:48px; }
.dialog-invite-rule .content p + p { margin-top:16px; }
.dialog-invite-rule .content span { color:#2daaeb; }
.dialog-invite-rule .btn-close { position:absolute; top:0px; right:0px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

/* 技能说明 */
.dialog-skill-list { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:stretch; width:964px; height:696px; background:url("../images/dialog-skill-list.png?v=20250528") no-repeat 50% 0%; padding:80px 80px 0px 80px; }
.dialog-skill-list .content { display:block; }
.dialog-skill-list .content .skill-list { display:block; }
.dialog-skill-list .content .skill-list-header { display:block; border-bottom:1px dashed #c3c4c5; padding-bottom:48px; }
.dialog-skill-list .content .skill-list-header .skill-icon-list { display:flex; justify-content:center; align-items:center; gap:80px; }
.dialog-skill-list .content .skill-list-header .skill-icon { cursor:pointer; display:flex; justify-content:center; align-items:center; width:154px; height:154px; border:8px solid #4eecf1; border-radius:50%; background-color:#088bc1; transition:border-color 0.8s cubic-bezier(0.23,1,0.32,1), background-color 0.8s cubic-bezier(0.23,1,0.32,1); }
.dialog-skill-list .content .skill-list-header .skill-icon img { display:block; width:114px; height:114px; transition:transform 0.8s cubic-bezier(0.23,1,0.32,1); }
.dialog-skill-list .content .skill-list-header .skill-icon.active { border-color:#ffcf26; background-image:linear-gradient(150deg, #ff6e02, #fbc33c); }
.dialog-skill-list .content .skill-list-header .skill-icon.active img { transform:scale(1.1); }
.dialog-skill-list .content .skill-list-body { display:block; padding-top:48px; }
.dialog-skill-list .content .skill-list-body .skill-description-list {  }
.dialog-skill-list .content .skill-list-body .skill-description { display:none; height:248px; overflow:auto; color:#333; font-size:32px; text-align:left; line-height:48px; }
.dialog-skill-list .content .skill-list-body .skill-description.active { display:block; }
.dialog-skill-list .btn-close { position:absolute; top:0px; right:0px; display:block; width:80px; height:80px; background:url("../images/dialog-btn-close.png?v=20250528") no-repeat 50% 50%; }

.landscape-warning { display:none; z-index:9999; position:fixed; left:0; top:0; width:100vw; height:100vh; background-color:#318fd7; font-size:32px; color:#fff; text-align:center; line-height:80vh; }

/* 动画 */
@keyframes breathing {
  0% { opacity:1; transform:translate(calc(-50% + 24px),0%) scale(1); }
  50% { opacity:0.65; transform:translate(calc(-50% + 24px),0%) scale(0.95); }
  100% { opacity:1; transform:translate(calc(-50% + 24px),0%) scale(1); }
}

@keyframes floating {
  0% { transform:translateY(0px); opacity:1; }
  50% { transform:translateY(8px); opacity:0.5; }
  100% { transform:translateY(0px); opacity:1; }
}