/*main_rolling*/
.main_rolling_wrap{position:relative; overflow:hidden; width:100%; height:183px; margin:0 auto;}
.main_rolling_wrap #srolling{position:relative; margin:0 auto; margin-left:170px;}
.main_rolling_wrap #srolling div{width:300px; height:183px;}

/*main_contents*/
.main_contents_wrap{width:1004px; height:522px; margin:45px auto;}
.contents_div{float:left; margin-right:17px;}
.contents_bottom{margin-top:46px;}

.main_beaf{position:relative; width:305px; height:150px;}
.main_beaf .before{width:152px; height:150px; position:absolute; top:0px; left:0px;}
.main_beaf .before div{position:absolute; top:0px; left:0px; overflow:hidden;}
.main_beaf .before div img{width:152px; height:150px; vertical-align:top; }
.main_beaf .after{width:152px; height:150px; position:absolute; top:0px; right:0px;}
.main_beaf .after div{position:absolute; top:0px; left:0px; overflow:hidden}
.main_beaf .after div img{width:152px; height:150px; vertical-align:top;}
.main_beaf div div .beaf{position:relative;}
.main_beaf .before .point{width:42px; height:42px; background:url(/images/before_point.png) no-repeat top left; z-index:8;}
.main_beaf .after .point{width:41px; height:41px; background:url(/images/after_point.png) no-repeat top left; z-index:8;}

.main_experi{float:left; margin-right:0px;}
.main_letest{float:left; width:305px; height:167px; margin-top:17px; background-color:#fff; margin-right:17px;}
.latest_2{margin-right:0px;}
.main_letest .latest_title{padding:16px 0px 0px 18px; background:url(/images/main_latest_more.jpg) no-repeat center right #fff;}
.main_letest .latest_title a{font-size:16px; font-weight:bold; color:#687b13;}

.list{margin:20px auto; width:264px; height:0px;}
.list li{padding-left:10px; margin-bottom:10px; background:url(/images/bul_list.gif) no-repeat center left;}
.list li a{color:#222222}
.list li a:hover{color:#687b13}
.list li span{float:right; color:#999; font-size:12px;}

.main_icon{width:304px; height:142px; margin-left:4px;}
.main_icon li{float:left; margin-right:2px; margin-bottom:2px;}
.main_icon .main_icon_right{margin-right:0px;}
.main_movie{float:left; width:306px; height:142px;}
.main_movie li{float:left; margin-left:2px;}
.main_movie .main_movie_first{margin-left:0}

/*main_img*/
.main_img_wrap{position:relative; margin:0 auto; width:100%; height:640px;}
.main_img_wrap .main_img{position:relative; margin:0 auto}
.main_img_wrap .main_img li{position:absolute; top:0px; width:100%; height:640px;}
.main_img_wrap .main_img .main_img_1{background:url(/images/main_img_1.jpg) repeat-x top center;}
.main_img_wrap .main_img .main_img_2{background:url(/images/main_img_2.jpg) repeat-x top center;}
.main_img_wrap .main_img .main_img_3{background:url(/images/main_img_3.jpg) repeat-x top center;}

.main_img_wrap .main_img_btns_wrap{position:relative; margin:0 auto; width:1311px;}
.main_img_wrap .main_img_btns_wrap .main_img_btns{position:absolute; z-index:3; top:600px; left:803px;}
.main_img_wrap .main_img_btns_wrap .main_img_btns li{float:left; width:16px; height:16px; background:url(/images/main_img_btn.png) no-repeat 0 0; margin-left:15px; cursor:pointer}
.main_img_wrap .main_img_btns_wrap .main_img_btns li.active{background-position:0 -16px}

.animation{position:relative; margin:0 auto; width:1311px;}
.animation_1{
  position:absolute; top:195px; left:615px;
  width:486px; height:55px;
  background:url(/images/main_1_animation.png) no-repeat top center;
}
.animation_2{
  position:absolute; top:140px; left:560px;
  width:558px; height:75px;
  background:url(/images/main_2_animation.png) no-repeat top center;
}
.animation_3{
  position:absolute; top:60px; left:690px;
  width:506px; height:506px;
  background:url(/images/main_3_animation.png) no-repeat top center;
}

.animated {
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

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

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

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

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
          backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
          animation-name: flipInX;
}