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


/**************************************************************************************************
BASE CSS READING (NOT IE 4 AND MAC IE 5.x)
**************************************************************************************************/
/*ﾂ･*/
@import "/common/css/content.css";
/**/


* {
margin:0; padding:0;
list-style:none;
}


body {
background:#fff;
font-family:Arial, Helvetica, sans-serif;
color:#282828;
text-align:center;
font-size:75%;
background:#fff url(../images/bg.gif) repeat-x 0 0;
}


	body#index {
	background:#fff url(../images/bg-index.gif) repeat-x 0 0;
	}


img {
border:none;
}


a {
color:#282828;
text-decoration:underline;
}


a:hover {
color:#49813c;
text-decoration:underline;
}


hr {
display:none;
visibility:hidden;
}


/**************************************************************************************************

CLEARFIX

**************************************************************************************************/


br.clear {
visibility:hidden;
clear:both;
height:1px;
line-height:1px;
display:block;
border:none;
font-size:1px;
}


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


.clearfix{
	display:inline-table;
	min-height:1%;
}


/* FOR MAC IE \*/
* html .clearfix{
	height:1%;
}


.clearfix{
	display: block;
}


/* END OF FOR MAC IE */


/**************************************************************************************************

CONTAINER

**************************************************************************************************/


div#container {
width:100%; height:auto;
text-align:center;
}


/**************************************************************************************************

HEADER

**************************************************************************************************/


div#header {
width:880px; height:94px;
margin:0 auto;
text-align:left;
position:relative;
}


	div#header h1 {
	width:525px; height:34px;
	line-height:34px;
	margin-top:31px;
	float:left;
	}
	
	div#header h1 a {
	background:url(../images/h1.gif) no-repeat 0 0;
	width:525px; height:34px;
	display:block;
	text-indent:-9999px;
	}
	
	
	div#header ul {
	width:300px;
	position:absolute;
	top:40px; right:0px;
	}

	div#header ul li {
	float:right;
	margin-left:20px;
	background:url(../images/link-arrow1.gif) no-repeat 0 2px;
	line-height:1.2;
	padding-left:15px;
	}


/**************************************************************************************************

TOP VISUAL AREA

**************************************************************************************************/


div#visualArea {
width:880px; height:443px;
background:url(../../images/visual1.jpg) no-repeat 0 0;
text-indent:-9999px;
margin:0 auto;
}


/**************************************************************************************************

NAVIGATION

**************************************************************************************************/


div#navigation {
width:880px; height:71px;
margin:0 auto;
}

	div#navigation ul { 
	width:880px; height:71px;
	}
	
	div#navigation ul li {
	float:left; height:71px;
	line-height:71px;
	}
	
	div#navigation ul li a {
	height:71px;
	background:url(../images/navigation.png) no-repeat 0 0;
	display:block;
	text-indent:-9999px;
	}
	
		div#navigation ul li.about a { width:221px; background-position:0 0; }
		div#navigation ul li.sample a { width:220px; background-position:-221px 0; }
		div#navigation ul li.faq a { width:220px; background-position:-441px 0; }
		div#navigation ul li.order a { width:219px; background-position:-661px 0; }
	
		div#navigation ul li.about a:hover { background-position:0 -71px; }
		div#navigation ul li.sample a:hover { background-position:-221px -71px; }
		div#navigation ul li.faq a:hover { background-position:-441px -71px; }
		div#navigation ul li.order a:hover { background-position:-661px -71px; }
	
		div#navigation ul li.about a:active,div#navigation ul li.about a.on { background-position:0 -142px; }
		div#navigation ul li.sample a:active,div#navigation ul li.sample a.on { background-position:-221px -142px; }
		div#navigation ul li.faq a:active,div#navigation ul li.faq a.on { background-position:-441px -142px; }
		div#navigation ul li.order a:active,div#navigation ul li.order a.on { background-position:-661px -142px; }


/**************************************************************************************************

CONTENT AREA

**************************************************************************************************/


div#contentArea {
width:820px; height:auto;
background:url(../images/bg-content.gif) repeat-y 0 0;
padding:30px; margin:0 auto;
text-align:left;
}

div#contentArea div.section { margin:0 15px; }

div#contentArea div#flowchart { margin-top:25px; background:url(../../order/images/flowchart.gif) no-repeat 0 0; width:790px; height:449px; text-indent:-9999px; }

	div#contentArea div#about { background:url(../../images/bg-about.jpg) no-repeat right 70px; }
	div#contentArea div#t-shirts { background:url(../../images/t-shirts.jpg) no-repeat 0 0; width:720px; height:460px; text-indent:-9999px; margin-top:25px; }
	
	div#contentArea div#faq h2 { background:url(../../faq/images/h2.gif) no-repeat 0 0; width:820px; height:35px; text-indent:-9999px; }
	div#contentArea div#sample h2 { background:url(../../sample/images/h2.gif) no-repeat 0 0; width:820px; height:35px; text-indent:-9999px; }
	div#contentArea div#order h2 { background:url(../../order/images/h2.gif) no-repeat 0 0; width:820px; height:35px; text-indent:-9999px; }
	div#contentArea div#orderform h2 { width:820px; height:115px; text-indent:-9999px; }
		
		div#orderform h2.one { background:url(../../order/images/h2-1.gif) no-repeat 0 0;}
		div#orderform h2.two { background:url(../../order/images/h2-2.gif) no-repeat 0 0;}
		div#orderform h2.three { background:url(../../order/images/h2-3.gif) no-repeat 0 0;}
		div#orderform h2.four { background:url(../../order/images/h2-4.gif) no-repeat 0 0;}
		div#orderform h2.five { background:url(../../order/images/h2-5.gif) no-repeat 0 0;}
	
	div#orderform input,div#orderform select,div#orderform textarea { padding:2px; }
	
	div#thankyou { text-align:center; margin-top:50px; }
	
		
/**************************************************************************************************

H3

**************************************************************************************************/


h3 {
width:820px; height:35px;
text-indent:-9999px;
display:block;
line-height:35px;
}


	div#contentArea div#about h3 { background:url(../../images/h3-about01.gif) no-repeat 0 0; }
	
	div#contentArea div#faq h3,div#contentArea div#sample h3,div#contentArea div#orderform h3 { text-indent:0px !important; border-left:2px #49813c solid; padding:0px 10px; font-size:140%; color:#49813c; line-height:1.6 !important; margin-top:25px; height:auto !important; }


/**************************************************************************************************

H4

**************************************************************************************************/


h4 {
margin-top:30px;
height:35px; line-height:35px;
display:block;
text-indent:-9999px;
}


	div#about h4.h4-1 { background:url(../../images/h4-1.gif) no-repeat 0 0; width:377px; }
	div#about h4.h4-2 { background:url(../../images/h4-2.gif) no-repeat 0 0; width:317px; }
	div#about h4.h4-3 { background:url(../../images/h4-3.gif) no-repeat 0 0; width:653px; }
	div#about h4.h4-4,div#order h4.h4-4 { background:url(../../images/h4-4.gif) no-repeat 0 0; width:820px; }
	div#about h4.h4-5,div#order h4.h4-5 { background:url(../../images/h4-5.gif) no-repeat 0 0; width:820px; }
	div#about h4.h4-6 { background:url(../../images/h4-6.gif) no-repeat 0 0; width:820px; }
	div#about h4.h4-7 { background:url(../../images/h4-7.gif) no-repeat 0 0; width:820px; }


/**************************************************************************************************

p SMALL

**************************************************************************************************/

/** IE HACK **/
*:first-child + html small,* html small { font-size:78%; }
*:first-child + html small strong,* html small strong { font-size:102%; }
/** /IE HACK **/

p { line-height:1.9; margin-top:15px; }

	
	p.sampleBtn {
	width:810px; height:35px;
	margin-top:10px !important;
	}
	
	p.sampleBtn a {
	background:url(../../images/samplebtn.gif) no-repeat 0 0;
	width:810px; height:35px;
	display:block;
	text-indent:-9999px;
	}
	
	p.sampleBtn a:hover { background-position:0 -35px; }

	
	p.cautionBtn {
	width:810px; height:35px;
	margin-top:20px !important;
	}
	
	p.cautionBtn a {
	background:url(../../images/cautionbtn.gif) no-repeat 0 0;
	width:810px; height:35px;
	display:block;
	text-indent:-9999px;
	}
	
	p.cautionBtn a:hover { background-position:0 -35px; }
	
	p#orderbottan {
	margin-top:60px;
	}
	
	p#orderbottan a {
	background:url(../../order/images/orderbottan.gif) no-repeat 0 0;
	width:820px; height:110px;
	text-indent:-9999px;
	display:block;
	}
	
	
	p.formbottan {
	text-align:center;
	margin-top:40px;
	}
	
	p.formbottan input {
	padding:10px 20px !important;
	background:#49813C;
	color:#fff;
	border:#282828 2px solid;
	}
	
	p.formbottan input:hover {
	background:#6F9F63;
	border:#484848 2px solid;
	}
	

/**************************************************************************************************

UL

**************************************************************************************************/


div#about ul {
margin-top:18px;
}

	div#about ul li {
	margin-left:15px;
	list-style:outside disc;
	line-height:1.9;
	}


ul#caution {
margin-top:18px;
}

	ul#caution li {
	margin-left:15px;
	list-style:url(../../images/caution.gif) outside !important;
	line-height:1.9;
	}
	

div.imgList {
width:800px;
margin-top:10px;
overflow:hidden;
}

	div.imgList ul {
	width:800px;
	overflow:hidden;
	}

	div.imgList li {
	width:147px;
	float:left;
	margin:13px 13px 0 0;
	text-align:center;
	}
	
	div.imgList li span {
	font-size:75%;
	line-height:1.6;
	}
	
	div.imgList li span strong { font-size:110%; }
	
	.multiBoxDesc {
	display:none;
	}

/**************************************************************************************************

TABLE

**************************************************************************************************/


table {
margin-top:25px;
font-size:100%;
line-height:1.9;
border-top:2px solid #e6e6e6;
border-left:2px solid #e6e6e6;
border-right:1px solid #e6e6e6;
border-bottom:1px solid #e6e6e6;
}

	table th {
	font-weight:normal;
	color:#49813c;
	text-align:left;
	padding:6px 10px;
	background:#fafafa;
	border-right:1px solid #e6e6e6;
	border-bottom:1px solid #e6e6e6;
	}
	
	table td {
	padding:6px 10px;
	border-right:1px solid #e6e6e6;
	border-bottom:1px solid #e6e6e6;
	}
	
	
	table.delivery { height:255px; }
	/** IE HACK **/
	*:first-child + html table.delivery , * html table.delivery { height:266px; }
	/** /IE HACK **/
	
	
	table.size th,table.size td,table.center th,table.center td {
	text-align:center;
	}
	

/**************************************************************************************************

FLOAT

**************************************************************************************************/


.left { float:left; }
.right { float:right; }


	div.left#price { width:300px; }
	div.right#bonus { width:490px; height:243px; background:url(../../images/bonus.gif) no-repeat 0 25px; text-indent:-9999px; }
	

/**************************************************************************************************

FOOTER

**************************************************************************************************/


div#footer {
width:820px; height:auto;
margin-top:100px;
}

	
	div#footer ul { line-height:1.6; margin-top:4px; }
	
	/** IE HACK **/
	*:first-child + html div#footer ul,* html div#footer ul { margin-top:7px; }
	/** /IE HACK **/
	
	div#footer ul li {
	float:left;
	background:url(../images/footer-arrow.gif) no-repeat 0 6px;
	padding-left:10px;
	margin-right:10px;
	font-size:85%;
	}
	
	/** IE HACK **/
	*:first-child + html div#footer ul li , * html div#footer ul li { background:url(../images/footer-arrow.gif) no-repeat 0 4px; font-size:73%; }
	/** /IE HACK **/
	
	p.pagetop { width:119px; height:28px; line-height:28px; margin-left:701px; margin-top:0 !important; }
	
	p.pagetop a {
	background:url(../images/pagetop.gif) no-repeat 0 0;
	width:119px; height:28px;
	display:block;
	text-indent:-9999px;
	}
	
	
	p.copyrights {
	text-align:center;
	margin-top:5px; padding-top:50px;
	background:url(../images/footer-line.gif) repeat-x 0 0;
	font-size:85%; letter-spacing:1px; color:#B4B4B4;
	}