/*侧边*/
#common-silder {
    position: fixed;
    width: 40px;
    background: #333;
    right: 0;
    height: 100%;
    top: 0;
    z-index: 99999;
    min-height: 600px;
    /*颤抖吧 小宇宙 最高级的z-index*/
}

#common-silder .topimg-show {
    height: 146px;
    position: relative;
}

#common-silder .topimg-show a > img {
    height: 146px;
}

#common-silder .topimg-show:hover div {
    display: block;
}

#common-silder .topimg-show div {
    position: absolute;
    width: 190px;
    height: 235px;
    left: -190px;
    top: 0;
    display: none;
}

#common-silder .topimg-show div img {
    width: 100%;
    height: 100%;
}

.common-silder-tools li {
    height: 47px;
    margin: 8px 0;
    cursor: pointer;
    background: url(http://img1.40017.cn/cn/c/c/2015/common-silder.0.0.1.png);
    position: relative;
}

.common-silder-tools li.c-q a {
    cursor: default;
}

.common-silder-tools li a {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.common-silder-tools li span {
    position: absolute;
    height: 47px;
    left: -120px;
    text-align: center;
    background: #636363;
    font-size: 14px;
    color: #fff;
    padding: 0 15px;
    line-height: 47px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.common-silder-tools .c-q span {
    visibility: hidden;
    background: #636363;
    opacity: 0;
    height: auto;
    padding: 20px 16px 10px 23px;
    left: -184px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.common-silder-tools .c-q:hover span {
    left: -150px;
    opacity: 1;
    visibility: visible;
}

.common-silder-tools .c-q span i {
    top: 25px;
}

.common-silder-tools .c-q span p {
    line-height: 14px;
    text-align: center;
    margin-top: 10px;
}

.common-silder-tools li span img {
    width: 104px;
    height: 104px;
    display: block;
}

.common-silder-tools li:hover span {
    left: -86px;
    opacity: 1;
    visibility: visible;
}

.common-silder-tools li span i {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-left: 5px solid #636363;
    border-bottom: 5px solid transparent;
    top: 50%;
    right: -5px;
    margin-top: -5px;
}

.common-silder-tools li:hover {
    background-color: #ff6600;
}

.common-cstb {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
}

.common-silder-tools .c-q {
    background-position: -120px -94px;
}

.common-silder-tools .c-q:hover {
    background-position: -40px -141px;
}

.common-silder-tools .c-p {
    background-position: -120px -47px;
}

.common-silder-tools .c-p:hover {
    background-position: -40px -94px;
}

.common-silder-tools .c-logind {
    background-position: 0 0;
}

.common-silder-tools .c-logind:hover {
    background-position: 0 0;
}

.common-silder-tools .c-d:hover {
    background-position: -40px -47px;
}

.common-silder-tools .c-d {
    background-position: -120px 0;
}

.common-silder-tools .c-f {
    background-position: -80px -141px;
}

.common-silder-tools .c-f:hover {
    background-position: -40px 0;
}

.common-silder-tools .c-s {
    background-position: -80px -94px;
}

.common-silder-tools .c-s:hover {
    background-position: -0 -141px;
}

.common-silder-tools .c-k {
    background-position: -80px -47px;
}

.common-silder-tools .c-k:hover {
    background-position: -0px -94px;
}

.common-silder-tools .c-t {
    margin-bottom: 0;
    background-position: -80px 0;
}

.common-silder-tools .c-t:hover {
    background-position: 0 -46px;
}

#content #GuessLike {
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}

#GuessLike h3 {
    background: url(http://img1.40017.cn/cn/c/home/2015/gusyoulike.png?v=12) no-repeat 0 -48px;
    height: 42px;
}

/*.guess-con {
    padding-bottom: 10px;
}*/

.guess-con > a {
    position: absolute;
    width: 26px;
    height: 56px;
    background: url(http://img1.40017.cn/cn/c/home/2015/gusyoulike.png?v=12) no-repeat -34px 0;
    z-index: 7;
    top: 50%;
    margin-top: -27px;
    right: 0;
    display: none;
}

.guess-con > a:hover {
    background-position: -102px 0;
}

.guess-con > a:first-child {
    background-position: 0 0;
    left: 0;
    right: inherit;
}

.guess-con > a:first-child:hover {
    background-position: -68px 0;
}

#GuessLike:hover .guess-con > a {
    display: block;
}

.guess-con ul li {
    width: 182px;
    height: 210px;
    float: left;
    padding-right: 19px;
    position: relative;
}

.guess-con ul li div {
    position: relative;
    padding: 5px 10px 10px 10px;
}

.guess-con ul li div em {
    float: right;
    color: #666;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guess-con ul li div span:first-child {
    font-size: 14px;
    display: block;
    overflow: hidden;
    height: 43px;
    line-height: 18px;
}

.guess-con ul li div p {
    color: #f63;
    font-size: 20px;
}

.guess-con ul li div p i {
    font-size: 16px;
}

.guess-con ul li div p em {
    float: none;
    font-size: 12px;
    color: #999;
}

.guess-con ul li div:first-child {
    padding: 0;
}

.guess-con ul li div:first-child span, .guess-con ul li div:first-child i, .guess-con ul li div:first-child span em {
    position: absolute;
    top: 0;
    color: #fff;
    float: none;
}

.guess-con ul li div:first-child i {
    position: absolute;
    right: 10px;
    top: -1px;
    display: block;
    width: 40px;
    height: 23px;
    background: url(http://img1.40017.cn/cn/c/home/2015/home.0.0.1.png?v=2) no-repeat 0 -725px;
    text-align: center;
    color: #fff;
}

.guess-con ul li div:first-child span {
    color: #fff;
    padding: 0 4px 0 8px;
    background: #158bc8;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50158BC8, endColorstr=#50158BC8);
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    background: rgba(21, 139, 200, 0.9);
}

.guess-con ul li div:first-child span em {
    width: 0;
    height: 0;
    border-top: 20px solid #158bc8;
    border-right: 10px solid transparent;
    display: block;
    right: -10px;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    border-top-color: rgba(21, 139, 200, 0.9);
}

.guess-con ul li a {
    display: block;
    height: 198px;
    background: #f5f5f5;
}

.guess-con ul li a:hover {
    box-shadow: 0 4px 12px #ddd;

}

.guess-con img {
    width: 182px;
    height: 122px;
    display: block;
}

.mSlider_con ul li {
    float: left;
}

.appxb-header {
    position: fixed;
    bottom: 0;
    left: -131px;
    cursor: pointer;
}

.appxb {
    position: fixed;
    bottom: 0;
    width: 100%;
    left: 0;
    z-index: 999999;
}

.appxb-con {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.appxb-con > div {
    /*height: 189px;*/
    /*background: url(http://img1.40017.cn/cn/c/home/2015/bbpic.0.0.5.png?v=201596164051) no-repeat bottom center;*/
    z-index: 10;
    width: 990px;
    margin: 0 auto;
    position: relative;
}

.appxb-con .app-warp {
    width: 100%;
    position: absolute;
    left: 0;
    z-index: -2;
    height: 160px;
    bottom: 0;
    background: #000f17;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50000f17, endColorstr=#50000f17);
    filter: alpha(Opacity=85);
    background: rgba(0, 15, 23, 0.85);
}

.warp-close {
    background: url(http://img1.40017.cn/cn/c/home/2015/bbpiclose.0.0.1.png) no-repeat center center;
    position: absolute;
    top: 27px;
    right: 0;
    width: 60px;
    height: 60px;
    z-index: 9;
    transition: 0.5s;
}

.warp-close:hover {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg); /* IE 9 */
    -moz-transform: rotate(180deg); /* Firefox */
    -webkit-transform: rotate(180deg); /* Safari 和 Chrome */
    -o-transform: rotate(180deg); /* Opera */
}

.opred {
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
    /*width: 100%;*/
    /*height: 100%;*/
}

.opred i {
    width: 97px;
    height: 54px;
    position: absolute;
    background: url(http://img1.40017.cn/cn/c/home/2015/btngo.png) no-repeat;
    right: 260px;
    top: 95px;
    animation: goanime 0.65s linear infinite alternate;
    -moz-animation: goanime 0.65s linear infinite alternate;
    -webkit-animation: goanime 0.65s linear infinite alternate;
    -o-animation: goanime 0.65s linear infinite alternate;
}

.opred img {
    display: block;
}

@keyframes goanime {
    from {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
        -o-transform: scale(1);
    }
    to {
        -webkit-transform: scale(.9);
        -moz-transform: scale(.9);
        transform: scale(.9);
        -o-transform: scale(.9);
    }
}

@-moz-keyframes goanime {
    from {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
        -o-transform: scale(1);
    }
    to {
        -webkit-transform: scale(.9);
        -moz-transform: scale(.9);
        transform: scale(.9);
        -o-transform: scale(.9);
    }
}

@-webkit-keyframes goanime {
    from {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
        -o-transform: scale(1);
    }
    to {
        -webkit-transform: scale(.9);
        -moz-transform: scale(.9);
        transform: scale(.9);
        -o-transform: scale(.9);
    }
}

@-o-keyframes goanime {
    from {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
        -o-transform: scale(1);
    }
    to {
        -webkit-transform: scale(.9);
        -moz-transform: scale(.9);
        transform: scale(.9);
        -o-transform: scale(.9);
    }
}

