@charset "utf-8";
/* CSS Document */
*{font-size:14px;font-family:"微软雅黑";color:#333;}
body,dl,dd,p{margin:0;}
a{text-decoration:none;transition:all .3s;}
img{display:block;}
input{margin:0;padding:0;border:none;outline:none;cursor:pointer;}
textaea{margin:0;padding:0;outline:none;}
h1,h2,h3{font-weight:normal;margin:0;}
ul{margin:0;padding:0;}
li{list-style:none;}
.clearfix{clear:both;}
[v-cloak]{display:none}


/*header*/
.header{max-width:1000px; margin:0 auto; overflow:hidden;}
.header .logo{ float:left;margin-top:2px;}
.header .right{float:right; line-height:50px;text-align:right;}
.header .right a{font-size:14px;transition:all 0.4s;}
.header .right a:hover{color:#f5c11d;}


.banner img{
    width:100%;
}


.title{
    margin-top:50px;
}
.title h1{
    font-size:32px;
    font-weight:bold;
    text-align:center;
}


.box{
    max-width:1000px;
    margin: auto;
    margin-top:20px;
}


.headlines a{
    font-size:20px;
    font-weight:bold;
    text-align:center;
    line-height:50px;
    display:block;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    border:#ccc solid 1px;
    margin-top:10px;
    transition:all .3s ease-in-out;
}
.headlines a:first-child{
    position:relative;
}
.headlines a img{
    position:absolute;
    top:50px;
    left:calc(50% - 179px);
    display:none;
}
.headlines a:hover{
    color:#fff;
    background:#f5c11d;
    border:#f5c11d solid 1px;
}
.headlines a:hover img{
    display:block;
}


.data_nav{
    display:flex;
}
.data_nav li{
    flex:1;
    font-size:16px;
    text-align:center;
    line-height:40px;
    background:#eee;
    cursor:pointer;
    transition:all .3s ease-in-out;
}
.data_nav .current{
    color:#fff;
    background:#f5c11d;
}
.data_img img{
    width:100%;
    display:none;
}
.data_img .current{
    display:block
}


#app iframe{
    width:460px;
    height:240px;
    margin-left:10px;
}


.figure{
    background:#fafafa;
    padding:10px 0;
}
.figure li{
    max-width:900px;
    margin: auto;
    display:flex;
    justify-content:space-between;
}
.figure .figure_l{
    flex:0 0 30%;
    text-align:center;
}
.figure_l img{
    margin: auto;
}
.figure_l a{
    font-size:20px;
    font-weight:bold;
    color:#111;
}
.figure_l p{
    font-size:12px;
    margin-top:10px;
}
.figure .figure_r{
    flex:0 0 50%;
}
.figure .figure_r a{
    float:right;
}
.figure a:hover{
    color:#f5c11d;
}


.platform{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}
.platform li{
    flex:0 0 48%;
    border:#eee solid 1px;
    margin-top:10px;
}
.platform_title{
    background:#f5c11d;
    height:30px;
    line-height:30px;
}
.platform_title h1{
    font-weight:bold;
    color:#111;
    float:left;
    margin-left:5px;
}
.platform_title a{
    float:right;
}


@media(max-width:1000px){
    .header .right a:first-child{
        display:none;
    }
    .title h1{
        font-size:24px;
    }
    .headlines a{
        font-size:14px;
        line-height:30px;
    }
    .data_nav li{
        font-size:12px;
    }
    .figure{
        background:none;
    }
    .figure li, .platform{
        display:initial;
    }
    .figure .figure_r{
        margin-top:20px;
    }
    #app iframe{
        width:90%;
        margin-left:0;
    }
}