@import url(layout.css); 
.wrapper{ padding-top:0px;}

.star_pic{ position:relative; width:100%; font-size:0;}
.star_pic img{ width:100%; height:auto;}
.star_pic .layer_info{ position:absolute; left:0; bottom:0; height:100%; width:100%; background: -webkit-gradient(linear, 0% 0%, 0% 100%,from(rgba(0,0,0,0)), to(rgba(0,0,0,0.8))); color:#fff;}
.star_pic .layer_info small{ position:absolute; top:10px; background-size:30px; background-repeat:no-repeat; width:30px; height:30px;}
.star_pic .layer_info .icon_menu{ background-image:url(../images/fans/icon_menu.png); left:10px;}
.star_pic .layer_info .icon_change{ background-image:url(../images/fans/change_star.png); right:10px;}
.star_pic .layer_info strong{ color:#fff; font-size:30px; font-weight:400; display:block; text-align:center; width:100%; position:absolute; top:50%; margin-top:-72px;}
.star_pic .layer_info i{ background:rgba(0,0,0,0.1); background-repeat:no-repeat; background-size:13px; height:20px; border-radius:20px; border:1px solid #fff; line-height:20px; color:#fff; display:inline-block; margin:0 auto; top:45%; position:absolute; font-size:14px;}
.star_pic .layer_info i.qiandao1{ background-image:url(../images/fans/icon_qiandao1.png); background-position: 10px 2px; padding-left:30px; width:40px; left:50%; margin-left:-35px;}
.star_pic .layer_info i.qiandao2{ background-image:url(../images/fans/icon_qiandao2.png); background-position: 6px 3px; padding-left:20px; width:50px; left:50%; margin-left:-35px;}
.star_pic .layer_info p{ height:40px; line-height:20px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size:11px; position:absolute; bottom:30px; margin:0 25px;}
.star_pic .layer_info em{ background:url(../images/fans/fans_downarrow.png) no-repeat 0 0; width:18px; height:8px; display:block; left:50%; margin-left:-9px; background-size:18px 8px; margin-top:10px; position:absolute; bottom:10px;}

/*切换明星*/
.change_star{ background:rgba(0,0,0,0.95); position:absolute; top:0; width:100%; height:140px; max-width:640px; overflow:hidden; display:none;}
.change_star span{ display:block; color:#fff; text-align:center; margin:10px 0; font-size:16px;}
.change_star ul{ width:9999px; height:66px; margin:20px 8px 0;}
.change_star ul li{ float:left; width:66px; height:66px; border-radius:66px; overflow:hidden; position:relative; margin:0 8px;}
.change_star ul li.cur{ border:2px solid #ffa4ba; width:62px; height:62px;}
.change_star ul li img{ width:66px; height:66px;}
.change_star ul li i{ background: -webkit-gradient(linear, 0% 0%, 0% 100%,from(rgba(0,0,0,0)), to(rgba(0,0,0,0.8))); color:#fff; position:absolute; height:20px; line-height:20px; bottom:0; left:0; width:100%; text-align:center; font-size:11px;}
.change_star small{ position:absolute; right:15px; top:15px; background:url(../images/close.png) no-repeat 0 0; background-size:15px 15px; width:15px; height:15px;}

/*排名*/
.paiming{ padding:10px; border-bottom:1px solid #eee; height:34px;}
.paiming a{ float:right; height:24px; border-radius:24px; border:1px solid #ffb400; color:#ffb400;  line-height:24px; padding:0 10px; font-size:12px; margin-top:3px;}
.paiming em{ background:url(../images/fans/icon_paiming.png) no-repeat 0 0; background-size:29px; width:29px; height:29px; display:inline-block; float:left; margin:4px 10px 0 0;}
.paiming p{ color:#ffb400;}
.paiming p span{ font-size:11px; color:#999; display:block;}

/*粉圈导航*/
.nav{ height:70px; margin:15px 8px 0;}
.nav li{ float:left; text-align:center; width:25%;}
.nav li em{ display:block; width:40px; height:40px; background:url(../images/fans/nav_icon.png) no-repeat 0 0; display:block; background-size:160px 40px; margin:0 auto 5px;}
.nav li a{ color:#555555; font-size:11px;}
.nav li.icon_information em{ background-position:0 0;}
.nav li.icon_stroke em{ background-position:-40px 0;}
.nav li.icon_album em{ background-position:-80px 0;}
.nav li.icon_video em{ background-position:-120px 0;}

h2{ color:#ff7b9a; font-size:15px; padding-left:20px; font-weight:normal; background-size:16px; background-repeat:no-repeat; background-position:0 5px; height:26px; line-height:26px;}
h2 a{ float:right; height:24px; border-radius:24px; border:1px solid #ff7a9a; color:#ff7a9a;  line-height:24px; padding:0 10px; font-size:12px;}
h2 a:active , h2 a:hover , h2 a:link , h2 a:visited{ color:#ff7a9a;}
.relation h2{ background-image:url(../images/fans/icon_relation.png); position:absolute; top:5px; left:10px;}
.stroke h2{ background-image:url(../images/fans/icon_stroke.png);}
.news h2{ background-image:url(../images/fans/icon_news.png);}
.fans_zone h2{ background-image:url(../images/fans/icon_fanszone.png);}

/*关系图谱*/
.relation{ position:relative;}
.relation img{ width:100%; height:auto;}
.relation span{ position:absolute; width:1.963rem; height:1.963rem; border-radius:1.963rem; overflow:hidden; top:50%; left:50%; margin:-0.75rem 0 0 -1.05rem; border:3px solid #fcc6d3;}
.relation em{ position:absolute; width:1.37rem; height:1.37rem; border-radius:1.37rem; overflow:hidden; top:1.231rem; left:2.019rem;}
.relation em i{ position:absolute; width:100%; height:14px; line-height:14px; display:block; background:rgba(220,45,103,0.5); color:#fff; text-align:center; bottom:5px; left:0; font-size:10px;}
.relation span img , .relation em img{ width:100%; height:auto;}

/*行程*/
.stroke{ margin:10px 10px 0;}
.stroke p{ line-height:16px; margin:10px 0;}
.stroke span{ display:block; height:14px;}
.stroke span em{margin-right:20px;color:#999;background-repeat:no-repeat;background-size:12px;font-size:12px;padding-left:15px;height:12px;line-height:12px;background-position: 0 2px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.stroke span em.date{ background-image:url(../images/fans/icon_date.png);}
.stroke span em.place{ background-image:url(../images/fans/icon_place.png);}
.stroke span em.item{background-image:url(../images/fans/icon_item.png);}

/*新闻*/
.news{ margin:10px 0.278rem 0;}

/*粉丝圈*/
.fans_zone{ margin:10px 0.278rem 0;}
ul.comlist li{ border-bottom:1px solid #f5f5f5; margin:10px 0 0; padding-bottom:10px;}
ul.comlist li:last-child{ padding:0; border:0;}
ul.comlist li .com_user{ height:30px; position:relative; }
ul.comlist li .com_user .com_cz{ position:absolute; right:0; top:5px;}
.com_user .com_cz em{ float:left; line-height:22px; height:22px; font-size:12px; float:left; background-size:20px; background-repeat:no-repeat; background-position:right 0; display:inline-block; padding-right:22px; color:#999; margin-left:10px;}
.com_user .com_cz em.zan1{ background-image:url(../images/zan_icon1.png);}
.com_user .com_cz em.zan2{ color:#ff7b9a; background-image:url(../images/zan_icon2.png);}
ul.comlist li .com_user img{ width:28px; height:28px; border-radius:28px; float:left; margin-right:10px; border:1px solid #ddd;}
ul.comlist li .com_user strong{ font-weight:normal; display:block;}
ul.comlist li .com_user span{ font-size:11px; color:#999; display:block;}
ul.comlist li p{ margin:10px 0 0; line-height:22px;}
ul.comlist li p.img{ height:3.019rem; overflow:hidden;}
ul.comlist li.img3 p.img img , ul.comlist li.img1 p.img img{ width:3.019rem; height:3.019rem;}
ul.comlist li.img3 p.img img:nth-child(2){ margin:0 0.194rem;}
/*投票*/
ul.comlist li .com_user .com_num{ position:absolute; right:0; top:0; background:#ffb400; border-radius:3px; color:#fff; font-size:10px; padding:2px 10px;}
ul.comlist li .com_user .com_num em{ display:block; text-align:center; font-size:14px;}
ul.comlist li .vote{ margin-top:10px; display:block;}
/*投票前*/
ul.comlist li.vote1 .vote em{ display:inline-block; width:49%; background:#ff7a9a; height:30px; line-height:30px; border-radius:30px; color:#fff; text-align:center;}
ul.comlist li.vote1 .vote em:first-child{ margin-right:1%;}
ul.comlist li.vote1 .vote em:last-child{ margin-left:1%;}
/*投票后*/
ul.comlist li.vote2 .vote i{ color:#ffbb19;}
ul.comlist li.vote2 .vote em{ background:#ffbb19; height:10px; border-radius:10px; display:inline-block; margin:0 5px;}
ul.comlist li.vote2 .vote small{ color:#999;}

/*详情介绍*/
.content_layer{ background:rgba(0,0,0,0.95); position:fixed; width:100%; height:100%; z-index:999; left:0; box-sizing:border-box; text-align:center; color:#bbb; overflow-y:scroll;}
.content_layer h1{ display:inline-block; padding:0 20px; height:15px; border-bottom:1px solid #fff; margin:30px auto 0; font-weight:normal; color:#fff; margin-bottom:30px;}
.content_layer h1 strong{ background:#000; padding:0 10px; height:30px; font-size:30px; line-height:30px; font-weight:normal;}
.content_layer p{ text-align:left; line-height:35px; margin:0 8%;}
.content_layer p span{ line-height:25px; display:block;}
.content_layer .works{ overflow:hidden; margin-left:8%;}
.content_layer .works ul{ width:9999px;height: 140px;}
.content_layer .works ul li{ float:left; width:78px; margin-right:10px;box-sizing:border-box;}
.content_layer .works ul li img{ width:78px; height:110px; margin-bottom:5px;}
.content_layer .works ul li span{ display:block; text-align:center; height:20px; line-height:20px;overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.content_layer em{ width:18px; height:8px; display:block; background:url(../images/fans/fans_uparrow.png) no-repeat 0 0; background-size:18px 8px; margin:20px auto;}

/*发布*/
.fabu{ background:url(../images/fans/icon_fabu.png) no-repeat 0 0; background-size:60px; width:60px; height:60px; position:fixed; z-index:555; bottom:70px; right:10px; display:block;}