/* CSS Reset */
     * {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
     }

     body {
         font-family: Arial, sans-serif;
         line-height: 1.6;
         background-color: #f5f5f5;
         color: #333;
     }

     header {
         background-color: #333;
         color: #fff;
         padding: 20px 0;
         text-align: center;
     }

     header h1 {
         font-size: 2.5em;
         margin-bottom: 10px;
     }

     header p {
         font-size: 1.2em;
     }

     nav {
         background: #444;
         /* 背景色为深灰色 */
         color: white;
         /* 文本颜色为白色 */
         padding: 10px 10px;
         /* 内边距 */
         width: 100px;
         /* 导航栏宽度 */
         position: fixed;
         /* 固定位置，随屏幕滚动 */
         top: 144px;
         /* 距离页面顶部 0px */
         left: 0;
         /* 距离页面左侧 0px */
         height: 450px;
         /* 导航栏高度占满屏幕 */
     }


     nav a {
         color: white;
         /* 链接颜色为白色 */
         text-decoration: none;
         /* 移除链接下划线 */
         display: block;
         /* 将链接设为块级元素，垂直排列 */
         margin: 10px 0;
         /* 每个链接上下间隔 10px */
         padding: 10px;
         /* 为链接增加内边距 */
         font-size: 1.1em;
         /* 字体大小为默认大小的 1.1 倍 */
     }

     nav a:hover {
         text-decoration: underline;
     }

     .container {
         width: 90%;
         margin: 20px auto;
         max-width: 1200px;
         background: #fff;
         padding: 20px;
         border-radius: 10px;
         box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
     }

     .container h2 {
         margin-bottom: 15px;
         color: #444;
     }

     .container p {
         margin-bottom: 15px;
         text-align: justify;
     }

     .tiles {
         display: flex;
         flex-wrap: wrap;
         gap: 20px;
         justify-content: center;
         margin-top: 20px;
     }

     .tile {
         width: 110px;
         text-align: center;
     }

     .tile img {
         width: 40px;
         border-radius: 10px;
         cursor: pointer;
         transition: transform 0.3s ease;
     }

     .tile img:hover {
         transform: scale(1.1);
     }

     footer {
         background: #333;
         color: #fff;
         text-align: center;
         padding: 10px 0;
         margin-top: 20px;
     }

     footer a {
         color: #fff;
         text-decoration: none;
     }

     footer a:hover {
         text-decoration: underline;
     }

     .mahjong-item img {
         width: 30px;
         height: auto;
         display: block;
         margin: 0 auto 10px;
     }

     .maj img {
         width: 30px;


     }

     .mahjong-row {
         display: flex;
         justify-content: center;
         align-items: center;
         flex-wrap: wrap;
         margin: 20px auto;
         padding: 10px;
         gap: 20px;
     }

     .sic {
         margin: 30px;
         text-align: center;
     }

     .yjjw img {
         width: 25px;
     }

     .yjjw3 tr td img {
         width: 25px;


     }

     .yjjw3 img {
         width: 25px;
     }

     .mahjong-gzt img {
         width: 500px;
         height: auto;
         display: block;
         margin: 0 auto 10px;

     }

     .th2 {
         border: 1px solid black;
         padding: 8px;
         text-align: left;
     }

     .td2 {
         border: 1px solid black;
         padding: 8px;
     }

     .td3 {
         border: 1px solid black;
         padding: 8px;
         text-align: center;
     }

     .HOME1 {
         margin-left: 330px;
         padding-top: 8px;
         position: absolute;
         color: #333;
     }

     .HOME1:hover {
         color: rgb(139, 138, 138);
     }


     /* 默认导航栏样式（桌面端显示） */
     nav {
         background: #444;
         color: white;
         padding: 10px 10px;
         width: 100px;
         position: fixed;
         top: 144px;
         left: 0;
         height: 450px;
     }

     /* 针对宽度小于768px的设备（隐藏导航栏） */
     @media screen and (max-width: 768px) {
         nav {
             display: none;
             /* 手机端隐藏导航栏 */
         }
     }

     /* 默认图片样式（桌面端） */


     /* 针对手机端的样式（宽度小于768px时）） */
     @media screen and (max-width: 768px) {
         .mahjong-gzt img {
             width: 70%;
             /* 缩小图片宽度到50% */
             height: auto;
             /* 保持宽高比 */
             margin: 0 auto;
             /* 图片居中 */
             display: block;
             /* 确保图片块级显示 */
         }
     }

     /* 默认样式（适用于桌面端） */


     /* 图片默认样式 */

     /* 手机端适配（宽度小于768px） */
    

         /* 内容容器全屏显示 */
         .container {
             width: 95%;
             padding: 10px;
         }

         /* 调整图片大小 */


         /* 减小字体大小 */
         body {
             font-size: 14px;
         }

         h1 {
             font-size: 1.8em;
             text-align: center;
         }

         h2 {
             font-size: 1.5em;
         }

         p,
         span,
         a {
             font-size: 1em;
             line-height: 1.5;
         }
     

     /* 超小屏适配（宽度小于480px） */
     @media screen and (max-width: 480px) {
         h1 {
             font-size: 1.5em;
         }

         nav a {
             font-size: 0.9em;
         }

         img {
             max-width: 80%;
         }

         .container {
             padding: 5px;
         }
     }