body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin: 0;padding: 0}
table{border-collapse: collapse;border-spacing: 0}
fieldset,img{border: 0;vertical-align: top;}
address,caption,cite,code,dfn,em,strong,th,var{font-style: normal;font-weight: normal}
ol,ul{list-style: none}
caption,th{text-align: left}
h1,h2,h3,h4,h5,h6{font-size: 100%;}
q:before,q:after{content: ''}
abbr,acronym{border: 0;font-variant: normal}
sup{vertical-align: text-top}
a,a:hover{color: #2e2f33;text-decoration: none;outline: 0;}
sub{vertical-align: text-bottom}
input,textarea,select{font-family: inherit;font-size: inherit;font-weight: inherit}
input,textarea,select{*font-size: 100%}

body{color: #2e2f33; font: 14px/1.5 "Microsoft YaHei", Arial, Helvetica, sans-serif; -webkit-text-size-adjust: none; -ms-text-size-adjust: none;}
html,body{width: 100%; height: 100%; background: #000; overflow: hidden;}

.main {
    width: 100%;
    margin: 0 auto;
    height: 100%;
    opacity: 0;
    transition: opacity .5s;
}

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

.bg {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
}

.bg-back {
    background: url(../images/bg.jpg) no-repeat 50% 50%;
    background-size: cover;
}

.bg-front {
    bottom: 0;
    height: auto;
}

.bg-front img {
    width: 100%;
}


.frame {
    position: relative;
    height: 100%;
    width: 100%;

}
.frame-main {
    width: 100%;
    height: 100%;
    position: absolute;
}

.frame-con {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.frame-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.frame-bg .back {
    width: 100%;
    height: 100%;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/bg_n.jpg) no-repeat 50% 0;
    background-size: cover;
}

.frame-bg .front {
    width: 100%;
    height: 100%;
    z-index: 5;
    position: absolute;
    left: 0;
    bottom: 0;
}

.frame1 .frame-con {
   width: 100%;
   height: 100%;
   margin-left:1.5%;
}
.frame1 .v{
    width: 100%;
    height: 100%;
    background:url(../images/bg.jpg) no-repeat 50% 0;
    background-size: 100%;
    z-index:2;
    position: absolute;
    left:0;
    right: 0;
    /* transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%); */
    top:0;
}
.backgo {position: absolute;top:-30px;left:14px;font-size:20px; color:#f1d4a4;}

.frame1 .frame-bg .back{
    background: url(../images/bg.jpg) no-repeat 50% 0;
    background-size: cover;
}
.frame1 .frame-bg .front{
    background: url(../images/front.png) no-repeat 50% 100%;
    background-size: 100% auto;
}

.f1i1 {
    height: 110%;
}
.showNext{
    background:url(../images/arr_down.png) no-repeat 0 0;
    position: absolute;
    z-index: 10;
    left:50%;
    bottom:10px;
    width: 82px;
    height: 90px;
    animation:d 2s infinite;
}

@keyframes d{
    from{
        opacity:1;
        bottom:10px;
    }
    to{
        opacity:0;
        bottom:-20px;
    }
}

.aside {
    width: 150px;
    position: absolute;
    left: -350px;
    height: 100%;
    top: 0;
    z-index: 20;
    transition:left .5s .5s;
}

.aside-con {
    width: 100%;
    height: 100%;
    position: relative;
    background: url(../images/line02.png) no-repeat 50% 0;
}

.video-sec {
    width: 141px;
    height: 141px;
    position: relative;
    margin: 0 auto;
    top: 86px;
    margin-bottom: 40px;
}

.video-sec .outer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation:rr 5s linear infinite;
    background: url(../images/video_out.png) no-repeat 50% 50%;
}

.video-sec .inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation:rl 5s linear infinite;
    background: url(../images/video_inner.png) no-repeat 50% 50%;
}
@keyframes rr{
    100%{
        transform: rotate(360deg);
    }
}
@keyframes rl{
    100%{
        transform: rotate(-360deg);
    }
}

.video-sec .video {
    position: absolute;
    top: 11px;
    left: 13px;
    width: 117px;
    height: 119px;
    background: url(../images/video.png) no-repeat 50% 50%;
}

.video-sec .video-btn {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}

#menu {
    top: 266px;
    left: 14px;
    position: absolute;
}

#menu li {
    margin-bottom: 35px;
    width: 122px;
}

#menu li a {
    display: block;
    color: #86724d;
		width:122px;height:37px;
    line-height: 37px;
    text-indent:-9999px;
}
#menu li.active a,#menu a:hover {
    color: #d6ba86;
    font-size: 16px;
}
#menu li .n1{background: url(../images/nav001.png) no-repeat;}
#menu li .n1:hover,#menu li.active .n1{background: url(../images/nav01.png) no-repeat;}
#menu li .n2{background: url(../images/nav002.png) no-repeat;}
#menu li .n2:hover,#menu li.active .n2{background: url(../images/nav02.png) no-repeat;}
#menu li .n3{background: url(../images/nav003.png) no-repeat;}
#menu li .n3:hover,#menu li.active .n3{background: url(../images/nav03.png) no-repeat;}
#menu li .n4{background: url(../images/nav004.png) no-repeat;}
#menu li .n4:hover,#menu li.active .n4{background: url(../images/nav04.png) no-repeat;}
#menu li .n5{background: url(../images/nav005.png) no-repeat;}
#menu li .n5:hover,#menu li.active .n5{background: url(../images/nav05.png) no-repeat;}
#menu li .n6{background: url(../images/nav006.png) no-repeat;}
#menu li .n6:hover,#menu li.active .n6{background: url(../images/nav06.png) no-repeat;}

a.logofollow {
    display: block;
    position: absolute;
    bottom: 71px;
    left: 10px;
    background: url(../images/logo.png) no-repeat 0 0;
    width: 168px;
    height: 75px;
    text-indent: -999em;    z-index: 22;
}

a.follow {
    display: block;
    position: absolute;
    bottom: 0;
    left: 10px;
    background: url(../images/follow.png) no-repeat 0 0;
    width: 167px;
    height: 72px;
    text-indent: -999em;    z-index: 22;
}

.rSide {
    position: absolute;
    right: -300px;
    top: 0;
    z-index: 20;
    transition:right .5s .5s;
}

.rSide .slogan {
    font-size: 14px;
    color: #d6ba86;
    background: url(../images/10year.png) no-repeat;
    width: 73px;
    height:354px;
    position: absolute;
    top: 40px;
    right: 0;
}
.hdnav{width: 164px;height:210px;position: fixed;bottom: 22px;right: 20px;}
    .hdnav .hd{}
  	.hdnav .rhd{display:none;}
    .hdnav .lhd a{position:relative;display: block;width:164px;height:164px;background: url(../images/long.png) no-repeat;}
    .hdnav .rhd a{position:relative;display: block;width:164px;height:164px;background: url(../images/niu.png) no-repeat;}
    .hdnav .quan{
    position: absolute;
    top: -21px;
    left: 0;
    width: 100%;
    height: 100%;
    animation: rl 5s linear infinite;
    background: url(../images/quan.png) no-repeat 50% 50%;
    }
   	.hdnav .bd{width:94px;margin:0 auto;position: relative;z-index: 2;}
    .hdnav .larrow{float: left;display: block;width:42px;height:45px;background: url(../images/p2-btn-l_2fe1099.png) no-repeat;margin-right:10px}
    .hdnav .larrow:hover,.hdnav .larrow.on{ background: url(../images/p1-btn-l_2fe1099.png) no-repeat;}
    .hdnav .rarrow{float: left;display: block;width:42px;height:45px;background: url(../images/p2-btn-r_a9f4c87.png) no-repeat;}
    .hdnav .rarrow:hover,.hdnav .rarrow.on{ background: url(../images/p1-btn-r_a9f4c87.png) no-repeat;}
    .hdnav .bg{position:absolute;top: 175px;left: -16px;display: block;width:167px;height:59px;background: url(../images/line01.png) no-repeat;margin-right:10px;/* z-index:0; */}


.frame2 .frame-con {
    width: 1280px;
    height: 750px;
    margin-left: 60px;
}

.frame2 h2 {
    display: block;
    background: url(img/gf/gf_title.png) no-repeat 0 0;
    width: 101px;
    height: 275px;
    text-indent: -999em;
    float: left;
    margin-top: 20px;
    margin-right: 20px;
}

.gf {
    width: 980px;
    padding-top:15px;
    float: left;
    margin-right: 20px;
}

.gf .swap-con {
    position: relative;
    width: 980px;
    height: 550px;
    overflow: hidden;
    margin-bottom: 15px;
}

.gf .swap-con li {
    position: absolute;
    top: 0;
    left: 0;
}

.gf .swap-dot {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 0;
}

.gf .swap-dot li {
    display: inline-block;
    width: 40px;
}

.gf .swap-dot li a {
    display: block;
    width: 40px;
    height: 40px;
    margin-right: 5px;
    background: url(../images/swapdot.png) no-repeat 0 0;
}

.gf .swap-dot li.active a {
    background: url(../images/swapdot_hover.png) no-repeat 0 0;
}

.frame2 .swap-nav {
    float: left;
    border-left: 2px solid #6d634f;
    margin-top: 10px;
    padding-top: 30px;
}

.frame2 .swap-nav li {
    background: url(../images/dot_hover.png) no-repeat 0 50%;
    padding-left: 30px;
    font-size: 28px;
    line-height: 48px;
    margin-bottom: 40px;
    margin-left: -9px;
}

.frame2 .swap-nav a {
    color: #86724d;;
}

.frame2 .swap-nav a:hover {
    color: #d6ba86;
}
.frame2 .swap-nav .active a{
    color: #d6ba86;
}


.swap-con li{
    display: none;
}
.swap-con li:nth-child(1){
    display: block;
}
#empireCon,#heroPopDes{
    height: 578px;
    overflow:hidden;
}
#heroPopDes p { display: block; text-indent: 2em;}

.pager {
    text-align: center;
    color: #6d543c;
    font-size: 20px;
    line-height: 40px;
}
.pager span{
    padding: 0 5px;
}

.pager strong {
    font-size: 40px;
}
.pager .prev{
    width: 18px;
    height: 38px;
    background: url(../images/arr_left.png) no-repeat;
    opacity: .6;
    transition: opacity .4s;
    display: inline-block;
}
.pager .next{
    width: 18px;
    height: 38px;
    background: url(../images/arr_right.png) no-repeat;
    opacity: .6;
    transition: opacity .4s;
    display: inline-block;
}




.frame4 .frame-con {
    width: 100%;
    height: 100%;
    margin-left: 9px;
}
.frame4 .v{
    position: absolute;
    width: 100%;
    height: 1039px;
    top: 0;
    left: 0;
    background: url(../images/hero/main.png) no-repeat 50% 0;
    background-size:auto 100%;
}

.frame4 .items,
.frame4 .cards {
    position: relative;
    top: 0;
    left: 0;
}
.frame4 .cards .card{
    display: none;
}

.frame4 .item,
.frame4 .card {
    position: absolute;
    top: 478px;
    left: 50%;
}

.frame4 .item div,
.frame4 .card div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.frame4 .item{
    cursor: pointer;
}
.frame4 .item01 {
    width: 282px;
    height: 213px;
    margin-left: -521px;
    margin-top: -503px;
}

.frame4 .item02 {
    width: 386px;
    height: 373px;
    margin-left: -658px;
    margin-top: -244px;
}

.frame4 .item03 {
    width: 233px;
    height: 222px;
    margin-left: -360px;
    margin-top: 90px;
}

.frame4 .item04 {
    width: 287px;
    height: 275px;
    margin-left: 40px;
    margin-top: 40px;
}

.frame4 .item05 {
    width: 329px;
    height: 267px;
    margin-left: 200px;
    margin-top: -200px;
}

.frame4 .item06 {
    width: 282px;
    height: 317px;
    margin-left: 145px;
    margin-top: -535px;
}

.frame4 .item07 {
    width: 358px;
    height: 499px;
    margin-left: -183px;
    margin-top: -225px;
}

.frame4 .card {
    width: 220px;
    height: 300px;
    cursor: pointer;
    opacity:0;
    transition: opacity 1s;
}
.frame4 .card-con{
    width: 220px;
    height: 300px;
    perspective: 500px;
    -webkit-perspective: 500px;
    position: relative;
}
.frame4 .item .light{
    opacity:0;
}
.frame4 .item01 .light{
    animation: light 5s infinite;
    animation-delay: 8;
}
.frame4 .item02 .light{
    animation: light 8s infinite;
    animation-delay: 0s;
}
.frame4 .item03 .light{
    animation: light 3s infinite;
    animation-delay: 3s;
}
.frame4 .item04 .light{
    animation: light 4s infinite;
    animation-delay: 10s;
}
.frame4 .item05 .light{
    animation: light 6s infinite;
    animation-delay: 6s;
}
.frame4 .item06 .light{
    animation: light 5s infinite;
    animation-delay: 2s;
}
.frame4 .item07 .light{
    animation: light 7s infinite;
    animation-delay: 12s;
    transform-origin: 50% 60%;
}
@keyframes light{
    0%{
        opacity:0;
    }
    50%{
        opacity:1;
    }
    100%{
        transform:scale(1.3);
        opacity:0;
    }
}
.frame4 .card .front,
.frame4 .card .back {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    transition-duration: 1s;
    -webkit-transition-duration: 1s;
    transition-delay: 0.3s;
    -webkit-ttransition-delay: 1s;
    transform: rotate3d(0, 1, 0, 180deg);
    -webkit-transform: rotate3d(0, 1, 0, 180deg);
}
.frame4 .card .back{
    opacity: 0;
}

.frame4 .card .front {
    z-index: 6;
    transform: rotate3d(0, 1, 0, 0deg);
    -webkit-transform: rotate3d(0, 1, 0, 0deg);
}
.frame4 .card:hover{
    opacity:1;
}

.frame4 .card:hover .front {
    z-index: 5;
    transform: rotate3d(0, 1, 0, -180deg);
    -webkit-transform: rotate3d(0, 1, 0, -180deg);
    opacity: 0;
}

.frame4 .card:hover .back {
    z-index: 6;
    opacity: 1;
    transform: rotate3d(0, 1, 0, 0deg);
    -webkit-transform: rotate3d(0, 1, 0, 0deg);
}

.frame4 .card1 {
    margin-left: -521px;
    margin-top: -478px;
}

.frame4 .card2 {
    margin-left: -573px;
    margin-top: -176px;
}

.frame4 .card3 {
    margin-left: -390px;
    margin-top: 45px;
}

.frame4 .card4 {
    margin-left: 116px;
    margin-top: 40px;
}

.frame4 .card5 {
    margin-left: 275px;
    margin-top: -210px;
}

.frame4 .card6 {
    margin-left: 207px;
    margin-top: -490px;
}
.frame4 .card7 {
    margin-left: -114px;
    margin-top: -114px;
}

.pop{
    top: 0;
    left: 0;
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.pop-con .name h3{ width:215px;height: 319px;background: url(../images/hero/name01.png) no-repeat;position: relative;}
.pop-con .name h3 span { display: block; position: absolute;}
.pop-wrap{
    position: relative;
    width: 100%;
    height: 100%;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    max-width: 1920px;
}

.model{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:rgba(0,0,0,.78);
    z-index: 200;
}
.model-follow{background: url(../images/follow.jpg) no-repeat top center;}
.model-wrap{
    width: 1920px;
    height:1080px;
    position: absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
}
.model-con{
    position: relative;
    width: 100%;
    height: 100%;
}
.model-empire .model-con,
.model-con,.model-fitter .model-con,.model-empire .model-con,
.model-fitter .model-con,.model-empire .model-con {
    width: 805px;
    height: 802px;
    left:50%;
    top:50%;
    margin-top:-420px;
    margin-left:-402px;
    background:url(../images/jbgs.png) no-repeat 0 0;
}
.model-fitter .model-con .close,.model-empire .model-con .close {
    width: 64px;
    position: absolute;
    left:95%;
    top: 0;
    background: none;
}
.model-con .v{
    position: absolute;
}
.model-empire .v1{
    top:-90px;
    left:180px;
}

.model-empire .t,.model-fitter .t{
    width:545px;
    margin:0 auto;
    padding-top: 86px;
}
.model-con .t h3{
    font-size:32px;
    color:#bda87e;
    margin-bottom:30px;
    font-weight: 400;
    text-align: center;
}
.model-con .t h3 span{
    display: block;
    color:#a5a5a5;
    font-size: 16px;
}
.model-con .t .t-c{
    font-size: 14px;
    color:#d8d1c3;
    line-height: 25px;
}
#zyjs p{ display: block; text-indent: 2em;}
.model-con .bird{
    position: absolute;
}
.model-con .bird1{
    left:1424px;
    top:-50px;
}
.model-con .bird2{
    left:1300px;
    top:120px;
}
.model-con .bird3{
    left:1324px;
    top:405px;
}
.model-con .close{
    width: 64px;
    background:url(../images/dots.png) no-repeat 50% -28px;
    position: absolute;
    left:50%;
    top:86%;
    margin-left: -32px;
}
.model-follow .close{    width: 164px;
    background:none;
    position: absolute;
    left:50%;
    top: 577px;
    margin-left: 220px;cursor:pointer;}
.model-con .close a{
    display: block;
    margin-top: 50px;
    background:url(../images/close.png) no-repeat 50% 0;
    width: 64px;
    height: 64px;
    text-indent: -999em;
}
.fllowtb{position: absolute;display: block;top: 781px;left: 482px;width: 264px;height: 200px;z-index:5;}
.fllowbi{position: absolute;display: block;top: 781px;left: 767px;width: 264px;height: 200px;z-index:5;}
.model-follow .close a {background:none;}
.model-fitter .v1{
    overflow: hidden;
    zoom:1;
    width: 456px;
    margin:0 auto 30px;
}


.frame5 .frame-con{
    width: 1220px;
    height: 710px;
    margin-left: 60px;
}
.frame5 .videos{
    overflow: hidden;
    margin-bottom: 10px;
}
.frame5 .videos .video{
    float: left;
    border:2px solid #d6ba86;
}
.frame5 .videos .video img{
    width:100%;
    height:100%;
    position: absolute;
    top:0;
    left:0;
}
.frame5 .video a{
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    background-size:cover;
    background-position:50% 50%;
}
.frame5 .video a span.t{
    display: block;
    background:rgba(31,31,31,.89);
    position: absolute;
    width:100%;
    left:0;
    bottom:0;
    height: 32px;
    text-align: center;
    color:#fff;
    font-size: 14px;
    line-height: 32px;
    padding-top: 10px;
    padding-bottom: 10px;
    transition: bottom .3s;
}
.frame5 .video a span.mask{
    background: rgba(0,0,0,.78);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity .3s;
}
.frame5 .video a span.t i{
    background:url(img/media/play1.png) no-repeat 0 0;
    height: 32px;
    width: 32px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: -10px;
}
.frame5 .video a strong{
    display: block;
    position: absolute;
    text-align: center;
    color:#fff;
    border:1px solid #d6ba86;
    top:14px;
    left:14px;
    right:14px;
    bottom:14px;
    opacity: 0;
    transition: opacity .3s;
}
.frame5 .video a strong i{
    background:url(img/media/play2.png) no-repeat 0 0;
    height: 78px;
    width: 79px;
    display: block;
    margin:110px auto 20px;
}
.frame5 .videos .video1{
    width: 614px;
    height: 344px;
    margin-right: 10px;
}
.frame5 .videos .video2{
    width: 430px;
    height: 344px;
}
.frame5 .video a:hover span.mask,
.frame5 .video a:hover strong{
    opacity: 1;
}
.frame5 .video a:hover span.t{
    bottom:-54px;
}
.frame5 .slide {overflow: hidden; position: relative;}
.frame5 .slide ul{
    overflow: hidden;
    width: 1178px;
    height:348px;
    float: left;
}
.frame5 .slide li{
    float: left;
    border:2px solid #c3ac7f;
    width: 117px;
    height: 344px;
    transition: width .4s;
    overflow: hidden;
    font-size: 0;
    margin-right: 9px;
    position: relative;
    cursor: pointer;
}
.frame5 .slide li span.cover{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 117px;
    height: 344px;
    opacity: 1;
    transition: opacity .4s;
}
.frame5 .slide li span.cover img{
    width: 117px;
    height: 344px;
    object-fit: cover
}
.frame5 .slide li span.mask{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .3s;
    background:#191304;
}
.frame5 .slide li p{
    text-align: center;
    font-size: 0;
    position: absolute;
    top:14px;
    left:14px;
    right:14px;
    bottom:14px;
    border:1px solid #d6ba86;
    opacity:0;
    transition: opacity .3s;
    padding:135px 130px 0;
}
.frame5 .slide li a{
    display: inline-block;
    font-size: 14px;
    color:#e5d08f;
    width: 138px;
    height: 38px;
    line-height: 38px;
    border:1px solid #d6ba86;
    margin: 0 10px 10px;
}
.frame5 .slide li a:hover{
    background:#d6ba86;
    color:#fff;
}
.frame5 .slide li:hover p{
    opacity: 1;
    transition-delay: .2s;
}
.frame5 .slide li:hover .mask{
    opacity: 0.7;
}
.frame5 .slide li.active{
    width:640px;
}
.frame5 .slide li.active span.cover{
    opacity: 0;
}

.frame5 .slide .more{
    display: block;
    position: absolute;
    top: 314px;
    right: 0;
    line-height: 32px;
    height: 32px;
    font-size: 14px;
    color: #b0955f;
    border-top:1px solid #b0955f;
    border-bottom:1px solid #b0955f;
}

.model-follow .model-con{
    height:364px;
    top: 324px;
    background:none;
}
.model-follow .v{
    top: -162px;
    left:215px
}
.model-follow .t{
    padding-top: 40px;
}

.model-follow .model-con .bird2{
    left:1270px;
    top:0;
}
.model-follow .model-con .bird3{
    left:1300px;
    top:265px;
}
.footer{
    z-index: 200;
    width: 100%;
    height: 100%;
    position: absolute;
    top:0;
    left:0;
    display: none;
}
.footer .mask{
    width: 100%;
    height: 100%;
    position: absolute;
    top:0;
    left:0;
    background:rgba(0,0,0,.78);
}
.footer .footer-wrap{
    position: absolute;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    left:0;
    bottom:0;
    background:#000;
    border-top:4px solid #a08b56;
    text-align: center;
    color:#7f7f7f;
    line-height: 25px;
}
.footer .logo{
    display: inline-block;
    margin-bottom: 20px;
}
.footer .icon-culture{
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url(https://lilithimage.lilithcdn.com/aoc/pc/net_authentication.png?v=2019110114142535);
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    margin-right: 5px;
}
.footer a{
    color:#fff;
}
.footer .close{
    width: 64px;
    background:url(../images/dots.png) no-repeat 50% 72px;
    position: absolute;
    right:180px;
    top:-110px;
    height: 110px;
}
.footer .close a{
    display: block;
    background:url(../images/close.png) no-repeat 50% 0;
    width: 64px;
    height: 64px;
    text-indent: -999em;
}
.close a:hover{
    transform:rotate(360deg);
    transition: transform 1s;
}

.main-in{
    opacity:1;
}
.main-in .aside{
	 	top: -770px;
    left: 20px;
		-webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}
.main-in .show{top: 0px;}

.main-in .rSide{
    right: 0;
}
.intro{
    position: absolute;
    width: 100%;
    left:0;
    bottom:0;
}
.intro img{
    width: 100%;
}

.popup{
    width: 100%;
    height: 100%;
    z-index: 200;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
}
.popup .mask{
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    background:rgba(0,0,0,.78);
}
.popup-con{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.popup .media-sec{
    border: 4px solid #e6ca92;
    background:#000;
}

.popup .close{
    width: 64px;
    background:url(../images/dots.png) no-repeat 50% -32px;
    margin:0 auto;
    padding-top: 36px;
    height: 66px;
}
.popup .close a{
    display: block;
    background:url(../images/close.png) no-repeat 50% 0;
    width: 64px;
    height: 64px;
    text-indent: -999em;
}

.frameyy .frame-con {width: 1100px;margin-left: 0;}
.framebbs .frame-con {width: 1100px;margin-left: 0;}
.framexcfl .frame-con {width: 1100px;margin-left: 0;}
@media screen and (max-height: 960px) {
    .aside-con {
        background: url(../images/line02.png) no-repeat 50% -0px;
    }

    .video-sec {
        top: 86px;
    }

    #menu {
        top: 266px;
    }
    .aside .down {
        top: 575px;
    }
    .showNext{
        transform: scale(.5);
        transform-origin: 0 0;
    }
    .pop-hero .close{
        transform: scale(.7) !important;
        transform-origin: 0 0;
        margin-top:-30px;
    }
    .hdnav .bg{display:none;}
}
@media screen and (max-width: 1750px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.9) translate(-50%,-56%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.8);
        transform-origin: 0 0;
    }
}
@media screen and (max-width: 1640px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.85) translate(-50%,-59%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.85) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.5);
        transform-origin: 0 0;
    }
}
@media screen and (max-width: 1540px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.8) translate(-50%,-63%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.8) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.5);
        transform-origin: 0 0;
    }
}
@media screen and (max-width: 1440px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.75) translate(-50%,-67%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.75) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.4);
        transform-origin: 0 0;
    }
    .main-in .aside {margin-top: -50px;}
}
@media screen and (max-width: 1340px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.7) translate(-50%,-72%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.7) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.4);
        transform-origin: 0 0;
    }
    .frame1 .frame-con{height:686px;}
    .main-in .aside {margin-top: -60px;}
}
@media screen and (max-width: 1200px){
    .frame1 .frame-con,
    .frame4 .frame-con{
        transform: scale(.65) translate(-50%,-77%);
        transform-origin: 0 0;
    }
    .frame3 .frame-con,
    .frame2 .frame-con,
    .frame5 .frame-con{
        transform: scale(.65) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .framezl .frame-con{
        transform: scale(.9) translate(-50%,-50%);
        transform-origin: 0 0;
    }
    .showNext{
        transform: scale(.4);
        transform-origin: 0 0;
    }
    .frame1 .frame-con{height:686px;}
    .main-in .aside {margin-top: -70px;}
}
.downimg { width:64px; height: 30px; background: #918464; color: #fff; text-align: center; font-size: 14px;line-height: 30px; position: absolute;right:0px;bottom:62px;}
.prevbtn,.nextbtn {position: absolute;width:31px;height: 59px;top:315px; background: url(../images/arrow.png) no-repeat;}
.prevbtn {left:-50px; background-position: 0 0;;}
.prevbtn a { display: block;width: 100%;height:100%;}
.nextbtn {right:-50px; background-position: right 0;}
.nextbtn a { display: block;width: 100%;height:100%;}

.icon__audio{position:absolute;right:10px;top:10px;z-index:999;display:block;width:22px;height:14px;overflow:hidden;-webkit-transform:translate(0,0,0);-moz-transform:translate(0,0,0);-ms-transform:translate(0,0,0);transform:translate(0,0,0);cursor:pointer;}.icon__audio.audio__play strong{-webkit-animation:audio 1s ease-in-out infinite;-moz-animation:audio 1s ease-in-out infinite;-ms-animation:audio 1s ease-in-out infinite;animation:audio 1s ease-in-out infinite}@-webkit-keyframes audio{0%{height:4px}60%{height:17px}100%{height:4px}}@-moz-keyframes audio{0%{height:4px}60%{height:17px}100%{height:4px}}@-ms-keyframes audio{0%{height:4px}60%{height:17px}100%{height:4px}}@-o-keyframes audio{0%{height:4px}60%{height:17px}100%{height:4px}}@keyframes audio{0%{height:4px}60%{height:17px}100%{height:4px}}.icon__audio.audio__play .icon__audio_1{height:10px;animation-delay:.4s}.icon__audio.audio__play .icon__audio_2{height:17px}.icon__audio.audio__play .icon__audio_3{height:5px;animation-delay:.8s}.icon__audio.audio__play .icon__audio_4{height:14px;animation-delay:.6s}.icon__audio.audio__play .icon__audio_5{height:10px;animation-delay:.2s}.icon__audio strong{display:block;float:left;width:2px;height:4px;background:#fff;position:absolute;bottom:0}.icon__audio_1{left:0}.icon__audio_2{left:5px}.icon__audio_3{left:10px}.icon__audio_4{left:15px}.icon__audio_5{left:20px}

.framebbs .frame-bg .back{background: url(../images/yuyue/bg.jpg) no-repeat 50% 0;background-size: cover;}
.bbstitleh1{position:absolute;top: 66px;left: 184px;width:665px;height:248px;}
.bbsnav{position: absolute;left: 662px;top: 126px;width: 464px; display:none;}
.bbsnav.on{ display:block;}
.bbsnav .swap-con{position: relative;width: 491px;height: 670px;overflow: hidden;margin-left: 14px;margin-bottom: 29px;}
.bbsnav .swap-con li{position: absolute;top: 0;left: 0;}
.bbsnav .swap-dot{position: relative;display: block;margin-left: 11px;width: 418px;height: 40px;text-align: center;font-size: 0;z-index:2;padding: 4px 10px 3px 10px;border: 2px solid #c2a060;}
.bbsnav .swap-dot-bg{position: absolute;top: 750px;left: -1px;display: block;margin-left: 118px;width: 898px;height: 111px;text-align: center;font-size: 0;background: url(../images/zl/bbsnav_2.png) 0 -219px no-repeat;z-index:0;}
.bbsnav .swap-dot li{float: left;display: block;width: 136px;height: 40px;cursor:pointer;}
.bbsnav .swap-dot li.n1{}
.bbsnav .swap-dot li.n6{width: 115px;}
.bbsnav .swap-dot li a{display: block;width: 145px;height: 39px;line-height: 39px;text-align: center;font-size: 18px;}
.bbsnav .swap-dot li.active a{background: #c2a060;color: #fff;}
.bbsnav .swap-dot .n1{border-right: 1px solid #c2a060;}
.bbsnav .swap-dot .n1.active{}
.bbsnav .swap-dot .n2{border-right: 1px solid #c2a060;}
.bbsnav .swap-dot .n2.active{background-position: -0px -17px;}
.bbsnav .zmdiv{display:block;position: absolute;top: 115px;left: 75px;width: 805px;}
.bbsnav .zmdiv img{display:block;margin:0 auto;}
.bbsnav .gameintro{position:absolute;top: 384px;left: 14px;width: 748px;line-height: 34px;font-size: 14px;color: #ffecba;}
.bbsnav .gameintro2{left: -51px;width: 810px;top: 366px;}
.bbsnav .gameintro span{float:left;width: 35px;height: 35px;margin-bottom: 63px;background: url(../images/zl/icon.png) -15px -4px no-repeat;}
.bbsnav .gameintro em{color:#ffd76d;}
.bbsnav .tx{position:absolute;left: 77px;top: 43px;width: 253px;height: 50px;background: url(../images/zl/bbsnav_1.png) -23px -342px no-repeat;}
.bbsnav .tx2{background-position: -16px -345px;}
.bbsgz{position: absolute;top: 19px;left: 0px;width: 434px;padding: 0;color: #000;line-height: 24px;font-size: 20px;}
.bbsgz p{margin-bottom: 0px;line-height: 41px;}
.bbsgz p em{float:left;width: 112px;height: 38px;line-height: 41px;font-size: 20px;color: #fe5301;text-align:center;margin-right: 0px;font-weight: bold;}
.bbsgz1 p{line-height: 33px;}
.bbsgz1 p em{line-height: 33px;height:33px}
.bbsgz1 p .em2{height:62px;}
.bbsgz1 p .tips{color:red;}
.goimg{position: absolute;top: 349px;left: 76px;margin: 0 auto;display:block;width:266px;height: 65px;cursor:pointer;background: url('../images/bbs/btn01.png') 0 0px no-repeat;}
.goimg2{position: absolute;top: 349px;left: 76px;margin: 0 auto;display:block;width:266px;height: 65px;cursor:pointer;background: url('../images/bbs/btn02.png') 0 0px no-repeat;}

.gon1{position: absolute;top: 211px;left: 0px;display:block;width: 426px;height: 100px;cursor:pointer;background: url('../images/bbs/icon001.png') 0 0px no-repeat;}
.gon2{position: absolute;top: 147px;left: 0px;display:block;width: 400px;height: 191px;cursor:pointer;background: url('../images/bbs/icon002.png') 0 0px no-repeat;}
.gon3{position: absolute;top: 150px;left: 98px;display:block;width: 190px;height: 191px;cursor:pointer;background: url('../images/bbs/icon003.png') 0 0px no-repeat;}

.gon4{position: absolute;top: 159px;left: 11px;display:block;width: 168px;height: 251px;cursor:pointer;background: url('../images/bbs/hongbao.png') 0 0px no-repeat;}
.gon4-1{position: absolute;top: 179px;left: 208px;display:block;width: 210px;height: 54px;cursor:pointer;background: url('../images/bbs/qqbtn01.png') 0 0px no-repeat;}
.gon4-2{position: absolute;top: 258px;left: 208px;display:block;width: 210px;height: 54px;cursor:pointer;background: url('../images/bbs/qqbtn02.png') 0 0px no-repeat;}
.gon4-3{position: absolute;top: 338px;left: 208px;display:block;width: 210px;height: 54px;cursor:pointer;background: url('../images/bbs/qqbtn03.png') 0 0px no-repeat;}
.gon5{position: absolute;top: 232px;left: -13px;display:block;width: 460px;height: 166px;cursor:pointer;background: url('../images/bbs/jlnl.png') 0 0px no-repeat;}
.gon6{position: absolute;top: 225px;left: -17px;display:block;width: 460px;height: 166px;cursor:pointer;background: url('../images/bbs/dtgs.png') 0 0px no-repeat;}

.btips{position: absolute;width: 600px;top: 399px;left: 0px;color:red;}
.bbswx{position: absolute;top: -31px;left: 46px;display:block;width: 362px;height: 526px;cursor:pointer;background: url('../images/bbs/wxfl.png?ver=1') 0 0px no-repeat;}
.bbspf{position: absolute;top: -18px;left: -15px;display:block;width: 506px;height: 500px;cursor:pointer;background: url('../images/bbs/pf.png?ver=1') 0 0px no-repeat;}
 .framebbs .bbsdiv{position: absolute;left: -115px;top:231px;width: 1264px; height: 700px; background: url(../images/bbs/bg05.png) no-repeat;}
 .framebbs .quanbig{position: absolute;top: 0px;left: 35px;width: 700px;height: 700px;animation: rl 10s linear infinite;background: url(../images/bbs/qian01.png) no-repeat 50% 50%;}
 .framebbs .quan3{position: absolute;top: 207px;left: 242px;width: 275px;height: 275px;}
 .framebbs .quanrw1{background: url(../images/bbs/qian03.png) no-repeat 50% 50%;}
 .framebbs .quanrw2{background: url(../images/bbs/qian06.png) no-repeat 50% 50%;cursor:pointer;}
 .framebbs .quanrw3{background: url(../images/bbs/qian08.png) no-repeat 50% 50%;cursor:pointer;}
 .framebbs .quanrw4{background: url(../images/bbs/qian05.png) no-repeat 50% 50%;}
 .framebbs .quanrw5{background: url(../images/bbs/qian04.png) no-repeat 50% 50%;}
 .framebbs .quanrw6{background: url(../images/bbs/qian07.png) no-repeat 50% 50%;}
 .framebbs .quantitle{position: absolute;top: 0px;left: 35px;width: 700px;height: 700px;background: url(../images/bbs/tit.png) no-repeat;}
 .framebbs .quan{position: absolute;top: 0px;left: 0;width: 100%;height: 100%;animation: rl 5s linear infinite;background: url(../images/bbs/qian02.png) no-repeat 50% 50%;display:none;}
  
  
 .framebbs .bbsn{position: absolute;width: 112px;height: 112px;}
 .framebbs .bbsn1{left: 322px;top: 24px;}
 .framebbs .bbsn2{left: 549px;top: 177px;}
 .framebbs .bbsn3{left: 532px;top: 433px;}
 .framebbs .bbsn4{left: 322px;top: 549px;}
 .framebbs .bbsn5{left: 84px;top: 432px;}
 .framebbs .bbsn6{left: 84px;top: 178px;}
 .framebbs .bbsn.on .quan,.framebbs .bbsn:hover .quan{display:block;}
 
/**/
 .framexcfl .frame-bg .back{background: url(../images/yuyue/bg.jpg) no-repeat 50% 0;background-size: cover;}
 .xcfltitleh1{position:absolute;top: 66px;left: 184px;width:665px;height:248px;}
 .framexcfl .xcfldiv{position: absolute;left: 159px;top: 382px;width: 800px;height: 700px;}
 .idlo{background: url(../images/xcfl/xnfl.png) no-repeat;}
 .idel_1{position: absolute;background-position: 0 -359px;width: 213px;height: 330px;top: 25px;left: -7px;}
 .idel_1:hover{background-position: 0 0;}
 .idel_2{position: absolute;background-position: -226px -359px;width: 213px;height: 300px;top: 25px;left: 253px;}
 .idel_2:hover{background-position: -226px 0;}
 .idel_3{position: absolute;background-position: -459px -359px;width: 213px;height: 300px;top: 25px;left: 529px;}
 .idel_3:hover{background-position: -459px 0;}