/* 基础重置样式 */
html{color:#000;background:#FFF}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}
legend{color:#000}
/* 全局样式 */
html{height:100%}
body{height:100%;font-family:Arial,Helvetica,"Microsoft Yahei";font-size:14px;color:#333}
a{text-decoration:none;color:#333}
a:hover{color:#1670c6}
img{vertical-align:middle}
button,input,select,textarea{font-family:Tahoma,Arial, Helvetica,"微软雅黑";font-size:inherit;line-height:inherit}
.wrapper{position:relative;min-height:100%;background:#f8f8f8}
.inner{width:1000px;margin:0 auto}
.header{margin-bottom:20px}
.container .inner{position:relative}
/* 清除浮动 */
.inner:before,.inner:after{content:"";display:table}
.inner:after{clear:both;overflow:hidden}
/* 头部样式 */
.mod-head .bd{background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);position:relative}
.mod-head .bd .logo{float:left;width:200px;height:80px;line-height:80px;text-align:center;font-size:24px;font-weight:bold;color:#d4237a}
.mod-head .ft{background:#1670c6;overflow:hidden}
.mod-head .ft ul{float:left;border-left:1px solid rgba(0,0,0,0.1);border-right:1px solid rgba(255,255,255,0.1)}
.mod-head .ft ul li{float:left;height:40px;border-left:1px solid rgba(255,255,255,0.1);border-right:1px solid rgba(0,0,0,0.1);line-height:40px}
.mod-head .ft ul li.active a{background:rgba(0,0,0,0.1);color:#fff}
.mod-head .ft ul li.home a{padding:0 15px}
.mod-head .ft ul a{display:inline-block;padding:0 30px;text-align:center;font-size:16px;color:#fff;color:rgba(255,255,255,0.9)}
/* 模块通用样式 */
.module{position:relative;background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);margin-bottom:20px}
.module .hd{height:48px;line-height:48px;padding:0 15px;border-bottom:2px solid #ebebeb;position:relative;overflow:hidden}
.module .hd h3{font-weight:700;font-size:18px;cursor:default;float:left}
.module .hd h3 span{display:inline-block;padding:0 20px 0 10px;border-bottom:2px solid #1670c6}
.module .hd .more{float:right;color:#888;font-size:14px;line-height:48px;text-decoration:none}
.module .hd .more:hover{color:#1670c6}
/* 推荐区域样式 - 增大显示更多游戏 */
.mod-recommend{position:relative;background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);margin-bottom:20px}
.mod-recommend .hd{float:left;width:16px;padding:15px 8px;margin:0 16px;background:#d4237a}
.mod-recommend .hd h3{font-size:14px;color:#fff;writing-mode:vertical-lr}
.mod-recommend .bd{padding:20px 15px 15px;margin-left:48px}
.mod-recommend .bd ul{overflow:hidden}
.mod-recommend .bd li{float:left;width:10%;line-height:30px;text-align:center;margin-bottom:15px}
.mod-recommend .bd li .icon{display:block;margin:0 8px}
.mod-recommend .bd li .icon img{width:60px;height:60px;border-radius:12px}
.mod-recommend .bd li .icon span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;margin-top:5px}
/* 分类展示区域 - 调整为更大的展示 */
.mod-category{background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);margin-bottom:20px}
.mod-category .hd{height:48px;line-height:48px;padding:0 15px;border-bottom:2px solid #ebebeb;overflow:hidden}
.mod-category .hd h3{font-weight:700;font-size:18px;float:left}
.mod-category .hd h3 span{display:inline-block;padding:0 20px 0 10px;border-bottom:2px solid #1670c6}
.mod-category .hd .more{float:right;color:#888;font-size:14px;line-height:48px;text-decoration:none}
.mod-category .hd .more:hover{color:#1670c6}
.mod-category .bd{padding:20px 15px}
.mod-category .game-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:15px}
.mod-category .game-item{text-align:center;padding:10px;border:1px solid #f0f0f0;border-radius:8px;transition:all 0.3s ease}
.mod-category .game-item:hover{border-color:#1670c6;box-shadow:0 4px 12px rgba(22,112,198,0.1)}
.mod-category .game-item img{width:60px;height:60px;border-radius:10px;margin-bottom:8px}
.mod-category .game-item .name{font-size:13px;color:#333;margin-bottom:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mod-category .game-item .tag{font-size:11px;color:#ff4757;background:#fff2f2;padding:2px 6px;border-radius:10px}
/* 最新游戏区域 */
.mod-latest{background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);margin-bottom:20px}
.mod-latest .hd{height:48px;line-height:48px;padding:0 15px;border-bottom:2px solid #ebebeb;background:linear-gradient(90deg, #ff6b35, #f7931e)}
.mod-latest .hd h3{font-weight:700;font-size:18px;color:#fff}
.mod-latest .bd{padding:20px 15px}
.mod-latest .latest-list{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:15px}
.mod-latest .latest-item{display:flex;align-items:center;padding:12px;border:1px solid #f0f0f0;border-radius:8px;transition:all 0.3s ease}
.mod-latest .latest-item:hover{border-color:#ff6b35;background:#fff8f5}
.mod-latest .latest-item img{width:50px;height:50px;border-radius:8px;margin-right:12px}
.mod-latest .latest-info .name{font-size:14px;font-weight:bold;color:#333;margin-bottom:4px}
.mod-latest .latest-info .desc{font-size:12px;color:#666;margin-bottom:4px}
.mod-latest .latest-info .time{font-size:11px;color:#999}
/* 攻略模块样式 - 改为列表式 */
.mod-strategy{background:#fff;box-shadow:0 0 2px rgba(0,0,0,0.15);margin-bottom:20px}
.mod-strategy .hd{height:48px;line-height:48px;padding:0 15px;border-bottom:2px solid #ebebeb;background:linear-gradient(90deg, #8e44ad, #9b59b6);overflow:hidden}
.mod-strategy .hd h3{font-weight:700;font-size:18px;color:#fff;float:left}
.mod-strategy .hd .more{float:right;color:#fff;font-size:14px;line-height:48px;text-decoration:none;opacity:0.9}
.mod-strategy .hd .more:hover{opacity:1}
.mod-strategy .bd{padding:20px 15px}
.mod-strategy .strategy-list{list-style:none}
.mod-strategy .strategy-item{
display: flex;
align-items: flex-start;
padding: 15px 0;
border-bottom: 1px solid #f0f0f0;
transition: all 0.3s ease;
color: #333;
text-decoration: none;
}
.mod-strategy .strategy-item:last-child{border-bottom:none}
.mod-strategy .strategy-item:hover{
background: #f8f9fa;
padding-left: 10px;
color: #333;
text-decoration: none;
}
.mod-strategy .strategy-content{flex: 1;margin-right: 20px}
.mod-strategy .strategy-title{
font-size:16px;
font-weight:bold;
color:#333;
margin-bottom:8px;
line-height:1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.mod-strategy .strategy-desc{
color:#666;
font-size:13px;
line-height:1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.mod-strategy .strategy-meta{
flex-shrink: 0;
text-align: right;
color: #999;
font-size: 12px;
line-height: 1.4;
min-width: 100px;
}
.mod-strategy .strategy-date{
display: block;
margin-bottom: 4px;
font-weight: bold;
}
.mod-strategy .strategy-views{
display: block;
font-size: 11px;
}
/* 友情链接样式 */
.mod-link .hd{padding:0 10px}
.mod-link .bd{padding:10px;line-height:24px;text-align:justify}
.mod-link .bd a{margin-right:5px}
/* 底部样式 */
.mod-foot .bd{padding:20px 0 10px}
.mod-foot .bd p{line-height:24px;text-align:center;font-size:12px;color:#999}
.mod-foot .bd span,.mod-foot .bd a{margin:0 15px}
.mod-foot .bd a{color:#999}
.mod-foot .bd a:hover{color:#1670c6}
/* 返回顶部 */
.mod-sidebar{position:fixed;right:25px;bottom:25px;width:60px;height:60px;background:#1670c6;border:1px solid #1670c6;line-height:60px;text-align:center;border-radius:50%;color:#fff;font-size:12px;cursor:pointer;transition:all 0.3s ease}
.mod-sidebar:hover{background:#0d5aa7}
/* 响应式设计 */
@media screen and (max-width: 800px){
.inner{width:auto;padding:0 10px}
.header{position:fixed;left:0;top:0;z-index:99;width:100%;margin-bottom:10px}
.container{padding-top:100px}
.mod-head .bd .logo{width:auto;height:50px;line-height:50px;font-size:18px}
.mod-head .ft{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mod-head .ft ul{
border:none;
white-space:nowrap;
overflow:visible;
display:flex;
min-width:max-content;
}
.mod-head .ft ul li{
float:none;
display:inline-block;
border:none;
height:36px;
line-height:36px;
flex-shrink:0;
}
.mod-head .ft ul a{padding:0 15px;font-size:14px}
.mod-recommend .hd{float:none;width:auto;padding:10px;margin:0;background:#d4237a;text-align:center}
.mod-recommend .hd h3{writing-mode:initial;font-size:16px;font-weight:bold}
.mod-recommend .bd{margin-left:0;padding:15px 10px}
.mod-recommend .bd li{width:20%;margin-bottom:10px}
.mod-recommend .bd li .icon img{width:50px;height:50px}
.mod-category .game-grid{grid-template-columns:repeat(auto-fill, minmax(120px, 1fr))}
.mod-latest .latest-list{grid-template-columns:1fr}
.mod-strategy .strategy-item{flex-direction:column;align-items:stretch}
.mod-strategy .strategy-content{margin-right:0;margin-bottom:10px}
.mod-strategy .strategy-meta{text-align:left;min-width:auto}
.mod-sidebar{right:15px;bottom:15px;width:45px;height:45px;line-height:45px;font-size:10px}
}
/* 专题标签云 */
.special-cloud{
line-height:1.8;
text-align:justify;
}
.special-tag{
display:inline-block;
margin:4px 6px 4px 0;
padding:8px 15px;
background:#fff;
border:1px solid #e0e0e0;
border-radius:20px;
color:#333;
font-size:14px;
text-decoration:none;
transition:all 0.3s ease;
position:relative;
overflow:hidden;
}
.special-tag:before{
content:'';
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(90deg, transparent, rgba(22,112,198,0.1), transparent);
transition:left 0.5s ease;
}
.special-tag:hover:before{
left:100%;
}
.special-tag:hover{
border-color:#1670c6;
color:#1670c6;
text-decoration:none;
transform:translateY(-2px);
box-shadow:0 4px 12px rgba(22,112,198,0.2);
}
/* 热门专题标签 */
.special-tag.hot{
background:linear-gradient(135deg, #ff6b6b, #ff8e8e);
color:#fff;
border:none;
font-weight:bold;
}
.special-tag.hot:hover{
background:linear-gradient(135deg, #ff5252, #ff7979);
color:#fff;
transform:translateY(-3px) scale(1.05);
}
/* 新专题标签 */
.special-tag.new{
background:linear-gradient(135deg, #26de81, #20bf6b);
color:#fff;
border:none;
font-weight:bold;
}
.special-tag.new:hover{
background:linear-gradient(135deg, #00d2ff, #3a7bd5);
color:#fff;
transform:translateY(-3px) scale(1.05);
}
/* 推荐专题标签 */
.special-tag.recommend{
background:linear-gradient(135deg, #a55eea, #8854d0);
color:#fff;
border:none;
font-weight:bold;
}
.special-tag.recommend:hover{
background:linear-gradient(135deg, #fd79a8, #fdcb6e);
color:#fff;
transform:translateY(-3px) scale(1.05);
}
/* 大号专题标签 */
.special-tag.large{
font-size:16px;
padding:10px 18px;
font-weight:bold;
}
/* 中号专题标签 */
.special-tag.medium{
font-size:15px;
padding:9px 16px;
}