@charset "utf-8";
/* CSS Document */

body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0;  /*-webkit-appearance:none; -moz-appearance:none;*/}
body{ font-size:18px;margin: 0 auto; -webkit-text-size-adjust:100%; background-color: #fff;}
a{ color:#333;text-decoration:none}
a:hover{color:#000;text-decoration:none;}
em{font-style:normal}
li{list-style:none}
img{border:0;vertical-align:middle}
table{border-collapse:collapse;border-spacing:0}
p{word-wrap:break-word; color:#777;}

/*通用定义*/
.clearfix:after {clear:both; height:0; overflow:hidden; display:block; visibility:hidden; content:"."; }
.fl{ float:left;}
.fr{ float:right;}
.clearer{clear:both; height:0; display:block; font-size:1px;overflow:hidden;}



body{ width: 7.5rem; margin: 0 auto; background-color: #f5f7fb;}

.layout{ padding: 0 0.3rem;}

header{ min-height: 3.92rem; padding: 0.3rem 0; background-image: url(../images/banner.jpg); background-size: 100% 100%; box-sizing: border-box;}

.header_top{ display: flex; justify-content: right; margin-bottom: 0.16rem;}
a.header_top_btn{ display: flex; align-items: center; justify-content: left; height: 0.26rem; margin-left: 0.3rem; font-size: 0.24rem; line-height: 0.26rem; color: #fff;}
a.header_top_btn.slh:before{ width: 0.25rem; height: 0.25rem; margin-right: 0.1rem; background-image: url(../images/icon_slh.png); background-size: 100% 100%; content: ""}
a.header_top_btn.znzx:before{ width: 0.24rem; height: 0.21rem; margin-right: 0.1rem; background-image: url(../images/icon_znzx.png); background-size: 100% 100%; content: ""}

.logo{ display: block; width: 6rem; height: auto; margin: 0 auto 0.36rem;}

.search_bar{ position: relative; width: 100%; height: 0.6rem; margin-bottom: 0.3rem; background-color: #fff; border-radius: 0.1rem; }
a.search_btn{ position: absolute; top: 0; left: 0; width: 0.7rem; height: 0.6rem; background: url(../images/icon_search.png) no-repeat center; background-size: 0.3rem 0.3rem;}
a.search_btn:before{ position: absolute; top: 50%; right: 0; width: 0.01rem; height: 0.28rem; margin-top: -0.14rem; background-color: #bee2f9; content: ""}
.search_text{ position: absolute; top: 0; left: 0.8rem; width: 6rem; height: 0.6rem; font-size: 0.28rem; line-height: 0.6rem; color: #8ea5bf; outline: none; border: none;}
.search_btnbutton {position: absolute;right: 0;background: linear-gradient(135deg, #55b0ff, #448fff);color: white;width: 1rem;height: 0.6rem;border: none;padding: 0.12rem 0.24rem;border-radius: 0.05rem;box-sizing: border-box;font-size: 0.25rem;font-weight: 600;cursor: pointer;}

.hotWord{ display: flex; flex-wrap: wrap;  justify-content: left;}
.hotWord_tit{ display: flex; align-items: center; justify-content: left; height: 0.44rem; font-size: 0.3rem; line-height: 0.44rem; color: #fff;}
.hotWord_tit:before{ width: 0.25rem; height: 0.31rem; margin-right: 0.1rem; background-image: url(../images/icon_hotword.png); background-size: 100% 100%; content: ""}

.hotWord_list{ display: flex; flex-wrap: wrap; align-items: center; justify-content: left; width: 5.2rem;}
.hotWord_list li{ height: 0.44rem; margin: 0 0 0.1rem 0.2rem; padding: 0 0.1rem; font-size: 0.3rem; line-height: 0.44rem; color: #3aa2ff; background-color: #daeeff; border-radius: 0.08rem;}
.hotWord_list .liActive{
    background-color: #fbfbfb;
}
.marB_nav{ padding-bottom: 1.3rem; }

.nav{ position: fixed; bottom: 0; left: 0; display: flex; justify-content: left; width: 100%; height: 1.3rem; background-color: #fff; box-shadow: 0 0  0.06rem rgba(0,0,0,0.06); z-index: 10}

.nav_tem{  width: 25%; height: 100%; }
.nav_tem > a{ width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; font-weight: bold; font-size: 0.28rem; line-height: 0.3rem; letter-spacing: 0.2em; text-indent: 0.2em; color: #2f4269;}
.nav_tem > a:before{ width: 0.4rem; height: 0.4rem; margin-bottom: 0.1rem; background-image: url(../images/icon_nav.png); background-size: 0.8rem 1.6rem; content: ""}

.nav_tem.tem1{}
.nav_tem.tem1 > a:before{ background-position: 0 0}
.nav_tem.tem1.active > a:before{ background-position: -0.4rem 0}
.nav_tem.tem2 > a:before{ background-position: 0 -0.4rem}
.nav_tem.tem2.active > a:before{ background-position: -0.4rem -0.4rem}
.nav_tem.tem3 > a:before{ background-position: 0 -0.8rem}
.nav_tem.tem3.active > a:before{ background-position: -0.4rem -0.8rem}
.nav_tem.tem4 > a:before{ background-position: 0 -1.2rem}
.nav_tem.tem4.active > a:before{ background-position: -0.4rem -1.2rem}