@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0;}
.content{background-color:#f4f4f4;
         padding-bottom:0px;padding-top: 24px}

.banner{position:relative;}

.content .logo_layer{position:absolute;
            top:0%;
			width:100%;
			height:100%;;}
			
.content .logo{margin:auto;
      display:block;
	  padding-top:10%;
	  animation:myfirst3 3.5s;}	
	  
@keyframes myfirst3
{
0%  {opacity:0; padding-top:0%;}
70%  {opacity:0; padding-top:0%;}
100%{opacity:1;padding-top:10%;}

}	  		

h1{position:absolute;
    font-size:50px;
	color:#FFF;
	top:50%;
	display:block;
	font-weight:200;
	width:100%;
	text-align:center;
	text-shadow:0 10px 10px #333333;
	animation:myfirst 3s;}

@keyframes myfirst
{
0%   {opacity:0;top:70%;}
100% {opacity:1;top:50%;}
}

p1{position:absolute;
    font-size:25px;
	color:#FFF;
	top:60%;
	display:block;
	font-weight:200;
	width:100%;
	text-align:center;
	animation:myfirst2 4s;}
	
@keyframes myfirst2
{
0%   {opacity:0;}
30%   {opacity:0;}
100% {opacity:1;}
}	
	

.main{width:1106px;
       height:1300px;
	   margin:auto;} 

#pic{background-color:#FFF;
     width:356px;
     height:410px;
	 float:left;
	 margin-left:10px;
	 margin-top:10px;}	   

#pic:hover{cursor:default;}
	 
#pic:hover{background-color:#3993d1;
           transition:0.8s ease-in-out;} 

#pic_top{width:200px;
         height:200px;
		 margin:auto;
		 display:block;}
		 
		 
.pic_top1{background-image:url(/images/PV/function/pic1.png);transition:0.3s ease-in-out;}
.pic_top2{background-image:url(/images/PV/function/pic2.png);transition:0.3s ease-in-out;}
.pic_top3{background-image:url(/images/PV/function/pic3.png);transition:0.3s ease-in-out;}
.pic_top4{background-image:url(/images/PV/function/pic4.png);transition:0.3s ease-in-out;}
.pic_top5{background-image:url(/images/PV/function/pic5.png);transition:0.3s ease-in-out;}
.pic_top6{background-image:url(/images/PV/function/pic6.png);transition:0.3s ease-in-out;}
.pic_top7{background-image:url(/images/PV/function/pic7.png);transition:0.3s ease-in-out;}
.pic_top8{background-image:url(/images/PV/function/pic8.png);transition:0.3s ease-in-out;}
.pic_top9{background-image:url(/images/PV/function/pic9.png);transition:0.3s ease-in-out;}

#pic:hover .pic_top1{background-image:url(/images/PV/function/pic1.1.png);}
#pic:hover .pic_top2{background-image:url(/images/PV/function/pic2.1.png);}
#pic:hover .pic_top3{background-image:url(/images/PV/function/pic3.1.png);}
#pic:hover .pic_top4{background-image:url(/images/PV/function/pic4.1.png);}
#pic:hover .pic_top5{background-image:url(/images/PV/function/pic5.1.png);}
#pic:hover .pic_top6{background-image:url(/images/PV/function/pic6.1.png);}
#pic:hover .pic_top7{background-image:url(/images/PV/function/pic7.1.png);}
#pic:hover .pic_top8{background-image:url(/images/PV/function/pic8.1.png);}
#pic:hover .pic_top9{background-image:url(/images/PV/function/pic9.1.png);}

#title{widht:365px;
       height:20px;
	   margin-top:30px;}
	   
#title h2{text-align:center;
         font-size:15px;
		 display:block;
		 text-decoration:none;
		 font-weight:600;}	  


#pic p{font-size:15px;
     display:block;
	 text-decoration:none;
	 margin:auto;
	 margin-top:10px;
	 text-align:center;
	 width:300px;
	 height:100px;}	   
 
.content .bottom{position:relative;
         overflow:hidden;
		 height:416px;}
		 
.bottom_bg{position:absolute;
           left:50%;
		   margin-left:-960px;}	
		   
#middle{width:70%;
        height:70%;
		position:absolute;
		margin-left:15%;}
		   	   	 
#interface{position:absolute;	
		   margin-left:4%;
}				 
#title2{position:absolute;
		margin-left:55%;
		margin-top:12%;}