@charset "shift_jis";

*{margin:0; padding:0;}

body {
	font-size: 62.5%; /* Resets 1em to 10px */
	font-family:'Helvetica','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Arial,'ＭＳ Ｐゴシック','MS P Gothic',sans-serif;
	color: #000;
	text-align:center;
	margin:0;padding:0;
	background: url(../images/main_bg_dark.jpg) repeat-x;
	}
	
.clear{clear:both;}
.attention{color:#ED2A19;}

a img {border:0;}


	
ul#gNavigation li a{
	padding: 5px 10px;
	text-decoration: none;
	color: #000;
	}
ul#gNavigation li a:hover{
	background: #f90;
	}

/*content

/*レイアウト---------------------------*/

#wrapper{
	width:990px;
	margin: 0 auto;
	text-align:left;
	}
/*HEADER --------------------------------*/

#header{
	position:relative;
	height: 114px;
	}
#header h1 a{
	display: block;
	height: 77px;
	background: url(../images/hyperlite_logo.gif) no-repeat;
	width: 262px;
	text-indent: -9999px;
	}
#gNavigation{
	position: absolute;
	top: 50px;
	left: 280px;
	}
	#gNavigation ul li{
		list-style: none;
		float: left;
		font-size: 13px;
		margin-left: 10px;
		padding: 5px;
		}
		#gNavigation ul li a{
			text-decoration: none;
			color: #fff;

			}
			#gNavigation ul li a:hover{
				border-bottom: 1px solid #fff;
				}
#gearMenu{
	position: absolute;
	top: 80px;
	left: 0;
	}
	#gearMenu ul li{
		float:left;
		list-style: none;
		margin-left: 5px;
		line-height: 34px;
		font-size: 20px;
		font-weight: bold;
		}
		#gearMenu ul li a{
			display: block;
			padding: 0px 10px;
			text-decoration: none;
			color: #000;
			}#gearMenu ul li a:hover{
				background: #f90;
				}
/*---------------------------------*/

#home_top #contents{
	margin-top:40px;
	}#contents{
	padding:10px;
	background: #fff;
	}
/*end_contents---------------------------------*/
/*route ---------------------------------------*/
#route{
	margin: 10px;
	font-size:12px;
	font-weight:bold;
	color:#fff;
	}
	#route p{text-transform:capitalize;}
	#route p a{color:#fff; text-decoration:none;}
/*--------------------------------------------*/
/*contentsChild -------------------------------*/
#contentsChild{
	width:950px;
	padding:10px;
	background:#fff;
	}
	#gearTop #contentsChild,#acTop #contentsChild{
	text-transform:capitalize;
	}
	#contentsChild h3,#contentsChild h2{
	font-size:130%;
	border-bottom:#222 solid 2px;
	}
/*----------------------------------------------*/
/*Top -------------------------------------------*/
#top{
	padding:5px;
	background:#fff;
	}
	#top p a{
		display:block;
		margin-left:925px;
		width:55px;
		height:20px;
		text-indent:-9999px;
		background:url(../images/top.gif) top left no-repeat;
		outline:0;
		}
		#top p a:hover{
			background:url(../images/top.gif) top right no-repeat;
			}
/*-----------------------------------------------*/
/*main---------------------------------------*/
#main{
	width:760px;
	float:right;
	}

/*------------------------------------------*/
/*main---------------------------------------*/
#mainCon{
	width:390px;
	float:left;
	}
/*------------------------------------------*/
/*main---------------------------------------*/
#sabCon{
	width:350px;
	float:right;
	}
/*------------------------------------------*/
/*navigation---------------------------------------*/
#navigation{
	width:180px;
	float:left;
	}
#navigation ul{
	list-style:none;
	text-transform:capitalize;
	}
#navigation li a{
	display:block;
	color:#999;
	text-decoration:none;
	width:165px;
	padding:5px 5px 5px 10px;
	border-bottom:1px solid #fff;
	}
	#navigation li a:hover{
		background:#eee;
		color:#333;
		}
	#navigation li.live a{
		background:#eee;
		color:#333;
		}
/*------------------------------------------*/

/*footer-------------------------*/
#footerWrap{
	background:url(../images/footer_bg.gif) repeat-x;
	}
#footer{
	width: 860px;
	margin: 0 auto;
	padding: 15px 0;
		
	}
/*end_footer-------------------------*/

address{
	padding:5px 0 5px 5px;
	font-style:normal;
	color:#fff;
	}
	address a{
		color:#f90;
		}

/* END レイアウト---------------------------*/
/*HOME -----------------------------------*/
/*main---------------------------------------*/
#Hmain{
	margin:10px 0 5px;
	}
	
#mainImg{
	position: relative;
	}	
	
	#topMenu{
		position: absolute;
		bottom: 0px;
		width: 970px;
		height: 30px;
		line-height: 30px;
		color: #fff;
		z-index: 3;
		}
	#topMenu h2{
		background: #f90;
		font-weight: bold;
		color: #000;
		padding: 0px 10px;
		font-size: 18px;
		
		}
	#topMenu ul li{
		float: left;
		}
		
	#topMenu ul li a:hover img{
		opacity: 0.7;
		}
	#topMenuBg{
		background: #000;
		opacity: 0.7;
		width: 970px;
		z-index: -1;
		height: 200px;
		position: absolute;
		bottom: 0px;
		}
/*------------------------------------------*/
/*mainCon---------------------------------------*/

	
	#img{
		width:300px;
		float: right;
		margin-right: 20px;
		
		}
	#topics{
		width:640px;
		float:left;
		}
	#topics h2{
		background: #f90;
		color:#000 ;
		padding: 5px;
		font-weight: bold;
		font-size: 15px;
		}
	#topics ul{
		}
	
	#topics li a{
		display:block;
		width:615px;
		background:#222;
		border-top:1px dotted #666;
		padding:5px 10px 5px 15px;
		font-size: 11px;
		color:#fff;
		text-decoration:none;
		}#topics li a:hover{background:#666;}
	
	
/*------------------------------------------*/
/*mainSab---------------------------------------*/
#HmainSab{
	width:320px;
	float:right;
	}
/*------------------------------------------*/

/*end_sab----------------------------------------------*/

/*mainSab---------------------------------------*/

#footer{
	}
#footer ul{
	margin: 15px;
	}
#footer li {
	display: inline;
	border-left: 1px solid #000;
	
}
	#footer li.first{
		border-left: none;
		}
#footer li a{
	padding: 8px;
	font-size: 12px;
	color: #000;
}
address{
	padding-top: 15px;
	}
/*-------------------------------------------------*/


/*ABOUT*/

#aboutTop #contentsChild{
	width:900px;
	padding:10px 40px;
	background:#fff;
	}
	#aboutTop #contentsChild h2{
	font-size:130%;
	border-bottom:#222 solid 2px;
	margin:10px 0px 12px;
	}
	#aboutTop #contentsChild p{
		line-height:2;
		margin:5px 10px;
		}
	#aboutTop #contentsChild table{
		margin:5px 10px;
		width:600px;
		border-collapse:collapse;
		border:1px solid #ccc;
		}
	#aboutTop #contentsChild th,#aboutTop #contentsChild td{
		padding:5px;
		border:1px solid #ccc;
		vertical-align: top;
		line-height:2;
		}
	#aboutTop #contentsChild th{
		letter-spacing:.5em;
		
		width:9em;
		}
	#aboutTop #contentsChild td{
		
		}


/*------------------------------------------*/

/*GEAR*/
#contentsChild #main #listBox h3{
	margin-top:5px;
		font-size:120%;
		border-bottom:none;
		margin-top:15px;
		padding:5px;
		background:#f1f1f1;
		}
#gearlist ul{
	list-style:none;
	margin:10px 150px;
	}
#gearlist li{
	display:block;
	float:left;
	margin:5px 0 0 4px;
	}
ul#detail{
	list-style:none;
	}
ul#detail li{
	margin-bottom:10px;
	}
#listBox ul{
	padding:10px 4px;
	list-style: none;
	}
	
#listBox ul li{
	display:block;
	margin:5px 0 0 2px;
	float:left;
	border: 5px solid #eee;
	}
#listBox ul li a{
	display:block;
	padding:3px;
	}
	#listBox ul li:hover{
		border: 5px solid #ccc;
	}
#listBox{
	}

#test1-content,#test2-content,#test3-content{
width:350px;
}
.accordion_headings{
	padding:5px;
	background:#f90;
	color:#000;
	border:1px solid #FFF;
	cursor:pointer;
	font-weight:bold;
}

.accordion_headings:hover{
	background:#222;
	color:#fff;
}

.accordion_child{
	padding:15px;
	background:#EEE;
}
.accordion_child p{
	margin:5px 10px;
	line-height:1.8;
	}
.accordion_child ul{
	margin:5px 10px;
	}
	.accordion_child ul li{
		line-height:1.5;
		margin-bottom:8px;
		margin-left:20px;
		}

.header_highlight{
	background:#222;
	color:#fff;
}

.tab_container *{
	float:left;
	width:90px;
}

table.size{
	margin:10px;
	width:260px;
	border-collapse:collapse;
	border:1px solid #999;
	}
	table.size th,table.size td{
		padding:3px;
		text-align:center;
		border:1px solid #999;
		}
/* Wakeboard page -----------*/
#byerlyBox{
	width:305px;
	float:left;
	}
#dineBox{
	width:305px;
	float:left;
	margin-left:5px;
	}
ul#boardicon{
	margin:5px 50px;
	display:block;
	width:160px;
	list-style:none;
	text-align:center;
	}
	ul#boardicon li{
		display:inline;
		}
.wakeboard .accordion_headings{
	padding:5px;
	background:#f90;
	color:#000;
	cursor:pointer;
	font-weight:bold;
}

.wakeboard .accordion_headings:hover{
	background:#111;
	color: #fff;
}

.wakeboard .accordion_child{
	padding:15px 2px 15px 8px;
	background:#EEE;
}

.wakeboard .header_highlight{
	background:#111;
	color: #fff;
}

.impression img{
	float:left;
	margin:5px;
	}
.impression p{
	line-height:1.5;
	font-size:90%;
	}
/* --------------------------*/

/*--------------------*/
/*Shop*/

	#shopTop #contentsChild h2{
	font-size:130%;
	border-bottom:#222 solid 2px;
	}
	#shopBox{
		margin:10px 0px;
		}
	#contentsChild #main #shopBox h3{
		font-size:120%;
		border-bottom:none;
		margin-top:15px;
		padding:5px;
		background:#f1f1f1;
		}
	#shopTop #contentsChild p{
		line-height:2;
		margin:5px 10px;
		}
		
		.shop_list_box{
			margin:5px 60px;
			padding:10px 5px 0;
			}
			.shop_list_box h4,.shop_list_boxTop h4{
				background:#eee;
				padding:5px 8px;
				}
				.shop_list_box p,.shop_list_boxTop p{
					margin:3px 15px;
				}
			.shop_list_boxTop{
			margin:5px 60px;
			padding:10px 5px 0;
			}



#shopTop #test1-content,#shopTop #test2-content,#shopTop #test3-content,#shopTop #test4-content,#shopTop #test5-content,#shopTop #test6-content,#shopTop #test7-content,#shopTop #test8-content,#shopTop #test9-content{
width:620px;
}
#shopTop .accordion_headings{
	padding:5px;
	background:#ccc;
	color:#000;
	cursor:pointer;
	font-weight:bold;
}

#shopTop .accordion_headings:hover{
	background:#333;
	color:#fff;
}

#shopTop .accordion_child{
	padding:15px;
	background:#fff;
	border:3px solid #333;
}
#shopTop .accordion_child p{
	margin:5px 10px;
	line-height:1.8;
	}
#shopTop .accordion_child ul{
	margin:5px 10px;
	}
	#shopTop .accordion_child ul li{
		line-height:1.5;
		margin-left:20px;
		}

#shopTop .header_highlight{
	background:#333;
	color:#fff;
}

#shopTop .tab_container *{
	font-size:90%;
	border:none;
	float:left;
	text-align:center;
	border-right:1px solid #fff;
	width:57px;
}

/*------------------------------------------*/


/*Rider*/

#riderTop #contentsChild{
	}
#riderTop #contentsChild table.bio{
		border-collapse:collapse;
		width:310px;
		margin:0 auto;
		font-size:90%;
		}
	table.bio th,table.bio td{
		border:1px solid #ccc;
		padding:5px 3px 5px 8px;
		line-height:1.5;
		}
	table.bio th{
		width:110px;
		}
#riderTop .accordion_child{
	padding:15px 3px;
}

ul#gearList{
	margin:0; padding:0;
	list-style:none;
	}
ul#gearList li{
	margin:0; padding:0px;
	display:block;
	float:left;
	font-size:80%;
	margin:5px 0 0 4px;
	}
ul#gearList li img{border:1px solid #666;}
ul#gearList li a{
	color:#333;
	text-decoration:none;
	margin:5px 8px 5px 0px;
	display:block;
	text-align:center;
	height:105px;
	width:100%;
	}
	
ul#riderPhoto{
	list-style:none;
	margin:5px 0;
	}
ul#riderPhoto li{
	float:left;
	margin-right:2px;
	}
ul#riderPhoto li a{
	display:block;
	padding:3px;
	background:#ccc;
	}

ul#riderPhoto li a:hover{
	background:#333;
	}
	
img.supportImg{
	margin:5px 0;
	border:1px solid #ccc;
	padding:3px;
	}
table.supportBio{
		border-collapse:collapse;
		margin:5px 3px;
		font-size:90%;
		width:90%;
	}
	
	table.supportBio th,table.supportBio td{
		border:1px solid #ccc;
		padding:5px 3px 5px 8px;
		line-height:1.5;
		}
		table.supportBio th{
			width:150px;
			}

/*------------------------------------------*/
/*DOWNLOADS-----------*/
#dlTop #contentsChild{
	width:900px;
	padding:10px 40px;
	background:#fff;
	}
	#dlTop #contentsChild h2{
	font-size:130%;
	border-bottom:#222 solid 2px;
	margin:10px 0px 12px;
	}
#dlTop #contentsChild div.dlchildBox ul{
	margin-left:10px;	
	list-style:none;
	}
	#dlTop #contentsChild div.dlchildBox li a{
		line-height:2;
		padding-left:12px;
		background:url(../images/win.gif) 0 50% no-repeat;
	}
	#dlTop #contentsChild div.dlchildBox li a:hover{background:url(../images/win_roll.gif) 0 50% no-repeat;
	}
#dlTop #contentsChild div.dlchildBox{
	margin:5px;
	width:206px;
	float:left;
	}
	#dlTop #contentsChild div.dlchildBox a img{
		display:block;
		width:198px;
		padding:3px;
		background:#eee;
		border:1px solid #ccc;
		} #dlTop #contentsChild div.dlchildBox a:hover img{
			background:#f30;
			}
			
			

#dlTop #test1-content,#dlTop #test2-content,#dlTop #test3-content{
width:900px;
}
#dlTop .accordion_headings{
	padding:5px;
	background:#f90;
	color:#fff;
	cursor:pointer;
	font-weight:bold;
}

#dlTop .accordion_headings:hover{
	background:#000;
	color:#fff;
}

#dlTop .accordion_child{
	padding:15px;
	background:#fff;
	border:3px solid #000;
}
#dlTop .accordion_child p{
	margin:5px 10px;
	line-height:1.8;
	}
#dlTop .accordion_child ul{
	margin:5px 10px;
	}
	#dlTop .accordion_child ul li{
		line-height:1.5;
		margin-left:20px;
		}

#dlTop .header_highlight{
	background:#000;
	color:#fff;
}

#dlTop .tab_container *{
	font-size:90%;
	border:none;
	float:left;
	text-align:center;
	border-right:1px solid #fff;
	width:150px;
}

/*--------------------*/
			
/*CONTACT*/

#contactTop #contentsChild{
	width:760px;
	padding:10px 40px;
	background:#fff;
	}
	#contactTop #contentsChild h2{
	font-size:130%;
	border-bottom:#222 solid 2px;
	margin:10px 0px 12px;
	}
	#contactTop #contentsChild p{
		line-height:2;
		margin:5px 10px;
		}
	#contactTop #contentsChild table{
		margin:5px 10px;
		width:740px;
		border-collapse:collapse;
		border:1px solid #ccc;
		}
	#contactTop #contentsChild th,#contactTop #contentsChild td{
		padding:5px;
		border:1px solid #ccc;
		}
	#contactTop #contentsChild th{
		letter-spacing:.25em;
		width:200px;
		}
	#contactTop #contentsChild td{
		line-height:2;
		}
	.mark{color:#f30;}

#care{
	}
#care #careL{
	width:450px;
	float:left;
	}
#care #careB{
	width:250px;
	float:left;
	}
	#care #careB a{
		display:block;
		width:250px;
		height:75px;
		outline:0;
		background:url(../images/care_b.jpg) left no-repeat;
		text-indent:-9999px;
		text-decoration:none;
		}#care #careB a:hover{background:url(../images/care_b.jpg) right no-repeat;}
		
		
/*--Tech Details----------------------------------------*/

#techD{
	margin: 10px;
	width: 800px;
	
}
#techD table{
	border-collapse: collapse;
	border: 1px solid #ccc;
}
#techD table th,#techD table td{
	padding: 15px ;
	border: 1px solid #ccc;
	}
#techD table th{
	text-align: center;
	}
#techD table td dt{
	font-size: 14px;
	font-weight: bold;
}
#techD table td dd{
	margin: 5px;
	line-height: 1.8;
	}

/*---riderPage---------------------------------------*/	
.riderPage{}
.riderPage ul{
	margin: 10px;
	list-style: none;
	margin-bottom: 30px;
	}
.riderPage ul li img{
	margin-bottom: 5px;
	}
.riderPage ul li a{
	text-decoration: none;
	text-align: center;
	display: block;
	color: #333;
	}
.riderPage ul#co li,.riderPage ul#ca li,.riderPage ul#d li{
	padding-right: 40px;
	width: 150px;
	float: left;
	margin-right: 10px;
	background: url(../images/rider_bk.gif) top right no-repeat;
	}
.riderPage ul#su li,.riderPage ul#ca li,.riderPage ul#d li{
	padding-right: 27px;
	width: 100px;
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	background: url(../images/rider_bk_s.gif) top right no-repeat;
	}

/*------------------------------------------*/


/* Hack cleafix--------------------------------*/
.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	}

.clearfix{display:inline-table;
	min-height:1px;　/* IE 7*/
}

/* IE \*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/*end IE */
/* END Hack cleafix--------------------------------*/

/*lightbox--------------------------------------------------*/
#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	color:#333;
	}
#lightbox a img{ border: none; }
#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}
#imageContainer{padding: 10px;}
#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}

#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}

#imageContainer>#hoverNav{ left: 0;}

#hoverNav a{ outline: none;}
#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(/images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}

#nextLink { right: 0; float: right;}

#prevLink:hover, #prevLink:visited:hover { background: url(/images/prevlabel.gif) left 15% no-repeat; }

#nextLink:hover, #nextLink:visited:hover { background: url(/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}

#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	

#imageData #caption{ font-weight: bold;	}

#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			

#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	

		

#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
/*end_lightbox--------------------------------------------------*/


p#vtip { display: none; position: absolute; padding: 10px 20px; top: 10px; left: 5px; font-size: 18px; font-weight: bold; background-color: white; color: #333; border: 3px solid #ccc; -moz-border-radius: 5px; -webkit-border-radius: 5px; z-index: 9999 }
p#vtip #vtipArrow { position: absolute; top: -11px; left: 5px }
