* {
    box-sizing: border-box
}

html, body {
    height: 100%;
}

body {
    text-align: center;
    background: #000;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 14px;
    color: #000;
    margin: 0;
    padding: 0;
    min-width: 1350px;
    overflow-x: auto;
    overflow-y: hidden;
}

h1, p {
    padding: 0;
    margin: 0
}

#loading-wrapper {
    background: url('/Scripts/kzl/images/loadingBg.jpg');
    background-size: 100% 100%;
    z-index: 2000;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block
}

#shipei-wrapper {
    background: url('/Scripts/kzl/images/loadingBg.jpg');
    background-size: 100% 100%;
    z-index: 2000;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block
}

.wrappercontent {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 307px
}

.wrapper {
    width: 100%;
    margin: 0 auto;
    color: #757575
}

    .wrapper .load-bar {
        width: 100%;
        height: 10px;
        border-radius: 30px;
        background: #c5c3bf;
        position: relative;
        box-shadow: 0 1px 0 rgba(255,255,255,0.8),inset 0 2px 3px rgba(0,0,0,0.2)
    }

        .wrapper .load-bar:hover .load-bar-inner, .wrapper .load-bar:hover #counter {
            animation-play-state: paused;
            -moz-animation-play-state: paused;
            -o-animation-play-state: paused;
            -webkit-animation-play-state: paused
        }

    .wrapper .load-bar-inner {
        height: 80%;
        width: 0;
        border-radius: inherit;
        position: relative;
        background: linear-gradient(#e2e4e8,#9e9fa1);
        background: -moz-linear-gradient(#e2e4e8,#9e9fa1);
        background: -webkit-linear-gradient(#e2e4e8,#9e9fa1);
        background: -o-linear-gradient(#e2e4e8,#9e9fa1);
        box-shadow: inset 0 1px 0 rgba(255,255,255,1),0 1px 5px rgba(0,0,0,0.3),0 4px 5px rgba(0,0,0,0.3)
    }

    .wrapper #counter {
        position: absolute;
        background: #eeeff3;
        background: linear-gradient(#eeeff3,#cbcbd3);
        background: -moz-linear-gradient(#eeeff3,#cbcbd3);
        background: -webkit-linear-gradient(#eeeff3,#cbcbd3);
        background: -o-linear-gradient(#eeeff3,#cbcbd3);
        padding: 5px 10px;
        border-radius: .4em;
        box-shadow: inset 0 1px 0 rgba(255,255,255,1),0 2px 4px 1px rgba(0,0,0,0.2),0 1px 3px 1px rgba(0,0,0,0.1);
        left: -25px;
        top: -50px;
        font-size: 12px;
        font-weight: bold;
        width: 44px
    }

        .wrapper #counter:after {
            content: "";
            position: absolute;
            width: 8px;
            height: 8px;
            background: #cbcbd3;
            transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            left: 50%;
            margin-left: -4px;
            bottom: -4px;
            box-shadow: 3px 3px 4px rgba(0,0,0,0.2),1px 1px 1px 1px rgba(0,0,0,0.1);
            border-radius: 0 0 3px 0
        }

    .wrapper h1 {
        font-size: 28px;
        padding: 20px 0 8px 0
    }

    .wrapper p {
        font-size: 13px
    }

.load-bar-inner {
    height: 99%;
    width: 0;
    border-radius: inherit;
    position: relative;
    background: #c2d7ac;
    background: linear-gradient(#e0f6c8,#98ad84);
    box-shadow: inset 0 1px 0 rgba(255,255,255,1),0 1px 5px rgba(0,0,0,0.3),0 4px 5px rgba(0,0,0,0.3);
    animation: loader 10s linear infinite
}

#info {
    position: absolute;
    top: 0;
    width: 100%;
    color: #fff;
    padding: 5px;
    font-family: Monospace;
    font-size: 13px;
    font-weight: bold;
    text-align: center
}

a {
    color: #fff
}

.skybottom {
    background-color: black;
    filter: alpha(Opacity=80);
    -moz-opacity: .8;
    opacity: .8
}

#zbvideo1 {
    width: auto;
    height: auto;
    background: #000;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}

#container {
    min-width: 1350px;
}

.left {
    width: 113px;
    height: 113px;
    background: url(/Scripts/kzl/images/left.png) no-repeat;
    cursor: pointer;
    left: 0;
    top: 50%;
    margin-top: -50px;
    position: fixed;
    z-index: 1000;
    background-size: auto 100%;
}

    .left:hover {
        background: url("/Scripts/kzl/images/left_a.png")no-repeat;
    }

.right {
    width: 113px;
    height: 113px;
    background: url(images/right.png) no-repeat;
    cursor: pointer;
    right: 0;
    top: 50%;
    margin-top: -50px;
    position: fixed;
    z-index: 1000;
    background-size: auto 100%;
}

    .right:hover {
        background: url("images/right_a.png")no-repeat;
    }

.bottomdiv {
    position: absolute;
    min-width: 1350px;
    width: 100%;
    height: 70px;
    z-index: 33;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    text-align: center;
    opacity:1;transition:all 1s;
}

    .bottomdiv .bottombeve {
        display: inline-block;
        z-index: 34;
        overflow: visible;
        height: 41px;
        background: url('/Scripts/kzl/images/skins.png') no-repeat;
        margin-right: 15px;
        margin-top: 14.5px;
        background-size: 590px 32px;
        vertical-align: top;
        cursor: pointer;
        position:relative;
    }
    /*退出*/
    .bottomdiv .tuichu {
        background: url("/Scripts/kzl/images/tuichu.png")no-repeat;
        width: 61px;
        float: left;
        margin-left:15px;
    }

        .bottomdiv .tuichu:active {
            background: url("images/tuichu_a.png")no-repeat;
        }
        .bottomdiv .bottombeve p{background:rgba(0,0,0,0.1);height:41px;display:none;}
        .bottomdiv .bottombeve b{width:5px;height:5px;background:#fff;position:absolute;left:50%;transform:rotate(45deg) translateX(-50%);
            -ms-transform:rotate(45deg) translateX(-50%); /* Internet Explorer */
            -moz-transform:rotate(45deg) translateX(-50%); /* Firefox */
            -webkit-transform:rotate(45deg) translateX(-50%); /* Safari 和 Chrome */
            -o-transform:rotate(45deg) translateX(-50%); /* Opera */top:-10px;display:none;}
        .bottomdiv .bottombeve span{position:absolute;left:50%;transform:translateX(-50%);padding:3px 5px;border-radius:3px;color:#5f9d00;background:#fff;white-space:nowrap;font-size:12px;top:-30px;display:none;}
        .bottomdiv .bottombeve:hover p{display:block;}
        .bottomdiv .bottombeve:hover b{display:block;}
        .bottomdiv .bottombeve:hover span{display:block;}
    /*封面*/
    .bottomdiv .fm {
        width: 41px;
        background: url("/Scripts/kzl/images/fm.png")no-repeat;
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: -132px;
    }

        .bottomdiv .fm:active {
            background: url("images/fm_a.png")no-repeat;
        }
    /*上一页*/
    .bottomdiv .syy {
        width: 41px;
        background: url("/Scripts/kzl/images/syy.png")no-repeat;
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: -76px;
    }

        .bottomdiv .syy:active {
            background: url("/Scripts/kzl/images/syy_a.png")no-repeat;
        }
    /*下一页*/
    .bottomdiv .xyy {
        width: 41px;
        background: url("/Scripts/kzl/images/xyy.png")no-repeat;
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: 41px;
    }

        .bottomdiv .xyy:active {
            background: url("/Scripts/kzl/images/xyy_a.png")no-repeat;
        }
    /*封底*/
    .bottomdiv .fd {
        width: 41px;
        background: url("/Scripts/kzl/images/fd.png")no-repeat;
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: 97px;
    }

        .bottomdiv .fd:active {
            background: url("/Scripts/kzl/images/fd_a.png")no-repeat;
        }
    /*全屏*/
    .bottomdiv .qp {
        width: 41px;
        background: url("/Scripts/kzl/images/qp.png")no-repeat;
        float: right;
    }

    .bottomdiv .qp:active {
        background: url("/Scripts/kzl/images/qp_a.png")no-repeat;
    }
    .bottomdiv .tcqp {
        width: 41px;
        background: url("/Scripts/kzl/images/tcqp.png")no-repeat;
        float: right;
        display:none;
    }

    .bottomdiv .tcqp:active {
        background: url("/Scripts/kzl/images/tcqp_a.png")no-repeat;
    }
    /*缩略图*/
    .bottomdiv .slt {
        width: 41px;
        background: url("/Scripts/kzl/images/slt.png")no-repeat;
        float: right;
    }

        .bottomdiv .slt:active {
            background: url("/Scripts/kzl/images/slt_a.png")no-repeat;
        }
    /*音乐*/
    .bottomdiv .yinyue {
        width: 41px;
        background: url("/Scripts/kzl/images/yinyue.png")no-repeat;
        float: right;
    }

        .bottomdiv .yinyue:active {
            background: url("/Scripts/kzl/images/yinyue_a.png")no-repeat;
        }

    .bottomdiv .jingyin {
        width: 41px;
        background: url("/Scripts/kzl/images/jingyin.png")no-repeat;
        float: right;
        display: none;
    }

        .bottomdiv .jingyin:active {
            background: url("/Scripts/kzl/images/jingyin_a.png")no-repeat;
        }
    /*缩小*/
    .bottomdiv .suoxiao {
        width: 41px;
        background: url("images/suoxiao.png")no-repeat;
        float: right;
    }

        .bottomdiv .suoxiao:active {
            background: url("/Scripts/kzl/images/suoxiao_a.png")no-repeat;
        }
    /*放大*/
    .bottomdiv .fangda {
        width: 41px;
        background: url("/Scripts/kzl/images/fangda.png")no-repeat;
        float: right;
    }

        .bottomdiv .fangda:active {
            background: url("/Scripts/kzl/images/fangda_a.png")no-repeat;
        }
    /*自动播放*/
    .bottomdiv .zdbf {
        width: 61px;
        background: url("/Scripts/kzl/images/zdbf.png")no-repeat;
        float: right;
    }

        .bottomdiv .zdbf:active {
            background: url("/Scripts/kzl/images/zdbf_a.png")no-repeat;
        }

    .bottomdiv .zanting {
        width: 61px;
        background: url("/Scripts/kzl/images/zanting.png")no-repeat;
        float: right;
        display: none;
    }

        .bottomdiv .zanting:active {
            background: url("/Scripts/kzl/images/zanting_a.png")no-repeat;
        }

    .bottomdiv .zdbfsjBJ {
        width: 118px;
        background: url("/Scripts/kzl/images/zdbfsjBJ.png")no-repeat;
        float: right;
        cursor: default;
        position: relative;
    }

        .bottomdiv .zdbfsjBJ .zdbfsj_jian {
            width: 30px;
            height: 31px;
            background: url("/Scripts/kzl/images/zdbfsj_jian.png")no-repeat;
            position: absolute;
            left: 5px;
            top: 5px;
            z-index: 1;
        }

            .bottomdiv .zdbfsjBJ .zdbfsj_jian:hover {
                background: url("/Scripts/kzl/images/zdbfsj_jian_a.png")no-repeat;
            }

        .bottomdiv .zdbfsjBJ input {
            width: 50px;
            height: 41px;
            line-height: 41px;
            text-align: center;
            color: #083857;
            font-size: 14px;
            position: absolute;
            left: 34px;
            top: 0;
            border: none;
            background: none;
            outline: none;
            z-index: 2;
        }

        .bottomdiv .zdbfsjBJ .zdbfsj_jia {
            width: 30px;
            height: 31px;
            background: url("/Scripts/kzl/images/zdbfsj_jia.png")no-repeat;
            position: absolute;
            right: 4px;
            top: 5px;
            z-index: 1;
        }

            .bottomdiv .zdbfsjBJ .zdbfsj_jia:hover {
                background: url("/Scripts/kzl/images/zdbfsj_jia_a.png")no-repeat;
            }


    .bottomdiv .bottombetween {
        display: inline-block;
        z-index: 34;
        overflow: visible;
        height: 70px;
        line-height: 70px;
        width: 60px;
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: -30px;
    }

.bottombetween div {
    color: white;
    position: absolute;
    font-size: 1.5em;
    width: 60px
}
/*复位*/
.fuwei {
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 33;
    display: none;
}

    .fuwei img {
        display: block;
        width: 62px;
        height: 71px;
        cursor: pointer;
    }
/*提示图片*/
.tstp {
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 35;
    width: 186px;
    height: 76px;
    background: url("/Scripts/kzl/images/tstp.png")no-repeat;
}

    .tstp span {
        display: block;
        width: 28px;
        height: 28px;
        float: right;
        cursor: pointer;
        margin-right:6px;
    }
/*缩略图弹出*/
.slttc {
    position: fixed;
    left: 0;
    bottom: 70px;
    width: 100%;
    height: 142px;
    background: rgba(0,0,0,0.6);
    z-index: 100;
    display: none;
}

.slttcM {
    width: 100%;
    height: 100%;
    position: relative;
}

.slttc_gban {
    position: absolute;
    right: 5px;
    top: 5px;
    display: block;
    width: 36px;
    height: 36px;
    background: url("/Scripts/kzl/images/gban.png")no-repeat;
    cursor: pointer;
}

    .slttc_gban:hover {
        background: url("/Scripts/kzl/images/gban_a.png")no-repeat;
    }

.slttc_left {
    margin: 10px 22px 22px 80px;
    width: 48px;
    height: 110px;
    display: block;
    float: left;
    background: url("/Scripts/kzl/images/slt_left.png")no-repeat;
    cursor: pointer;
}

    .slttc_left:hover {
        background: url("/Scripts/kzl/images/slt_left_a.png")no-repeat;
    }

.slttc_M {
    float: left;
    margin: 10px auto 12px;
    height: 120px;
}

    .slttc_M .swiper-container {
        width: 100%;
        height: 100%;
    }

    .slttc_M .swiper-slide {
        width: 160px;
        height: 120px;
        border: 1px solid #b4b79c;
        position: relative;
        float: left;
        margin-right: 20px;
    }

        .slttc_M .swiper-slide img {
            display: block;
            max-width: 142px;
            height: 100px;
            position: absolute;
            left: 50%;
            top: 4px;
            transform: translateX(-50%);
        }

        .slttc_M .swiper-slide p {
            width: 100%;
            text-align: center;
            height: 14px;
            line-height: 14px;
            font-size: 12px;
            color: #fff;
            position: absolute;
            left: 0;
            bottom: 0;
        }

    .slttc_M .slttc_MM {
        background: rgba(255,255,255,0.2);
    }

/*弹出层*/
.tanchu {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background: rgba(0,0,0,0.8);
    display: none;
}

.tanchuGB {
    position: absolute;
    right: 15px;
    top: 15px;
    display: block;
    width: 60px;
    height: 60px;
    background: url("/Scripts/kzl/images/gban.png")no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

    .tanchuGB:hover {
        background: url("/Scripts/kzl/images/gban_a.png")no-repeat;
        background-size: 100% 100%;
    }


.tanchu_left {
    width: 113px;
    height: 113px;
    background: url(/Scripts/kzl/images/left.png) no-repeat;
    left: 0;
    top: 50%;
    margin-top: -50px;
    position: fixed;
    z-index: 1000;
    background-size: auto 100%;
}

    .tanchu_left:hover {
        background: url("/Scripts/kzl/images/left_a.png")no-repeat;
    }

.tanchu_right {
    width: 113px;
    height: 113px;
    background: url(/Scripts/kzl/images/right.png) no-repeat;
    right: 0;
    top: 50%;
    margin-top: -50px;
    position: fixed;
    z-index: 1000;
    background-size: auto 100%;
}

    .tanchu_right:hover {
        background: url("/Scripts/kzl/images/right_a.png")no-repeat;
    }

.tanchu_fangda {
    width: 82px;
    height: 81px;
    background: url(/Scripts/kzl/images/tcfangda.png)no-repeat;
    position: fixed;
    left: 50%;
    top: 85%;
    margin-left: -100px;
    z-index: 1000;
    background-size: auto 100%;
    opacity:0;transition:all 1s;
}

    .tanchu_fangda:active {
        background: url("/Scripts/kzl/images/tcfangda_a.png")no-repeat;
    }

.tanchu_suoxiao {
    width: 82px;
    height: 81px;
    background: url(/Scripts/kzl/images/tcsuoxiao.png)no-repeat;
    position: fixed;
    left: 50%;
    top: 85%;
    margin-left: 18px;
    z-index: 1000;
    background-size: auto 100%;
    opacity:0;transition:all 1s;
}

    .tanchu_suoxiao:active   {
        background: url("/Scripts/kzl/images/tcsuoxiao_a.png")no-repeat;
    }

/*弹出图片区域*/
.tanchu_M {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

    .tanchu_M img {
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }




.slttc_right {
    margin: 10px 80px 22px 22px;
    width: 48px;
    height: 110px;
    display: block;
    float: right;
    background: url("/Scripts/kzl/images/slt_right.png")no-repeat;
    cursor: pointer;
}

    .slttc_right:hover {
        background: url("/Scripts/kzl/images/slt_right_a.png")no-repeat;
    }

.closebutton {
    width: 59px;
    height: 57px;
    background: url(/Scripts/kzl/images/skins.png) no-repeat;
    background-size: 671px 44px;
    background-position: -201px 0;
    z-index: 1900;
    right: 1px;
    margin: 8px;
    margin-top: 12px;
    position: absolute
}

.jieshuobutton {
    width: 37px;
    height: 50px;
    background: url(/Scripts/kzl/images/skins.png) no-repeat;
    background-size: 767px 50px;
    z-index: 1900;
    right: 1px;
    margin: 11px;
    position: absolute;
    bottom: 3px
}

.videobutton {
    width: 54px;
    height: 41px;
    background: url(/Scripts/kzl/images/skins.png) no-repeat;
    background-size: 629px 41px;
    z-index: 1900;
    margin: 8px;
    position: absolute;
    background-position: -133px 0;
    bottom: 3px;
    right: 1px
}

#wrapperLoading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 307px
}
/*音频样式*/
.zbyp{width:385px;height:72px;position:absolute;bottom:72px;left:50%;margin-left:-192.5px;z-index:35;background:rgba(0,0,0,0.8);border-radius:20px;opacity:0;transition:all 1s;display:none;}

.ypbf{width:55px;height:55px;background:url(/Scripts/kzl/images/yinyue_y.png)no-repeat;margin:8.5px;float:left;}
.ypzt{width:55px;height:55px;background:url(/Scripts/kzl/images/yinyue_w.png)no-repeat;margin:8.5px;float:left;display:none;}
.ypM{width:285px;float:left;margin-left:3px;padding-top:32px;text-align:center;color:#ccc;font-size:12px;}
.ypjdt{width:100%;height:6px;border:1px solid #ccc;background:#030;}
.ypM span{line-height:32px;margin:0 5px;}
.ypjdtM{width:0;height:4px;background:#ccc;}