@charset "UTF-8";

/*=====================================
	       reset
=====================================*/


/*--- reset-----*/

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;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}	
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/*--- clear fix ---*/

.clearfix {zoom:1;}
.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}

/*--- font ---*/

body {
	font-size: 12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.4;
	background: #f3f0f0;
	color: #7C756F;
	letter-spacing: 0.1em;
}

/*--- aタグの設定 ---*/

a, a:link{
	color: #362e2b;
	text-decoration: none;
}
a:visited{
	color: #362e2b;
}
a:hover{
	color: #ccc;
	text-decoration: underline;
}
a:active{
	color: #ccc;
	text-decoration: none;
}

/*=====================================
	       base styles
=====================================*/

#wrapper {
	width: 980px;
	margin: 0 auto;
}

#header {
	width: 980px;
	height: 85px;
}

#topheader h1 {
	width: 145px;
	height: 35px;
	position: absolute;
	top: 50px;
	left: 140px; 
}



#header h1 {
	width: 145px;
	height: 35px;
	margin-top: 50px;
	margin-left: 10px;
	float: left;
}

#header p {
	margin-top: 67px;
	margin-right: 520px;
	width: 220px;
	height: 20px;
	float: right;
	/*position: absolute;
	top: 66px;
	left: 240px;*/
	}
	
#header p {
	margin-top: 67px;
	margin-right: 420px;
	width:320px;
	height: 20px;
	float: right;

	}

#main {
	clear:both;
	width: 980px;
	overflow: hidden; 
}


#topnav {
	width: 135px;
	/*height: 155px;*/
	float: left;
	list-style-type: none;
	position: absolute;
	top: 178px;
	left: 145px;
	color: #CC3;
	/*margin-top: 60px;
	margin-left: 15px;*/
}

#aboutnav ,#itemnav ,#knitnav ,#contactnav{
	width: 135px;
	height: 15px;
	float: left;
	list-style-type: none;
	margin-top: 60px;
	margin-left: 15px;
}

#content {
	margin-top: 60px;
	width: 720px;
	float: right;
	line-height: 2.0;
}

#itemcontent {
	margin-top: 60px;
	width: 720px;
	float: right;
	line-height: 2.0;
}

#topfooter {
	clear: both;
	position: absolute;
	top: 930px;
	left: 140px;
}

#contactfooter {
	clear: both;
	width: 980px;
	margin-top: 80px;
	margin-left: 750px;	
}

#footer {
	clear: both;
	width: 980px;
	/*margin-bottom: 10px;*/
	margin-left: 680px;
}

div#p_top{
	margin-left: 1100px;
}

/*=====================================
	       gnavi 
=====================================*/



/*-------------------- top -----------------*/


#topnav ul li a {
	text-indent: -9999px;
	text-decoration: none;
	display: block; /*領域を広げる*/
	margin-top: 25px;
	width: 145px;
	height: 15px;
	background-image: url(../img/gnavi_top.png);
	background-repeat: no-repeat;
	color: #F96;
	
}


#topnav ul li#topnav01 a {
	background-position: 0 0;
	
}

#topnav ul li#topnav02 a {
	background-position: 0 -42px;
}

#topnav ul li#topnav03 a {
	background-position: 0 -85px;
}

#topnav ul li#topnav04 a {
	background-position: 0 -128px;
}

#topnav ul li#topnav05 a {
	background-position: 0 -171px;
}

#topnav ul li#topnav01 a:hover {
	background-position: -145px 0;
}

#topnav ul li#topnav02 a:hover {
	background-position: -145px -42px;
}

#topnav ul li#topnav03 a:hover {
	background-position: -145px -85px;
}

#topnav ul li#topnav04 a:hover {
	background-position: -145px -128px;
}

#topnav ul li#topnav05 a:hover {
	background-position: -145px -171px;
}
	
/*-------------------- about ---------------------*/

#aboutnav ul li a {
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	line-height: 35px;
	background-image: url(../img/gnavi_about.png);
	background-repeat: no-repeat;
	
}

#aboutnav ul li#aboutnav01 a {
	background-position: -145px 0;
}

#aboutnav ul li#aboutnav02 a {
	background-position: 0 -37px;
}

#aboutnav ul li#aboutnav03 a {
	background-position: 0 -75px;
}

#aboutnav ul li#aboutnav04 a {
	background-position: 0 -110px;
}

#aboutnav ul li#aboutnav05 a {
	background-position: 0 -152px;
}

#aboutnav ul li#aboutnav06 a {
	background-position: 0 -195px;
}

#aboutnav ul li#aboutnav07 a {
	background-position: -145px -238px;
}

#aboutnav ul li#aboutnav08 a {
	background-position: 0 -281px;
}

/*#aboutnav ul li#aboutnav01 a:hover {
	background-position: -135px 0;
}*/

#aboutnav ul li#aboutnav02 a:hover {
	background-position: -145px -37px;
}

#aboutnav ul li#aboutnav03 a:hover {
	background-position: -145px -75px;
}

#aboutnav ul li#aboutnav04 a:hover {
	background-position: -145px -110px;
}
#aboutnav ul li#aboutnav05 a:hover {
	background-position: -145px -152px;
}

#aboutnav ul li#aboutnav06 a:hover {
	background-position: -145px -195px;
}

#aboutnav ul li#aboutnav07 a:hover {
	background-position: -145px -238px;
}

#aboutnav ul li#aboutnav08 a:hover {
	background-position: -145px -281px;
}

/*-------------------- knit ---------------------*/

#knitnav ul li a {
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	line-height: 35px;
	background-image: url(../img/gnavi_knit.png);
	background-repeat: no-repeat;
	
}

#knitnav ul li#knitnav01 a {
	background-position: 0 0;
}

#knitnav ul li#knitnav02 a {
	background-position: -145px -42px;
}

#knitnav ul li#knitnav03 a {
	background-position: 0 -81px;
}

#knitnav ul li#knitnav04 a {
	background-position: 0 -116px;
}

#knitnav ul li#knitnav05 a {
	background-position: -145px -158px;
}

#knitnav ul li#knitnav06 a {
	background-position: 0 -201px;
}


#knitnav ul li#knitnav01 a:hover {
	background-position: -145px 0;
}

#knitnav ul li#knitnav02 a:hover {
	background-position: -145px -42px;
}

#knitnav ul li#knitnav03 a:hover {
	background-position: -145px -81px;
}

#knitnav ul li#knitnav04 a:hover {
	background-position: -145px -116px;
}

#knitnav ul li#knitnav05 a:hover {
	background-position: -145px -158px;
}

#knitnav ul li#knitnav06 a:hover {
	background-position: -145px -201px;
}


/*-------------------- item ---------------------*/

#itemnav ul li a {
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	line-height: 35px;
	background-image: url(../img/gnavi_item.png);
	background-repeat: no-repeat;
	
}

#itemnav ul li#itemnav01 a {
	background-position: 0 0;
}

#itemnav ul li#itemnav02 a {
	background-position: 0 -42px;
}

#itemnav ul li#itemnav03 a {
	background-position: -145px -85px;
}

#itemnav ul li#itemnav04 a {
	background-position: 0 -123px;
}

#itemnav ul li#itemnav05 a {
	background-position: 0 -160px;
}

#itemnav ul li#itemnav06 a {
	background-position: -145px -201px;
}

#itemnav ul li#itemnav07 a {
	background-position: 0 -244px;
}

#itemnav ul li#itemnav01 a:hover {
	background-position: -145px 0;
}

#itemnav ul li#itemnav02 a:hover {
	background-position: -145px -42px;
}

#itemnav ul li#itemnav03 a:hover {
	background-position: -145px -85px;
}

#itemnav ul li#itemnav04 a:hover {
	background-position: -145px -123px;
}
#itemnav ul li#itemnav05 a:hover {
	background-position: -145px -160px;
}

#itemnav ul li#itemnav06 a:hover {
	background-position: -145px -201px;
}

#itemnav ul li#itemnav07 a:hover {
	background-position: -145px -244px;
}


/*-------------------- contact ---------------------*/

#contactnav ul li a {
	text-indent: -9999px;
	text-decoration: none;
	display: block; /*領域を広げる*/
	margin-top: 25px;
	width: 145px;
	height: 15px;
	background-image: url(../img/gnavi_top.png);
	background-repeat: no-repeat;
	
}


#contactnav ul li#contactnav01 a {
	background-position: 0 0;
	
}

#contactnav ul li#contactnav02 a {
	background-position: 0 -42px;
}

#contactnav ul li#contactnav03 a {
	background-position: 0 -85px;
}

#contactnav ul li#contactnav04 a {
	background-position: -145px -128px;
}

#contactnav ul li#contactnav05 a {
	background-position: -145px -171px;
}

#contactnav ul li#contactnav01 a:hover {
	background-position: -145px 0;
}

#contactnav ul li#contactnav02 a:hover {
	background-position: -145px -42px;
}

#contactnav ul li#contactnav03 a:hover {
	background-position: -145px -85px;
}

/*#contactnav ul li#contactnav04 a:hover {
	background-position: -145px -128px;
}*/

#contactnav ul li#contactnav05 a:hover {
	background-position: -145px -171px;
}