﻿body,html{position: relative;
    margin: auto;
    overflow-x: hidden;
    height: 100%; background: url(../image/enter2022.jpg) no-repeat center center;-webkit-background-size:cover;-moz-background-size:cover;-ms-background-size:cover;-o-background-size:cover;background-size:cover;
}
header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; transition: background 0.7s ease,height 0.7s ease;}
.inner-wrapper{padding: 20px 50px 20px;position: absolute;top: 0;left: 0;width: 100%;box-sizing: border-box;transition: all 0.3s ease 0s;background: linear-gradient(rgba(0,0,0,0.4),rgba(0,0,0,0));}
.flower_right{ position: fixed;top: 0px; right: 0px;}
.flower_left{ position: fixed; bottom: 0px;left: 0px;}
.warpbox{ position: absolute; width:1066px; height: 174px; left: 50%; margin-left: -533px; top: 50%; margin-top: -87px; z-index: 9999;}
.warpbox a{ display: block; width: 493px; height: 174px; float: left;}
.warpbox a img{ max-width: 100%;}
.male80{ margin-left: 80px;}
.flower_left{opacity:0;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 0.7s;  
    animation-duration: 0.7s;  
    -webkit-animation-fill-mode: forwards ;  
    animation-fill-mode: forwards ;
     -webkit-animation-delay:0.5s;  /**延迟动画**/
     animation-delay:0.5s; }
.flower_right{opacity:0;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 0.8s;  
    animation-duration: 0.8s;  
    -webkit-animation-fill-mode: forwards ;  
    animation-fill-mode: forwards ;
     -webkit-animation-delay:1s;  /**延迟动画**/
     animation-delay:1s; 
}
 
 
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
 
    100% {
        opacity: 1
    }
}
 
@keyframes fadeIn {
    0% {
        opacity: 0
    }
 
    100% {
        opacity: 1
    }
}
@media only screen and (max-width:1280px){
	.warpbox{ width: 848px;  margin-top: -70px; margin-left: -424px; height: 140px;}
	.warpbox a{ width: 394px; height: 140px;}
	.male80{ margin-left: 60px;}
}
@media only screen and (max-width:768px){
	.flower_right,.flower_left{ display: none;}
	.warpbox{ width:324px; height:290px; margin-top: -145px; margin-left: -162px;} 
	.warpbox a{ width: 100%; height: 119px;}
	.male80{ margin-left: 0px; margin-top: 50px;}
	.inner_logo{ width:220px ;}
	.inner_logo img{ max-width: 100%;}
	.inner-wrapper{ padding-left: 20px;}
	
}