/************************
RESETS
**********************/
* {
	margin:0;
	padding:0;
	}
	
body{
	line-height:150%;
	font-family:'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','MS　Pゴシック',Helvetica,Arial,sans-serif;
	font-size:12px; 
	background: #FCF8EC;
	}

a {
	-moz-outline: none 0;
	outline: none 0;
	text-decoration:none;
	}

a:hover {color:#000;}

img {border:none;}

ul {list-style: none;}

h1#ttl {display:none;}

h2 {text-indent:-9999px; margin-bottom:10px;}

h3 {font-size:12px;}

small {font-size:10px; color:#999;}

/************************
STRUCTURE
**********************/

#wrap {
	margin:0 auto;
	width:1000px;
	}
	
#header {margin-bottom:30px;}

#main-content {	padding-bottom:20px;}

#column-narrow-a {
	width:200px;
	float:left;
	margin-right:30px;
	}

#column-narrow-b {
	width:225px;
	float:left;
	}

#column-wide {
	width:515px;
	float:left;
	margin-right:30px;
	}	

#footer {
	background: url(../images/line.gif) no-repeat top;
	padding:20px 0 30px 0;
	}

/************************
ELEMENTS
**********************/

#header-image-wrap {
	height:276px;
	top:24px;
	position:relative;
	padding-bottom:30px;
	}

.image-nav {
	position:relative;
	float:right;
	top:0;
	height: 24px;
	overflow: hidden;
	}

.image-nav ul {
	float:right;
	height: 24px;
	overflow: hidden;
	width:230px;
	}

.image-nav li {float:left;}

.image-nav li a {
	display:block;
	height:24px; 
	text-indent:-99999px;
	background: url(../images/image-nav-btn.gif) no-repeat;
	margin-left:2px;
	}

.image-nav #surf a {background-position:0 -24px; width:43px;}
/*.image-nav #surf a:hover {background-position:0 0;}*/
.image-nav #surf a.hovering {background-position:0 0;}
.image-nav #bike a {background-position:-43px -24px; width:42px;}
/*.image-nav #bike a:hover {background-position:-43px 0;}*/
.image-nav #bike a.hovering {background-position:-43px 0;}
.image-nav #sk8 a {background-position:-86px -24px; width:38px;}
/*.image-nav #sk8 a:hover {background-position:-86px 0;}*/
.image-nav #sk8 a.hovering {background-position:-86px 0;}
.image-nav #snow a {background-position:-123px -24px; width:47px;}
/*.image-nav #snow a:hover {background-position:-123px 0;}*/
.image-nav #snow a.hovering {background-position:-123px 0;}
.image-nav #music a {background-position:-170px -24px; width:50px;}
/*.image-nav #music a:hover {background-position:-170px 0;}*/
.image-nav #music a.hovering {background-position:-170px 0;}

.image-nav .btn-select {
	width:102px;
	height:24px;
	background: url(../images/image-nav-btn.gif) no-repeat -221px -24px;
	position:relative;
	top:0;
	right:0;
	float:right;
	}

.image-nav a.btn-select:hover {background-position: -221px 0;}

#column-narrow-a .section {
	background: url(../images/line-narrow-a.gif) no-repeat top;
	padding:30px 0 25px 0;
	}

#column-narrow-b .section {
	background: url(../images/line-narrow-b.gif) no-repeat top;
	padding:30px 0 25px 0;
	}

#column-wide .section {
	background: url(../images/line-wide.gif) no-repeat top;
	padding:30px 0 25px 0;
	}

.section-head h2 {float:left;}

.section-head .detail {float:right; width:195px; text-align: right;}

.flickr {
	background: url(../images/icon-flickr.jpg) no-repeat right center;
	height:21px;
	padding-right:27px;
	display:block;
	font-weight:bold;
	margin-top:5px;
	}

/*ITEMS*/

.items a {color:#00A978;}
.items a:hover  {color:#000;}

.items h2 {
	height:63px;
	background:url(../images/ttl-items.gif) no-repeat 0 0;
	width:287px;	
	}
	
.items .section-head .detail {padding-top:20px;}
	
.items-list li {
	float:left;
	margin:0 10px 10px 0;
	}
	
.items-list li a img{ display:block; border:5px solid #FFF; height:81px; width:111px;}

.items-list li a:hover img {border:5px solid #00A978;}

.items-list li.last {margin-right:0;}

/*STYLINGS*/

.stylings a {color:#39AA0E;}

.stylings a:hover {color:#000;}

.stylings h3 {width:160px;}

.stylings h2 {
	height:85px;
	background:url(../images/ttl-stylings.gif) no-repeat 0 0;
	width:305px;	
	}
	
.stylings .detail {padding-top:35px;}

.styling-list li{
	float:left;
	margin:0 10px 10px 0;
	width:165px;
	}

.styling-list li p {overflow:hidden;}

.styling-list li p a{	
	word-wrap: break-word;
	}

.styling-list li.last {margin-right:0;}

.styling-list li a img {border:5px solid #FFF;}

.styling-list li a:hover img{border:5px solid #39AA0E;}

/*NEWS*/

.news a {color:#87D007;}

.news a:hover {color:#000;}

.news h2 {
	background:url(../images/ttl-news.gif) no-repeat;
	width:300px;
	height:63px;
	}
	
.news .detail {padding-top:20px;}

.news li {padding-bottom:15px;}

.twitter {
	background: url(../images/icon-twitter.jpg) no-repeat right center;
	height:23px;
	padding-right:27px;
	display:block;
	font-weight:bold;
	margin-top:5px;
	}


/*BRANDS*/

.brands h2 {
	background:url(../images/ttl-brands.gif) no-repeat 0 0;
	width:515px;
	height:63px;
	margin-bottom:25px;
	}

.brands a img {margin-bottom:5px;}

/*PEOPLE*/
.people h2 {
	background: url(../images/ttl-people.jpg) no-repeat 0 0;
	width:209px;
	height:50px;
	}
	
.people ul li{
	background: url(../images/speech-tail.gif) no-repeat 50px 16px;
	float:left;
	margin-bottom: 10px;
	}
	
.people ul li small {color:#000;}

.people .speech-box {
	background:#1D7DC7;
	padding:15px;
	width:135px;
	float:left;
	margin-left: 10px;
	}

.people .speech-box a {	color:#FFF;}

.people .speech-box a:hover {color:#000;}

.people img {float:left;}

.speech-box p {
	word-wrap: break-word;
	overflow:hidden;
	white-space: -moz-pre-wrap; /* Mozilla */
	}


/*LEFT SIDEBAR*/

.animation {width:200px; height:444px; background:url(../images/animation.gif);}

.webcam {
	background:url(../images/webcam-bg.gif) no-repeat 0 0;
	padding:18px 20px 12px 20px;
	height: 95px;
	}

	
.concept h2{
	background:url(../images/ttl-concept.gif) no-repeat 0 0;
	height:33px;
	}
	
.box-pink {
	background:#FF2A71;
	color:#FFF;
	font-weight: bold;
	padding:15px;
	}

.shops h2{
	background:url(../images/ttl-shops.gif) no-repeat 0 0;
	height:33px;
	}

.shops ul {padding-top:25px;}
.shops ul li {padding-bottom:10px;}

.shops a {color:#FF0000;}

.shops a:hover {color:#000;}

.shops small {color:#000;}

/*FOOTER*/
#footer ul {float:left;}
#footer li {display:inline; padding-right:15px;}
#footer a {color:#000;}
#footer a:hover {text-decoration: underline;}
#footer .copyright {font-size:10px; color:#999; float:right;}



/************************
CLEARS
**********************/
.section:after,
.section-head:after,
#main-content:after,
#footer:after,
.people ul li a:after,
.image-nav:after,
#TB_ajaxContent:after,
.lightbox-content:after,
.map:after

	{
	content: '';
	display: block;
    clear: both;
    height: 0;	
	}
