/* 响应式字体设置 */
@media screen and (min-width: 1201px){
    html {
        font-size:1250%!important
    }
}
@media screen and (min-width: 1001px) and (max-width: 1200px){
    html {
        font-size: 850%!important
    }
}
@media screen and (max-width: 1001px){
    html {
        font-size: 750%!important
    }
}

/* 基础样式 */
@media screen and (min-width:769px){
    html { 
        padding: 0; 
        margin:0;  
        font-size: 625%;
        -webkit-text-size-adjust: none; 
        -webkit-overflow-scrolling: touch;
    }

    .w{width:90%; max-width:1200px; margin:0 auto;}
    .clear{clear:both;}
}

/* 通用样式 */
html { 
    padding: 0; 
    margin:0;  
    -webkit-text-size-adjust: none; 
    -webkit-overflow-scrolling: touch;
}

body {
    margin: 0;
    padding: 0;
    color: #444;
    font-family: SourceHanSerifSC-Regular, Arial, Helvetica, sans-serif;
    width: 100%;
    max-width: 100% !important;
}

img {
    border: none;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

/* Banner 样式 */
.banner{width: 100%;height: 1.6rem;position: relative;background: url(../img/banner.jpg) center;background-size: cover;}
.ban_txt{position: absolute;top:50%;left:50%;width:100%;transform:translate(-50%,-50%);text-align: center;color: #FFFFFF;}
.ban_txt .tit{font-size: .18rem;font-weight: 100;margin-bottom: .02rem;}
.ban_txt .tit b{font-weight: bold;}
.ban_txt p{font-size: .08rem;margin-top: .02rem;}
.ban_txt i{display: block;width: 90%;max-width: 1200px;margin: 0 auto;height: 1px;background: url(../img/04.png) center;background-size: 100% 100%;margin-top: .06rem;}
.ban_txt a{display: block;margin: 0 auto;border: 1px solid #FFFFFF;width: .65rem;line-height: .16rem;border-radius: .08rem;color: #FFFFFF;font-size: .08rem;margin-top: .08rem;}

.ban_txt a:hover{background: #0355ed;border-color: #0355ed}

/* 标题样式 */
.new_tit{overflow: hidden; margin-bottom: .08rem;}
.new_tit i{display: block;float: left;width: .09rem;}
.new_tit i img{width: 100%;display: block;}
.new_tit h3{float: left;font-size: .09rem;color: #333333;line-height: .09rem;margin-left: .03rem;}

/* 网格布局 */
.data-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: .15rem;
}

.grid-item {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    padding: 15px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.grid-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* 数据块样式 */
.data-blocks-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.data-block {
    background: #f8f9fa;
    border-radius: 4px;
    padding: 10px;
    border-left: 3px solid #3498db;
    transition: all 0.3s ease;
}

.data-block:hover {
    background: #e3f2fd;
    transform: translateX(3px);
}

.block-header {
    margin-bottom: 6px;
}

.block-header h4 {
    color: #2c3e50;
    font-size: 14px;
    margin: 0;
    font-weight: 600;
}

.block-content p {
    color: #666;
    line-height: 1.4;
    margin-bottom: 8px;
    font-size: 12px;
}

.block-links {
    text-align: center;
}

.block-links a {
    display: inline-block;
    background: #3498db;
    color: white;
    padding: 4px 8px;
    border-radius: 3px;
    text-decoration: none;
    margin: 0 2px;
    transition: background 0.3s ease;
    font-size: 11px;
}

.block-links a:hover {
    background: #2980b9;
}

/* 广告样式 */
.adv {
    height: 60px;
    background: url(../img/21.jpg) center;
    background-size: cover;
    border-radius: 4px;
    margin-top: .15rem;
    text-align: center;
    padding-top: 15px;
}
.adv img {
    display: inline-block;
    width: 300px;
    vertical-align: middle;
}
.adv a {
    display: inline-block;
    border: 1px solid #FFFFFF;
    background: rgba(255, 255, 255, .1);
    line-height: 22px;
    font-size: 12px;
    color: #FFFFFF;
    border-radius: 12px;
    padding: 0 10px;
    vertical-align: middle;
    margin-left: 20px;
}

.adv a:hover {
    background: #FFFFFF;
    color: #0355ed;
}

/* 下半部分内容样式 */
.daqi_c li {
    border-bottom: 1px solid #dddddd;
    padding: .06rem 0;
}

.daqi_c li .img {
    width: 30.89%;
    border-radius: 3px;
    overflow: hidden;
}

.daqi_c li .img img {
    width: 100%;
    display: block;
    transition: transform .5s ease;
}

.daqi_c li .txt {
    width: 66%;
    margin-top: 2px;
}

.daqi_c li .txt h3 a {
    display: block;
    font-weight: normal;
    color: #333333;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.daqi_c li .txt p {
    font-size: 11px;
    line-height: 16px;
    margin-top: 2px;
    color: #999999;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
}

.daqi_c li:hover .img img {
    transform:scale(1.15,1.15);
}

.daqi_c li:hover .txt h3 a {
    color: #0355ed;
}

/* 接口服务样式 */
.jiekou_c ul {
    display: flex;
    flex-wrap: wrap;
    margin-top: .05rem;
}

.jiekou_c li {
    width: 50%;
    text-align: center;
    margin-top: .05rem;
}

.jiekou_c li img {
    display: block;
    margin: 0 auto;
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    transition: all .3s;
}

.jiekou_c li p {
    font-size: .07rem;
    color: #333333;
    margin-top: 4px;
}

.jiekou_c li:hover img {
    box-shadow:0 0 8px rgba(3, 85, 237, .5);
}

.jiekou_c li:hover p {
    color: #0355ed;
}

/* 可视化分析样式 */
.ditu_c {
    margin-top: .08rem;
    width: 100%;
    height: 1.1rem;
    background: #f3f6fd;
    border-radius: .04rem;
    padding: .06rem .04rem .06rem .04rem;
}

.ditu_c a {
    display: block;
    width: 100%;
    height: 100%;
}

.ditu_c img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: .02rem;
}

/* 移动端响应式 */
@media screen and (max-width: 768px) {
    html {
        padding: 0;
        margin:0;
        font-size: 625%;
        -webkit-text-size-adjust: none;
        -webkit-overflow-scrolling: touch;
    }

    body {
        padding: 0;
        font-size: .14rem;
        margin: 0 auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
    }

    .ww {
        width:93.75%; 
        margin:0 auto;
    }

    .data-grid {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: .12rem;
    }

    .banner {
        height: 1.4rem;
    }
    
    .ban_txt .tit {
        font-size: .14rem;
        margin-bottom: .01rem;
    }
    
    .ban_txt p {
        font-size: .07rem;
        margin-top: .01rem;
        line-height: 1.4;
    }
    
    .ban_txt i {
        margin-top: .04rem;
    }
    
    .ban_txt a {
        width: .6rem;
        line-height: .14rem;
        border-radius: .07rem;
        font-size: .07rem;
        margin-top: .06rem;
    }

    .adv {
        height: auto;
        margin-top: .15rem;
        padding: .08rem 0;
    }
    
    .adv img {
        display: block;
        width: 2.2rem;
        margin: 0 auto;
    }
    
    .adv a {
        display: block;
        line-height: 18px;
        font-size: 11px;
        border-radius: 10px;
        padding: 0;
        margin: 0 auto;
        width: .7rem;
        margin-top: .06rem;
    }

    .daqi_c li {
        padding: .05rem 0;
    }
    
    .jiekou_c li {
        width: 50%;
        margin-top: .04rem;
    }
    
    .jiekou_c li p {
        font-size: 12px;
    }
    
    .ditu_c {
        height: 1rem;
        margin-top: .06rem;
    }
}