.block4 {
    width: 100%;
    height: 730px;
    overflow: hidden;
}
.race_nav {
    margin: 0 auto;
    position: relative;
    z-index: 9;
    display: flex;
    padding-left: 25px;
}
.race_nav li {
    position: relative;
}
.race_nav li img {
    height: 170px;
}
.race_nav li .new {
    position: absolute;
    left: 0;
    width: 37px;
    height: 37px;
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/new_fff9eaa.png) no-repeat center top
}
.race_nav li>a {
    display: block;
    width: 100%;
    height: 100%;
    color: #1e3876;
    font-size: 24px;
    line-height: 75px;
    filter: saturate(0.5);
    opacity: 0.7;
}
.race_nav li>a:hover, .race_nav li>a.active {opacity: 1;filter: saturate(1);}

.race_nav2 li>a {
    display: block;
    width: 100%;
    height: 100%;
    color: #1e3876;
    font-size: 24px;
    line-height: 75px;
    filter: saturate(0.5);
    opacity: 0.7;
}
.race_nav2 li>a:hover, .race_nav li>a.active {opacity: 1;filter: saturate(1);}


.race_nav li>a:hover .drop a, .race_nav li>a.active .drop a {
    border-bottom: 0
}
.race_nav .drop {
    width: 96px;
    height: 45px;
    position: relative;
    left: -10px
}
.race_nav .drop li {
    width: 47px;
    height: 45px;
    float: left;
    margin-right: 0
}
.race_nav .drop a {
    width: 47px;
    height: 45px
}
.race_nav .drop a:hover {
    border-bottom: 0
}
.race_nav .drop .dk1 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat 0 0
}
.race_nav .drop .dk1:hover, .race_nav .drop .dk1.active {
    background-position: 0 -55px
}
.race_nav .drop .dk2 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat -47px 0
}
.race_nav .drop .dk2:hover, .race_nav .drop .dk2.active {
    background-position: -47px -55px
}
.race_nav .drop .js1 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat -111px 0
}
.race_nav .drop .js1:hover, .race_nav .drop .js1.active {
    background-position: -111px -55px
}
.race_nav .drop .js2 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat -158px 0
}
.race_nav .drop .js2:hover, .race_nav .drop .js2.active {
    background-position: -158px -55px
}
.race_nav .drop .fs1 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat -222px 0
}
.race_nav .drop .fs1:hover, .race_nav .drop .fs1.active {
    background-position: -222px -55px
}
.race_nav .drop .fs2 {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/s_switch_4e966e4.png) no-repeat -268px 0
}
.race_nav .drop .fs2:hover, .race_nav .drop .fs2.active {
    background-position: -269px -55px
}
.race_nav ul {
    display: none
}
.race_block.cur .name {
    opacity: 1;
    transform: translate(0px);
    -webkit-transform: translate(0px);
    transition: transform .25s ease-in-out, opacity .2s ease-in-out;
    -webkit-transition: -webkit-transform .25s ease-in-out, opacity .2s ease-in-out
}
.race_block.cur .dingwei {
    opacity: 1;
    -webkit-transform: translate(0px);
    transform: translate(0px);
    transition: transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out;
    -webkit-transition: -webkit-transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out
}
.race_block.cur .detail_btn {
    -webkit-transform: translate(0px);
    transform: translate(0px);
    opacity: 1;
    transition: transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out;
    -webkit-transition: transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out
}
.race_block.cur .leida {
    opacity: 1;
    transition: opacity .2s .6s ease-in-out;
    -webkit-transition: opacity .2s .6s ease-in-out
}
.race_block.cur .person {
    -webkit-transform: translate(0px);
    transform: translate(0px);
    opacity: 1;
    transition: transform .3s ease-in-out, opacity .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out, opacity .3s ease-in-out
}
.race_list {
    position: absolute;
    width: 915px;
    height: 380px;
    z-index: 4;
    left: 20px;
    top: 305px;
}
.race_list .name {
    position: absolute;
    top: 110px;
    width: 450px;
    height: 63px;
    z-index: 9;
    opacity: 0;
    transform: translateY(50px);
    -webkit-transform: translateY(50px)
}
.race_list .dingwei {
    position: absolute;
    width: 335px;
    top: 115px;
    height: 103px;
    line-height: 35px;
    padding: 5px 0;
    font-size: 22px;
    color: #9b7442;
    text-align: center;
    z-index: 9;
    opacity: 0;
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
    right: 35px;
    background: url("../images/common/dln.png") no-repeat;
}
.race_list .detail_btn {
    width: 335px;
    height: 103px;
    line-height: 45px;
    position: absolute;
    right: 35px;
    top: 230px;
    font-size: 22px;
    color: #fff;
    z-index: 9;
    opacity: 0;
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
    background: url("../images/common/ply.png") no-repeat;
}
.race_list .detail_btn:hover {}
.race_list .leida {
    width: 230px;
    height: 209px;
    position: absolute;
    top: 285px;
    left: 5px;
    z-index: 9;
    opacity: 0
}
.race_list .person {
    opacity: 0;
    transform: translateX(100px);
    -webkit-transform: translateX(100px)
}
.person {
    position: absolute;
    right: 0;
    z-index: 5;
    bottom: 0;
    width: 915px;
    height: 380px;
}
.sex {
    width: 183px;
    height: 139px;
    position: absolute;
    z-index: 9;
    right: 15px;
    bottom: 20px
}
.sex a {
    display: block;
    width: 64px;
    float: right;
    height: 62px;
    font-size: 0;
    margin-bottom: 6px
}
.sex a.active, .sex a:hover {
    width: 183px;
    height: 62px;
    line-height: 62px;
    text-indent: 1em;
    text-align: left;
    color: #000;
    font-size: 24px
}
.sex .s_male:hover, .sex .s_male.active {
    background-repeat: no-repeat;
}
.sex .s_female:hover, .sex .s_female.active {
    background-repeat: no-repeat;
}
.mz .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/name-mz_85e60e8.png) no-repeat
}
.mz .leida {
    background-repeat: no-repeat;
}
.mz .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/mz-m_c5cf8ca.png) no-repeat
}
.mz .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/mz-f_b304c1f.png) no-repeat
}
.mz .s_female {
    background-repeat: no-repeat;
}
.mz .s_male {
    background-repeat: no-repeat;
}
.ss .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ss-name_b13f792.png) no-repeat
}
.ss .leida {
    background-repeat: no-repeat;
}
.ss .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ss-m_9b9bc83.png) no-repeat
}
.ss .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ss-f_b74a6ba.png) no-repeat
}
.ss .s_female {
    background-repeat: no-repeat;
}
.ss .s_male {
    background-repeat: no-repeat;
}
.hh .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/huahun-name_f8fbc82.png) no-repeat
}
.hh .leida {
    background-repeat: no-repeat;
}
.hh .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/hh-m_83559c3.png) no-repeat
}
.hh .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/hh-f_9468b27.png) no-repeat
}
.hh .s_female {
    background-repeat: no-repeat;
}
.hh .s_male {
    background-repeat: no-repeat;
}
.ys .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ys-name_88899bf.png) no-repeat
}
.ys .leida {
    background-repeat: no-repeat;
}
.ys .male {
    width: 1305px;
    left: -50px;
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ys-m_d710371.png) no-repeat
}
.ys .female {
    width: 1305px;
    left: -50px;
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/ys-f_065a743.png) no-repeat
}
.ys .s_female {
    background-repeat: no-repeat;
}
.ys .s_male {
    background-repeat: no-repeat;
}
.xk .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/xk-name_eb74050.png) no-repeat
}
.xk .leida {
    background-repeat: no-repeat;
}
.xk .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/xk-m_65e0a00.png) no-repeat
}
.xk .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/xk-f_7a9de52.png) no-repeat
}
.xk .s_female {
    background-repeat: no-repeat;
}
.xk .s_male {
    background-repeat: no-repeat;
}
.fs .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/fs-name_78a2c14.png) no-repeat
}
.fs .leida {
    background-repeat: no-repeat;
}
.fs .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/fs-m_6eac976.png) no-repeat
}
.fs .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/fs-f_9e5f12c.png) no-repeat
}
.fs .s_female {
    background-repeat: no-repeat;
}
.fs .s_male {
    background-repeat: no-repeat;
}
.tlfs .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/tlfs-name_06088ff.png) no-repeat
}
.tlfs .leida {
    background-repeat: no-repeat;
}
.tlfs .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/tlfs-m_07286bb.png) no-repeat
}
.tlfs .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/tlfs-f_451142a.png) no-repeat
}
.tlfs .s_female {
    background-repeat: no-repeat;
}
.tlfs .s_male {
    background-repeat: no-repeat;
}
.yishi .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yishi-name_3df15a7.png) no-repeat
}
.yishi .leida {
    background-repeat: no-repeat;
}
.yishi .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yishi-m_05ba186.png) no-repeat
}
.yishi .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yishi-f_d24ad68.png) no-repeat
}
.yishi .s_female {
    background-repeat: no-repeat;
}
.yishi .s_male {
    background-repeat: no-repeat;
}
.yr .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yr-name_8d21655.png) no-repeat
}
.yr .leida {
    background-repeat: no-repeat;
}
.yr .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yr-m_b507896.png) no-repeat
}
.yr .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/yr-f_06e3d82.png) no-repeat
}
.yr .s_female {
    background-repeat: no-repeat;
}
.yr .s_male {
    background-repeat: no-repeat;
}
.duanhen .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/duanhen-name_232a821.png) no-repeat
}
.duanhen .leida {
    background-repeat: no-repeat;
}
.duanhen .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/duanhen-m_cc58fbd.png) no-repeat
}
.duanhen .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/duanhen-f_719aa89.png) no-repeat
}
.duanhen .s_female {
    background-repeat: no-repeat;
}
.duanhen .s_male {
    background-repeat: no-repeat;
}
.cangren .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/cangren-name_d9a2e3e.png) no-repeat
}
.cangren .leida {
    background-repeat: no-repeat;
}
.cangren .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/cangren-m_6ad036e.png) no-repeat
}
.cangren .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/cangren-f_dc1bbd5.png) no-repeat
}
.cangren .s_female {


    background-repeat: no-repeat;
}
.cangren .s_male {
    background-repeat: no-repeat;
}
.zhanhun .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/zhanhun-name_9eba280.png) no-repeat
}
.zhanhun .leida {
    background-repeat: no-repeat;
}
.zhanhun .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/zhanhun-m_1fa4284.png) no-repeat
}
.zhanhun .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/zhanhun-f_bc718a2.png) no-repeat
}
.zhanhun .s_female {
    background-repeat: no-repeat;
}
.zhanhun .s_male {
    background-repeat: no-repeat;
}
.jingang .name {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/jingang-name_73b62d3.png) no-repeat
}
.jingang .leida {
    background-repeat: no-repeat;
}
.jingang .male {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/jingang-m_c4987dd.png) no-repeat
}
.jingang .female {
    background: url(https://qn.res.netease.com/pc/fab/20170405104338/img/job/jingang-f_2124cfc.png) no-repeat
}
.slt1 .slt-ppl {
    background-repeat: no-repeat;
}
.jingang .s_male {
    background-repeat: no-repeat;
}
.slt1 .slt-ppl {
    /* background-position: 0px 0px */
}
.tlfs .leida {
    background-position: -230px 0px
}
.ss .leida {
    background-position: 0px -209px
}
.hh .leida {
    background-position: -230px -209px
}
.ys .leida {
    background-position: -460px 0px
}
.xk .leida {
    background-position: -460px -209px
}
.mz .leida {
    background-position: 0px -418px
}
.yishi .leida {
    background-position: -230px -418px
}
.yr .leida {
    background-position: -460px -418px
}
.duanhen .leida {
    background-position: -690px 0px
}
.cangren .leida {
    background-position: -690px -209px
}
.zhanhun .leida {
    background-position: -690px -418px
}
.jingang .leida {
    background-position: 0px -627px
}
.ys .s_male {
    background-position: -230px -627px
}
.sex .s_male:hover, .sex .s_male.active {
    background-position: -294px -627px
}
.xk .s_female {
    background-position: -477px -627px
}
.xk .s_male {
    background-position: -541px -627px
}
.ss .s_female {
    background-position: -605px -627px
}
.fs .s_female {
    background-position: -669px -627px
}
.fs .s_male {
    background-position: -733px -627px
}
.sex .s_female:hover, .sex .s_female.active {
    background-position: -230px -689px
}
.tlfs .s_female {
    background-position: -797px -627px
}
.tlfs .s_male {
    background-position: -413px -689px
}
.ss .s_male {
    background-position: -477px -689px
}
.yishi .s_female {
    background-position: -541px -689px
}
.yishi .s_male {
    background-position: -605px -689px
}
.mz .s_female {
    background-position: -669px -689px
}
.yr .s_female {
    background-position: -733px -689px
}
.yr .s_male {
    background-position: -797px -689px
}
.hh .s_female {
    background-position: -230px -751px
}
.duanhen .s_female {
    background-position: -294px -751px
}
.duanhen .s_male {
    background-position: -358px -751px
}
.hh .s_male {
    background-position: -422px -751px
}
.cangren .s_female {
    background-position: -486px -751px
}
.cangren .s_male {
    background-position: -550px -751px
}
.mz .s_male {
    background-position: -614px -751px
}
.zhanhun .s_female {
    background-position: -678px -751px
}
.zhanhun .s_male {
    background-position: -742px -751px
}
.ys .s_female {
    background-position: -806px -751px
}
.jingang .s_female {
    background-position: 0px -836px
}
.jingang .s_male {
    background-position: -64px -836px
}
.fs .leida, .tlfs .leida, .ss .leida, .hh .leida, .ys .leida, .xk .leida, .mz .leida, .yishi .leida, .yr .leida, .duanhen .leida, .cangren .leida, .zhanhun .leida, .jingang .leida, .ys .s_male, .sex .s_male:hover, .sex .s_male.active, .xk .s_female, .xk .s_male, .ss .s_female, .fs .s_female, .fs .s_male, .sex .s_female:hover, .sex .s_female.active, .tlfs .s_female, .tlfs .s_male, .ss .s_male, .yishi .s_female, .yishi .s_male, .mz .s_female, .yr .s_female {
    background-image: url(https://qn.res.netease.com/pc/fab/20170405104338/img/spriter/job_z_2ef28b8.png)
}
.yr .s_male, .hh .s_female, .duanhen .s_female, .duanhen .s_male, .hh .s_male, .cangren .s_female, .cangren .s_male, .mz .s_male, .zhanhun .s_female, .zhanhun .s_male, .ys .s_female, .jingang .s_female, .jingang .s_male {
    background-image: url(https://qn.res.netease.com/pc/fab/20170405104338/img/spriter/job_z_2ef28b8.png)
}




.race_list{background: url("../images/common/slot-box.png") no-repeat center top;}

slt-ppl img {
    position: relative;
    top: -12px;
}

.slt-ppl img {
    position: relative;
    top: -20px;
    margin-left: 80px;
}

ul.race_nav2 {
    display: flex;
    position: relative;
    top: 395px;
    padding-right: 65px;
}
span.btn-innd {
    padding-left: 30px;
    position: relative;
    top: 28px;
    color: #fff;
    text-shadow: 0px 0px 3px #393e33, 0px 0px 5px #000000;
    display: block;
    text-align: center;
} 

.slot-lg {
    position: absolute;
    width: 335px;
    top: 30px;
    height: 103px;
    line-height: 35px;
    padding: 5px 0;
    font-size: 22px;
    color: #9b7442;
    text-align: center;
    z-index: 9;
    opacity: 0;
    right: 50px;
}

.race_block.cur .slot-lg {
    opacity: 1;
    -webkit-transform: translate(0px);
    transform: translate(0px);
    transition: transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out;
    -webkit-transition: -webkit-transform .25s .3s ease-in-out, opacity .2s .3s ease-in-out;
}