/* ==================================================
   51DZQ.COM site.css V3.0

   第一部分：
   基础系统 / Header / Layout

   ================================================== */


/* =========================
   CSS变量
   ========================= */


:root{


    --bg:#eef3f9;


    --panel:#ffffff;


    --line:#d8e2ee;


    --line-soft:#e8eef6;


    --text:#1f2d3d;


    --muted:#66788a;


    --blue:#1f6fb2;


    --blue-light:#2d8ad6;


    --blue-deep:#1d4f7d;


    --red:#ef5350;


    --radius:12px;


    --shadow:
    0 6px 18px rgba(18,52,86,.08);


}





/* =========================
   Reset
   ========================= */


*{

    box-sizing:border-box;

}



html,
body{


    margin:0;


    padding:0;


    width:100%;


    max-width:100%;


    overflow-x:hidden;


}



body{


    font-family:


    -apple-system,


    BlinkMacSystemFont,


    "Segoe UI",


    "PingFang HK",


    "Microsoft JhengHei",


    Arial,


    sans-serif;



    background:var(--bg);


    color:var(--text);


    line-height:1.7;


    min-width:320px;


}



a{


    color:var(--blue);


    text-decoration:none;


}



img{


    max-width:100%;


    height:auto;


    display:block;


}





/* =========================
   Header
   ========================= */


.header{


    width:100%;


    background:


    linear-gradient(
        90deg,
        var(--blue-deep),
        var(--blue-light)
    );


    color:#fff;


}



.head{


    max-width:1500px;


    margin:auto;


    padding:14px 18px;


    display:flex;


    align-items:center;


    justify-content:space-between;


    gap:20px;


}





/* Logo */


.logo{


    display:flex;


    align-items:center;


    gap:12px;


    color:#fff;


}



.logo-img{


    width:44px;


    height:44px;


    background:#fff;


    border-radius:10px;


    padding:3px;


    object-fit:contain;


}



.logo-text h1,
.logo-text .site-name{


    margin:0;


    color:#fff;


    font-size:20px;


    line-height:1.3;


    font-weight:800;


}



.logo-text p{


    margin:4px 0 0;


    color:rgba(255,255,255,.9);


    font-size:13px;


}






/* 时间 */

.date{


    background:

    rgba(255,255,255,.12);



    border:


    1px solid rgba(255,255,255,.25);



    padding:10px 14px;



    border-radius:10px;



    color:#fff;



    font-size:14px;



    white-space:nowrap;


}







/* =========================
   页面框架
   ========================= */


.wrapper{


    width:100%;


    max-width:1500px;


    margin:auto;


    padding:14px;


}



.container{


    display:grid;


    grid-template-columns:


    280px minmax(0,1fr);



    gap:16px;


}



.side,
main{


    min-width:0;


}







/* =========================
   通用面板
   ========================= */


.panel{


    background:#fff;


    border:


    1px solid var(--line);



    border-radius:var(--radius);



    box-shadow:var(--shadow);



    overflow:hidden;



    margin-bottom:16px;


}



.panel .title{


    margin:0;


    padding:15px 18px;



    background:#f7fbff;



    border-bottom:


    1px solid var(--line-soft);



    border-left:


    5px solid var(--blue-light);



    font-size:20px;



    font-weight:800;


}



.panel .bd{


    padding:18px;


}



.panel .bd p{


    margin:0 0 14px;



    color:#33485d;



    font-size:16px;



    line-height:1.9;


}







/* =========================
   左侧导航
   ========================= */


.side .bd h2{


    margin:0 0 16px;



    text-align:center;



    font-size:22px;



    line-height:1.5;


}



.side ul{


    margin:0;


    padding:0;


    list-style:none;


}



.side li{


    margin-bottom:10px;


}



.side li a{


    display:block;


    padding:13px 14px;


    background:#f7f9fc;


    border:


    1px solid var(--line-soft);



    color:#1f2d3d;



    font-weight:700;


}



.side li.active a{


    background:var(--red);



    border-color:var(--red);



    color:#fff;


}


/* ==================================================
   51DZQ.COM site.css V3.0

   第二部分：
   导航 / Banner / 广告 / iframe / SEO

   ================================================== */


/* =========================
   顶部导航
   ========================= */


.top-links{


    display:grid;


    grid-template-columns:repeat(4,1fr);


    background:#fff;


    border:


    1px solid var(--line);



    margin-bottom:16px;


}



.top-links a{


    display:flex;


    justify-content:center;


    align-items:center;



    min-height:54px;



    padding:12px 8px;



    text-align:center;



    font-weight:800;



    color:#24384f;



    border-right:


    1px solid var(--line);



}



.top-links a:last-child{


    border-right:none;


}



.top-links a.active{


    background:var(--red);


    color:#fff;


}







/* =========================
   Banner介绍
   ========================= */


.banner{


    background:


    linear-gradient(
        135deg,
        rgba(21,89,145,.95),
        rgba(42,150,214,.85)
    );



    padding:26px 22px;



    color:#fff;



    margin-bottom:16px;


}



.banner h2{


    margin:0 0 10px;



    color:#fff;



    font-size:24px;



}



.banner p{


    margin:0;



    color:#fff;



    font-size:16px;



    line-height:1.9;


}







/* ==================================================
   广告系统 V3
   响应式版本

   支持：

   data-ad-slot

   ads.js动态插入

   ================================================== */



.ad-slot{


    width:100%;


    overflow:hidden;


}



.img-ad{


    display:block;


    width:100%;


    overflow:hidden;


}



.img-ad img{


    display:block;


    width:100%;


    height:auto;


}






/* =========================
   横幅广告

   不固定高度

   保持图片比例

   ========================= */


.img-ad-top,
.img-ad-bottom{


    width:100%;


}



.img-ad-top img,
.img-ad-bottom img{


    width:100%;


    height:auto;


    object-fit:contain;


}







/* =========================
   侧边广告

   标准：

   300 × 250

   ========================= */


.img-ad-side{


    width:100%;


}



.img-ad-side img{


    width:100%;


    aspect-ratio:300 / 250;


    object-fit:cover;


}







/* =========================
   广告间距

   ========================= */


.banner-ad{


    margin-bottom:16px;


}







/* =========================
   比分 iframe

   ========================= */


.score-frame{


    width:100%;


    overflow:hidden;


    background:#fff;


}



.score-frame iframe{


    display:block;


    width:100%;


    height:980px;


    border:0;


}







/* =========================
   SEO 热门关键词

   ========================= */


.hotwords{


    display:flex;


    flex-wrap:wrap;


    gap:10px;


}



.hotwords a{


    display:inline-block;


    padding:8px 14px;


    background:#f3f8fd;


    border:


    1px solid var(--line);



    border-radius:8px;



    font-weight:700;


}







.seo-list{


    margin:0;


    padding-left:20px;


}



.seo-list li{


    margin-bottom:8px;


    color:#40566b;


}







/* =========================
   联系方式

   ========================= */


.contact-box{


    background:#f7fbff;


    border:


    1px solid var(--line);



    border-radius:10px;



    padding:16px;


}



.contact-item{


    margin-bottom:10px;



    line-height:1.8;


}



.contact-item:last-child{


    margin-bottom:0;


}



.contact-item .label{


    font-weight:800;


    color:var(--blue-deep);


}



.contact-links a{


    color:var(--blue);


    font-weight:700;


}



.contact-links a:hover{


    text-decoration:underline;


}


/* ==================================================
   51DZQ.COM site.css V3.0

   第三部分：
   Mobile / Footer / Protect

   ================================================== */





/* =========================
   Footer
   ========================= */


.footer{


    max-width:1500px;


    margin:20px auto;


    padding:18px;



    text-align:center;


    color:#6c7d8f;


    font-size:14px;


}








/* ==================================================
   手机端响应式
   ================================================== */


@media(max-width:768px){



html,
body{


    width:100%;


    max-width:100%;


    overflow-x:hidden;


}





/* 页面边距 */

.wrapper{


    padding:6px;


}



.container{


    display:block;


    width:100%;


    padding:0;


}





/* 隐藏侧栏 */


.side{


    display:none;


}



main{


    width:100%;


}








/* =========================
   Header 手机版
   ========================= */


.head{


    display:block;


    padding:12px;


}



.logo{


    gap:10px;


}



.logo-img{


    width:38px;


    height:38px;


}



.logo-text h1,
.logo-text .site-name{


    font-size:18px;


}



.logo-text p{


    font-size:12px;


}



.date{


    width:100%;


    margin-top:12px;


    text-align:center;


}








/* =========================
   手机导航

   4个按钮自动2×2

   ========================= */


.top-links{


    grid-template-columns:repeat(2,1fr);


}



.top-links a{


    min-height:48px;


    padding:10px 5px;


    font-size:14px;


}








/* =========================
   Banner

   ========================= */


.banner{


    padding:18px;


}



.banner h2{


    font-size:21px;


}



.banner p{


    font-size:14px;


    line-height:1.8;


}








/* =========================
   Panel

   ========================= */


.panel .title{


    padding:12px;


    font-size:18px;


}



.panel .bd{


    padding:14px;


}



.panel .bd p{


    font-size:15px;


}








/* =========================
   手机广告

   自适应比例

   不固定高度

   不裁剪

   ========================= */


.img-ad-top,
.img-ad-bottom{


    width:100%;


}



.img-ad-top img,
.img-ad-bottom img{


    width:100%;


    height:auto;


    object-fit:contain;


}








/* 手机隐藏侧边广告 */


.img-ad-side{


    display:none;


}








/* =========================
   手机比分区域

   ========================= */


.score-frame{


    width:100%;


    overflow:hidden;


}



.score-frame iframe{


    width:100%;


    height:760px;


    border:0;


}








/* 热门标签 */


.hotwords a{


    width:48%;


    text-align:center;


}








.footer{


    font-size:13px;


    padding:14px;


}




}









/* ==================================================
   超小屏手机

   iPhone SE等

   ================================================== */


@media(max-width:390px){



.wrapper{


    padding:4px;


}



.logo-text h1,
.logo-text .site-name{


    font-size:17px;


}



.top-links a{


    font-size:13px;


}



.score-frame iframe{


    height:720px;


}



}









/* ==================================================
   防复制辅助

   配合 protect.js

   ================================================== */


body{


    -webkit-user-select:none;


    -moz-user-select:none;


    -ms-user-select:none;


    user-select:none;


    -webkit-touch-callout:none;


}






/* 输入框保持正常 */


input,
textarea,
[contenteditable="true"]{


    -webkit-user-select:text;


    -moz-user-select:text;


    -ms-user-select:text;


    user-select:text;


}






/* 图片防拖拽 */


img{


    -webkit-user-drag:none;


    user-select:none;


}








/* 联系方式允许复制 */


.allow-select,
.allow-select *{


    -webkit-user-select:text!important;


    -moz-user-select:text!important;


    -ms-user-select:text!important;


    user-select:text!important;


}






/* =========================
   通用辅助
   ========================= */


.text-center{


    text-align:center;


}



.mt10{


    margin-top:10px;


}



.mb10{


    margin-bottom:10px;


}

/* === multi-ad stack gap (v20261011) === */
.ad-slot .img-ad + .img-ad {
  margin-top: 12px;
}
.ad-slot .img-ad img {
  width: 100%;
  height: auto;
}
