@import "animate.css";
body{   font: 14px/1.5 "Microsoft Yahei", Helvetica, Tahoma, sans-serif;}
.doc{overflow: hidden;position: relative;}
.inner{ width: 1120px; margin: 0 auto; position: relative; }
.firstinner{ width: 100%; }
.area{ font-size: 14px; }
.cov{ position: absolute; display: block;  }
.header {text-align: center;overflow: hidden;position: relative;}
.header .video{margin: 0 auto;position: absolute;left: 0;top:0;z-index: -1; width: 100%;}
.header .logo{left: -51px;top: 31px;width: 223px;/* height: 122px; */z-index: 9;}
.header .text{left: 50%;top: 78%;margin-left: -514px;width: 100%;color: #FFF;font-size: 14px;line-height: 199%;z-index: 5;}
 .bbbg{ left: 0; top: 0; width: 100%;height: 100%; background:rgba(0,0,0,0.65); z-index: 1 }
.header .midlogo {left: 25%;top: 104%;z-index: 9;position: absolute;width: 50%;}
.header .nexttip{display: block;width: 13px;height: 56px;position: absolute;left: 50%;bottom: 0;z-index: 5;margin-left: -5px;}
.header .nexttip i{ display: block; width: 13px; height: 30px; background: url(/www1/theme/powerstar01/images/tisap.png) no-repeat center top; 
-webkit-animation: fadeInDown 1s linear infinite;animation: fadeInDown 1s linear infinite;
 }
 .header .nexttip em{ display: block; width: 1px; height: 30px; bottom: 0; left: 0; position: absolute; }

 .apl{width: 17px;height: 28px;background: url(/www1/theme/powerstar01/images/apl.png) no-repeat center;/* display: block; *//* float: left; */padding: 0 10px;}
 .gifpng{width: 40%;height: 56%;left: 50%;margin-left: -20%;top: 10%;z-index: 8;}
  .gifpng.act1{ background: url(/www1/theme/powerstar01/images/mov-1.png) no-repeat center top; background-size: auto 100%;}
  .gifpng.act2{ background: url(/www1/theme/powerstar01/images/mov-2.png) no-repeat center top;background-size:auto  100%; }
  .gifpng.act3{ background: url(/www1/theme/powerstar01/images/mov-3.png) no-repeat center top; background-size:auto  100%;}
  .gifpng.act4{ background: url(/www1/theme/powerstar01/images/mov-4.png) no-repeat center top; background-size:auto  100%;}
  .gifpng.act5{ background: url(/www1/theme/powerstar01/images/mov-5.png) no-repeat center top; background-size: auto 100%;}
  .gifpng.act6{ background: url(/www1/theme/powerstar01/images/mov-6.png) no-repeat center top; background-size:auto  100%;}
  .gifpng.act7{background: url(/www1/theme/powerstar01/images/mov-7.png) no-repeat center;background-size: auto 100%;}
  .qrcode{position: fixed;left: 50%;margin-left: 561px;top: 20%;z-index: 9;display: none;}
  .menu.black a{background: #FFF;}
  .menu.black em{background: #d2cdcd;}
  .menu.white a{background: #d2cdcd;}
  .menu.black i{background:url(/www1/theme/powerstar01/images/chatbgbak.png) no-repeat center left;}
  .menu.white i{background:url(/www1/theme/powerstar01/images/chatbg.png) no-repeat center left;}

  .menu{ width: 162px; height: 136px;  z-index: 19; position: fixed; left: 30px; top:290px;  }
  .menu a{ display: block; width: 12px; height: 3px; margin-bottom: 19px; background: #FFF; position: relative;
        -webkit-transition: margin-left .5s;
    -moz-transition: margin-left .5s;
    -ms-transition: margin-left .5s;
    -o-transition: margin-left .5s;
    transition: margin-left .5s;
  }
  .menu a.prevspan,.menu a.nextspan{ margin-left: 8px;
-webkit-transition: margin-left .5s;
    -moz-transition: margin-left .5s;
    -ms-transition: margin-left .5s;
    -o-transition: margin-left .5s;
    transition: margin-left .5s;
   }
 
  .menu a.cur{ width: 12px; height: 3px;  background: #98372f; margin-left: 15px;
    -webkit-transition: margin-left .5s;
    -moz-transition: margin-left .5s;
    -ms-transition: margin-left .5s;
    -o-transition: margin-left .5s;
    transition: margin-left .5s;
    }
  .menu a i{ overflow: hidden;    position: absolute;left: 0px;top: -15px; background:url(/www1/theme/powerstar01/images/chatbgbak.png) no-repeat center left;width: 0px;height: 33px;line-height: 33px;text-align: center;color: #FFF;
-webkit-transition: width .2s, left .2s;
    -moz-transition: width .2s, left .2s;
    -ms-transition: width .2s, left .2s;
    -o-transition: width .2s, left .2s;
    transition: width .2s, left .2s;
  }
  .menu a em{ height: 1px;width:0px;background: #FFF;position: absolute;left: 20px;top: 1px; 
        -webkit-transition: width .5s;
    -moz-transition: width .5s;
    -ms-transition: width .5s;
    -o-transition: width .5s;
    transition: width .5s;
  }
  .menu a.cur i{ display: block; width: 94px; background:url(/www1/theme/powerstar01/images/chatbg.png) no-repeat center left; left: 64px;
-webkit-transition: width .2s, left .2s;
    -moz-transition: width .2s, left .2s;
    -ms-transition: width .2s, left .2s;
    -o-transition: width .2s, left .2s;
    transition: width .2s, left .2s;
   }
  .menu a.cur em{display: block; width: 40px;
    -webkit-transition: width .5s;
    -moz-transition: width .5s;
    -ms-transition: width .5s;
    -o-transition: width .5s;
    transition: width .5s;
    }

  .line{width: 4px;height: 127px;display: block;background: #000;left: 50%;top: -52px;z-index: 9;position: absolute;  }

  .fl,.fr{ float: left; }
  .area1{background: #f6f6f6;height: 396px;padding-top: 36px;}
  .area1 .line{height: 68px;background:#fff}
  .area1.cur .line{background: #f6f6f6;width: 2px;}
  .area1 .headtit{ height: 115px; background: url(/www1/theme/powerstar01/images/a-tit1.png) no-repeat center; }
   .area1 .col{ overflow: hidden; height: 250px; }
   .area1 .fl{width: 610px;}
   .area1 .fr{ width: 510px; background: url(/www1/theme/powerstar01/images/area1-colbg.png) no-repeat center;}
   .area1 .imgbox{ float: left; width: 242px;  margin-right: 15px; }
   .area1 .sum{float: left;width: 350px;padding-top: 25px;}
   .area1 .sum ul li{/* height: 45px; */line-height: 45px;float: left;width: 100%;}
   .area1 .sum span{float:left;margin-right: 10px;width: 245px;}
   .area1 .sum strong{float:left;margin-right: 2px;}
   .area1 .apl{height: 20px;margin-top: 13px;margin-right: 5px;float: left;padding: 0 0px;}
    .area1 .fr p.text{line-height: 30px;color: #333333;width: 283px;padding: 45px 28px;}
    .area2{ background: #FFF; height: 1582px; }
  .area2 .headtit{height: 115px;background: url(/www1/theme/powerstar01/images/a-tit2.png) no-repeat center bottom;padding-top: 30px; }
  .area2 .m-bg{left: -176px;top: 150px;width: 280px;height: 199px;background: url(/www1/theme/powerstar01/images/area2-mbg.png) no-repeat center;z-index:0;}
  .mainvideo{width: 1120px;height: 630px;left: 0;top: 176px;z-index:  1; opacity: 0} 
   .mainvideo .play{left: 424px;top: 270px;width: 273px;height: 131px;background: url(/www1/theme/powerstar01/images/playbtn.png) no-repeat center;z-index: 5;cursor: pointer;}
   .scrollcol{width: 1110px;height: 644px;border: solid 5px #000;left: 0;top: 828px;     overflow: hidden;}
   .scroll{
    width: 1007px;
    padding: 25px 25px 25px 25px;
    line-height: 34px;
    color: #4b4b4b;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    float: left;
   }
   .scroll img{padding: 0px 18px 10px;}
   .scroll h2{ font-size:18px}

 .data {width: 765px;float: left;height: 100%;overflow: hidden;}
  .tool {width: 21px;height: 645px;position: absolute;right: 5px;top: 833px;z-index: 5;}
  .tool  .sBar {width: 21px;position: absolute;top: 0;/* left: -5px; */background: #98372f;overflow: hidden;}
 .tool .sBar .mbg {width: 10px;height: 7px;display: block;position: absolute;left: 0;top: 50%;margin-top: -4px;overflow: hidden;}
 

 .area3{ background: #eeeeee; height: 984px; }
 .area3 .wbg{background: #FFF;width: 370PX;height: 222px;left: 62px;top: 478px;display: block;}
  .area3 .headtit{height: 115px;background: url(/www1/theme/powerstar01/images/a-tit3.png) no-repeat center bottom;padding-top: 30px;}
  .area3 .fl{ width: 555px; }
  .area3 .fl .sum{width: 515px;height: 230px;background: #FFF;margin-bottom: 40px;padding: 20px;line-height: 34px;}
  .area3 .fl .tit{float: left;margin-bottom: 28px;}
  .area3 .fl .sport{float: left;  width: 555px; height: 262px; background: url(/www1/theme/powerstar01/images/shujutu.png) no-repeat center left;}
  .sport .data{float: left;margin-left: 237px;}
  .sport .data dd{width: 100%;height: 22px;line-height: 55px;padding: 10px 0;margin-bottom: 13px;}
  .sport .data dd.red i{background: url(/www1/theme/powerstar01/images/redline.png) repeat-x;}
  .sport .data dd i{ display: block; width: 0px; height: 22px; float: left; background: url(/www1/theme/powerstar01/images/bakline.png) repeat-x; }

  .sport .data dd span{display: block;width: 95px;height: 22px;padding-left: 22px;line-height: 22px;float: left;background: url(/www1/theme/powerstar01/images/chatbgbak.png) no-repeat center;color: #FFF;}
  .sport .data dd.red span{background: url(/www1/theme/powerstar01/images/chatbg.png) no-repeat center;}
 .area3 .lookag{left: -126px;top: 70px;width: 174px;height: 65px;z-index: 19;background: url(/www1/theme/powerstar01/images/lookag2.png) no-repeat center;}
 .area3 .lookag2{background: url(/www1/theme/powerstar01/images/lookag.png) no-repeat center;} 
 .area3 .goods{left: -137px;top: 442px;width: 252px;z-index: 9;}
 .area3 .slider{width: 414px;height: 668px;float: left;overflow: hidden;/* margin-left: 149px; */position: relative;}
 .area3 .slider li{width: 414px;height: 668px;position: relative; overflow: hidden;}
 .area3 .slider li .tit{ width: 182px; color: #FFF; font-size: 12px;line-height: 20px; position: absolute; left: 200px; top: 606px; }
.addicon {position: absolute;left: 35%;top: 20%;width: 21px;height:21px;display: block;background:url(/www1/theme/powerstar01/images/add.png) no-repeat center;}
.addicon .txt{display: block;left: -122px;top: -69px;width: 220px;height: 43px;background:#333333;color: #FFF;font-size: 12px;line-height: 24px;padding: 18px;position: absolute;display: none;}
.addicon .txt FONT{ display: block; color: #af6b65; }
   .area3  .fr{position: relative;margin-left: 149px;}
   .btn{width: 50px;height: 50px;position: absolute;display: block;background: url(/www1/theme/powerstar01/images/btn.png) no-repeat 0 0;z-index: 52;}
   .prev{   background-position: 0 0; }
   .next{background-position: -59px 1px;}
    a.prev:hover{background-position: 0 -49px;}
    a.next:hover{background-position: -57px -50px;}
    .area3  .fr .btn{ top: 309px; }
    .area3  .fr .prev{left: -30px; }
    .area3  .fr .next{ left: 398px;}

   .area4 .line2{width: 4px;height: 212px;background: #FFF;left: 967px;top: -184px;display: block;z-index: 9;}

    .area4{ background: url(/www1/theme/powerstar01/images/area4bg.jpg) no-repeat center; height: 882px; }
  .area4 .headtit{height: 115px;background: url(/www1/theme/powerstar01/images/a-tit4.png) no-repeat center bottom;padding-top: 81px;}
   .area4 .summary{width: 1120px;line-height: 34px;color: #9a9a9a;margin-bottom: 60px;}
   .area4 .fl{width: 600px; }
   .videotab .vbox{width: 272px;height: 210px;float: left;margin-right: 28px;margin-bottom: 20px;position: relative;}
   .videotab .vbox .step{width: 111px;height: 73px;position: absolute;left: 0;top: 70px;display: block; text-align: left;}
   .videotab .vbox .sum{ height: 52px;  margin-top: 32px; text-align: left; color: #FFF; line-height: 24px; font-size: 12px;  }
   .area4 .fr{width: 520px; background: rgba(50,50,50,0.9); padding-bottom: 5px;}
   .area4 .fr .actmov{
    width: 520px;
    background: #333333;
}
 .area4 .fr .actmov h2{
    color: #FFF;
    FONT-SIZE: 28px;
    text-align: center;
    padding: 30px;
    font-family: "SimSun";
}
.area5{ background:#FFF; height: 1024px; }
.area5 .line{ left: 949px; }
  .area5 .headtit{height: 115px;background: url(/www1/theme/powerstar01/images/a-tit5.png) no-repeat center bottom;padding-top: 30px;margin-bottom: 10px;}
  .area5 .hd{width: 100%;height: 60px;position: relative;float: left;}
  .area5 .hd .face{width: 160px;height: 160px;border-radius: 50%;overflow: hidden;position: absolute;left: 0;top: 0;z-index: 0;}
  .area5 .hd .info{float: left;margin-left: 134px;position: absolute;left: 0;top: 0;z-index: 1;}
   .area5 .hd .info dl{
    /* padding-left: 20px; */
}
  .area5 .hd .info dt{border-bottom: solid 3px #000;height: 34px;line-height: 34px;color: #333333;font-size: 16px;padding-left: 40px;}
  .area5 .hd .info dd{  line-height: 34px;   color: #333; padding-left: 40px;}
  .albem{width: 100%;position: relative;clear: both;margin-top: 180px;}
  .albem .alb1{left: 0;top: 91px;width: 315px;height: 355px;padding: 30px;background: #eeeeee;}
  .albem .alb1 .bbbg{width: 315px;height: 355px;margin: 30px;}
  .albem .alb1 .atxt em{/* padding: 30px 40px; */}
  .albem .alb2{left: 407px;top: 0;width: 403px;height: 248px;}
  .albem .alb3{ left: 838px; top: 0; width: 283px; height: 247px; }
  .albem .alb4{ left: 407px; top: 317px; width: 326px; height: 288px; }
  .albem .alb5{ left: 769px; top: 260px; width: 293px; height: 344px; }
  .albem .mark{left: 353px;top: 274px;} 
  .albem .atxt{position: absolute;left: 0;top: 0;font-size: 14px;line-height: 34px;color: #FFF;display: none;/* display: table; */vertical-align: middle;} 
  .albem .atxt em{padding: 30px 20px;display: table-cell;text-align: left;height: 90px;vertical-align: middle;}

  .area6{background: url(/www1/theme/powerstar01/images/area6bg.jpg) no-repeat center top;height: 476px;}
  .area6 .col{color: #cecece;font-size: 14px;}
  .area6 .info1{ width: 526px; height: 206px; left: 0; top:196px; }
  .area6 .info1 dl{float: left;width: 254px;}
  .area6 .info1 dd{line-height: 58px;height: 58px;margin-left: 30px;}
  .area6 .info1 dd font{ font-size: 32px; color: #71413d; font-weight: bold; }
  .area6 .info2{ width: 318px; height: 266px; left: 803px; top:142px; }
  .area6 .info3{ left: 0; top: 586px; width: 550px; height: 245px; }
  .area6 .info3 .btn{
    top: 80px;
}
  .area6 .info3 .prev{
    left: -30px;
}
  .area6 .info3 .next{
    left: 528px;
}

  .area6 .info4{left: 782px;top: 542px;width: 370px;height: 226px;}
  .aboutus{ font-size: 13px; line-height: 50px;  }
  .aboutus li{height: 56px;line-height: 56px;width: 100%;clear: both;}
  .aboutus li span{display: block;float: left;width: 185px;margin-right: 20px;}
  .aboutus li span.s2{width: 122px;}
  .slider2 {
    width: 558px;
    height: 250px;
    overflow: hidden;
}
  .slider2 li{
    width: 272px;
    height: 250px;
    float: left;
    margin-right: 7px;
}
  .slider2 li span{
    width: 272px;
    height: 30px;
    line-height: 30px;
    display: block;
    color: #FFF;
    position: relative;
    text-align: center;
    display: none;
}
.slider2 li.current span{ display: block; }
.slider2 li span em{font-size: 38px;padding-left: 9px;font-family: "SimSun";}
.slider2 li span i{position: absolute;left: 10px;top: -20px;background: #FFF;z-index: 10;display: block;width: 250px;height: 3px;}
.slider2 li span .apl{padding-right: 18px;background-position: left;padding-left: 0;}
#slide .data {width: 765px;float: left;height: 100%;overflow: hidden;}
#slide .tool {width: 10px;height: 100%;float: right;border-left: 1px solid #ddd;position: relative;}
#slide .sBar {width: 10px;position: absolute;top: 0;left: -5px;background: #d8d8d8;overflow: hidden}
 #slide .sBar .mbg {width: 10px;height: 7px;display: block;background: url(/www1/global/2014/images/mdxy/mdxylicon.png) -735px -434px no-repeat;position: absolute;left: 0;top: 50%;margin-top: -4px;overflow: hidden;}
 
.slider2 li span img{ position:  absolute; left: 11px; bottom:0; }
  .headtit,.line,.line2{ 
     -webkit-transform: translate3d(0,900px,0);
    transform: translate3d(0,900px,0);
   }
 .cur .line,.cur  .line2{
 -webkit-animation: bounceInUp 1s both ease-in-out 0s;
  animation: bounceInUp 1s both ease-in-out 0s;

 }
 .cur .headtit{
    -webkit-animation: bounceInUp 0.5s both ease-in-out 0s;
  animation: bounceInUp 0.5s both ease-in-out 0s;
    }
     .cur .htit2{
    -webkit-animation: bounceInUp 0.5s both ease-in-out 1.5s;
  animation: bounceInUp 0.5s both ease-in-out 1.5s;
    }
    
  .sport .data dd i{
      -webkit-transition: width 1.5s;
    -moz-transition: width 1.5s;
    -ms-transition: width 1.5s;
    -o-transition: width 1.5s;
    transition: width 1.5s;
  }

 .area1.cur .fl {
  -webkit-animation: fadeInLeft 0.5s both ease-in-out 0.5s;
  animation: fadeInLeft 0.5s both ease-in-out 0.5s;
}

.area1.cur .fr {
  -webkit-animation: fadeInRight 0.5s both ease-in-out 0.5s;
  animation: fadeInRight 0.5s both ease-in-out 0.5s;
}
.area2.cur .mainvideo {
  -webkit-animation: fadeInDown 0.5s both ease-in-out 0s;
  animation: fadeInDown 0.5s both ease-in-out 0s;
}
.area2.cur .scrollcol,.area2.cur .tool {
  -webkit-animation: fadeInUp 0.5s both ease-in-out 1.5s;
  animation: fadeInUp 0.5s both ease-in-out 1.5s;
}

.area3.cur .sum{

  -webkit-animation: fadeInLeft 0.5s both ease-in-out 0.5s;
  animation: fadeInLeft 0.5s both ease-in-out 0.5s;
}

.area3.cur .sport,.area3.cur .tit{

  -webkit-animation: fadeInLeft 0.5s both ease-in-out 1s;
  animation: fadeInLeft 0.5s both ease-in-out 1s;
}

.area3.cur .spdr{

  -webkit-animation: fadeInRight 0.5s both ease-in-out 1.5s;
  animation: fadeInRight 0.5s both ease-in-out 1.5s;
}

.area4.cur .summary {
  -webkit-animation: fadeInUp 0.5s both ease-in-out 0s;
  animation: fadeInUp 0.5s both ease-in-out 0s;
}

.area4.cur .vbox:nth-child(1) {
  -webkit-animation: fadeInLeft 0.5s both ease-in-out 0.5s;
  animation: fadeInLeft 0.5s both ease-in-out 0.5s;
}

.area4.cur .vbox:nth-child(2) {
  -webkit-animation: fadeInLeft 0.5s both ease-in-out 1s;
  animation: fadeInLeft 0.5s both ease-in-out 1s;
}

.area4.cur .vbox:nth-child(3) {
  -webkit-animation: fadeInLeft 0.5s both ease-in-out 1.5s;
  animation: fadeInLeft 0.5s both ease-in-out 1.5s;
}

.area4.cur .vbox:nth-child(4) {
  -webkit-animation: fadeInLeft 0.5s both ease-in-out 2s;
  animation: fadeInLeft 0.5s both ease-in-out 2s;
}

.area4.cur .fr {
  -webkit-animation: fadeInRight 0.5s both ease-in-out 2.5s;
  animation: fadeInRight 0.5s both ease-in-out 2.5s;
}



.area5.cur .face {
  -webkit-animation: rollIn 0.5s both ease-in-out 0s;
  animation: rollIn 0.5s both ease-in-out 0s;
}

.area5.cur .info {
  -webkit-animation: fadeInRight 0.5s both ease-in-out 0.5s;
  animation: fadeInRight 0.5s both ease-in-out 0.5s;
}

.area5.cur .alb1 {
  -webkit-animation: zoomIn 0.5s both ease-in-out 1s;
  animation: zoomIn 0.5s both ease-in-out 1s;
}

.area5.cur .alb2 {
  -webkit-animation: zoomIn 0.5s both ease-in-out 1.5s;
  animation: zoomIn 0.5s both ease-in-out 1.5s;
}

.area5.cur .alb3 {
  -webkit-animation: zoomIn 0.5s both ease-in-out 2s;
  animation: zoomIn 0.5s both ease-in-out 2s;
}

.area5.cur .alb4 {
  -webkit-animation: zoomIn 0.5s both ease-in-out 2.5s;
  animation: zoomIn 0.5s both ease-in-out 2.5s;
}
.area5.cur .alb5 {
  -webkit-animation: zoomIn 0.5s both ease-in-out 3s;
  animation: zoomIn 0.5s both ease-in-out 3s;
}

.area6.cur .col {
  -webkit-animation: zoomInDown 1.5s both ease-in-out 0s;
  animation: zoomInDown 1.5s both ease-in-out 0s;
}