@charset "utf-8";
html {
    min-width: 1002px;
}

body {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-family: "微软雅黑", Arial, Helvetica, sans-serif;
    background-color: #050d16;
}

div, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, textarea, table, td {
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

area {
    outline: none;
}

img {
    border: 0;
}

ol, ul {
    list-style: none;
}

a {
    font-family: "微软雅黑", Arial, Helvetica, sans-serif;
    text-decoration: none;
    outline: none;
}

a:hover {
    text-decoration: underline;
}

.clearfix:after {
    content: "";
    display: block;
    height: 0;
    clear: both;
}

.clearfix {
    zoom: 1;
}

.wrap {
    margin: 0 auto;
    width: 1920px;
    min-width: 1200px;
    height: 1080px;
    background: url(/static/bg_nhanvat.jpg) no-repeat center top;
    position: relative;
    overflow: hidden;
}

.nav-box {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -435px;
    width: 157px;
    height: 870px;
    background: url(/static/nav-box.png) no-repeat center;
    z-index: 33;
}

.nav-box a {
    display: block;
    position: absolute;
    width: 102px;
    height: 95px;
    text-indent: -9999px;
    background: url(/static/nav.png) no-repeat center;
}

.nav-box a:hover, .nav-box a.on {
    background-image: url(/static/nav-on.png);
}

.nav-box a.nav-box-01 {
    top: 141px;
    right: 57px;
    background-position: -46px -2px;
}

.nav-box a.nav-box-02 {
    top: 307px;
    right: 99px;
    background-position: -4px -171px;
}

.nav-box a.nav-box-03 {
    top: 474px;
    right: 99px;
    background-position: 0 -335px;
}

.nav-box a.nav-box-04 {
    top: 639px;
    right: 57px;
    background-position: -46px -502px;
}

.profession-wrap {
    display: none;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.tab-box {
    position: absolute;
    top: 225px;
    left: 50px;
    width: 71px;
    overflow: hidden;
}

.tab-box.tab-box-shenzu {
    position: absolute;
    top: 225px;
    left: 150px;
    width: 71px;
    overflow: hidden;
}

.tab-box ul li {
    font-size: 12px !important;
    float: left;
    margin: 16px 0;
    width: 71px;
    height: 71px;
    text-align: center;
    line-height: 71px;
    color: #fff;
    background: url(/static/tab-bg.png) no-repeat center;
    cursor: pointer;
}

.tab-box ul li:hover, .tab-box ul li.on {
    background-image: url(/static/tab-on-renzu.png);
    text-indent: -9999px;
}

.tab-box ul li.tab-renzu4.on, .tab-box ul li.tab-renzu4:hover {
    background-position: 0 -314px;
}

.tab-box ul li.tab-renzu1.on, .tab-box ul li.tab-renzu1:hover {
    background-position: 0 0;
}

.tab-box ul li.tab-renzu2.on, .tab-box ul li.tab-renzu2:hover {
    background-position: 0 -105px;
}

.tab-box ul li.tab-renzu3.on, .tab-box ul li.tab-renzu3:hover {
    background-position: 0 -210px;
}

.tab-box ul li.tab-renzu4.on, .tab-box ul li.tab-renzu4:hover {
    background-position: 0 -314px;
}

.tab-box ul li.tab-renzu5.on, .tab-box ul li.tab-renzu5:hover {
    background-position: 0 -419px;
}

.tab-box ul li.tab-renzu6.on, .tab-box ul li.tab-renzu6:hover {
    background-position: 0 -524px;
}

.tab-box ul li.tab-renzu7.on, .tab-box ul li.tab-renzu7:hover {
    background-position: 0 -629px;
}

.tab-box-shenzu ul li:hover, .tab-box-shenzu ul li.on {
    background-image: url(/static/tab-on-shenzu.png);
    text-indent: -9999px;
}

.tab-box-tianmai ul li:hover, .tab-box-tianmai ul li.on {
    background-image: url(/static/tab-on-tianmai.png);
    text-indent: -9999px;
}

.tab-box-cangchi ul li:hover, .tab-box-cangchi ul li.on {
    background-image: url(/static/tab-on-cangchi.png);
    text-indent: -9999px;
}

.cangchi-line {
    position: absolute;
    left: 138px;
    bottom: 0;
    width: 1px;
    height: 765px;
    background-color: #15273d;
}

.profession-cont {
    position: absolute;
    top: 245px;
    left: 359px;
    z-index: 3;
    display: none;
}

.profession-box {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
    width: 600px;
}

.profession-title {
    display: block;
}

.profession-intro {
    margin-top: 52px;
}

.professio-video-box {
    float: left;
    width: 91px;
    height: 51px;
    margin-right: 22px;
    position: relative;
}

.profession-video-link {
    position: absolute;
    left: 0;
    top: 0;
    width: 91px;
    height: 51px;
    z-index: 3;
}

.pre-video {
    position: absolute;
    left: 0;
    top: 0;
    width: 91px;
    height: 51px;
    z-index: 2;
}

.pre-video video {
    width: 91px;
    height: 51px;
}

.profession-intro h4 {
    float: left;
    width: 450px;
    font-size: 16px;
    color: #fff;
    line-height: 24px;
}

.profession-intro h4 span {
    color: #6b86b0;
}

.profession-txt {
    margin-top: 22px;
    line-height: 30px;
    font-size: 18px;
    color: #fff;
}

.profession-map {
    display: block;
    margin-top: 70px;
}

.role-guidao {
    position: absolute;
    left: -148px;
    top: -112px;
    width: 1688px;
    height: 946px;
    background: url(/static/role-guidao.png) no-repeat center;
}

.role-fenxiang {
    position: absolute;
    left: 300px;
    top: -240px;
    width: 1230px;
    height: 1080px;
    background: url(/static/role-fenxiang.png) no-repeat center;
}

.role-guiwang {
    position: absolute;
    left: 443px;
    top: -246px;
    width: 961px;
    height: 1080px;
    background: url(/static/role-guiwang.png) no-repeat center;
}

.role-hehuan {
    position: absolute;
    left: 437px;
    top: -206px;
    width: 970px;
    height: 986px;
    background: url(/static/role-hehuan.png) no-repeat center;
}

.role-qingyun {
    position: absolute;
    left: 437px;
    top: -206px;
    width: 946px;
    height: 962px;
    background: url(/static/role-qingyun.png) no-repeat center;
}

.role-tianyin {
    position: absolute;
    left: 614px;
    top: -200px;
    width: 845px;
    height: 1011px;
    background: url(/static/role-tianyin.png) no-repeat center;
}

.role-changsheng {
    position: absolute;
    left: 230px;
    top: -241px;
    width: 1336px;
    height: 1080px;
    background: url(/static/role-changsheng.png) no-repeat center;
}

.role-chenhuang {
    position: absolute;
    left: 514px;
    top: -246px;
    width: 675px;
    height: 1080px;
    background: url(/static/role-chenhuang.png) no-repeat center;
}

.role-huaiguang {
    position: absolute;
    left: 334px;
    top: -189px;
    width: 1207px;
    height: 1025px;
    background: url(/static/role-huaiguang.png) no-repeat center;
}

.role-jiuli {
    position: absolute;
    left: 434px;
    top: -189px;
    width: 1006px;
    height: 1060px;
    background: url(/static/role-jiuli.png) no-repeat center;
}

.role-lieshan {
    position: absolute;
    left: 434px;
    top: -230px;
    width: 808px;
    height: 1064px;
    background: url(/static/role-lieshan.png) no-repeat center;
}

.role-taihao {
    position: absolute;
    left: 600px;
    top: -170px;
    width: 786px;
    height: 960px;
    background: url(/static/role-taihao.png) no-repeat center;
}

.role-tianhua {
    position: absolute;
    left: 440px;
    top: -122px;
    width: 929px;
    height: 958px;
    background: url(/static/role-tianhua.png) no-repeat center;
}

.role-huaying {
    position: absolute;
    left: 394px;
    top: -246px;
    width: 1149px;
    height: 1080px;
    background: url(/static/role-huaying.png) no-repeat center;
}

.role-guiyun {
    position: absolute;
    left: 200px;
    top: -215px;
    width: 1318px;
    height: 1050px;
    background: url(/static/role-guiyun.png) no-repeat center;
}

.role-qingluo {
    position: absolute;
    left: 400px;
    top: -162px;
    width: 1083px;
    height: 996px;
    background: url(/static/role-qingluo.png) no-repeat center;
}

.role-pojun {
    position: absolute;
    left: 453px;
    top: -200px;
    width: 1083px;
    height: 996px;
    background: url(/static/role-pojun.png) no-repeat center;
}

.role-qianji {
    position: absolute;
    left: 540px;
    top: -40px;
    width: 759px;
    height: 774px;
    background: url(/static/role-qianji.png) no-repeat center;
}

.role-yingzhao {
    position: absolute;
    left: 100px;
    top: -80px;
    width: 1175px;
    height: 909px;
    background: url(/static/role-yingzhao.png) no-repeat center;
}

.role-zushuang {
    position: absolute;
    left: 483px;
    top: -246px;
    width: 1010px;
    height: 1080px;
    background: url(/static/role-zushuang.png) no-repeat center;
}

.role-jinglan {
    position: absolute;
    left: 190px;
    top: -112px;
    width: 1353px;
    height: 947px;
    background: url(/static/role-jinglan.png) no-repeat center;
}

.role-zhaoming {
    position: absolute;
    left: 47px;
    top: -157px;
    width: 1480px;
    height: 986px;
    background: url(/static/role-zhaoming.png) no-repeat center;
}

.role-neiyu {
    position: absolute;
    left: 440px;
    top: -127px;
    width: 1100px;
    height: 999px;
    background: url(/static/role-nieyu.png) no-repeat center;
}

.role-bailing {
    position: absolute;
    left: 340px;
    top: -217px;
    width: 1037px;
    height: 1065px;
    background: url(/static/role-bailing.png) no-repeat center;
}

.role-shiluo {
    position: absolute;
    left: 302px;
    top: -242px;
    width: 1158px;
    height: 1080px;
    background: url(/static/role-shiluo.png) no-repeat center;
}

.video_pop {
    background: #000;
    width: 640px;
    height: 480px;
    position: relative;
    display: none;
}

.close_btn {
    position: absolute;
    right: -58px;
    top: 0px;
    width: 58px;
    height: 58px;
    cursor: pointer;
}

#video_box video {
    width: 640px;
    height: 480px;
}


.chara_icon2 {
    position: absolute;
    left: 0;
    bottom: 40px;
    z-index: 5;
}