body { font-size:12px; background:#f3f3f3; }
nav { background:#fff; }
nav li { float:left; width:25%; }
nav a { display:block; height:116px; }
nav .cate-img { padding:30px 0 10px; }
nav img { display:block; width:35px; height:37px; margin:0 auto; }
nav .cate-title { color:#555; text-align:center; padding:0 4px; }
.sh-item { background:#fff; margin-top:10px; }
.sh-item:nth-child(2) {
margin-top:0;
}
.sh-header { height:51px; line-height:50px; border-bottom:1px solid #f3f3f3; padding:0 16px; }
.sh-title { float:left; position:relative; font-size:16px; font-weight:bold; color:#000; padding-right:16px; }
.sh-title:after { position:absolute; top:20px; right:0; content:''; border:4px solid transparent; border-left-color:#555; }
.sh-content>ul { display:-webkit-box; display:-webkit-flex; display:flex; }
.sh-content li { -webkit-box-flex:1; -webkit-flex:1; flex:1; }
.sh-content li>a { display:block; height:96px; }
.life-main, .life-rec { margin-top:16px; background:#fff; }
.life-header { height:55px; line-height:54px; font-size:16px; padding-left:16px; border-bottom:1px solid #f3f3f3; position:relative; }
.life-list a { display:block; position:relative; height:70px; padding:0 66px 0 16px; }
.life-list ul { font-size:0; }
.life-list li { display:inline-block; width:50%; vertical-align:top; border-right:1px solid #f3f3f3; border-bottom:1px solid #f3f3f3; }
.life-list li:nth-child(2n) {
border-right:none;
border-bottom:1px solid #f3f3f3;
}
.life-list .cate-title { font-size:14px; color:#000; padding-top:14px; }
.life-list .cate-desc { font-size:12px; color:#aaa; padding-top:6px; }
.life-list .cate-img { position:absolute; top:0; right:0; width:66px; height:70px; }
.life-list img { display:block; width:44px; height:44px; margin:13px 0 0 10px; }
.life-list .cate-title, .life-list .cate-desc { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.life-list li:nth-child(2n-1):nth-last-child(2), .life-list li:nth-last-child(1) {
border-bottom:none;
}
.hqsy3line li { width:33.33%; }
.hqsy3line li:nth-child(2n) {
border-right:1px solid #f3f3f3;;
border-bottom:1px solid #f3f3f3;
}
.hqsy3line li:last-child { border-right:none; border-bottom:1px solid #f3f3f3; }
.hqsy3line li a { display:block; position:relative; height:120px; text-align:center; padding:0 }
.hqsy3line .cate-img { position:absolute; top:60px; bottom:0; left:0; width:100%; }
.hqsy3line img { display:block; width:50px; height:50px; margin:0 auto; }
.four-line img { width:20px; height:20px; }
.three-line li>a { height:118px; border-right:1px solid #f3f3f3; }
.three-line li:last-child>a { border-right:0; }
.three-line .cate-name { font-size:14px; color:#000; padding-top:18px; }
.three-line .cate-img { padding-top:12px; }
.three-line img { width:46px; height:46px; }
.other-sh .sh-header, .sh-rec { position:relative; font-size:16px; font-weight:bold; color:#000; }
.sh-header .post-btn, .life-header .post-btn { position:absolute; top:0; right:16px; font-size:12px; color:#aaa; padding-left:20px; background:url(../img/post_icon.png) no-repeat left center; }
.sh-main { position:relative; }
.sh-main a { float:left; width:25%; height:46px; line-height:46px; font-size:14px; color:#555; text-align:center; }
.sh-main .sh-type { color:#ff7100; }
.sh-main>div { padding-right:46px; }
.sh-main>.more-btn { position:absolute; top:0; right:0; width:46px; height:46px; }
.sh-main>a:after { position:absolute; top:50%; left:50%; content:''; border:4px solid transparent; border-top-color:#ff7100; margin:-2px 0 0 -4px; }
.sh-main>.active:after { border-top-color:transparent; border-bottom-color:#ff7100; margin:-6px 0 0 -4px; }
.sh-more { display:none; background:#f6f6f6; }
.life-rec { margin-top:16px; background:#fff; }
.life-header { height:55px; line-height:54px; font-size:16px; padding-left:16px; border-bottom:1px solid #f3f3f3; }
.rec-list li { border-bottom:1px solid #f3f3f3; }
.rec-list li:last-child { border-bottom:none; }
.rec-list a { position:relative; display:block; height:80px; padding:0 16px; }
.rec-list .rec-title { font-size:14px; color:#000; padding-top:10px; }
.rec-list .rec-title>div { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden; }
.rec-list .other-info { position:absolute; left:0; bottom:10px; width:100%; color:#aaa; padding:0 16px; }
.rec-list .service-name { float:left; }
.rec-list .post-time { float:right; }