@charset "utf-8";
body{ margin:0; padding:0; font-size:14px; font-family:"Microsoft Yahei"; background-color:#204b77; overflow-x:hidden;}
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:"Microsoft Yahei";text-decoration:none;outline:none; cursor:pointer;}
a:hover{ text-decoration:none;}

.wrap{ position:relative; width:750px; height:1473px; overflow:hidden;}
/* top_bar */
.top_bar{ position:fixed; width:750px; height:98px; left:0; top:0; background:rgba(0,0,0,0.72); z-index:20;}
.top_bar .logo{ position:absolute;width:81px; left:23px; top:9px;}
.page_t{ position:absolute; width:510px; height:98px; left:118px; top:0; font-size:24px; line-height:98px; color:#fff;}
.website{ position: absolute; top: 50%; right: 20px; transform: translate(0, -50%); width: 182px; height: 54px; background: url(../images/website.png) no-repeat 0 0; }

/* loading */
.loading_box{ position:absolute; width:750px; height:100%; left:0; top:0; background:url(../images/loading_bg.jpg) center top no-repeat; z-index:10;}
.loading_qiu{ position:absolute; width:310px; height:308px; left:213px; top:428px; background:url(../images/loading_qiu.png);}
.yue_gai{ position:absolute; width:750px; height:353px; left:0; top:412px; background:url(../images/yue_gai.png);}

.point_list{ position:absolute; width:460px; height:456px; left:142px; top:353px; background:url(../images/point_bg.png);}
.point_list li{ position:absolute; width:37px; height:37px;}
.point_list li img{ display:none; width:37px;}
.point_list li.on img{ display:block}
.point_list li.p1{ left:3px; top:215px;}
.point_list li.p2{ left:20px; top:127px;}
.point_list li.p3{ left:72px; top:53px;}
.point_list li.p4{ left:151px; top:10px;}
.point_list li.p5{ left:242px; top:3px;}
.point_list li.p6{ left:326px; top:35px;}
.point_list li.p7{ left:420px; top:203px;}
.point_list li.p8{ left:403px; top:292px;}
.point_list li.p9{ left:350px; top:365px;}
.point_list li.p10{ left:271px; top:409px;}
.point_list li.p11{ left:181px; top:416px;}
.point_list li.p12{ left:96px; top:384px;}

/* container */
.container{ display:none; position:relative; width:100%; height:100%; background:url(../images/bg.jpg) center top no-repeat #000;}
.ren{ position:absolute; width:750px; left:-23px; top:195px;}
.hua_bot1{position:absolute; width:750px; height:455px; left:0; top:0; background:url(../images/hua_bot_1.png);}
.hua_bot2{position:absolute; width:750px; height:616px; left:0; bottom:0; background:url(../images/hua_bot_2.png);}
.hua{position:absolute;}
.hua img{ position:absolute; left:0; top:0;}
.hua1{ width:493px; height:524px; left:-55px; bottom:0;}
.hua2{ width:509px; height:563px; right:-35px; bottom:0;}
.hua3{ width:181px; height:219px; left:0px; top:0px;}
.hua4{ width:307px; height:175px; right:0px; top:0px;}
.hua_front1{position:absolute; width:750px; height:453px; left:0; top:0; background:url(../images/hua_front_1.png);}
.hua_front2{position:absolute; width:741px; height:554px; left:0; bottom:0; background:url(../images/hua_front_2.png);}

.yao_bot1{transform-origin:left bottom;-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;}
.yao_bot2{transform-origin:right bottom;-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;}
.yao_top1{transform-origin:left top;-webkit-transform-origin:left top;-ms-transform-origin:left top;}
.yao_top2{transform-origin:right top;-webkit-transform-origin:right top;-ms-transform-origin:right top;}
.ani_updown{ animation:key_updown 2s 0.7s linear infinite alternate; -webkit-animation:key_updown 2s 0.7s linear infinite alternate; -ms-animation:key_updown 2s 0.7s linear infinite alternate;}
.ani_yaobai1{ animation:key_yaobai 4s linear infinite; -webkit-animation:key_yaobai 4s linear infinite; -ms-animation:key_yaobai 4s linear infinite;}
.ani_yaobai2{ animation:key_yaobai2 3.5s linear infinite; -webkit-animation:key_yaobai2 3.5s linear infinite; -ms-animation:key_yaobai2 3.5s linear infinite;}

.slogan_box{ position:absolute; width:299px; height:690px; left:439px; top:138px; background:url(../images/slogan.png); z-index:8;}
.btn_open{position:absolute; width:224px; height:224px; left:485px; top:856px; cursor:pointer; z-index:8;}
.open1{ position:absolute; width:158px; left:33px; top:0; animation:key_zhuan1 6s linear infinite; -webkit-animation:key_zhuan1 6s linear infinite; -ms-animation:key_zhuan1 6s linear infinite;}
.open2{ position:absolute; width:111px; left:56px; top:56px; animation:key_zhuan2 6s linear infinite; -webkit-animation:key_zhuan2 6s linear infinite; -ms-animation:key_zhuan2 6s linear infinite;}

.weidu_box{ display:none; position:absolute; width:450px; height:602px; left:283px; top:376px; z-index:8;}
.ani_xz_show{ animation:key_xz 0.5s linear both;-webkit-animation:key_xz 0.5s linear both; -ms-animation:key_xz 0.5s linear both;}
.ani_xz_show1{ animation:key_xz1 0.5s linear both;-webkit-animation:key_xz1 0.5s linear both; -ms-animation:key_xz1 0.5s linear both;}
.ani_xz_show2{ animation:key_xz2 0.5s linear both;-webkit-animation:key_xz2 0.5s linear both; -ms-animation:key_xz2 0.5s linear both;}
.btn_close{ display:none; position:absolute; width:156px; height:63px; left:160px; bottom:-85px; background:url(../images/btn_close.png); cursor:pointer;}

/* animation */
@keyframes key_updown{
	0%{transform:translate3d(0,0,0)}
	100%{transform:translate3d(0,20px,0)}
}
@-webkit-keyframes key_updown{
	0%{-webkit-transform:translate3d(0,0,0)}
	100%{-webkit-transform:translate3d(0,20px,0)}
}
@-ms-keyframes key_updown{
	0%{-ms-transform:translate3d(0,0,0)}
	100%{-ms-transform:translate3d(0,20px,0)}
}
@keyframes key_yaobai{
	0%{transform:rotate(0deg)}
	50%{transform:rotate(8deg)}
	100%{transform:rotate(0deg)}
}
@-webkit-keyframes key_yaobai{
	0%{-webkit-transform:rotate(0deg)}
	50%{-webkit-transform:rotate(8deg)}
	100%{-webkit-transform:rotate(0deg)}
}
@-ms-keyframes key_yaobai{
	0%{-ms-transform:rotate(0deg)}
	50%{-ms-transform:rotate(8deg)}
	100%{-ms-transform:rotate(0deg)}
}

@keyframes key_yaobai2{
	0%{transform:rotate(0deg)}
	50%{transform:rotate(-8deg)}
	100%{transform:rotate(0deg)}
}
@-webkit-keyframes key_yaobai2{
	0%{-webkit-transform:rotate(0deg)}
	50%{-webkit-transform:rotate(-8deg)}
	100%{-webkit-transform:rotate(0deg)}
}
@-ms-keyframes key_yaobai2{
	0%{-ms-transform:rotate(0deg)}
	50%{-ms-transform:rotate(-8deg)}
	100%{-ms-transform:rotate(0deg)}
}
@keyframes key_xz1{
	0%{ opacity:0; transform:rotate(-45deg) scale(0.5);}
	100%{ opacity:1; transform:rotate(0deg) scale(1);}
}
@-webkit-keyframes key_xz1{
	0%{ opacity:0; -webkit-transform:rotate(-45deg) scale(0.5);}
	100%{ opacity:1; -webkit-transform:rotate(0deg) scale(1);}
}
@-ms-keyframes key_xz1{
	0%{ opacity:0; -ms-transform:rotate(45deg) scale(0.5);}
	100%{ opacity:1; -ms-transform:rotate(0deg) scale(1);}
}
@keyframes key_xz2{
	0%{ opacity:0; transform:rotate(45deg) scale(0.5);}
	100%{ opacity:1; transform:rotate(0deg) scale(1);}
}
@-webkit-keyframes key_xz2{
	0%{ opacity:0; -webkit-transform:rotate(45deg) scale(0.5);}
	100%{ opacity:1; -webkit-transform:rotate(0deg) scale(1);}
}
@-ms-keyframes key_xz2{
	0%{ opacity:0; -ms-transform:rotate(45deg) scale(0.5);}
	100%{ opacity:1; -ms-transform:rotate(0deg) scale(1);}
}
@keyframes key_zhuan1{
	0%{ transform:rotate(0deg);}
	100%{ transform:rotate(360deg);}
}
@-webkit-keyframes key_zhuan1{
	0%{ -webkit-transform:rotate(0deg);}
	100%{ -webkit-transform:rotate(360deg);}
}
@-ms-keyframes key_zhuan1{
	0%{ -ms-transform:rotate(0deg);}
	100%{ -ms-transform:rotate(360deg);}
}
@keyframes key_zhuan2{
	0%{ transform:rotate(0deg);}
	100%{ transform:rotate(-360deg);}
}
@-webkit-keyframes key_zhuan2{
	0%{ -webkit-transform:rotate(0deg);}
	100%{ -webkit-transform:rotate(-360deg);}
}
@-ms-keyframes key_zhuan2{
	0%{ -ms-transform:rotate(0deg);}
	100%{ -ms-transform:rotate(-360deg);}
}