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


/* @group reset */
* {margin: 0;padding: 0}


ul, ol { list-style:none}
img { vertical-aligin:middle;
         
		 }
		 
	a:hover{
	text-decoration:none;
	}
			
a:hover img {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha(opacity=60)";
}		

a:active img {

  opacity: 0.4;
  filter: alpha(opacity=40);
  -ms-filter: "alpha(opacity=40)";
}		
/* @end */

/* @group Fluid-img */
img { max-width : 100%;
        }


/* @end */

/* @group html */
html { 
font-family : verdana, sans-serif;
font-size : 100%;
line-height : 150%;
}

header {
	width: 1080px;
margin: 3px auto 0;


}

#he1{
	width:180px;
	float:left;
		margin-bottom:0;}
	
	
	.he2{
	width:450px;
	float:right;
		margin-bottom:0;}
	
		.he2 img{
	width:20%;
	float:left;}



				   
	
	
	#nav
		{
				; /* 1000 */
	
			margin:0 auto 0;
			clear:both;
			border-top: 5px solid #E5D4EC;
		}

				#nav li a
				{
					color: #fff;
					display: block;
				}
				#nav li a:active
				{
					background-color: #c00 !important;
				}

			/* first level */

			#nav > ul
			{
				padding-top:0;
				padding-bottom:0.1em;
				height:1.4em; /* 60 */
				background-color:#5A99E4;
			}
				#nav > ul > li
				{
					width: 9.0909090909090%;
					float: left;
				}
					#nav > ul > li > a
					{
					
						font-size: 0.8em; /* 24 */
						text-align: center;
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: 1px solid #fff;
						}
						#nav > ul > li:hover > a,
						#nav > ul:not( :hover ) > li.active > a
						{
							background-color: #33AEDB;
						}
			   
				   
	#contents {width:1080px;
                margin:0 auto ;
				clear:both;
				}
			 
						  
.wrap1028{
		width:1080px;
		margin-right: auto;
	margin-left: auto;
	clear:both;}
	 
			   
.main{ margin-top: 0;
width:728px;
	     float:left}				   		   
	
	.sub{margin-top: 0.5em;
	width:336px;
	float:right}
	
				 .sub3{ 
width:337px;
height:auto;
 float:right} 
		 
.sub3 a{display:block;
		}
		
		 
		 .sub2{ margin-top: 0.5em;
height:auto;
padding:10px;
background-image:url(../image/haikei/sub2bg.gif);
background-position:bottom;
background-repeat:no-repeat;
	    }
		 
	.infofromsite {
	padding: 0.3em 0;
	color: #666666;

	background-color: #E5D4EC;
	text-align: center;
	margin-bottom:  0.3em;
	margin-top: 0px;
}
			

	
	.san{ margin-top: 0.5em;
	width:32%;
	float:left;
	margin-right:2%}
	
		.sanl{ margin-top: 0.5em;
	width:32%;
	float:left;
	}


	.underline {
	height: 5px;
	border-bottom: 1px solid #C4C2C2;
	clear: both;
	margin:15px 0;

}

	.under2 {
	height: 30px;
	border-bottom: 8px solid #F4F4F4;
	clear: both;
	margin:30px 0 10px 0;

}


.a1{


margin:0.3em 0 ;
padding:1em;
background-color:#F4F4F4;

		
	
}
.a2{
font-size:large;
margin:0.3em 0 ;
padding:1em;
background-color:#EEF9FA;

		
	
}


.fonts{
	font-size: small;

	line-height:140%;

	}


#nav1 {
	font-size: small;

	line-height:160%;
	float:right;
width:80%;
	text-align: center;	
}

#nav1 ul li { width :33.3333%; float : left} 
#nav1 ul li a { display : block ; 
padding:0.1em  1em;


} 
 


.level1bg {
	
	clear: both;
	padding : 1em;
	margin-bottom: 1em;
	border: 8px solid #F4F4F4;
	
	
}
#level1bg {
	
	clear: both;
	padding : 0.5em;
	margin-bottom: 1em;
	border: 4px solid #F4F4F4;
	
	
}


.level1bg2 {
	clear: both;
	padding : 1em;
	margin-bottom: 1em;
	border: 8px solid #F4F4F4;
	
	
}
.level1bg3 {
	background-color:#FBFDF0;
	padding : 0.5em 0.5em 0;
	margin-bottom: 0.2em;
	border: 0.1em solid #E5D4EC;
	
	
}

.level1bg3  a{
	display:block;

	

}

.level1bg3  img{
	width:30%;
	float:left;
	margin:0  0.5em 0.5em 0;

}






	.center{
	text-align:center;
	margin-bottom:0.1em;
}
	.space10 {
	clear: both;
	height: 10px;
}	

	.space05 {
	clear: both;
	height: 0.5%;
}	
	.space00 {
	clear: both;

}	



  .clred {
	color: #F00;
}
.clpurple {

	color: #90F;
}

.clgreen {
	color: #093;
}
.clgreen {
	color: #093;
}
.clwt{ color:#fff;
}
.clblue {
	color: #00F;
}

	    


  
.rightl10 {
	float: right;
	margin-left: 0.8em;
}
.leftnew {
	float: left;
	margin-right: 0.8em;
}
.left {
	float: left;
	margin-right: 0.8em;
	margin-bottom: 0.5em;
	
}

.left2 {
	float: left;
	width:49%;

	
}

.leftlate{
	margin-bottom:10px;
	
	}
	.rightlate{
	margin-bottom:10px;
	
	}

.right {
	float: right;

}
.right2 {
	float: right;
	width:49%;
	
}
.left img{width:55%;
float:left;
	margin-right:0.5em;
	
}

.right img{width:55%;
float:left;
margin-right:0.5em;
}


.bg2{
	width:100%;
	height:auto;
			background-color: #f7efeb;


	}
	
	.bg3{background-color:#FBE9FC;
	margin-top:0px;
	

	}
	.bg4{
	width:100%;
	padding:0.2em 0;
			background-color:#FBFDF0;


	}

.underlist{ width : 25%; float : left;
                 color:#FFFFFF} 
				 
	
				 

.left200 {
	    width:200px;
	
		float: left;
}
.right80 {
	    width:80px;
		float: right;
}

	 

footer {
	width: 100%;
	margin: 0 auto 0;
	background-color:#9966FF;
text-align: left;
}


small { float:right;
		  padding: 2em 0.5em 0 0 ; 
}


			

				 
				 
		@media only screen and ( max-width: 800px ) 
		{
	
			
			header {
	width: 100%;

}

				   #he1{
	width:180px;
	margin-left:1em;
	float:left;}
	.he2{
	width:450px;
	margin-right:1em;
	float:right;}
	
		.he2 img{
	width:20%;
	float:left;}



.main{ margin: 0.5em auto;
width:90%;
	     float:none}
		
		  		 .sub3{  margin: 0 auto 0;
width:652px;
height:auto;
	     float:none} 


		 
.sub{margin: 0.5em auto;
width:90%;
	float:none;
	clear:both;}
	

			 .sub2{ margin-top: 0.5em;
width:100%;
height:auto;
background-image:url(../image/haikei/sub2bg.jpg);
background-repeat:no-repeat;
background-position:bottom right;
	     float:none}

	
	 

	
	#contents {width:100%;
                margin:0 auto ;
			
			
				clear:both;
				}
			
	
	.wrap1028{
		width:100%;
	

	
		}

.level1bg3 {
	float:left;
	width:45%;


	padding : 0.5em 1% 0;
	margin-bottom: 0.2em;
	margin-right: 1%;
	margin-left: 1%;
	border: 0.1em solid #E5D4EC;
	
	
}

.level1bg .level1bg3 img  {

	width:100%;

	
}

.level2bg {
	width:30%;
	background-color: #FFFFCC;
    padding : 1%;
	line-height:130%;
	margin-bottom: 0.8em;
	margin-right:1.2%;
	border: thin solid #9966FF;
		font-size:80%;
		float:left;

}


.level3bg {
    padding : 0.5em;
	margin-bottom: 0.8em;
	background-color: #FBE9FC;
	font-size:80%;

}

.right {
	float: right;
	clear:both;
	
}

.leftlate{
	float:left;
	width:49%;
	
	
	}
	.rightlate{
		float:right;
width:49%;
	
	}



.leftad {
	float: none;
	
}
.rightad {
	float: none;


}	
.left img{width:45%;

	
}

.right img{width:45%;

}


	
	
	
	
		

			.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
	
		#nav
			{
				height:0;
	
				visibility:hidden;
	
			}
	#nav > a
			{
				height:0;
				visibility:hidden;
			}

			#nav li
			{
				height:0;
					visibility:hidden;
			}
				#nav li a
				{
					height:0;
					visibility:hidden;
				}
				
			#nav > ul
			{
				height:0;
				visibility:hidden;
			}
				#nav > ul > li
				{
				height:0;
				visibility:hidden;
				}
					#nav > ul > li > a
					{
					height:0;
				visibility:hidden;
					}
			 
		}
	@media only screen and ( max-width:700px )
		{
	
   #he1{

	margin-left:auto;
	margin-right:auto;
	float:none;}
	.he2{
	width:450px;
	margin-left:auto;
	margin-right:auto;
	margin-top:1em;

	clear:both;
		float:none;}
	
		.he2 img{
			margin-top:1em;
	width:20%;
	float:left;}

.left {
	width:40%;
}


		.right2  {
	float: none;
	width:98%;
	margin-left:auto;
	margin-right:auto;
	
}

	
	.left2 {
	float: none;
	width:98%;
	margin-left:auto;
	margin-right:auto;
	

	
}
#nav1 {
	float:none;
width:100%;
	text-align: center;
 margin-top:0;
	margin-bottom:0;
	
}

 .sub3{
width:565px;
height:auto;


} 
		 

		 

}
		@media only screen and ( max-width:480px )
		{
		html
			{
				font-size: 100%; /* 12 */
			}
			
header {
	width: 100%;
	height:auto;

	margin-left: auto;
	margin-right: auto;
	background-color:#fff;
		
	
	
	   text-align:left;
	 

}
	#nav
			{
				height:0;
	
				visibility:hidden;
	
			}

 #he1{

	margin-left:auto;
	margin-right:auto;
	float:none;}
	.he2{
	width:98%;
	margin:0.3em auto 0;
border-top: 3px solid #E5D4EC;
	clear:both;
		float:none;}
	
		.he2 img{
				margin-top:0.2em;
	width:20%;
	float:left;}


header h1  {margin:0;
      
			   text-align:center;
                   }
				   
  header img  {
	margin: 0.1em auto 0.2em;
	float: none;
	width: 80%;
}
header p{
	font-size:70%;
	text-align:center;
	  margin-top:0;
  margin-left:0;
  line-height:160%;}
  


	
		.pan {
	width:95%;
	margin-top: 0px;
	margin-bottom: 0px;
	padding:0.3em;
	font-size: 80%;
	float:right;




	
}			
		.san{ margin-top: 0.5em;
	width:98%;
	float:none;
	margin-right:auto;
	margin-left:auto}
		.sanl{ margin-top: 0.5em;
	width:98%;
	float:none;
	margin-right:auto;
	margin-left:auto}
	

		
.main{ margin-left:auto;
	margin-right:auto;
width:99%;
	     float:none}
		 
		 
		 		 .sub3{  margin: 15px auto 0;
width:320px;
height:auto;

	     float:none} 

		 
.sub{margin-top: 1em;
	width:100%;
	float:none}
	
			 
		 .sub2{ margin-top: 0;
width:auto;
height:auto;
margin-bottom:0.5em;
padding-top:0.5em;
background-image:url(../image/haikei/sub2bg.gif);
background-position:bottom left;
background-repeat:repeat-x;
	     float:none}
		 
		  .sub2 p{ width:100%}
	
	#contents {width:98%;
                margin:0 auto ;
				padding-left::1%;
			
				clear:both;
				}
	.pan{
		width:95%;
		margin-left:2%;}		
	.wrap1028{
		margin-left:auto;
		margin-right:auto;
	
		}
.level1bg {
	
	clear: both;
	padding : 0.6em;
	margin-bottom: 0.5em;
	border: 0.1em solid #C4C2C2;
	
	
}
	
.level1bg2 {
	clear: both;
	padding : 0.3em;
	margin-bottom: 0.5em;
	border: 0.1em solid #C4C2C2;
	
	
}
	.level1bg3 {
	float:none;
	width:92%;


	padding :2% 2% 0;
	margin-bottom: 1%;
	margin-right: 2%;
	margin-left: 2%;
	border: 0.1em solid #C4C2C2;
	
	
}
.level1bg3  a{
	font-size:90%;
	

	

}
	.level1bg3 img  {
		width:20%;}
		
		.level1bg .level1bg3 img  {

	width:20%;

	
}
	

	.under2 {
	height: 10px;
	border-bottom: 0.1em solid #C4C2C2;
	margin:20px 0 10px 0;

}

.rightl10 {
	float: none;
	width:95%;
	margin-left: 2%;
}
.left728 {
	float: none;
	width:100%;
	margin-top:0.8em;
	
}

.left {
	width:40%;
}

.leftnew {
	float: none;
	width:100%;

}
.left200 {
	    width:200px;
		float: left;
}
.right80 {
	    width:80px;
		float: right;
		
}

.right290 {
	float: none;
	width:290px;
	margin-top:1%;
	margin-left: auto;
	margin-right: auto;
	
	
}


	
		}