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

/************** init **************/
html {
	overflow-y: scroll;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td	{
	margin: 0;	padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var	{
	font-style: normal;
}
table	{
	border-collapse: collapse;	border-spacing: 0;
}
caption, th	{
	text-align: left;
}
q:before ,q:after	{
	content: '';
}
object, embed	{
	vertical-align: top;
}
hr, legend	{
	display: none;
}
h1, h2, h3, h4, h5, h6	{
	font-size: 100%;
}
img, abbr, acronym, fieldset	{
	border: 0;
	vertical-align: bottom;
}
li	{
	list-style-type: none;
}

h2{
	font-size:98%;
	font-weight:normal;
	padding:5px 0 15px 0;
}

h4{
	margin-top:10px;
	margin-bottom:10px;
	width:920px;
	background:url(../images/title_back.gif) repeat-x;
}
h4.no-image{
	width:900px;
	background:none;
	background-color:#000000;
	color:#FFFFFF;
	padding:2px 10px;
	font-size:120%;
}

/* ----------------------- Basic Style */
/* ------------ Font Style */
body {
	font-family: verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	font-size: 75%;
	line-height: 150%;
	color:#666666;
}
html>/**/body {
	font-size: 12px;
}
* + html body {
	font-family: "メイリオ","Meiryo";
}



/************** clearfix **************/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
	}
/* End hide from IE-mac */


a{text-decoration:none;}
a:link { color: #666666; }
a:visited { color: #666666; }
a:active { color: #666666; }
a:hover { color: #FF6600;}


div.musician a{text-decoration:none;font-weight:bold;}
div.musician a:link { color: #FF3300; }
div.musician a:visited { color: #FF3300; }
div.musician a:active { color: #FF3300; }
div.musician a:hover { color: #666666; text-decoration:underline;}

/************** frame **************/
div#container{
	width:920px;
	margin:auto;
	padding-top:20px;
}
div#main {
	float:left;
	padding-left:10px;
}
div#sub{
	float:right;
	padding-top:7px;
}


/************** RollOver **************/
a.a_90{
	display:block;
	width:90px;
	height:90px;
	float:left;
	margin-right:2px;
}
a.a_90:hover img.roll{
	-moz-opacity:0.4;
	opacity:0.4;
	filter: alpha(opacity=40);
}
a.a_120{
	display:block;
	width:120px;
	height:90px;
	margin-right:5px;
	float:left;
	overflow:hidden;
}
a.a_120:hover img.roll{
	-moz-opacity:0.4;
	opacity:0.4;
	filter: alpha(opacity=40);
}
a.a_180{
	display:block;
	width:120px;
	height:180px;
	margin-right:5px;
}
a.a_180:hover img.roll{
	-moz-opacity:0.4;
	opacity:0.4;
	filter: alpha(opacity=40);
}


/************** header **************/
div#header {
	margin-bottom:20px;
}
div#header h1 {
	float:left;
}
div#header p{
	float:left;
	padding:5px 0 0 10px;
}
div#header div#banner img{
	float:right;
}

/************** global-navi **************/
div#global-navi li{
	display:inline;
	margin-right:20px;
	font-weight:bold;
}

div#global-navi li a {
	padding-right:30px;
	border-bottom:solid 2px #009ce3;
}
div#global-navi li span {
	padding-right:30px;
	border-bottom:solid 2px #009ce3;
}
div#global-navi li a:hover {
	padding-right:30px;
	color:#FF3300;
	border-bottom-color:#FF3300;
}

/************** flash-area **************/

div#flash-area{
	margin-top:20px;
	height:393px;
	background:url(../images/flash_back.gif) no-repeat;
	padding:10px 15px;
	margin-bottom:20px;
}
div#flash-contents{
	float:left;
	margin-right:15px;
}
div#movie-data{
	float:left;
	margin-top:15px;
	font-size:85%;
	width:175px;
	color:#FFFFFF;
}
div#movie-data-wrap{
	height:150px;
}
div#movie-data dl{
	margin-top:10px;
	margin-bottom:10px;
}
div#movie-data dt{
	float:left;
	width:95px;
}
div#movie-data dd{
	float:left;
}

div#music-data {
	padding-top:30px;
}
div#music-data p{
	color:#FFFFFF;
}
div#music-data a.a_90{
	margin-right:5px;
}
div#flash-area span.star{
	color:#FFFF00;
}





/************** new-arrival **************/
div#new-arrival {
	width:560px;
	height:500px;
	position:relative
}
div#new-arrival li img{
	margin:0px 0 10px 0;
}
div#new-arrival ul {
	margin-left:0px;
	position:absolute;
	width:600px;
}
div#new-arrival li {
	font-size:90%;
	float:left;
	margin-right:25px;
	padding-bottom:12px;
}
div#new-arrival li a{
	margin: 0px;
	pause: 0px;
}

div#new-arrival li p{
	clear:both;
	font-size:90%;
	line-height:135%;
	margin:0;
	padding-left:10px;
	background:url(../images/square_light_blue.gif) no-repeat 0 3px;
}

div#new-arrival span.star{
	color:#E7B403;
	font-size:98%;
}
div#new-arrival span.black-star{
	color:#CCCCCC;
	font-size:98%;
}




/************** lifestyle **************/
div#lifestyle {
	width:560px;
	height:190px;
	position:relative
}
div#lifestyle li img{
	float:left;
	margin-top:3px;
}
div#lifestyle ul {
	margin-left:0px;
	position:absolute;
	width:600px;
}
div#lifestyle li {
	width:265px;
	font-size:90%;
	float:left;
	margin-right:25px;
	padding-bottom:12px;
}

div#lifestyle h3{
	color:#2a51dc;
}
div#lifestyle li p{
	font-size:90%;
	overflow:hidden;
}

div.lifestyle h2{
	font-size:120%;
	font-weight:bold;
	color:#CCCCCC;
	margin:10px 0 0 0;
	padding:0;
}

/************** Trip **************/
div#trip{
	margin-top:20px;
	width:265px;
	float:left;
	margin-right:25px;
}
div#trip h3{
	color:#2a51dc;
}
div#trip p{
	font-size:90%;
	overflow:hidden;
}
div#trip img.img_left{
	float:left;
	margin-top:3px;
	margin-right:5px;
}
div.trip-content{
	margin-bottom:10px;
	padding: 0 0 0 130px; /* 75px being the width of the thumbnail + how much space you want to put between it and your text */
	position: relative; /* So the thumbnail is relative to this */

}
div.trip-content .trip-image{
		position: absolute;
		left: 0;
		top: 0;
}



/************** music **************/
div#music{
	margin-top:20px;
	width:265px;
	float:left;
	margin-right:25px;
}
div#music h3{
	color:#2a51dc;
}
div#music p{
	font-size:90%;
	overflow:hidden;
}
div#music img.img_left{
	float:left;
	margin-top:3px;
	margin-right:5px;
}
div.music-content{
	margin-bottom:10px;
	padding: 0 0 0 130px; /* 75px being the width of the thumbnail + how much space you want to put between it and your text */
	position: relative; /* So the thumbnail is relative to this */
}
div.music-content .music-image{
		position: absolute;
		left: 0;
		top: 0;
}

/************** surfboards **************/
div#surfboards {
	margin-top:30px;
	width:560px;
}
div#surfboards li img{
	margin:0px 0 10px 0;
}
div#surfboards ul {
	margin-left:-25px;
}
div#surfboards li {
	font-size:90%;
	line-height:110%;
	float:left;
	margin-left:25px;
}
div#surfboards li p{
	font-size:90%;
	line-height:135%;
	margin:0;
	padding-left:10px;
	background:url(../images/square_yellow.gif) no-repeat 0 3px;
}


/************** information **************/
div#information ul{
	margin-top:5px;
}
div#information li{
	font-size:90%;
	background:url(../images/square_blue.gif) no-repeat 0px 4px;
	padding-left:12px;
}


/************** topics **************/
div#topics{
	margin-top:20px;
	width:300px;
}
div#topics-content{
	background:url(../images/topics_back.gif) no-repeat;
	height:361px;
	padding:15px;
	margin-top:5px;
}

/************** topics **************/
div#wanted {
	margin:30px 0 0 0;
}
div#wanted p{
	margin:5px 0;
}

/************** sponser **************/
div#sponser{
	margin:30px 0 0 0;
}

/************** footer **************/
div#footer {
	margin-top:30px;
}
div#footer li span.blue{
	color:#0051e3;
}
div#footer li{
	display:inline;
	background:url(../images/square_blue.gif) no-repeat 0px 3px;
	padding-left:12px;
	padding-right:10px;
}

div#footer address{
	margin-top:5px;
	background-color:#e4e4e4;
	text-align:right;
	padding:3px 15px;
	font-size:90%;
}


/************** Clip List **************/
div.clip-list{
	clear:both;
	width:730px;
	padding-top:20px;
	
}
div#advertisement{
	float:right;
	text-align:center;
	width:150px;
	margin-top:20px;
	margin-right:10px;
}

div.music-list{
	clear:both;
	width:580px;
	padding-top:20px;
	padding-right:20px;
	
}
div#musician-list{
	width:310px;
	
}
div#musician-list ul{
	margin-top:10px;
}
div#musician-list ul li{
	clear:both;
	padding-bottom:20px;
}
div#musician-list ul li a{
	margin-right:10px;
}


/************** Moive Detail **************/
div.movie-contents{
	clear:both;
	width:580px;
	padding-top:0px;
	padding-right:30px;
	padding-left:19px;
	border-right:solid 1px;
	
}
div#backnumber{
	width:280px;
	padding-top:0px;
}
div#backnumber ul{
	margin-top:10px;
}
div#backnumber ul li{
	clear:both;
	padding-bottom:0px;
}
div#backnumber ul li a{
	margin-right:10px;
	font-size:95%;
}




/************** Link **************/
div.link-box{
	width:696px;
	background-color:#009900;
	padding-left:50px;
}
div.link-box img{
	margin:40px 15px;
	float:left;
}

/************** about **************/
div.about{
	width:750px;
	padding-left:10px;
	padding-top:20px;
	line-height:170%;
}
div.about table td{
	border-bottom:solid 1px #666666;
}

/************** musician_wanted **************/
div.musician_wanted table td{
	font-size:110%;
}




/************** musician **************/
div.musician{
	width:580px;
}

/************** blog **************/
div.blog div#main{
	width:520px;
	padding-left:10px;
	padding-right:10px;
	float:left;
	margin-top:10px;
}
div.blog div#sub{
	float:left;
	width:187px;
	padding:0px 5px;
	margin-right:5px;
	margin-top:17px;
}
div.blog div#blog-advertisement{
	float:right;
	width:150px;
	margin-right:10px;
	margin-top:10px;
}
.blogbox {
	margin-bottom:50px;
}

.blogtitle {
	font-size:130%;
	height:25px;
	background:#FFFFFF url(/images/blog_title_bar.gif) no-repeat bottom;
}

div.storycontent{
	padding-top:15px;
}