
/* 全局样式重置 */
* {padding:0;margin:0}
body {
    background: linear-gradient(180deg,#1b1d32 0%,#16182b 50%,#661428 100%);
    background-size: 100% auto;
    font-size:12px;
    font-family:"Microsoft YaHei",Tahoma,SimSun,Verdana;
    position: relative;
    min-height: 100vh;
}
a{color:#c39f6f;text-decoration:none}
a:hover{color:#fff}
a:focus,input{outline:0}
img{border:0;vertical-align:top}
ul,ol,li{list-style:none}
table{border-collapse:collapse;border-spacing:0}

/* 通用工具类 */
.fr{float:right}.fl{float:left}.disb{display:block}.hid{display:none}.disib{display:inline-block}
.clr{clear:both}
.flexbox{display:flex}

/* 公共标题模块 */
.title{width:100%;height:60px;margin:0 auto 30px;background-size:750px auto}
.title h3{display:none}
.title-tese{background:url(../images/Title1.png) no-repeat center top;}
.title-sports{background:url(../images/Title2.png) no-repeat center top;}
.title-screenshot{background:url(../images/Title3.png) no-repeat center top;}

.content{width:100%;height:auto;margin:0 auto;text-align:center}
.mainbox{margin:0 auto;width:1200px;height:100%;position:relative}

/* Swiper 基础修复（解决方向错乱、竖向滚动、挤压BUG） */
.swiper-wrapper {display: flex !important; flex-direction: row !important;}
.swiper-slide {flex-shrink: 0 !important;}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 6px}

/* 头部导航 */
.headerbox { 
    width: 100%; height: 78px; background: rgba(19, 23, 34, .9); 
    position: absolute; top: 0; z-index: 9999; 
    border-bottom: 1px solid #bb985c; box-shadow: 0 1px 0 #a1743e; 
    display:none; 
}
.main-header { height: 78px; display: flex; box-sizing: border-box; justify-content: space-between; align-items: center; }
.toplogo { width: 27%; display: flex; overflow: hidden; padding: 0 5px; box-sizing: border-box; }
.toplogo a { width: 100%; height: 100%; display: flex; justify-content: flex-start; align-items: center; overflow: hidden; white-space:nowrap; text-overflow:ellipsis; }
.toplogo a img { width: 70px; height: 70px; margin: 0 8px 0 0; }
.gamename { color: #fff; display: flex; flex-direction: column; }
.gamename h1 { font-weight: normal; font-size: 2.4rem; margin-bottom: 3px; max-width: 240px; }
.gamename p { color: #999; }

#gamedown-mobile { display: none; width: auto; height: 88px; overflow: hidden; }
#gamedown-mobile a { width: auto; height: 100%; display: block; }
#gamedown-mobile a img { width: auto; height: 100%; }

/* Banner区域 */
#bannerbox{width:100%;text-align:center;overflow:hidden}
#banner{width:100%;height:100%;z-index:9;margin:0 auto;position:relative;display:block;overflow:hidden}
#banner img.heightself-big,#banner img.heightself-small { width:100%; opacity: 0; z-index: -1; }
#bannerbg { width: 100%; height: 100%; display: flex; justify-content: center; position: absolute; overflow: hidden; z-index: 1; top:0; }
#bannerbg img { width: 100%; height: auto; }
#bannerbg .banner-small,#banner img.heightself-small { display: none; }

#banner #logo { width: 39%; height: 30%; position: absolute; left:18.92%; top:5%; z-index: 99; text-align: center; overflow: hidden; display: flex; justify-content: center; align-items: center; }
#banner #logo img { width: 100%; object-fit: scale-down; }
#banner .bannertxt { width: 39.41%; height: 33%; position: absolute; top: 50%; left:18.92%; z-index: 3; display: flex; justify-content: center; align-items: center; }
#banner .bannertxt img { width: 100% ; height: 85% }

/* 玩法特色模块 */
.tese { width: 100%; height: auto; padding: 40px 0; display: block; position: relative; }
.teselist { margin-top: 40px; width: 100%; display: flex; flex-direction: row; justify-content: space-between; }
.teselist li { width: 24%; height: fit-content; padding: 3% 0; display: flex; flex-direction: column; justify-content: center; align-items: center; background: url(../images/ItemBg.png) no-repeat center top; background-size: contain; }
.teselist li .teseimg { width: 60%; height: 0; box-sizing: border-box; position: relative; overflow: hidden; }
.teselist li .teseimg[data-ratio="1:1"] { padding-top: calc(100% * 1 / 1.68); }
.teselist li .teseimg img { width: 100%; height: 100%; border-radius: 50%; box-sizing: border-box; position: absolute; top: 0; left: 0; object-fit: cover; }
.teselist li p { width: 80%; padding: 10px 5%; color: #13182e; font-size: 2.6rem; font-weight: bold; text-align: center; white-space:nowrap; overflow: hidden; text-overflow:ellipsis; }
.teselist li:hover { filter: brightness(110%); }

/* 竞技轮播【核心修复版 解决比例/方向/变形/错乱】 */
.sports { width: 100%; height: auto; overflow: hidden; padding: 40px 0; }
.cont-sports { display: block; }
.sportslist { width: 100%; height:auto; margin: 0 auto; }

.sportslist .swiper-sports { 
    width: 100%; margin: 0 auto; padding: 20px 0 60px; 
    --swiper-pagination-color: #bb985c; overflow: hidden;
}
.sportslist .swiper-sports .swiper-slide { 
    width: calc(28%); border-radius: 16px; 
    box-sizing: border-box; position:relative; 
    box-shadow: 0 0 10px rgba(255, 255, 255, .4);
}
.sportslist .swiper-sports .swiper-slide a { 
    width: calc(100% - 20px); height: calc(100% - 20px); 
    padding: 10px; border-radius: 16px; 
    background: linear-gradient(180deg, #c9b584 0%, #f2eee6 100%); 
    display: flex; flex-direction: column; justify-content: center; align-items: center;
}
.sportslist .swiper-sports .swiper-slide .sports-imgbox { width: 100%; margin-bottom: 2px; }
.sportslist .swiper-sports .swiper-slide .sports-img { 
    width: 100%; height: 0; position: relative; overflow: hidden;
}
/* 精准锁定3:4比例，彻底解决拉伸变形 */
.sportslist .swiper-sports .swiper-slide .sports-img[data-ratio="3:4"] { 
    padding-top: 133.33%;
}
.sportslist .swiper-sports .swiper-slide .sports-img img { 
    width: calc(100% - 20px); height: 85%; 
    box-sizing: border-box; position: absolute; top: 10px; left: 10px; 
    object-fit: cover; filter: brightness(100%); 
    border-top-left-radius: 10px; border-top-right-radius: 10px;
}
.sportslist .swiper-sports .swiper-slide-active img { filter: brightness(110%); }
.sportslist .swiper-sports .swiper-slide p { 
    width: 90%; padding: 0 5%; margin-bottom: 5px; display: block; 
    font-size: 3.4rem; color: #bb985c; letter-spacing: 5px; 
    text-shadow: 0 0 3px #fff; white-space:nowrap; overflow: hidden; text-overflow:ellipsis;
}

/* 竞技箭头 */
.swiper-sports .prev-sports,.swiper-sports .next-sports { 
    cursor:pointer; width:70px; height:62px; top:43%; position:absolute; z-index:99; 
}
.swiper-sports .swiper-button-prev { left: 0; background: url(../images/Btn-P.png) no-repeat center top; background-size: cover; }
.swiper-sports .swiper-button-next { right: 0; background: url(../images/Btn-N.png) no-repeat center top; background-size: cover; }

/* 竞技分页 */
.pag-sports { text-align: center; --swiper-theme-color: #bb985c; }
.pag-sports .swiper-pagination-bullet { display:inline-block;width:12px;height:12px; border-radius:12px; background:#999; opacity:.6; }
.pag-sports .swiper-pagination-bullet-active { background: var(--swiper-theme-color); opacity: 1; }
.sportslist .swiper-pagination-bullets { text-align: center; bottom: 0px; }
.sportslist .swiper-pagination-bullets .swiper-pagination-bullet {margin:0 6px; }

/* 游戏截图模块：上下内边距，块级显示 */
.screenshot { width: 100%; height: auto; padding: 40px 0; display: block; }

/* 截图主容器：最大宽度，顶部负间距（微调位置） */
.main-screenshot { width: 100%; max-width: 1600px; margin-top: -30px; }

/* 截图列表容器 */
.screenshotlist { width: calc(100%); }

/* 截图轮播容器：溢出隐藏，内边距 */
.screenshotlist .swiper-screenshot { width:100%; position: initial; display: block; overflow: hidden; padding: 15px 0 0; }

/* 轮播包裹层：弹性布局 */
.screenshotlist .swiper-screenshot .swiper-wrapper { width: 100%; display: flex; }

/* 截图轮播项：居中，相对定位 */
.screenshotlist .swiper-screenshot .swiper-slide { width: calc(100%); height: auto; box-sizing: border-box; position: relative; display: flex; justify-content: center; align-items: center; }

/* 截图图片：自适应，最大宽100%，覆盖填充 */
.screenshotlist .swiper-screenshot .swiper-slide img { width: auto; height: auto; max-width: 100%; object-fit: cover; }

/* 截图轮播箭头：大尺寸，绝对定位 */
.swiper-screenshot .prev-jietu,.swiper-screenshot .next-jietu { cursor:pointer; width:110px; height:110px; top:42%; position:absolute; z-index:99; }

/* 截图左箭头：左侧10px，背景图 */
.swiper-screenshot .swiper-button-prev { left: 10px; background: url(../images/Btn-L.png) no-repeat center top; background-size: cover; }

/* 截图右箭头：右侧10px，背景图 */
.swiper-screenshot .swiper-button-next { right: 10px; background: url(../images/Btn-R.png) no-repeat center top; background-size: cover; }

/* 截图分页器：居中，主题色 */
.pag-jietu { text-align: center; --swiper-theme-color: #bb985c; }
.pag-jietu .swiper-pagination-bullet { display:inline-block;width:12px;height:12px; border-radius:12px; background:#999; opacity:.6; }
.pag-jietu .swiper-pagination-bullet-active { background: var(--swiper-theme-color); opacity: 1; }
.screenshotlist .swiper-pagination-bullets { text-align: center; bottom: 0; }
.screenshotlist .swiper-pagination-bullets .swiper-pagination-bullet {margin:0 var(--swiper-pagination-bullet-horizontal-gap,6px); }

/* 底部 */
/* 底部版权容器：深色背景，顶部边框，上下内边距 */
#footer { width: 100%; height: auto; padding: 10px 0 20px; background: #141525; border-top: 1px solid #9b7849; }

/* 底部主容器：弹性换行布局 */
.main-footer { display: flex; flex-flow: row wrap; }

/* 底部按钮（客服/首页）：默认隐藏 */
.footerbtn { display: none; }
.footerbtn { width: auto; margin: 15px auto; }

/* 底部按钮样式：尺寸、字体、边框、背景、居中 */
.footerbtn a { width: 180px; height: 38px; line-height: 3.8rem; font-size: 1.6rem; border-radius: 4px; color:#e7e7e7; text-align: center; margin: 0 auto; display: inline-block; background: #222; border: 1px solid #444; }

/* 底部LOGO：尺寸、间距、弹性布局、溢出隐藏 */
.footerlogo { width: 220px; height: 110px; display: block; margin: 25px 15px 0 0; display: flex; display: block\0; align-items: center; text-align: center; overflow: hidden; }
.footerlogo img { width: 100%; object-fit: scale-down; }

/* 版权信息容器：宽度、内边距、弹性换行、垂直居中 */
.copyright { width: 940px; padding: 25px 0; display: flex; flex-wrap: wrap; align-items: center; }
.copyright div { width: 100%; display: flex; flex-wrap: wrap; }

/* 版权文字：小字体，灰色，行高 */
.copyright p { font-weight: normal; font-size: 1.2rem; color: #999; line-height: 2.6rem; }
.copyright a { color: #ddd; }

/* 适龄提示悬浮 */
#cadpa { width: 5%; height: 40px; position: absolute; top:10%; left: 1%; display: block; margin: 0 auto; z-index: 99999; }
#cadpa img { width: 100%; height: auto; }

/* 弹窗通用 */
.md-modal {position:fixed; top:50%; left:50%; width:70%; max-width:1000px; height:70%; z-index:9999999999999; visibility:hidden; transform:translate(-50%,-50%); }
.md-show { visibility: visible; }
.md-overlay{position:fixed;width:100%;height:100%; visibility:hidden;top:0;left:0;z-index:999999;opacity:0;background:rgba(1,1,1,0.6);transition:all 0.3s;}
.md-show ~ .md-overlay {opacity: 1;visibility: visible; }
.md-content{ height: 100%; color:#5b5b5b; background:#fff; position:relative; border-radius:8px; margin:0 auto; padding: 5px 0; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.md-content h3 { width: 100%; font-size:2.4rem; font-weight: bold; margin:0; text-align:center;background:#fff;border-radius:8px;color:#333; overflow: hidden; }
.md-content .md-close { width: 15%; font-size: 1.6rem; color: #fff; margin: 0 auto; padding: 8px 20px; background: #c39f6f; border: none; cursor:pointer; border-radius: 2px; }
.md-content .md-close:hover { background: #b89160; }
.md-content .md-main { padding:0 40px; height: 79%; margin: 15px 0; font-size: 14px; overflow-y: scroll; }
.md-effect-1 .md-content { transform: scale(0.7); opacity: 0; transition: all 0.3s; }
.md-show.md-effect-1 .md-content { transform: scale(1); opacity: 1; }

/* 右侧悬浮 */
.fixedbox { position:fixed; right: 15px; bottom: 25px; z-index: 9999; width: 240px; height: 412px; }
.fixedbox div { text-align: center; color: #d3b584; font-weight: bold;}
.fixedbox .Winicon { width: 208px; height: 90px; margin: -45px 0 0 0; overflow: hidden; }
.fixedbox .Winicon img { width: 190px;  height: 100px; margin: 0; }
.fixedbox .code img { width: 180px; height: 180px; padding: 8px; border-radius: 4px; margin: 5px 0 0; background: rgba(19, 23, 34, .5); }
.fixedbox .DownBtn p { width: 90%; padding: 0 5%; margin-bottom: 5px; display: block; font-size: 2.4rem; color: #d3b584; letter-spacing: 5px; text-shadow: 0 0 3px #ff0000; }
.fixedbox .DownBtn { margin: 15px 0 0 0; overflow: hidden;}
.fixedbox .DownBtn img { width: 190px;  height: 80px; margin: 0; }
.h5bar{ width:208px; height:410px; position: absolute; right: 0; background: rgba(60, 61, 90, .85); border: 1px solid #9b7849; box-shadow: 0 2px 5px rgba(0, 0, 0, .5); }

/* 微信弹窗 */
.wx { display: none; position: fixed; width: 90%; height: auto; margin: 0; padding: 0 0 20px; border-radius: 8px; top:100px; left: 5%; z-index: 99999999999; background: rgba(0,0,0,.8); }
.wx img { width:100%; height: auto; margin: -8% auto 0; }

/* 移动端适配 */
@media(max-width:768px){
    .headerbox{display:block;}
    #gamedown-mobile{display:block;}
    .fixedbox{display:none; }
    .mainbox{width:96%;}
}
