/* styles.css定义网页的整体样式，确保布局美观 */
body {
    font-family: 'Arial','Microsoft YaHei','Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','\5B8B\4F53',sans-serif;
    font-size: 16px;
    line-height: 28px;margin: 0;
    color: #333;
    webkit-text-size-adjust: 100%;

    margin: 0;
    padding: 0;
    background-color: #fff; /* 网站整体背景为白色 */
    display: flex;
    flex-direction: column; /* 垂直排列 */
    align-items: center; /* 水平居中 */
    min-height: 100vh; /* 确保页面高度占满整个视口 */
}

.container {
    width: 100%; /* 设置宽度为全屏的 100% */
    max-width: 1200px; /* 最大宽度限制 */
    margin: 0 auto; /* 水平居中 */
}

/* 网站标题和提示文字 */
.site-header {
    display: flex;
    align-items: center; /* 垂直居中 */
    margin-bottom: 10px; /* 与导航栏的间距 */
}

.site-header h1 {
    margin: 0;
    font-size: 2.5em;
    font-weight: bold;
    color: #ff0000; /* 网站标题为红色 */
    white-space: nowrap; /* 防止标题换行 */
}

.site-header .subtext {
    display: block; /* 独占一行 */
    font-size: 1em; /* 字体较小 */
    font-weight: normal; /* 正常字体 */
    color: rgba(0, 0, 0, 0.8); /* 半透明黑色 */
    margin-top: 2px; /* 减少与主标题的间距 */
    line-height: 1.2; /* 调整行高，使上下两行更紧凑 */
    text-align: center; /* 文字居中 */
    color: #ff0000;
}

.site-header .slogan {
    font-size: 1em;
    color: #666; /* 提示文字颜色为灰色 */
    margin-left: 5px; /* 与标题的间距 */
    flex-grow: 1; /* 占据剩余空间 */
}

/* 导航栏 */
nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex; /* 设置为弹性盒子 */
    justify-content: space-around; /* 均匀分布 */
    background-color: #BE0000; /* 导航栏背景颜色 */
    padding: 5px;
    border-radius: 10px; /* 圆角 */
}

nav ul li {
    flex:1; /* 均匀分布 */
    text-align: center; /* 文字居中 */
    white-space: nowrap; /* 防止标题换行 */
}

nav ul li a {
    color: #fff; /* 文字颜色为白色 */
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2em;
    border-radius: 5px; /* 圆角 */
    transition: background-color 0.3s ease; /* 平滑过渡 */
}

nav ul li a:hover {
    background-color: #E0A000; /* 悬停时背景色 */
}

nav ul li a.active {
    background-color: #E0A000; /* 选中项背景色 */
}

/* 小字提示样式 */
nav ul li a .subtext {
    display: block; /* 独占一行 */
    font-size: 0.5em; /* 字体较小 */
    font-weight: normal; /* 正常字体 */
    color: rgba(255, 255, 255, 0.8); /* 半透明白色 */
    margin-top: 2px; /* 与主标题的间距 */
    line-height: 1.2; /* 调整行高，使上下两行更紧凑 */
}

/********** yijia.html **********/
small {
        font-size: 12px;
        color: green;
    }


/* 后续内容区域 */
.main-content {
    margin-top: 0px; /* 与导航栏的间距 */
    padding: 0px;
    background-color: #fff; /* 背景为白色 */
    border-radius: 10px; /* 圆角 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 阴影效果 */
    width: 100%; /* 宽度占满容器 */
}


.error {
     color: red;
    margin-bottom: 15px;
}


/********** main **********/
.notice{font-size: 24px;padding: 50px 0;text-align: center;}


/********** table **********/

half{width:50%;}
thead,
th{background: linear-gradient(#FFF, #CCC);font-weight: normal;height:20px;line-height:20px;padding:6px 10px 10px;text-align:left; position: sticky;}
th a{position: relative;}
th a:before{font-size: 12px;line-height: 10px;position: absolute;top: 0;right: -12px;width: 10px;height: 10px;content: '▲';color: #999;}
th a.asc:before, 
th a.desc:after{color: #f33;}
th a:after{font-size: 12px;line-height: 10px;position: absolute;top: 10px;right: -12px;width: 10px;height: 10px;content: '▼';color: #999;}
.icon{padding-left:10px;border-left: 5px solid #d94040;color: #d94040;}
.count{float:right;color: #666;}
.count span{margin:0 2px;}
.even tr:nth-child(even),
.odd tr:nth-child(odd){background: #f1f1f1;}
tr:hover,
.odd tr:nth-child(odd):hover,
.even tr:nth-child(even):hover {background: #d4edda;}
td{line-height:20px;padding:15px 10px;}
td.ms{width:85px;}
td.xs{min-width:80px;}

.list-price{width:100px;}
.info th,
.info td{width: 33.33%;border-left: 1px solid #ddd;text-align: center;}
.info th:first-child,
.info td:first-child{border-left:none;}
.related{background:#f1f1f1;border-top: 1px solid #ddd;}
.related a{margin:0 10px;font-size:18px; }


/********** footer **********/
.footer{margin: 0 auto 10px;padding-top: 20px;text-align: center;border-top: 1px solid #eee;}
.footer a{padding-left: 10px;}
.footer p{font-size: 14px;margin: 0;color: #999;}






/********** nav **********/
.nav{margin-bottom: 30px;padding-top: 0px;background: #ebf3fb;background: linear-gradient(#ebf3fb, #D2E9FF);}
.area {overflow:hidden;min-width: 320px;max-width: 992px;margin: 0 auto 10px;border-bottom: 1px dashed #ccc;}
.area:last-child{margin-bottom:0;padding-bottom:10;border-bottom:none;}
.area-1{float:left;width:340px;padding-bottom:10px;}
.area-2{float:left;width:183px;padding-bottom:10px;}
.area-3{float:left;width:340px;padding-bottom:10px;}
.area-4{float:right;width:127px;padding-bottom:10px;text-align:center;}
.suffix{float:left;padding-bottom:1px;}
.site{float:right;padding-bottom:1px;}
.nav a{margin-right: 10px;color: #333;}
.nav a:last-child{margin-right: 0;}
.nav a:hover{color: #d94040;outline: 0;}
.category{clear: both;min-width: 320px;max-width: 992px;margin: 0 auto 10px;}
.category a{margin-right: 6px;}
a.current{padding: 3px 6px;color: #fff;background: #AE8F00;}
a.current:hover{color: #fff;}
.reset{font-size: 14px;line-height: 26px;display: inline-block;width: 60px;height: 26px;padding: 0;text-align: center;text-indent: 0;border: 1px solid #ccc;border-radius: 4px;background: #eee;}
.reset:hover{background: #e6e6e6;}









a{text-decoration: none;color: #0084ff;}
a:hover{color: #d94040;outline: 0;}
a:active{outline: 0;}
a[target='_blank']{padding-right: 12px;background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=) center right no-repeat;}
label{cursor: pointer;}
button{font-size: 14px;line-height: 28px;width: 60px;height: 28px;padding: 0;cursor: pointer;user-select: none;color: #fff;border: 1px solid #e36d1f;border-radius: 4px;outline: 0;background: #ff6700;}
button:hover{background: #f25807;}
h1{font-size: 36px;font-weight: normal;line-height: 60px;margin: 0 0 30px;padding: 0 10px;text-align: center;word-wrap: break-word;word-break: normal;color: #d94040;}
h2{font-size: 22px;font-weight: normal;margin: 0 0 0px;line-height: 1px;text-align: center;}
h2 strong{font-size:28px;font-weight:normal;}
h2 span{margin:0 14px;color:#ddd;}
mark{margin-left:2px;padding:0 3px;background:#d4edda;border-radius:4px;}


li{word-wrap: break-word;word-break: break-all;text-align: left;}
input[type='text'],
input[type='search'],
input[type='number']{box-sizing:border-box;width:110px;height: 28px;font-size: 14px;padding: 3px 6px;color: #666;border: 1px solid #ccc;border-radius: 4px;outline: none;background: #fff;-webkit-appearance: none;}
input[type='radio']{margin:3px 1px 0px 2px;}


/********** ymxq **********/
.main{position: relative;overflow: hidden;min-width: 320px;max-width: 992px;margin: 0 auto 30px;}
ol:before{font-size: 12px;line-height: 14px;position: absolute;left: 0;width: 18px;padding: 2px 0;content: '推荐';text-align: center;color: #fff;border: 1px solid #e36d1f;border-radius: 9px;outline: 0;background: #ff6700;}





/********** table **********/

.container1{margin-bottom:30px;padding-top:4px;border-radius: 8px; border:1px solid #d8d8d8;overflow:hidden;}
table{width: 100%;border-spacing: 0;border-collapse: collapse;}

.half{width:50%;}
.thead,
th{background: linear-gradient(#FFF, #CCC);font-weight: normal;height:20px;line-height:20px;padding:6px 10px 10px;text-align:left;}
th a{position: relative;}
th{position: sticky; top: 0;z-index: 1;}
th a.asc:before, 
th a.desc:after{color: #f33;}

.icon{padding-left:10px;border-left: 5px solid #d94040;color: #d94040;}
.count{float:right;color: #666;}
.count span{margin:0 2px;}
.even tr:nth-child(even),
.odd tr:nth-child(odd){background: #f1f1f1;}
tr:hover,
.odd tr:nth-child(odd):hover,
.even tr:nth-child(even):hover {background: #d4edda;}
td{line-height:20px;padding:15px 10px;}
td.ms{width:85px;}
td.xs{min-width:80px;}
.index-domain{font-size: 18px;padding-right:0;}
.index-price{width:70px;padding-left:0;text-align:right;}
.list-price{width:100px;}
.info th,
.info td{width: 33.33%;border-left: 1px solid #ddd;text-align: center;}
.info th:first-child,
.info td:first-child{border-left:none;}
.related{background:#f1f1f1;border-top: 1px solid #ddd;}
.related a{margin:0 10px;font-size:18px; }


@media screen and (max-width:960px){
    .logo{left: 10px;}
    .qrcode{right: 10px;}
    .nav{padding-left: 10px;}
    .main{padding:0 10px;}
    .suffix, .site, .category, .area-1, .area-2, .area-3, .area-4{float:none;width:100%;}
    .suffix, .area-1, .area-2, .area-3{margin-bottom:10px;border-bottom: 1px dashed #ccc;}
    .price{margin-left:0;}
}
@media screen and (max-width:768px){
    .header{padding:0 10px;}
    .contact{width:154px;background: url(img/mini.png) no-repeat 0 10px;}
    .grid a{width:33.33%;}
    .grid a:nth-child(4){border-top: 1px dashed #ddd;}
    .grid a:nth-child(4n+1) {border-left: 1px dashed #ddd;}
    .grid a:nth-child(3n+1){border-left:none;}
    .index-left,.index-right{float: none;width:100%;margin-right:0;}
    .index-intro{padding-left:0;padding-right:0;}
    .index-price{width:auto;padding-right:5px;color: #d94040;}
    .ms{display: none;}
}
@media screen and (max-width:560px){
    .header{margin-bottom: 10px;}
    .grid a{width:50%;}
    .grid a:nth-child(3){border-top: 1px dashed #ddd;}
    .grid a:nth-child(3n+1) {border-left: 1px dashed #ddd;}
    .grid a:nth-child(2n+1){border-left:none;}
    .simple,.alert{display: block;}
    .th-price{min-width:48px;}
    .list-price{width:auto;text-align:right;color: #d94040;}
    .pagination a, .pagination strong{margin-left: 4px;}
    .info th, .info td{width: auto;min-width: 80px;}
    .footer{word-break: keep-all;} 
    .xs{display: none;}
}