@charset "utf-8";
/**
* kongg@office.feng.com
* 2013.06.06
*/
body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td{ margin:0; padding:0;}
h1, h2, h3, h4, h5, h6{ font-size:100%;}
body{ color:#333; font:14px/1.5 '\5FAE\8F6F\96C5\9ED1',Arial,HELVETICA; min-width:1000px;}
img{ border:0;}
ol, ul{ list-style:none;}
:link, :visited, ins{ text-decoration:none;}
table{ border-collapse:collapse; border-spacing:0;}
sub, sup{ font-size:100%; vertical-align:baseline;}
blockquote, q{ quotes:'\201C' '\201D' '\2018' '\2019';}
blockquote:before, blockquote:after, q:before, q:after{ content:''; content:none;}
input, button, textarea, select, optgroup, option{ font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit;}
button, input, select, textarea{ font-family:inherit; font-size:100%; margin:0;}
button::-moz-focus-inner, input::-moz-focus-inner{ border:0; padding:0;}
textarea{ overflow:auto; resize:vertical; vertical-align:top;}
/*-- clearfix --*/
.clearfix:before, .clearfix:after{ content:'\200b'; display:block; height:0;}
.clearfix:after{ clear:both;}
.clearfix{ *zoom:1;}

.wrap{ margin:0 auto; width:980px;}

/* controller */
.controller{ font-size:0; height:0; position:relative;}
.controller .triggers{ margin-left:-100px; width:200px; position:absolute; left:50%; text-align:center;}
.controller .triggers a{ display:inline-block; border:4px solid #333; border-radius:100%; margin:0 4px; height:0; width:0; overflow:hidden; vertical-align:middle;}
.controller .triggers .current{ border-color:#0BAEB9; border-width:1px; padding:5px;}
.controller .prev, .controller .next{ margin:0 4px; position:absolute; left:0; top:-96px; opacity:0; visibility:hidden; -webkit-transition:all ease .5s; -moz-transition:all ease .5s; -ms-transition:all ease .5s; transition:all ease .5s;}
:hover>.controller .prev, :hover>.controller .next{ margin:0; opacity:1; visibility:visible;}
.controller .next{ left:auto; right:0;}
.controller .prev span, .controller .next span{ display:block; background:url(/Topic/AppRecommend/images/appleyearbook/controller.png) no-repeat; line-height:199px; height:46px; width:24px; overflow:hidden;}
.controller .next:hover span{ background-position:0 -46px;}
.controller .prev span{ background-position:-24px 0;}
.controller .prev:hover span{ background-position:-24px -46px;}
.controller .progress, .controller .progress .bar{ height:2px; width:100%; position:absolute; left:0;}
.controller .progress .bar{ background:#0BAEB9; width:0;}

/* header */
.header_wrap{ display:none;}

/* banner */
.banner{ height:374px;}
.banner .inner{ height:100%; width:100%; position:relative; z-index:1;}
.banner .inner ul, .banner .inner li{ height:100%; width:100%; position:absolute;}
.banner .inner li{ background-repeat:no-repeat; background-position:50% 0;}
.banner .inner li a{ display:block; height:100%;}
.banner .controller{ z-index:3;}
.banner .controller .triggers{ top:-30px;}
.banner .controller .progress{ margin-top:-2px; top:0;}

/* container */
.container_wrap{ background:#F5F5F5; border-top:1px solid #ABABAB; border-bottom:1px solid #E4E4E4; padding-bottom:30px;}
.content .colum{ float:left; border-right:1px solid #D7D7D7; width:50%; position:relative;}
.content .colum_right{ border-left:1px solid #D7D7D7; border-right:0; margin-left:-1px; padding-top:180px;}
.content .year_pipe{ margin-bottom:25px; height:94px; width:100%; position:relative;}
.content .year_pipe.last_year{ margin-bottom:0;}
.content .year_pipe .date{ background:url(/Topic/AppRecommend/images/appleyearbook/date_bg.png) no-repeat; color:#FFF; font:24px/1.2 Arial; margin-left:-86px; height:94px; width:172px; position:absolute; left:100%; top:0; text-align:center; text-transform:uppercase;}
.content .year_pipe.last_year .date{ background-position:-344px 0;}
.content .year_pipe .date.top{ background-position:-172px 0;}
.content .year_pipe .date em{ display:block; font-size:36px; font-weight:bold; font-style:normal;}
.content .year_pipe.last_year .date em{ padding-top:20px;}
.content .item{ background:#FFF; border:1px solid #E4E4E4; border-radius:3px; margin:0 auto 30px 0; width:440px; position:relative;}
.content .colum_right .item{ margin-left:auto; margin-right:0;}
.content .item_even{ margin-left:50px; left:100%;}
.content .item .arrow, .content .item .arrow b{ border-color:transparent #D7D7D7; border-style:dashed solid; border-width:8px 0 8px 8px; font-size:0; margin-left:1px; height:0; width:0; position:absolute; left:100%; top:20px;}
.content .colum_right .item .arrow, .content .item_even .arrow{ border-left-width:0; border-right-width:8px; margin-left:-9px; left:0;}
.content .item .arrow b{ border-color:transparent #FFF; margin:-8px -9px; top:0;}
.content .colum_right .item .arrow b, .content .item_even .arrow b{ border-left-width:0; border-right-width:8px; margin-left:1px;}
.content .item .date{ background:url(/Topic/AppRecommend/images/appleyearbook/date_bg.png) no-repeat 0 -94px; color:#CCC; font-size:12px; margin-left:22px; height:55px; width:54px; position:absolute; left:100%; top:0; text-align:center;}
.content .colum_right .item .date, .content .item_even .date{ margin-left:-78px; left:0;}
.content .item_top .date{ background-position:-55px -94px;}
.content .item .date em{ display:block; color:#FFF; font:18px/1.2 Arial; padding-top:7px;}
.content .item_top .date span{ color:#A8F1F6;}
.content .item .pic, .content .item .pic img{ display:block; border-radius:3px 3px 0 0;}
.content .item .main{ padding:15px 25px 20px; *zoom:1;}
.content .item .tit{ display:inline-block; border-bottom:1px solid #FFF; color:#333; font-size:18px; margin-bottom:10px; text-decoration:none;}
.content .item .tit:hover{ border-bottom-color:#00B2BD; color:#00B2BD; text-decoration:none; vertical-align:top;}
.content .item .desc{ color:#999; margin-bottom:.2em;}
.content .item .more{ border-bottom:1px solid #FFF; color:#00B2BD;}
.content .item .more:hover{ border-bottom-color:#00B2BD;}

/* topic_slider */
.topic_slider{ padding:30px 0;}
.topic_slider .inner{ height:130px; width:100%; overflow:hidden; position:relative;}
.topic_slider .inner ul{ width:600%; position:absolute; left:0; top:0;}
.topic_slider .inner li{ display:inline; float:left; margin-right:28px; width:260px;}
.topic_slider .inner a{ display:block; position:relative;}
.topic_slider .inner img{ vertical-align:top;}
.topic_slider .inner span{ color:#FFF; font-size:14px; padding:5px 0; width:100%; overflow:hidden; position:absolute; left:0; bottom:0; text-overflow:ellipsis; text-indent:10px; filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#40000000,endColorStr=#40000000);}
:root .topic_slider .inner span{ background:rgba(0,0,0,.5); filter:none;}