*,*::after,*::before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
*{margin:0;padding:0;outline:none;}
ol,ul{list-style:none;}
ins,a{text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;}
img{border:none;vertical-align:middle;}
html{font-size:62.5%;}
body{font-size:1.4rem;font-family:PingFang SC,DFPKingGothicGB-Regular,Lato,Tahoma,Microsoft Yahei,sans-serif!important;overflow:hidden;}
html,body,.page{padding:0;margin:0;height:100%;width:100%;}
.page{position:relative;background-color:#afa27c;}
.page .a-box{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;}
.page .ab-bd .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:1;}
.page .overlay-img-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:70%;max-width:500px;height:auto;border-radius:8px;}
.page .overlay-img{width:100%;height:auto;animation:zoomIn 3s ease-in-out infinite alternate;}
@keyframes zoomIn{0%{transform:scale(1);}100%{transform:scale(1.8);}}
.page .logo-wrap{display:flex;align-items:center;z-index:3;position:absolute;top:1rem;left:1rem;}
.page .logo{height:5rem;width:auto;margin-right:1rem;}
.page .site-name{font-size:1.8rem;color:#fff;font-weight:600;}
.page .info{position:absolute;bottom:2rem;left:0;width:100%;padding:2rem;text-align:center;z-index:3;max-width:42.8rem;margin:0 auto;border-radius:12px;}
.page .info .i-a{color:#fff;font-size:2.4rem;font-weight:600;animation:textGlowGold 3.5s ease-in-out infinite;text-shadow:0 2px 4px rgba(0,0,0,0.5);margin-bottom:1.5rem;}
.page .info .i-b{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:1.5rem 0 2rem;}
.page .info .i-b span{font-size:1.4rem;color:#fff;padding:0.8rem 0.5rem;background:rgba(255,255,255,0.1);border-radius:8px;transition:all 0.3s ease;animation:tagTextGlow 4s ease-in-out infinite;font-weight:500;display:flex;align-items:center;justify-content:center;min-height:4rem;}
.page .info .i-b span:nth-child(1){animation-delay:0s;}
.page .info .i-b span:nth-child(2){animation-delay:0.5s;}
.page .info .i-b span:nth-child(3){animation-delay:1s;}
.page .info .i-b span:nth-child(4){animation-delay:1.5s;}
.page .info .i-b span:nth-child(5){animation-delay:0.2s;}
.page .info .i-b span:nth-child(6){animation-delay:0.7s;}
.page .info .i-b span:nth-child(7){animation-delay:1.2s;}
.page .info .i-b span:nth-child(8){animation-delay:1.7s;}
.page .info .i-c{background-color:rgba(224,89,4,0.85);color:#fff;text-align:center;font-weight:600;font-size:1.6rem;cursor:pointer;padding:1.4rem 1rem;display:block;width:100%;border-radius:12px;transition:all 0.3s ease;box-shadow:0 4px 15px rgba(224,89,4,0.4);animation:buttonGlow 4s ease-in-out infinite;border:none;position:relative;overflow:hidden;}
.page .info .i-c:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(224,89,4,0.6);background-color:rgba(224,89,4,0.95);}
.page .info .i-c:active{transform:translateY(-1px);box-shadow:0 3px 10px rgba(224,89,4,0.5);}
.page .info .i-c p{font-size:1.2rem;font-weight:400;margin-top:0.8rem;color:#eee;animation:subTextGlow 3.5s ease-in-out infinite;animation-delay:1s;opacity:0.9;}
.page .info .i-b span:hover{transform:translateY(-3px);background:rgba(255,255,255,0.2);box-shadow:0 0 12px rgba(255,215,0,0.4),0 0 20px rgba(255,215,0,0.2),0 4px 12px rgba(0,0,0,0.3);}
@keyframes textGlowGold{0%,100%{text-shadow:0 0 8px rgba(255,215,0,0.9),0 0 15px rgba(255,140,0,0.6),0 0 20px rgba(255,100,0,0.3);}33%{text-shadow:0 0 8px rgba(0,255,255,0.9),0 0 15px rgba(0,200,255,0.6),0 0 20px rgba(0,150,255,0.3);}66%{text-shadow:0 0 8px rgba(255,105,180,0.9),0 0 15px rgba(255,50,150,0.6),0 0 20px rgba(255,0,120,0.3);}}
@keyframes tagTextGlow{0%,100%{color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.2),0 0 8px rgba(255,215,0,0.6);text-shadow:0 0 6px rgba(255,215,0,0.8);}33%{color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.2),0 0 10px rgba(0,255,255,0.5);text-shadow:0 0 8px rgba(0,255,255,0.7);}66%{color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.2),0 0 8px rgba(255,105,180,0.6);text-shadow:0 0 6px rgba(255,105,180,0.8);}}
@keyframes buttonGlow{0%,100%{box-shadow:0 4px 15px rgba(224,89,4,0.4),0 0 12px rgba(255,215,0,0.6);}33%{box-shadow:0 4px 15px rgba(224,89,4,0.4),0 0 15px rgba(0,255,255,0.5);}66%{box-shadow:0 4px 15px rgba(224,89,4,0.4),0 0 12px rgba(255,105,180,0.6);}}
@keyframes subTextGlow{0%,100%{text-shadow:0 0 4px rgba(255,215,0,0.8);}33%{text-shadow:0 0 6px rgba(0,255,255,0.7);}66%{text-shadow:0 0 4px rgba(255,105,180,0.8);}}
#modalOverlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,0.6);z-index:1100;justify-content:center;align-items:center;}
#modalContent{width:90vw;height:80vh;background-color:#111;border-radius:8px;position:relative;overflow:hidden;}
#modalContent iframe{width:100%;height:100%;border:none;}
#modalCloseBtn{position:absolute;top:8px;right:12px;color:white;font-size:24px;cursor:pointer;z-index:1101;width:30px;height:30px;display:flex;align-items:center;justify-content:center;}
#openTutorialBtn{position:fixed;top:50%;right:10px;width:50px;height:50px;background:url('../image/steup.png') no-repeat center/contain;cursor:pointer;z-index:999;transform:translateY(-50%);transition:opacity 0.3s;}
#openTutorialBtn:hover{opacity:0.8;}