html,body { width: 100%; height: 100%; margin: 0; padding: 0; font-family: "微软雅黑"; }
p {margin: 0; padding: 0;}
.hide { display: none;}
.header { width: 100%; height: 1.12rem; background-color: #2380F5; position: relative;}
.header .search-group { width: 6.7rem; height: 1.16rem; border-radius: .2rem; background-color: #fff; box-shadow:-2px 2px 4px #D8D8D8,2px 2px 4px #D8D8D8; position: absolute; left: .4rem; bottom: -0.58rem;;}
.header .search-group input { width: 80%; height: .42rem; margin-top: .38rem; font-size: .3rem; line-height: .42rem; color: #323232; border: 0; padding: 0; padding-left: .3rem; float: left; outline: none;}
.header .search-group img { width: .5rem; height: .5rem; float: right; margin-top: .38rem; margin-right: .36rem;}
.container { padding: 0; padding-bottom: 1rem;}
.top { width: 100%; line-height: 0;}
.top img { width: 100%; height: auto;}

.news-ad { display: -webkit-flex; display: flex; width: 6.9rem; height: 1rem; background-color: #fff; margin: 0 auto; margin-top: -0.5rem; border-radius:5px; box-shadow:0px 2px 4px 0px rgba(233,233,233,1); position: relative; z-index: 1;}
.news-ad .new  { width: 6.84rem; height: 100%;}
.news-ad .new img { width: .48rem; height: .54rem; float: left; margin: .22rem .2rem;}
.news-ad .new .newname { width: 5.7rem; height: 1rem; overflow: hidden; float: left;}
.swiper-container1  { width: 100%; height: 100%;} 
.swiper-container1 .swiper-slide span { display: block; height: 1rem; font-size: .32rem; line-height: 1rem; color: #4A4A4A;}
.news-ad .morenew { font-size: .24rem; line-height: 1rem; color: #EF6F6C;}

.ad { width: 6.9rem; margin: 0 auto; margin-top: .4rem; font-size: 0;} 
.swiper-container2 .swiper-slide { line-height: 0;}
.swiper-container2 .swiper-slide img { width:  6.9rem; height: auto;} 
.swiper-container2 .swiper-pagination-bullet { width: .08rem; height: .08rem; background: #C6C6C6; opacity: 1;}
.swiper-container2 .swiper-pagination-bullet-active { width: .24rem; height: .08rem; border-radius: .04rem; background-color: #FFFFFF;}

.nav { width: 100%; font-size: 0; margin-top: .2rem;}
.nav .item { display: inline-block; width: 25%; text-align: center; margin-top: .4rem;}
.nav .item p { font-size: .26rem; line-height: 1; color: #323232; margin-top: .2rem;}
.nav .item .icon_index_1 { width: .5rem; height: auto;}
.nav .item .icon_index_2 { width: .5rem; height: auto;}
.nav .item .icon_index_3 { width: .5rem; height: auto;}
.nav .item .icon_index_4 { width: .5rem; height: auto;}
.nav .item .icon_index_5 { width: .5rem; height: auto;} 
.nav .item .icon_index_6 { width: .5rem; height: auto;}
.nav .item .icon_index_7 { width: .5rem; height: auto;}
.nav .item .icon_index_8 { width: .5rem; height: auto;}

.recommend { padding: 0 .3rem; margin-top: .6rem;}
.recommend .re-title { font-size: .3rem; line-height: 1; color: #323232;}
.recommend .re-stitle { font-size: .22rem; line-height: .3rem; color: #999999; margin-top: .2rem;}
.recommend .list { margin-top: .1rem;}
.recommend .list .item { border-bottom: 1px solid #E9E9E9; padding-top: .3rem; padding-bottom: .4rem;}
.recommend .list .item:last-child { border-bottom: 0;}
.recommend .list .item .ctop { height: 0.4rem;top:0.1rem;display: -webkit-flex; display: flex; font-size: .26rem; line-height: 1;}
.recommend .list .item .ctop .left { color: #4A4A4A; width: 3.45rem; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.recommend .list .item .ctop .right { color: #999999; width: 3.45rem; text-align: right; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.recommend .list .item .ccenter { display: -webkit-flex; display: flex;}
.recommend .list .item .ccenter .citem { flex: 1;}
.recommend .list .item .ccenter .citem .num { font-size: .3rem; line-height: 1; color: #EF6F6C; margin-top: .3rem;}
.recommend .list .item .ccenter .citem .desp { font-size: .26rem; line-height: 1; color: #4A4A4A; margin-top: .2rem;}

.recommend .bottom { margin-top: .4rem;}
.recommend .bottom .percent { width: 4.9rem; float: left;}
.recommend .bottom .percent .num { font-size: .22rem; line-height: .3rem; color: #EF6F6C; text-align: right;}
.recommend .bottom .percent .progress-bar { width: 100%; height: .08rem; border-radius: .04rem; background-color: #E9E9E9; position: relative; margin-top: .1rem;}
.recommend .bottom .percent .progress-bar .progress { width: 0; height: .08rem; border-radius: .04rem; background-color: #fc6c68; position: absolute; top: 0; left: 0;}
.recommend .bottom .invest { display: inline-block; font-size: .25rem; line-height: 1; color: #FFFFFF; padding: .2rem; background-color: #EF6F6C; float: right; margin-top: 0.08rem;border-radius:2500px}
.recommend .bottom:after { content:""; clear: both; display: block;}

.signMask { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 3;}
.signMask .mask { width: 100%; height: 100%; background:rgba(74,74,74,0.3); position: absolute; left: 0; top: 0; z-index: 4;}
.signMask .cont { width: 5.7rem; padding-bottom: .6rem; background-color: #fff; border-radius: 5px; margin: 0 auto; margin-top: 2.5rem; position: relative; z-index: 5; text-align: center;}
.signMask .cont .img { width: 100%; height: 3.52rem; background-color: #EF6F6C; text-align: center;}
.signMask .cont .img img { width: 2rem; height: auto; margin-top: .5rem;}
.signMask .cont p { font-size: .32rem; line-height: 1; color: #333333; text-align: center; padding-top: .6rem;}
.signMask .cont p span { color: #EF6F6C;}
.signMask .cont .confirm { display: inline-block; width: 4.65rem; height: .88rem; border-radius: 2500px; background-color: #EF6F6C; font-size: .3rem; line-height: .88rem; color: #fff; text-align: center; margin-top: .6rem;}
