body{font-family:'microsoft yahei';position:relative;zoom:1;min-width:1000px;width:100%;height:100%;overflow:hidden;}

#header{position:relative;zoom:1;z-index:3;}

.update-ie{position:absolute;width:100%;height:60px;line-height:60px;z-index:14;color:#fff;}
.update-ie a{color:#D32B02;}
.update-ie .close{padding-right:20px;}

#fullbg{ background:#000; position:absolute; top:0px; filter: Alpha(Opacity=80); opacity:0.8; width:100%; display:none; z-index:12; height:100%;}
.loading{position:absolute;width:100%;height:100%;left:0;top:42px;z-index:13;background:url(../images/loading.gif) no-repeat center center #000;}

#toolTipLayer{position:absolute;z-index:10;opacity:0.95; filter: alpha(opacity=95); border: 2px solid #121b14;border-radius:5px; padding: 2px; background-color: #111;left:0px;top:0px;width:250px;line-height:18px;color:#99DDFF;display:none;}
#toolTipLayer span{color:#0088FF;display:block;}

#videoPlay{ position:absolute;top:50%;left:50%;margin:-189px 0 0 -330px;_margin:0;border:2px solid #000;z-index:12;display:none;background:#fff;}
#videoPlay a{position:absolute;top:-2px;right:-24px;font-size:24px;width:24px;height:24px;line-height:24px;text-align:center;background:#000;color:#fff;}


.defwrap{margin:0 auto;width:1000px;}
.posr{position:relative;zoom:1;}

h2{position:absolute;z-index:2;top:76px;left:60px;width:170px;height:140px;}
h2 a{display:block;width:100%;height:100%;background:url(../images/m2-logo.png) no-repeat 0 0;line-height:999em;}

#wrap{overflow:hidden;}
.screen{width:100%;height:100%;overflow:hidden;}

#wrap{min-width:1000px;overflow:hidden;}
.warp-con{position: absolute;left:0;top:42px;width:100%;min-width:1000px;overflow:hidden;z-index:1;}
.img-con{z-index:1;}

.section{position:relative;overflow:hidden;}
.section .inner{ width:1200px; margin:0 auto;}
.img-con .section{position: absolute;width:100%;left:0;z-index:1;text-align: left; height:100%;}

.bg-img{position:absolute;top:0;left:0;height:100%;width:100%;}
.video-bg{position:absolute;z-index:1;-webkit-transform: translate3d(0,0,0);}
.bg-vdo video{width: 1920px;height: 936px;}
/* header nav */
.header-nav{position:absolute;z-index:2;right:76px;top:88px;width:700px;height:48px;}
.com-btn{position:absolute;width:60px;height:46px;background:url(../images/hd-sprite.png) no-repeat 0 0;}

.enter-link, .down-link{position:absolute;width:165px;height:46px;line-height:42px;background-position:-60px 0;color:#f00;}
.down-link{right:0;top:0;background-position:-225px 0;}
.enter-link{right:160px;}

.music-link{right:320px;top:0;}
.share-wrap{position:absolute;right:376px;top:0;width:60px;height:46px;overflow:hidden;}
.share-link{right:0;}

.icon-com{display:inline-block;width:22px;height:22px;background:url(../images/hd-sprite.png) no-repeat 0 0;margin-top:10px;}
.icon-play{background-position:-615px 0;}
.icon-mute{background-position:-637px 0;}
.icon-share{background-position:-659px 0;}
.icon-plus{margin:0 10px 0;_margin-top:12px;vertical-align:middle;margin-right:10px;background-position:-681px 0;_vertical-align:text-bottom;}
.icon-star{background-position:-681px -25px;}
.icon-dollar{background-position:-704px -25px;}
.icon-tabarrow{margin-left:350px;background-position: -704px 0;width:50px;height:25px;}
.icon-arrow{display:none;position:absolute;bottom:-18px;left:50%;margin-left:-18px;width:36px;height:18px;background-position:-728px -25px;}

/* weibo share */
.tc,.sina,#weixin{background:none;}
#clShare{position:absolute;right:60px;top:0x;z-index:9;zoom:1;width:225px;height:47px;background:url(../images/hd-sprite.png) no-repeat -390px 0;}
#clShare a{float:left;width:56px;height:43px;text-indent:-999em;}
#clShare .sina,.wx-btn{margin-right:0;}
#weixinShow,#kouDaiShow{position:absolute;left:50px;bottom:-114px;opacity:0;filter:alpha(opacity=0);_display:none;width:102px;height:112px;background:url(../images/sns.png) -105px -49px;_background-image:url(../images/sns.gif);}
#kouDaiShow{left:-55px;background-position:0 -49px;}

/* menu */
.menu-wrap{position:absolute;right:68px;top:50%;margin-top:-125px;width:20px;height:250px;z-index:12;overflow:hidden;}
.menu-wrap li{margin-bottom:10px;*margin-bottom:8px;width:100%;height:20px;background:url(../images/hd-sprite.png) no-repeat -637px -22px;cursor:pointer;}
.menu-wrap li:hover, .menu-wrap li.active{background-position:-615px -22px;}
.menu-wrap .icon-mouse, .menu-wrap .icon-mouse:hover{height:33px;background-position:-659px -22px;cursor:default;}

/* down btn */
.down-btn{margin:10px auto 0;width:85px;height:170px;cursor:pointer;}
.down-btn i{position:absolute;background:url(../images/down-btn.png) no-repeat 0 0;}
.down-btn .line{left:42px;width:2px;height:159px;}
@-webkit-keyframes move { 
	0% {
 		top:48px;
	}
	50% {
 		top:50px;
	}
	100% {
		top:52px;
	}
}
@keyframes move { 
	0% {
 		top:48px;
	}
	50% {
 		top:50px;
	}
	100% {
		top:52px;
	}
}
@-webkit-keyframes move1 { 
	0% {
 		top:58px;
	}
	50% {
 		top:65px;
	}
	100% {
		top:72px;
	}
}
@keyframes move1 { 
	0% {
 		top:58px;
	}
	50% {
 		top:65px;
	}
	100% {
		top:72px;
	}
}
.down-btn .quare{left:29px;top:50px;width:30px;height:30px;background-position:-3px 0;overflow:hidden;
	-webkit-animation:move .6s infinite alternate linear;
	animation:move .6s infinite alternate linear;}
.down-btn .arrow{left:3px;top:65px;width:82px;height:44px;background-position: -3px -30px;overflow:hidden;
	-webkit-animation:move1 .8s infinite alternate linear;
	animation:move1 .8s infinite alternate linear;}

.title-wrap{margin:52px auto 0;width:743px;height:695px;font-size:0;}
.title-wrap .title{position:absolute;top:100px;left:50px;width:640px;height:600px;background:url(../images/title.png) no-repeat 0 0;text-indent:-9999px;}
.title-wrap .boom-tl{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../images/bloom.png) no-repeat 0 0;z-index:-1;}
.title-wrap .video-btn{position:absolute;left:335px;top:600px;width:60px;height:55px;}

.com-tl{position:absolute;width:538px;height:52px;background:url(../images/tl-sprite.png) no-repeat 0 0;text-indent:-999em;
	-webkit-transform: translateY(-1500px);
    -moz-transform: translateY(-1500px);
    transform: translateY(-1500px);
}
.active .com-tl{
	-webkit-animation: bounceInDown 1s linear 0s 1;
  	-moz-animation: bounceInDown 1s linear 0s 1;
  	animation: bounceInDown 1s linear 0s 1;
  	-webkit-animation-fill-mode: forwards;
  	animation-fill-mode: forwards;
}
@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1500px);
    transform: translateY(-1500px); }
  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    transform: translateY(30px); }
  80% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px); } 
}
@-moz-keyframes bounceInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-1500px);
    transform: translateY(-1500px); }
  60% {
    opacity: 1;
    -moz-transform: translateY(30px);
    transform: translateY(30px); }
  80% {
    -moz-transform: translateY(-10px);
    transform: translateY(-10px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0px);
    transform: translateY(0px); } 
}
@-ms-keyframes bounceInDown {
  0% {
    opacity: 0;
    -ms-transform: -ms-translateY(-1500px);
    transform: translateY(-1500px); }
  60% {
    opacity: 1;
    -ms-transform: -ms-translateY(30px);
    transform: translateY(30px); }
  80% {
    -ms-transform: -ms-translateY(-10px);
    transform: translateY(-10px); }
  100% {
    opacity: 1;
    -ms-transform: -ms-translateY(0px);
    transform: translateY(0px); } 
}
@keyframes bounceInDown {
  0% {
    opacity: 0;
    transform: translateY(-1500px);}
  60% {
    opacity: 1;
    transform: translateY(30px); }
  80% {
    transform: translateY(-10px); }
  100% {
    opacity: 1;
    transform: translateY(0px); } 
}

.tl2{background-position:0 0;}
.tl3{background-position:0 -52px;}
.tl4{background-position:0 -104px;}
.tl5{position:static;margin:-100px auto 0;background-position:0 -156px;}
.tl6{width:650px;background-position:0 -208px;}
.tl7{background-position:0 -260px;}

/* section 2 */
.grey-opacity{filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#D8000000', endColorstr='#D8000000');background:rgba(0,0,0,0.85);*background:#000;*filter:none;}
.section-bg{position:absolute;top:30%;left:0;width:100%;}
.section-bg2{height:425px;border-bottom:114px solid #f00;_border-bottom:0 none;}
.tl2{left:0;top:-100px;}
.sunlinglong{position:absolute;left:180px;top:-280px;width:1145px;height:678px;}
.animate-mover{
	opacity:0;
	transition: all 1s; 
    transform: translateX(1000px);
  	-webkit-transition: all 1s;
  	-webkit-transform: translateX(1000px);
  	-moz-transition: all 1s;
  	-moz-transform: translateX(1000px);
  	-ms-transition: all 1s;
  	-ms-transform: translateX(1000px);
}
.active .animate-mover{
	opacity: 1;
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);}
.animate-movel{
	opacity:0;
	transition: all 1s; 
    transform: translateX(-1000px);
  	-webkit-transition: all 1s;
  	-webkit-transform: translateX(-1000px);
  	-moz-transition: all 1s;
  	-moz-transform: translateX(-1000px);
  	-ms-transition: all 1s;
  	-ms-transform: translateX(-1000px);
}
.active .animate-movel{
	opacity: 1;
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);}

	.map-con{padding-top:90px;}
	/* focus */
	.map-focus{position:relative;margin-right:38px;height:264px;width:453px;}
	.map-focus .box{ overflow: hidden; position: relative; width: 445px; height:240px;border:4px solid #4B4A49;}
    .map-focus .list{ overflow: hidden; width: 9999px; }
    .map-focus .list li {float:left;position:relative;width:445px;}
    .map-focus .list li a{display:block;}
	.map-focus .list img { _vertical-align: top;}
	.map-focus .btn{position:absolute;left:0;bottom: -18px; z-index: 3; width: 150px; height: 16px; font: 0/0 Arial;}
    .map-focus .btn li {display:inline-block; margin-right:2px; width:12px; height:12px;background:#000;border:2px solid #f00; cursor: pointer; vertical-align:middle;*display: inline; *zoom: 1; }
	.map-focus .btn .selected {width:16px;height:16px;background:#f00;border:0 none;}

	.map-intro{padding-top:56px;width:420px;}
	.map-intro .map-tl{font-size:25px;line-height:25px;color:#f00;}
	.map-intro .desc{color:#fff;}

	.map-links{margin-top:90px;_position:absolute;_margin-top:100px;_zindex:9;}
	.map-links li{float:left;margin-right:20px;width:160px;height:42px;}
	.map-links a{display:block;width:100%;height:100%;background:#282828;line-height:42px;color:#ececec;}
	.map-links a:hover{background:#000;color:#f5f5f5;}

	.section2-ie6{position:absolute;top:425px;left:0;width:100%;background:#f00;height:114px;}
	.section3-ie6{position:absolute;top:385px;left:0;width:100%;background:#000;height:150px;}
	.section4-ie6{position:absolute;top:375px;left:0;width:100%;background:#000;height:150px;}

/* section 3 */
.section-bg3{height:385px;border-bottom:150px solid #000;}
	.section-bg3 .left-bg{position:absolute;top:0;left:0;width:60%;height:100%;
		filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#CCFA0000', endColorstr='#CCFA0000');background:rgba(250,0,0,0.8);}
	.section-bg3 .right-bg{position:absolute;top:0;left:60%;width:40%;height:100%;}

	.tl3{left:0;top:-100px;}
	.lvbu{position:absolute;left:150px;top:-260px;width:977px;height:750px;}


	.intro-wrap{padding-top:68px;}
	.intro-tabshow{border:3px solid #000;border-right:0 none;width:496px;height:240px;}
	#tabTl{margin-top:-3px;width:51px;height:246px;background-image:url(../images/tab-tl.png);background-repeat:no-repeat;}
    #tabTl.hd0{background-position:0 0;}
    #tabTl.hd1{background-position:-51px 0;}
    #tabTl.hd2{background-position:-102px 0;}
    #tabTl.hd3{background-position:-153px 0;}
    .intro-tabshow .tl-item{display:block;width:40px;height:55px;text-indent:-9999em;cursor:pointer;}
    .intro-tabshow .bd{width:445px;height:240px;}
    .intro-tabshow .tab-info{width:100%;height:100%;cursor:pointer;}
    .v-su{background:url(../images/intro/intro1.jpg) no-repeat 0 0 ;}
    .v-zhan{background:url(../images/intro/intro2.jpg) no-repeat 0 0 ;}
    .v-bian{background:url(../images/intro/intro3.jpg) no-repeat 0 0 ;}
    .v-xie{background:url(../images/intro/intro4.jpg) no-repeat 0 0 ;}

    .intro-wrap .show-con{margin-top:36px;}
    .intro-wrap .show-con .info{display: none;}
    .intro-wrap .show-con .title, 
    .war-wrap .title, 
    .pack-wrap .title{font-size:25px;color:#fff;line-height:25px;}
    .intro-wrap .show-con .title em, 
    .war-wrap .title em,
    .pack-wrap .title em{color:#f00;}
    .intro-wrap .show-con .desc,  .war-wrap .desc{color:#c8c8c8;}
    .intro-wrap .icon-tabarrow{margin-left:0;}
	

/* section 4 */
.section-bg4{height:375px;border-bottom:150px solid #000;background:url(../images/section-bg4.png) center 0 no-repeat;}
	
	.tl4{right:50px;top:-80px;}
	.wei{position:absolute;left:-120px;top:-330px;width:740px;height:656px;}

	.war-wrap{padding:70px 0 0 80px;}
	.war-wrap .tab-title{height:264px;}
	.war-wrap .tab-list{margin-top:6px;}
	.war-tl{position:absolute;top:0;left:0;width:521px;height:247px;background:url(../images/war-map.png) no-repeat 0 0;text-indent:-999em;}
	.war-tl:hover{

	}
	#liangcao{left:310px;top:15px;background-position:0 -248px;}
	#gouzi.current, #liangcao.current{z-index:2;}

/* section 5 */
.section-bg5{height:515px;border-top:10px solid #f00;}
	.section-5 .more{margin:13px auto 0;*margin-top:7px;width:1000px;}
	.section-5 .more a{display:inline-block;width:91px;height:25px;background:url(../images/more.png) no-repeat 0 0;line-height:999em;overflow:hidden;}
	.section-5 .more a:hover{background-position:0 -25px;}

	/* hero */
	.avatar{float:left;width:58px;height:58px;background:url(../images/hero-avatar.png) no-repeat 0 0;text-indent:-999em;cursor:pointer;}
	#avatar-1{background-position: 0 -60px;}
	#avatar-2{background-position: -75px -60px;}
	#avatar-3{background-position: -151px -60px;}
	#avatar-4{background-position: -228px -60px;}
	#avatar-5{background-position: -304px -60px;}
	#avatar-6{background-position: -380px -60px;}
	#avatar-7{background-position: -458px -60px;}
	#avatar-8{background-position: -534px -60px;}
	#avatar-9{background-position: -613px -60px;}
	#avatar-10{background-position: -690px -60px;}

	#avatar-1:hover, #avatar-1.current{background-position: 0 0;}
	#avatar-2:hover, #avatar-2.current{background-position: -75px 0;}
	#avatar-3:hover, #avatar-3.current{background-position: -151px 0;}
	#avatar-4:hover, #avatar-4.current{background-position: -228px 0;}
	#avatar-5:hover, #avatar-5.current{background-position: -304px 0;}
	#avatar-6:hover, #avatar-6.current{background-position: -380px 0;}
	#avatar-7:hover, #avatar-7.current{background-position: -458px 0;}
	#avatar-8:hover, #avatar-8.current{background-position: -534px 0;}
	#avatar-9:hover, #avatar-9.current{background-position: -613px 0;}
	#avatar-10:hover, #avatar-10.current{background-position: -690px 0;}

	.hero-wrap{padding-top:78px;}
	.hero-list{width:100%;height:278px;background:#000;overflow:hidden;}
	.hero-list ul {float:left;}
	.hero{float:left;margin-left:-34px;width:259px;height:274px;font-size:50px;color:#f00;}
	.hero a{display:block;width:100%;height:100%;background:url(../images/hero-list.png) no-repeat 0 0;cursor:default;}
	.hero1 a{background-position:0 -274px;}
	.hero2 a{background-position:-259px -274px;}
	.hero3 a{background-position:-518px -274px;}
	.hero4 a{background-position:-777px -274px;}
	.hero5 a{background-position:-1036px -274px;}
	.hero6 a{background-position:-1295px -274px;}
	.hero7 a{background-position:-1554px -274px;}
	.hero8 a{background-position:-1813px -274px;}
	.hero9 a{background-position:-2072px -274px;}
	.hero10 a{background-position:-2331px -274px;}

	.hero1 a:hover, .hero1 a.current{background-position:0 0;}
	.hero2 a:hover, .hero2 a.current{background-position:-259px 0;}
	.hero3 a:hover, .hero3 a.current{background-position:-518px 0;}
	.hero4 a:hover, .hero4 a.current{background-position:-777px 0;}
	.hero5 a:hover, .hero5 a.current{background-position:-1036px 0;}
	.hero6 a:hover, .hero6 a.current{background-position:-1295px 0;}
	.hero7 a:hover, .hero7 a.current{background-position:-1554px 0;}
	.hero8 a:hover, .hero8 a.current{background-position:-1813px 0;}
	.hero9 a:hover, .hero9 a.current{background-position:-2072px 0;}
	.hero10 a:hover, .hero10 a.current{background-position:-2331px 0;}

	.avatar-list{margin: 65px auto 0;width:760px;}
	.avatar-list li{margin-right:15px;}

	.hero-layer{display:none;z-index:999;position:absolute;width:178px;height:245px;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#F21F222B', endColorstr='#F21F222B');background:rgba(31,34,43,0.95);}
	:root .hero-layer{filter:none;}/*for IE9*/
	.hero-layer .inner{padding:20px 0 0 24px;color:#fefefe;}
	.hero-layer .name{height:35px;line-height:35px;font-size:30px;}
	.hero-layer .label span{display:inline-block;padding:0 4px;margin-right:4px;height:16px;line-height:16px;background:#00A398;color:#fff;}
	.hero-layer .bar{display:inline-block;*display:inline;margin-left:10px;background:#363C3C;width:90px;height:12px;vertical-align:middle;}
	.hero-layer .bar em{position:absolute;top:0;left:0;display:inline-block;height:100%;}
	.surv em{background:#F2C500;}
	.phis em{background:#2C97DE;}
	.tech em{background:#1ECA6B;}

	.star{display:inline-block;margin-left:10px;vertical-align:middle;width:82px;height:14px;background:url(http://www.m3guo.com/v2/images/hd-level-tips.png) no-repeat 0 0;}
	.star2{background-position:0 -14px;}
	.star3{background-position:0 -28px;}
	.star4{background-position:0 -42px;}
	.star5{background-position:0 -56px;}
	.star6{background-position:0 -70px;}
	.star7{background-position:0 -84px;}
	.star8{background-position:0 -98px;}
	.star9{background-position:0 -112px;}
	.star10{background-position:0 -126px;}

/* section 6 */
.section-bg6{height:500px;border-top:60px solid #f00;border-bottom:10px solid #f00;}
	.tl6{left:190px;top:-80px;*top:-150px;}

	.icon-num{display:inline-block;margin-top:-5px;_margin-top:15px;margin-right:10px;width:30px;height:30px;background:url(../images/num.png) no-repeat 0 0;vertical-align:middle;_vertical-align:text-bottom;}
	.icon-num1{background-position: 0 0;}
	.icon-num2{background-position: -30px 0;}
	.icon-num3{background-position: -60px 0;}
	.icon-num4{background-position: -90px 0;}
	.icon-num5{background-position: -120px 0;}

	.pack-wrap{margin-top:-60px;}
	.pack-wrap .tab-title{height:60px;/*overflow:hidden;*/}
	.pack-wrap .tab-link{float:left;position:relative;zoom:1;margin-right:1px;width:249px;height:59px;text-align:center;font-size:22px;color:#fff;line-height:59px;background:#c40000;}
	.pack-wrap .current .icon-arrow{display:block;_display:none;}
	.pack-wrap .current, .pack-wrap .tab-link:hover{background:#9C0000;}
	.pack-wrap .desc{color:#fff;line-height:26px;}
	.pack-wrap .desc em{color:#f00;}
	.pack-wrap .tab-info{padding-top:75px;}
	.get-btn, .reg-btn{display:inline-block;padding:0 20px;height:42px;line-height:42px;color:#fff;background:#C40000;}
	.reg-btn{padding:0 70px;height:38px;line-height:38px;}
	.get-btn:hover, .reg-btn:hover{background: #9C0000;color:#fff;}

	/* 7day */
	.tb-7day{color:#490000;}
	.tb-7day th{padding:8px 0;width:12.5%;background:#C40000;border:1px solid #222;}
	.tb-7day td{border:1px solid #222;padding:10px 0;vertical-align:top;
		filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#33FFFFFF', endColorstr='#33FFFFFF');background:rgba(255,255,255,0.2);}
	.tb-7day .name{background:#C40000;font-size:30px;line-height:45px;filter:none;vertical-align:middle;}
	.icon{display:inline-block;margin-bottom:5px;width:46px;height:46px;background:url(../images/icon-sprite.jpg) no-repeat 0 0;}
	.icon1{background-position: 0 0;}
	.icon2{background-position: -46px 0;}
	.icon3{background-position: -92px 0;}
	.icon4{background-position: -138px 0;}
	.icon5{background-position: -184px 0;}
	.icon6{background-position: -230px 0;}
	.icon7{background-position: -276px 0;}
	.icon8{background-position: -322px 0;}
	.icon9{background-position: -368px 0;}
	.icon10{background-position: -414px 0;}

	.icon11{background-position: 0 -46px;}
	.icon12{background-position: -46px -46px;}
	.icon13{background-position: -92px -46px;}
	.icon14{background-position: -138px -46px;}
	.icon15{background-position: -184px -46px;}
	.icon16{background-position: -230px -46px;}
	.icon17{background-position: -276px -46px;}
	.icon18{background-position: -322px -46px;}
	.icon19{background-position: -368px -46px;}
	.icon20{background-position: -414px -46px;}

	.icon21{background-position: 0 -92px;}
	.icon22{background-position: -46px -92px;}
	.icon23{background-position: -92px -92px;}
	.icon24{background-position: -138px -92px;}
	.icon25{background-position: -184px -92px;}
	.icon26{background-position: -230px -92px;}
	.icon27{background-position: -276px -92px;}
	.icon28{background-position: -322px -92px;}
	.icon29{background-position: -368px -92px;}
	.icon30{background-position: -414px -92px;}

	/* apple watch */
	.watch-list{margin-top:60px;}
	.watch{display:inline-block;margin-right:15px;width:124px;height:124px;background:url(../images/apple-watch.png) no-repeat 0 0;}
	.watch-white{background-position:0 0;}
	.watch-blue{background-position:-140px 0;}
	.watch-green{background-position:-280px 0;}
	.watch-pink{background-position:-420px 0;}
	.watch-black{background-position:-560px 0;}

	/* buff table */
	.prize-tb{margin:40px auto 0;}
	.prize-tb th{padding:10px 0;background:#C40000;color:#490000;border:1px solid #252523;}
	.prize-tb td{padding:10px 0;border:1px solid #252523;color:#e4e4e4;
		filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#33FFFFFF', endColorstr='#33FFFFFF');background:rgba(255,255,255,0.2);}

	/* new map*/
	.news-map{margin:30px auto 0;width:709px;height:269px;background:url(../images/new-map.png) no-repeat 0 0;text-indent:-999em;}

/* section 7 */
.section-bg7{height:565px;border-top:10px solid #f00;}

	.tl7{left:300px;top:-142px;}
	.sunce{position:absolute;left:-240px;top:90px;width:974px;height:476px;}
	.dianwei{position:absolute;right:-60px;top:105px;width:484px;height:444px;}
	.new-area{position:absolute;left:330px;top:128px;width:201px;height:124px;background:url(../images/new-area.png) no-repeat 0 0;text-indent:-999em;
		opacity:0;
		-webkit-transition: all 1s;
	    -moz-transition: all 1s;
	    transition: all 1s; 
	    transition-delay: 1s;
	    -webkit-transition-delay: 1s;
	    -webkit-transform: scale3d(0, 0, 0);
	    -moz-transform: scale3d(0, 0, 0);}
	.active .new-area{
		opacity:1;
		-webkit-transform: scale3d(1, 1, 1);
	    -moz-transform: scale3d(1, 1, 1);
	}
	
	.dust{position:absolute;top:0;left:-406px;width:1695px;height:611px;background:url(../images/dust.png) no-repeat 0 0;}
	.area-wt{left:auto;top:180px;right:180px;background-position:-201px 0;}

	.activity{position:absolute;top:-70px;right:0;width:158px;}
	.show-menu{float:left;width:158px;}
	.show-menu a{display:block;width:158px;height:43px;line-height:43px;background:url(../images/new-area.png) no-repeat -406px 0;color:#fff;}
	.show-menu .icon-com{margin:0 10px 0 0;width:23px;_width:22px;height:23px;vertical-align:middle;_margin-top:12px;overflow:hidden;_vertical-align:text-bottom;}
	.show-menu a:hover{color:#fff;}

	.area-intro{position:absolute;left:448px;top:290px;
		-webkit-transition: all 1s;
	    -moz-transition: all 1s;
	    transition: all 1s; 
	    transition-delay: 1s;
	    -webkit-transition-delay: 1s;
	    -webkit-transform: translateY(1000px);
	    transform: translateY(1000px);
		background:url(../images/kitchen.png);}
	.active .area-intro{
		-webkit-transform: translateY(0);
	    transform: translateY(0);
	}
	.area-intro .title{color:#e72b2b;}
	.area-intro .desc{color:#ddd;}

	.activity-wrap{position:absolute;top:-10px;left:0;width:100%;height:575px;display:none;}
	.show-box{margin:40px auto 0;width:720px;height:498px;background:#D20303;color:#fffad0;}
	.show-box .inner{padding:30px 0 0 80px;}
	.show-box .desc{color:#fffad0;}
	.iclose{position:absolute;top:10px;right:10px;width:44px;height:44px;background:url(../images/hd-sprite.png) no-repeat -765px 0;text-indent:-999em;}
	.tb-activity{border:1px solid #700505;}
	.tb-activity th{padding:10px 0;background:#700505;border:1px solid #700505;}
	.tb-activity .bd-l{border-left-color:#D00202;}
	.tb-activity .bd-r{border-right-color:#D00202;}
	.tb-activity td{height:70px;border:1px solid #960101;}
	/*.icon-wrap{display:block;height:50px;}*/
	/*.icon{display:inline-block;width:50px;height:50px;}*/

	.sday-wrap{margin-top:-30px;}
	.tb-7day{margin:20px auto 0;}

:root .grey-opacity, 
:root .section-bg3 .left-bg,
:root .section-bg3 .right-bg,
:root .prize-tb td{filter:none;}/*for IE9*/

/* animate */
.war-tl:hover {
   -webkit-animation-name: pulse;
   animation-name: pulse;

   -webkit-animation-duration: 1s;
   animation-duration: 1s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    -ms-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

	@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    -ms-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    -ms-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;

  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    -ms-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    -ms-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    -ms-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    -ms-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    -ms-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing:hover{
	color:#b00;
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
  
}
.swing:hover,
.animate,
.section-1.active .title,
.section-1.active .boom-tl,
.section-1.active .down-btn{-webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;}

.sun-infi {
     -webkit-transition: transform 1.5s;
     -webkit-animation: rotate 1.5s linear infinite;
     -moz-animation: rotate 1.5s linear infinite;
     -o-animation: rotate 1.5s linear infinite;
     animation: rotate 1.5s linear infinite;
}
@-webkit-keyframes rotate{
     from {
          -webkit-transform: rotate(0deg);
     } to {
          -webkit-transform: rotate(360deg);
     }
}
@-moz-keyframes rotate{
     from {
          -moz-transform: rotate(0deg);
     } to {
          -moz-transform: rotate(360deg);
     }
}
@keyframes rotate{
     from {
          transform: rotate(0deg);
     } to {
          transform: rotate(360deg);
     }
}


@-webkit-keyframes zoomOut {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 0.6;
    -webkit-transform: scale3d(5, 5, 5);
    transform: scale5d(5, 5, 5);
  }
  70% {
    opacity: 0.8;
    -webkit-transform: scale3d(1.8, 1.8, 1.8);
    transform: scale3d(1.8, 1.8, 1.8);
  }

  100% {
    opacity: 1;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 0.6;
    -webkit-transform: scale3d(5, 5, 5);
    -ms-transform: scale5d(5, 5, 5);
    transform: scale5d(5, 5, 5);
  }
  70% {
    opacity: 0.8;
    -webkit-transform: scale3d(1.8, 1.8, 1.8);
    transform: scale3d(1.8, 1.8, 1.8);
  }
  100% {
    opacity: 1;
  }
}

.section-1.active .boom-tl {
	animation-delay:1s;
	-webkit-animation-delay:1s;
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
}

.section-1.active .down-btn{
	animation-delay:2s;
	-webkit-animation-delay:2s;
	-webkit-animation-name: bounceInUp;
  	animation-name: bounceInUp;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -ms-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    -ms-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px);
    -ms-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.section-1.active .title {
  -webkit-backface-visibility: visible;
  -ms-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    -ms-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    -ms-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    -ms-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    -ms-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.zb-list{
  width: 1200px;
  height: 500px;
  margin: 70px auto 0;
}
/* .zb-list li{
  float: left;
  margin: 0 20px 20px;
} */

.zb-list li{
  width: 66px;
  height: 66px;
  float: left;
  margin: 0 34px 100px;
  position: relative;
}
.zb-list li img{
  width: 100%;
  height: 100%;
}
.newDiv{
  position: fixed;
  z-index: 99;
  border: 1px solid #614635;
  background: #3c2116;
  padding: 5px;
  color: #fff;
}

.mask{
  position: absolute;
  top: -51px;
  left: -51px;
  width: 168px;
  height: 168px;
  background: url(../images/gq/gq1.png) no-repeat;
  background-size: 100% 100%;
  animation: gq 1s infinite;
}
@keyframes gq {
  0%{background: url(../images/gq/gq1.png) no-repeat;background-size: 100% 100%;}
  12.5%{background: url(../images/gq/gq2.png) no-repeat;background-size: 100% 100%;}
  25%{background: url(../images/gq/gq3.png) no-repeat;background-size: 100% 100%;}
  37.5%{background: url(../images/gq/gq4.png) no-repeat;background-size: 100% 100%;}
  50%{background: url(../images/gq/gq5.png) no-repeat;background-size: 100% 100%;}
  62.5%{background: url(../images/gq/gq6.png) no-repeat;background-size: 100% 100%;}
  75%{background: url(../images/gq/gq7.png) no-repeat;background-size: 100% 100%;}
  87.5%{background: url(../images/gq/gq8.png) no-repeat;background-size: 100% 100%;}
}
