/* CSS Document */

 @-webkit-keyframes loading_txt {
 0% {
 margin-left:-15px;
 margin-top:-20px;
}
 50% {
 margin-left:10px;
 margin-top:15px;
}
 100% {
 margin-left:25px;
 margin-top:-20px;
}
}
 @keyframes loading_txt {
 0% {
 margin-left:-15px;
}
 50% {
 margin-left:10px;
}
 100% {
 margin-left:25px;
}
}
.loading_txt1 {
	animation: loading_txt 3s linear 0s infinite alternate;
	-webkit-animation: loading_txt 3s linear 0s infinite alternate;
}
@-webkit-keyframes fadeInDown {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
}
 100% {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
}
}
 @keyframes fadeInDown {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
}
 100% {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
}
}
.title_logo {
	animation: fadeInDown 1s linear 0s 1 both;
	-webkit-animation: fadeInDown 1s linear 0s 1 both;
}
 @-webkit-keyframes play_box_img {
 0% {
 opacity: 0.2;
 width:258px;
 margin-top:15px;
}
50% {
 width:273px;
 opacity:1;
 margin-top:5px;
}
 100% {
 opacity: 0.2;
 width:288px;
 margin-top:0;
}
}
 @keyframes play_box_img {
 0% {
 opacity: 0.2;
 width:258px;
 margin-top:15px;
}
50% {
 width:273px;
 opacity:1;
 margin-top:5px;
}
 100% {
 opacity: 0.2;
 width:288px;
 margin-top:0;
}
}
.play_box_img {
	animation: play_box_img 1.5s linear 0s infinite alternate;
	-webkit-animation: play_box_img 1.5s linear 0s infinite alternate;
}
 @-webkit-keyframes fadeInRight {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(100%, 0, 0);
 transform: translate3d(100%, 0, 0);
}
 100% {
 opacity: 0.7;
 -webkit-transform: none;
 transform: none;
}
}
 @keyframes fadeInRight {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(100%, 0, 0);
 transform: translate3d(100%, 0, 0);
}
 100% {
 opacity: 0.7;
 -webkit-transform: none;
 transform: none;
}
}
.animation.play_banner {
	animation: fadeInRight 1.5s linear 3s 1 both;
	-webkit-animation: fadeInRight 1.5s linear 3s 1 both;
}
@-webkit-keyframes fadeInDown {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
}
 100% {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
}
}
 @keyframes fadeInDown {
 0% {
 opacity: 0;
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
}
 100% {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
}
}
.animation.play_bottom {
	animation: fadeInDown 1.5s linear 1s 1 both;
	-webkit-animation: fadeInDown 1.5s linear 1s 1 both;
}
 @-webkit-keyframes play_bottom {
 0% {
 opacity: 0;
 width:0%;
 left:50%;
}
50% {
 width:50%;
 left:25%;
}
 80% {
opacity: 1;
}
 100% {
 opacity:0;
 width:100%;
 left:0;
}
}
 @keyframes play_bottom {
 0% {
 opacity: 0;
 width:0%;
 left:50%;
}
50% {
 width:50%;
 left:25%;
}
 80% {
opacity: 1;
}
 100% {
 opacity:0;
 width:100%;
 left:0;
}
}
.play_bottom img {
	animation: play_bottom 3.5s linear 0s infinite both;
	-webkit-animation: play_bottom 3.5s linear 0s infinite both;
}
@-webkit-keyframes bounceInRight {
 0%, 60%, 75%, 90%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
 0% {
 opacity: 0;
 -webkit-transform: translate3d(3000px, 0, 0);
 transform: translate3d(3000px, 0, 0);
}
 60% {
 opacity: 1;
 -webkit-transform: translate3d(-25px, 0, 0);
 transform: translate3d(-25px, 0, 0);
}
 75% {
 -webkit-transform: translate3d(10px, 0, 0);
 transform: translate3d(10px, 0, 0);
}
 90% {
 -webkit-transform: translate3d(-5px, 0, 0);
 transform: translate3d(-5px, 0, 0);
}
 100% {
 -webkit-transform: none;
 transform: none;
}
}
 @keyframes bounceInRight {
 0%, 60%, 75%, 90%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
 0% {
 opacity: 0;
 -webkit-transform: translate3d(3000px, 0, 0);
 transform: translate3d(3000px, 0, 0);
}
 60% {
 opacity: 1;
 -webkit-transform: translate3d(-25px, 0, 0);
 transform: translate3d(-25px, 0, 0);
}
 75% {
 -webkit-transform: translate3d(10px, 0, 0);
 transform: translate3d(10px, 0, 0);
}
 90% {
 -webkit-transform: translate3d(-5px, 0, 0);
 transform: translate3d(-5px, 0, 0);
}
 100% {
 -webkit-transform: none;
 transform: none;
}
}
/*
.remind {
	animation: bounceInRight 2s linear 4s 1 both;
	-webkit-animation: bounceInRight 2s linear 4s 1 both;
}
@-webkit-keyframes rotate45 {
 0% {
-webkit-transform: rotate(3deg );
-webkit-transform-origin: left;
transform: rotate(3deg );
transform-origin: left;
}
 50% {
-webkit-transform: rotate(-3deg);
-webkit-transform-origin: left;
transform: rotate(-3deg);
transform-origin: left
}
 100% {
-webkit-transform: rotate(3deg);
-webkit-transform-origin: left;
transform: rotate(3deg);
transform-origin: left
}
}
@-moz-keyframes rotate45 {
 0% {
transform: rotate(3deg );
transform-origin: left;
}
 50% {
transform: rotate(-3deg);
transform-origin: left
}
 100% {
transform: rotate(3deg);
transform-origin: left
}
}
@keyframes rotate45 {
 0% {
transform: rotate(3deg );
transform-origin: left;
}
 50% {
transform: rotate(-3deg);
transform-origin: left
}
 100% {
transform: rotate(3deg);
transform-origin: left
}
}
/*
.rotate45 {
	-webkit-animation: rotate45 0.7s 0s linear infinite;
	-moz-animation: rotate45 0.7s .0s linear infinite;
	animation: rotate45 0.7s 0s linear infinite;
}*/
@-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);
 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);
}
}
.pulse {
	animation: pulse 2.5s linear 0s infinite both;
	-webkit-animation: pulse 2.5s linear 0s infinite both;
}
.duration1 {
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
}
.duration2 {
	-webkit-animation-duration: 5s;
	animation-duration: 5s;
}
 @-webkit-keyframes ro2 {
0% {
-webkit-transform:rotate(0deg);
}
 5%, 15%, 25% {
-webkit-transform:rotate(-2deg);
}
 10%, 20%, 30% {
-webkit-transform:rotate(2deg);
}
 35% {
-webkit-transform:rotate(0deg);
}
}
@-moz-keyframes ro2 {
0% {
-moz-transform:rotate(0deg);
}
 5%, 15%, 25% {
-moz-transform:rotate(-2deg);
}
 10%, 20%, 30% {
-moz-transform:rotate(2deg);
}
 35% {
-moz-transform:rotate(0deg);
}
}
@keyframes ro2 {
0% {
transform:rotate(0deg);
}
 5%, 15%, 25% {
transform:rotate(-2deg);
}
 10%, 20%, 30% {
transform:rotate(2deg);
}
 35% {
transform:rotate(0deg);
}
}
.ro2 {
	-webkit-animation: ro2 1.5s .2s linear infinite;
	-moz-animation: ro2 1.5s .2s linear infinite;
	animation: ro2 1.5s .2s linear infinite;
}
 @-webkit-keyframes bounceIn {
 0%, 20%, 40%, 60%, 80%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
 0% {
 opacity: 0;
 -webkit-transform: scale3d(.3, .3, .3);
 transform: scale3d(.3, .3, .3);
}
 20% {
 -webkit-transform: scale3d(1.1, 1.1, 1.1);
 transform: scale3d(1.1, 1.1, 1.1);
}
 40% {
 -webkit-transform: scale3d(.9, .9, .9);
 transform: scale3d(.9, .9, .9);
}
 60% {
 opacity: 1;
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 80% {
 -webkit-transform: scale3d(.97, .97, .97);
 transform: scale3d(.97, .97, .97);
}
 100% {
 opacity: 1;
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
 @keyframes bounceIn {
 0%, 20%, 40%, 60%, 80%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
 0% {
 opacity: 0;
 -webkit-transform: scale3d(.3, .3, .3);
 transform: scale3d(.3, .3, .3);
}
 20% {
 -webkit-transform: scale3d(1.1, 1.1, 1.1);
 transform: scale3d(1.1, 1.1, 1.1);
}
 40% {
 -webkit-transform: scale3d(.9, .9, .9);
 transform: scale3d(.9, .9, .9);
}
 60% {
 opacity: 1;
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 80% {
 -webkit-transform: scale3d(.97, .97, .97);
 transform: scale3d(.97, .97, .97);
}
 100% {
 opacity: 1;
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
.play_con_txt {
	animation: bounceIn 2.5s linear 0s 1 both;
	-webkit-animation: bounceIn 2.5s 1 0s infinite both;
}
@-webkit-keyframes meto {
 0% {
margin-top:-10px;
}
 100% {
margin-top:10px;
}
}
@keyframes meto {
 0% {
margin-top:-10px;
}
 100% {
margin-top:10px;
}
}
.meto1 {
	animation: meto 1.5s linear 0s infinite alternate;
	-webkit-animation: meto 1.5s linear 0s infinite alternate;
}
@-webkit-keyframes bounceInDown {
 0%, 60%, 75%, 90%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-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, 25px, 0);
 transform: translate3d(0, 25px, 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: none;
 transform: none;
}
}
 @keyframes bounceInDown {
 0%, 60%, 75%, 90%, 100% {
 -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 animation-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, 25px, 0);
 transform: translate3d(0, 25px, 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: none;
 transform: none;
}
}
.make_banner {
	animation: bounceInDown 1.5s linear 0s 1 both;
	-webkit-animation: bounceInDown 1.5s linear 0s 1 both;
}
 @-webkit-keyframes head_bor {
 0% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: rotate3d(0, 0, 1, -200deg);
 transform: rotate3d(0, 0, 1, -200deg);
 opacity: 1;
}
 100% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
}
}
 @keyframes head_bor {
 0% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: rotate3d(0, 0, 1, -200deg);
 transform: rotate3d(0, 0, 1, -200deg);
 opacity: 1;
}
 100% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
}
}
.head_bor {
	animation: head_bor 4s linear 0s infinite both;
	-webkit-animation: head_bor 4s linear 0s infinite both;
}
 @-webkit-keyframes zoomIn {
 0% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: rotate3d(0, 0, 1, -200deg);
 transform: rotate3d(0, 0, 1, -200deg);
 opacity:0.5;
 width:10px;
 top: 34px;
 left: 34px;
}
 100% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
 width:71px;
 top: 6px;
left: 6px;
}
}
 @keyframes zoomIn {
 0% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: rotate3d(0, 0, 1, -200deg);
 transform: rotate3d(0, 0, 1, -200deg);
 opacity:0.5;
 width:10px;
 top: 34px;
 left: 34px;
}
 100% {
 -webkit-transform-origin: center;
 transform-origin: center;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
 width:71px;
 top: 6px;
left: 6px;
}
}
.zoomIn {
	animation: zoomIn 1s linear 0s 1 both;
	-webkit-animation: zoomIn 1s linear 0s 1 both;
}
 @-webkit-keyframes shear_jiantou {
 0% {
-webkit-transform: rotate(3deg );
-webkit-transform-origin:  right top;
transform: rotate(3deg );
transform-origin: right top;
}
 50% {
-webkit-transform: rotate(-3deg);
-webkit-transform-origin: right top;
transform: rotate(-3deg);
transform-origin:  right top
}
 100% {
-webkit-transform: rotate(3deg);
-webkit-transform-origin:  right top;
transform: rotate(3deg);
transform-origin:  right top
}
}
 @keyframes shear_jiantou {
 0% {
-webkit-transform: rotate(3deg );
-webkit-transform-origin:  right top;
transform: rotate(3deg );
transform-origin: right top;
}
 50% {
-webkit-transform: rotate(-3deg);
-webkit-transform-origin: right top;
transform: rotate(-3deg);
transform-origin:  right top
}
 100% {
-webkit-transform: rotate(3deg);
-webkit-transform-origin:  right top;
transform: rotate(3deg);
transform-origin:  right top
}
}
.shear_jiantou {
	-webkit-animation: shear_jiantou 1.7s 0s linear infinite;
	animation: shear_jiantou 1.7s 0s linear infinite;
}
 @-webkit-keyframes hue {
 from {
 -webkit-filter: hue-rotate(0deg);
}
to {
	-webkit-filter: hue-rotate(-360deg);
}
}
 @keyframes hue {
 from {
 -webkit-filter: hue-rotate(0deg);
 filter: hue-rotate(0deg);
}
to {
	-webkit-filter: hue-rotate(-360deg);
	filter: hue-rotate(-360deg);
}
}
@-webkit-keyframes flipInX {
 0% {
 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 360deg);
 transform: perspective(400px) rotate3d(1, 0, 0, 360deg);
}
 33% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 0deg);
 transform: perspective(400px) rotate3d(1, 0, 0, 0deg);
}
66% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 180deg);
 transform: perspective(400px) rotate3d(0, 1, 0, 360deg);
}
100% {
-webkit-transform: perspective(400px) ;
 transform: perspective(400px) ;
}
}
 @keyframes flipInX {
 0% {
 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 360deg);
 transform: perspective(400px) rotate3d(1, 0, 0, 360deg);
}
 33% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 0deg);
 transform: perspective(400px) rotate3d(1, 0, 0, 0deg);
}
66% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 180deg);
 transform: perspective(400px) rotate3d(0, 1, 0, 360deg);
}
100% {
-webkit-transform: perspective(400px) ;
 transform: perspective(400px) ;
}
}
.flipInX {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation:flipInX 6.7s 0s linear 1 both;
    animation:flipInX 6.7s 0s linear 1 both;
}
@-webkit-keyframes play_small {
 0% {
margin-top:-10px;
}
 100% {
margin-top:10px;
}
}
@keyframes play_small {
 0% {
	 top:5px;
	 right:5px; 
	 height:10px;
	 width:10px;
	 opacity:0;
}
 100% {
     top:12px;
	 right:24px; 
	 height:50px;
	 width:50px;
	 opacity:1;
}
}
.play_small {
	animation: play_small 1.5s linear 2s 1 both;
	-webkit-animation: play_small 1.5s linear 2s 1 both;
}