/* =====================================================================
*
*    INDEX
*
*    // サイト全体の共通要素
*
*
*    1. Common Format
*
*    2. Header
*
*    3. Global Navigation
*
*    4. Contents
*
*    5. Banner
*
*    5. Footer
*
* =================================================================== */


/* =====================================================================
*
*    1. Common Format
*
* =================================================================== */

.altText {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}

a.btn:hover {
	background-position: 0 1px;
}

.marginR20 {
	margin-right: 20px;
}


/* ---------------------------------
*    clearfix
*/

.clearfix { min-height: 1%; }

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

.clearfix { display: inline-table; }

/* Hides from Mac IE \*/
* html .clearfix { height: 1px; }
.clearfix { display: block; }
/* Hides from Mac IE */


/* =====================================================================
*
*    2. Header
*
* =================================================================== */

body.home #header {
	width: 100%;
	position:relative;
	background: url(images/bg2009.jpg) center top repeat-x;
}

	body.under #header {
		width: 100%;
		background: url(images/head_bg_under.jpg) center top repeat-x;
	}

body.home #header .wrapper {
	width: 100%;
	background: url(images/head_bg2009.jpg) center top no-repeat;
	text-align: center;
}

	body.under #header .wrapper {
		width: 100%;
		background: url(images/head_catch_bg.jpg) center top no-repeat;
		text-align: center;
	}

#header .cont {
	width: 890px;
	margin: 0 auto;
}

body.home #header h1 {
	float: left;	
	width: 600px;
	height: 63px;
	padding: 0 0 0 0px;
}

	body.under #header h1 {
		float: left;	
		width: 600px;
		height: 63px;
		padding: 0 0 0 0;
	}

body.home #header h1 a {
	width: 600px;
	height: 63px;
	background: url(images/spacer.gif) left top no-repeat;
}

	body.under #header h1 a {
		width: 600px;
		height: 63px;
		background: url(images/spacer.gif) left top no-repeat;
	}

body.home #header #cLogo {
	float: right;
	width: 200px;
	height: 41px;
	padding: 22px 20px 0 0;
}

	body.under #header #cLogo {
		float: right;
		width: 200px;
		height: 41px;
		padding: 22px 20px 0 0;
	}

body.home #header #cLogo a {
	width: 200px;
	height: 20px;
	background: url(images/time.gif) left top no-repeat;
}

	body.under #header #cLogo a {
		width: 250px;
		height: 30px;
		background: url(images/time.gif) left top no-repeat;
	}

body.home #header #flash {width:890px;height:360px;text-align:center;position:relative;top:0px;left:0px;padding: 20px 0 0 20px;}

body.home #header #flash #text_info{width:615px;text-align:left;text-valign:bottom;float:left;position:relative;bottom:20px;left:22px;padding: 15px 0 0 0;}
body.home #header #flash #text_info p{font-size:1.0em;line-height:1.6em;margin-top:30px;margin-right:10px;}


body.home #header #flash #dj{width:250px;height:360px;text-align:center;float:right;position:relative;top:0px;left:0px;padding: 0 5px 0 5px;}
body.home #header #flash #dj a,a:visited,a:hover{font-size:0.9em;color:#448800;font-weight:bold;}



/* =====================================================================
*
*    3. Global Navigation
*
* =================================================================== */

#gnavi {
	width: 100%;
	height: 60px;
	background: url(images/navi_bg.jpg) center bottom no-repeat;
	text-align: center;
}

#gnavi ul {
	width: 830px;
	margin: 0 auto;
}

#gnavi ul li {
	float: left;
}

#gnavi ul li a {
	height: 60px;
	margin: 0;
	padding: 0;
}

#gnavi ul li a {
	background-image: url(images/navi.jpg);
}

li#gnTech a { width: 157px; background-position: 0 -120px; }
li#gnProduct a { width: 196px; background-position: -157px -120px; }
li#gnYoga a { width: 242px; background-position: -353px -120px; }
li#gnCamp a { width: 235px; background-position: -595px -120px; }

li#gnTech a:hover { background-position: 0 -60px; }
li#gnProduct a:hover { background-position: -157px -60px; }
li#gnYoga a:hover { background-position: -353px -60px; }
li#gnCamp a:hover { background-position: -595px -60px; }

li#gnTech a:active { background-position: 0 0; }
li#gnProduct a:active { background-position: -157px 0; }
li#gnYoga a:active { background-position: -353px 0; }
li#gnCamp a:active { background-position: -595px 0; }

body#technology li#gnTech a { background-position: 0 -60px; }
body#product li#gnProduct a { background-position: -157px -60px; }
body#yoga li#gnYoga a { background-position: -353px -60px; }
body#campaign li#gnCamp a { background-position: -595px -60px; }


/* =====================================================================
*
*    4. Contents
*
* =================================================================== */

.col {
	width: 100%;
	background: url(images/col_mid.jpg) center top repeat-y;
}

.col .wrap {
	width: 100%;
	background: url(images/col_top.jpg) center top no-repeat;
	padding-top: 85px;
	text-align: center;
}

.col .wrap .cont {
	width: 810px;
	height: 580px;
	margin: 0 auto;
	padding: 0 0 0 0;
	background: url(images/col_btm.jpg) center bottom no-repeat;
	text-align: left;
}

.col .wrap .cont2 {
	width: 890px;
	margin: 0 auto;
	padding: 0 0 13px 0;
	background: url(images/col_btm.jpg) center bottom no-repeat;
	text-align: left;
}


/* =====================================================================
*
*    5. Banner & Control
*
* =================================================================== */

#Control {
	width: 100%;
	text-align: center;
}

#Control .wrap {
	width: 880px;
	margin: 5px auto;
	text-align:center;
}



#Control #bnrLeft a {
	width: 80px;
	float: left;
	margin: 10px auto;
	text-align: left;
}

#Control #bnrRight a {
	width: 80px;
	float: right;
	margin: 10px auto;
	text-align: right;
}
#Control ul {
	width: 890px;
	margin-top: 0px;
}





#banner {
	width: 100%;
	height:78px;
	background: url(images/banner_bg.jpg) left bottom repeat-x;
	text-align: center;
}

#banner .wrap {
	width: 890px;
	margin: 0 auto;
	text-align: left;
}

a.g2t {
	width: 100px;
	height: 30px;
	margin: 18px 0 0 auto;
	background-image: url(images/icon_g2t.jpg);
	background-position: 0 -30px;
		float: right;
	text-indent: -9999px;
}

a.g2t:hover {
	background-position: 0 0;
}

#banner ul {
	width: 235px;
	margin-top: 20px;
}

#banner li {
	float: center;
}

#banner li a {
	height: 60px;
	background-position: 0 -235px;
}



#banner #bnrLimited a {
	width: 297px;
	background-image: url(images/bnr_limited.jpg);
}

#banner #bnrAqua a {
	width: 296px;
	background-image: url(images/bnr_aqua.jpg);
}

#banner #bnrProduct a {
	width: 297px;
	background-image: url(images/bnr_product.jpg);
}

#banner #bnrSoka a {
	width: 235px;
	background-image: url(images/soka_banner.jpg);
}


#banner li a:hover { background-position: 0 -60px; }
#banner li a:active { background-position: 0 0; }


/* =====================================================================
*
*    6. Footer
*
* =================================================================== */

#footer {
	width: 100%;
	background: #90A352 url(images/foot_bg.jpg) left top repeat-x;
	text-align: center;
}

#footer .wrap {
	width: 850px;
	height: 80px;
	margin: 0 auto;
	padding: 15px 5px 0 5px;
	overflow: hidden;
	text-align: left;
}

#footer ul { margin-bottom: 10px; }

#footer ul li {
	float: left;
	padding: 0 0 0 11px;
	background: url(../images/ln_bdr.gif) left 2px no-repeat;
	color: #99Ad59;
}

#footer ul li.first {
	padding: 0;
	background: no-repeat;
}

#footer a:link    { color: #EAF2DD; text-decoration: none; }
#footer a:visited { color: #EAF2DD; text-decoration: none; }
#footer a:hover   { color: #FFFFFF; text-decoration: underline; }
#footer a:active  { color: #FFFFFF; text-decoration: underline; }

#footer .cont {
	clear: both;
	float: right;
}

#footer .cont a {

	width: 150px;
	height: 56px;
	padding-top: 10px;
	background-image: url(/images/northwave.gif) no-repeat;
	background-position: 0 0;
}

#footer .banner {
	clear: both;
	float: left;
}

#footer .banner a {
	width: 196px;
	height: 50px;
	background-position: 0 0;
}

#footer .cont a:hover { background-position: 0 0; }

#footer #fLogo {
	float: left;
	width: 144px;
	height: 36px;
	margin-right: 20px;
	background: url(/images/foot_logo.gif) no-repeat;
}

#footer #fCopy {
	float: left;
	width: 196px;
	height: 50px;
	background: url(/images/soka_banner.jpg) no-repeat;
}