/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
address,caption,cite,code,dfn,em,strong,th,var{font-weight:normal;font-style:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:100%}
q:before,q:after{content:''}
fieldset,img,abbr,acronym{/* border:0 */}
a{text-decoration:none;color: #ccc5b4}
body{background-color: #3b2d2d;-webkit-transition: all 1s;}
.hide{display:none;}
button {
    background: inherit;
    border: hidden;
    overflow: visible !important;
}

/*==============menu===============*/
#menu {width: 150px;margin-top: -57px;float: right;position: relative;right: 30px;list-style-type: none;z-index: 70;}
#menu li {
    /* float: left; */
    margin: 8px 3px;
    font-size: 16px;
    width: 142px;
    display: block;
    font-weight: bold;
    text-align: center;
    line-height: 46px;
    height: 43px;
}
#menu a {
	color: #bc0000;
	text-decoration: none;
	background: url("../images/btnbg.png")  no-repeat;
	width: 100%;
	height: 100%;
	display: block;
}
#menu .active a {
	color: #ffffff;
	background: url("../images/btnbg-off.png");
}
body.page1{background: #000 url("../images/section0.jpg") center top no-repeat;*/background-size: cover;}
body.page2{background: #000 url("../images/section1.jpg") center top no-repeat;*/background-size:cover}
body.page3{background: #000 url("../images/section2.jpg") center top no-repeat;*/background-size: cover}
.section1{background: #210106 url(../images/section0.jpg) center top no-repeat;background-size: cover;}
.section2{background: #1e0004 url(../images/section1.jpg) center top no-repeat;background-size:cover;}
.section3{background: #1d0003 url(../images/section2.jpg) center top no-repeat;background-size: cover;}
.section4{background: #1d0003 url(../images/section3.jpg) center top no-repeat;background-size:cover;}
.section5{background: #200308 url(../images/section4.jpg) center top no-repeat;background-size: cover;}
.mm{width: 1422px;position: absolute;height: 100%;-webkit-transition: all 1s;padding-left: 60px;z-index: 99;/* display: none; */top: -105px;left: 50%;margin-left: -733px;}
.bom-menu{
	/* background-image: url(../images/bottombg.jpg); */
	background-repeat: repeat-x;
	height: 72px;
	width: 100%;
	position: absolute;
	top: 295px;
	right: 0;
}
.line02{
	position: absolute;
	right: 50%;
	bottom:;
	display: block;
	width: 161px;
	height: 57px;
	top: 107px;
	margin-right: -475px;
}
.index{
	position: absolute;
	right: 50%;
	bottom:;
	display: block;
	top: 107px;
	margin-right: -286px;
	background-color: rgba(0, 53, 133, 0.9);
	font-size: 16px;
	padding: 3px 9px 3px 5px;
	text-decoration: none;
	color: #fff;
}
.web{
	position: absolute;
	right: 50%;
	bottom:;
	display: block;
	top: 107px;
	margin-right: -215px;
	background-color: rgba(0, 0, 0, 0.55);
	font-size: 16px;
	padding: 3px 9px 3px 5px;
	text-decoration: none;
}
.index:hover, .web:hover{
	background-color: rgba(0, 0, 0, 0.8);
	color:#fff;
}
.spx{position: absolute;    right: 414px;  top: 420px;-webkit-animation-fill-mode: forwards;  -webkit-animation-duration: .1s; -webkit-animation-delay:.2s;cursor: pointer;}
.section{overflow: hidden}


.center{width: 1220px;height: 100%;margin:  0 auto;position: relative;}

.scenter{
	width: 100%;
	position: absolute;
	left: -222px;
	top: 250px;
	z-index: 2;
}
.pman{position: absolute;-webkit-transition: all 1s;}
.opc{opacity: 0;-webkit-transition: all 2s;}
.active .opc{opacity: 1; }
.windows{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: 270px 0 0 -166px;
	z-index: 2;
	background-image: url(../images/winbtn.jpg);
	width: 325px;
	height: 83px;
	display: block;
}



@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;



    }

    to {
        opacity: 1;
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}



@-webkit-keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}


@-webkit-keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);

    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}


@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}


@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
footer{
	height: 80px;
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 10;
	background: #4c0a14;
}
.footer{
	background-image: url(../images/footer.png);
	background-repeat: no-repeat;
	/* background-size: 98%; */
	height: 95px;
	width: 1135px;
	min-width: 1100px;
	margin:0 auto;
}


/*bar*/
#top-bar{
	 width:100%;
	 height: 70px;
	 background: #000;
	 position:fixed;
	 top: 0!important;
	 -moz-box-shadow: 0px 8px 15px #333;
	 z-index: 999;
}
.event_07 {
    top: 3378px;
    z-index: 8;
}
.bar{
	position:relative;
	width:1200px;
	margin:0 auto;
}
.bar-01{
    position: absolute;
    top: 1px;
    left: 250px;
}
.bar-02{
    position: absolute;
    top: 13px;
    right: 110px;
}
.bar-01 li{
	float: left;
}
.bar-01 li a{
	height: 67px;
    width: 190px;
	display:block;
}
.bar-02 li{
	float: left;
}
.bar-02 li a{
	height: 47px;
	width: 47px;
	display:block;
}
.btn{
	background-image: url(../images/btn.png);
	background-repeat: no-repeat;
}
.btn01{
	background-position: 0 0;
	height: 67px;
    width: 190px;
	text-indent: -9999px;
}
.btn02{
	background-position: -210px 0;
	height: 67px;
	width: 190px;
	text-indent: -9999px;
}
.btn03{
	background-position: -445px 0;
	height: 67px;
	width: 190px;
	text-indent: -9999px;
}
.btn04{
	background-position: -687px -17px;
	height: 47px;
	width: 47px;
	text-indent: -9999px;
}





.sound {
	outline: none;
	float: right;
	width: 60px;
	height: 58px;
	margin-top: 52px;
	margin-right: 831px;
	font: 0/0 "";
	color: transparent;
	background-image: url(../images/btn02.png);
	background-position: 118px 0;
	display: inline-block;
	cursor: pointer;
}
.sound:hover {
    background-position: -41px -24px;
}
.sound.off {
	background-position: -489px 0;
}
.sound.off:hover { 
    background-position: -489px -51px; 
}
.sound03 {
	outline: none;
	/* float: right; */
	width: 276px;
	height: 167px;
	margin-top: 52px;
	color: transparent;
	/* background-image: url(../images/click02.png); */
	background-position: 0 0;
	display: inline-block;
	cursor: pointer;
	position:absolute;
	top: inherit;
	left: 50%;
	margin-left: 317px;
}
.sound03:hover {
    background-position: 0 -171px;
}
.sound02 {
	outline: none;
	/* float: right; */
	/* width: 276px; */
	height: 167px;
	margin-top: 52px;
	color: transparent;
	background-image: url(../images/click02.png);
	background-position: -275px 0;
	display: inline-block;
	cursor: pointer;
	position:absolute;
	top: inherit;
	left: 50%;
	margin-left: 317px;
}
.sound02:hover {
    background-position: -275px -171px;
}
.vedio1{width:338px;height:204px;background: url(../images/vedio1.png) no-repeat 0 0;position: absolute;text-indent: -9999px;top: 587px;left: 50%;margin-left: -543px;}
.vedio2{width:338px;height:204px;background: url(../images/vedio2.png) no-repeat 0 0;position: absolute;text-indent: -9999px;top: 587px;left: 50%;margin-left: -543px;}
.vedio1 a, .vedio2 a{width:321px;height:168px;display:block;}
.vedio1 a:hover, .vedio2 a:hover{opacity:0.5;filter:alpha(opacity=50);}

@media screen and (max-width: 1000px) {
#menu {
    position: fixed;
    bottom: 55px;
    list-style-type: none;
    z-index: 70;
    width: 200%;
    left: -8rem;
    transform: scale(0.7);
}
.windows {
	top: 75%;
    margin-left: -585px!important;
}
.windows {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: 155px;
    z-index: 999;
    background-image: url(../images/winbtn.jpg);
    width: 325px;
    height: 83px;
    display: block;
    transform: scale(0.45);
}
#menu li {
	float: left;
    font-size: 1.0em;
    font-weight: 500;
    margin-left: 0.8em;
    width: 6rem;
}
#menu a {

}
#menu .active a {

}
ul.qlink li {
    transform: scale(0.5);
}
.section1{background: #210106 url(../images/section0_m.jpg) center top no-repeat;background-size:cover;}
.section2{background: #1e0004 url(../images/section1_m.jpg) center top no-repeat;background-size:cover;}
.section3{background: #1d0003 url(../images/section2_m.jpg) center top no-repeat;background-size: cover;}
.section4{background: #1d0003 url(../images/section3_m.jpg) center top no-repeat;background-size:cover;}
.section5{background: #200308 url(../images/section4_m.jpg) center top no-repeat;background-size: cover;}
.footer{background:url(../images/footer_m.png) center top no-repeat;background-size: 85%;width: inherit;min-width: inherit;}
}

#audio {
    bottom: 55px;
    right: -41px;
}
ul.qlink {
    margin-top: -185px;
    left: -13px;
}

#roleBg .roleItem .a1 {
    position: absolute;
    left: 50%;
    margin-left: -387px;
    top: 67px;
    background-size: 60%;
}
#roleBg .roleItem .a2 {
    position: absolute;
    left: 50%;
    margin-left: -387px;
    top: 67px;
    background-size: 60%;
}
#roleBg .roleItem .a3 {
    position: absolute;
    left: 50%;
    margin-left: -462px;
    top: 67px;
    background-size: 60%;
}
#roleBg .roleItem .a4 {
    position: absolute;
    left: 50%;
    margin-left: -387px;
    top: 67px;
    background-size: 60%;
}
.pop {
	background: url(../images/pop.png) no-repeat;
	background-repeat: no-repeat;
	background-position: center top;
	width: 100%;
	height: 90px;
	position: fixed;
	z-index: 60;
	left: 0;
	bottom: 0;
}
.pop_elin {
	position: absolute;
	left: 507px;
	top: -27px;
}
.pop.down { bottom: -237px; }
.pop .btns {
	background-color: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	position: absolute;
	bottom: 13px;
	left: 50%;
	background-repeat: no-repeat;
	display: block;
	transition: filter .3s ease;
}
.pop .btn_download:hover { filter: brightness(150%); }
.pop .btn_download {
	background: url(../images/btn_download.png) no-repeat;
	background-position: 0 51px;
	height: 154px;
	width: 275px;
	margin-left: -46px;
}
.pop .btn_register {
	background: url(../images/btn_register.png) no-repeat;
	background-position: 0 25px;
	height: 129px;
	width: 275px;
	margin-left: -299px;
	display: block;
}
.pop .btn_register:hover { filter: brightness(150%); }
.gohome {
	position: absolute;
	top: 13px;
	left: 50%;
	margin-left: 256px;
	color: #FFFFFF;
	text-decoration: none;
	font-size: 15px;
}
@keyframes flash {  0% {
background-position: 0 0;
}
 5% {
background-position-y: -100px;
}
 10% {
background-position-y: -200px;
}
 15% {
background-position-y: -300px;
}
 20% {
background-position-y: -400px;
}
 25% {
background-position-y: -500px;
}
 30% {
background-position-y: -600px;
}
 100% {
background-position-y: -600px;
}
}
.close_pop {
	position: absolute;
	bottom: 60px;
	right: 0px;
	cursor: pointer;
	z-index: 11;
}
.open_pop {
	position: fixed;
	bottom: 0px;
	right: 0px;
	cursor: pointer;
	z-index: 11;
	display: none;
}
.leaves {
	z-index: 1;
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -750px;
	width: 1920px;
	height: 1500px;
}
.october-leaf {
	z-index: 0;
	position: absolute;
	background-color: transparent;
	background-image: url('../images/flower.png');
	opacity: 0.8 !important;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0);
}

.fancybox-lock .fancybox-overlay {
    background: rgba(0, 0, 0, 0.81);
}
.fancybox-close {
	background: url(../images/close.png) no-repeat!important;
	background-position: 0 0;
    position: absolute;
    top: 47px;
    right: -105px!important;
    width: 100px!important;
    height: 100px!important;
    cursor: pointer;
    z-index: 8040;
}
ul.qlink {position: fixed;top: 50%;margin-top: -160px;left: 25px;z-index: 199;}
ul.qlink li {margin-bottom: 12px;}
ul.qlink li a {filter: brightness(.75);width: 104px;height: 103px;background-image:url(../images/menu.png);text-indent:-9999px;display: block;/*transition: all ease .3s; margin-left: -140px;*/background-repeat: no-repeat;}
ul.qlink li.ev1 a {background-position: 3px -99px;}
ul.qlink li.ev2 a {background-position: -99px 2px;}
ul.qlink li a:hover { filter: brightness(1); }