body,html { width: 100%; height: 100%; padding: 0; margin: 0; overflow: hidden; }
body { font-family: "微软雅黑","microsoft yahei"; position: relative; }
img { border: 0; display: block; padding: 0; margin: 0; }

.ydy-logo { position: absolute; left: 10px; top: 10px; z-index: 6; height: 40px; display: none; }
.ydy-logo img { height: 100%;}
.ydy-link { position: absolute; right: 10px; top: 10px; z-index: 6; }
.ydy-link a { width: 90px; height: 30px; display: block; font-size: 14px; text-align: center; line-height: 30px; color: #FFFFFF; text-decoration: none; border: 1px solid #FFFFFF; border-radius: 5px; transition:all .3s linear;  -webkit-transition:all .3s linear;  -moz-transition:all .3s linear;  -o-transition:all .3s linear;  -ms-transition:all .3s linear; }
.ydy-close { width: 36px; height: 36px; position: absolute; top: 20px; right: 152px; display: block; background: url(../img/ydy-btn-close.png) no-repeat center; z-index: 6; cursor: pointer; transition:all .3s linear;  -webkit-transition:all .3s linear;  -moz-transition:all .3s linear;  -o-transition:all .3s linear;  -ms-transition:all .3s linear; display: none; }
.ydy-close:hover { background-image: url(../img/ydy-btn-close-hover.png); }

.ydy-img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: 50% 50%; background-size: cover; -mov-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; z-index: 2; }
.ydy-img-yy { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../img/ydy-yy.png) repeat; z-index: 3;}

.ydy-font { position: absolute; z-index: 4; width: 100%; height: 100%; }
.ydy-font img { height: 20%; display: block; margin: 40% auto 0 auto; }
.ydy-video-btn-box { position: absolute; width: 100%; text-align: center; bottom: 48%; z-index: 5; }
.ydy-video-btn { display: inline-block; width: 63px; height: 63px; background: url(../img/ydy-video01.png) no-repeat center; background-size: 63px auto; cursor: pointer; -webkit-animation:mymove 1s linear 0s infinite 300ms 0 ease; -moz-animation:mymove 1s linear 0s infinite 300ms 0 ease; -ms-animation:mymove 1s linear 0s infinite 300ms 0 ease; animation:mymove 1s linear 0s infinite 300ms 0 ease; -moz-animation:mymove 1s linear 0s infinite; -webkit-animation:mymove 1s linear 0s infinite; -o-animation:mymove 1s linear 0s infinite; -ms-animation:mymove 1s linear 0s infinite; animation:mymove 1s linear 0s infinite; }

.ydy-video-btn-box02 { position: absolute; width: 100%; text-align: center; bottom: 48%; z-index: 5; }
.ydy-video-btn02 { font-size: 16px; font-weight: bold; color: #fff; text-decoration: none; letter-spacing: 4px; display: inline-block; width: 100px; height: 50px; padding: 25px 0; border-radius: 50%; border:1px solid #fff; background: #9bd3ff; cursor: pointer; -webkit-animation:mymove 1s linear 0s infinite 300ms 0 ease; -moz-animation:mymove 1s linear 0s infinite 300ms 0 ease; -ms-animation:mymove 1s linear 0s infinite 300ms 0 ease; animation:mymove 1s linear 0s infinite 300ms 0 ease; -moz-animation:mymove 1s linear 0s infinite; -webkit-animation:mymove 1s linear 0s infinite; -o-animation:mymove 1s linear 0s infinite; -ms-animation:mymove 1s linear 0s infinite; animation:mymove 1s linear 0s infinite; }

@media screen and (orientation: landscape){
	.ydy-font img { height: 30%; margin: 10% auto 0 auto; }
}

@keyframes mymove { 
	0% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
	50% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	100% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
}
@-webkit-keyframes mymove { 
	0% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
	50% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	100% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
}
@-moz-keyframes mymove { 
	0% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
	50% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	100% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
}
@-ms-keyframes mymove { 
	0% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
	50% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	100% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
}
@-o-keyframes mymove { 
	0% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
	50% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	100% { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); }
}

.ydy-video-box { position: absolute; z-index: 99; width: 100%; height: 100%; background: rgba(0,0,0,.8); display: none; }
#myvideo { position: absolute; top: 30%; height: 40%; width:100% }
@media screen and (orientation: landscape){
	#myvideo { top: 15%; width: 70%; height: 70%; left: 15%;}
}