/*-------------------------------------------
   基本スタイル
---------------------------------------------*/

* {										/* 全体 */
	margin: 0;
	padding: 0;
	font-size: 100%;
}

body {									/* ボディ */
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "メイリオ", "Meiryo", "ＭＳ 明朝" , "MS Mincho", serif;  /* 文字は左から優先 */
	line-height: 25px;
	color: #333333;
}

a {										/* 通常 */
	color: #666666;
	text-decoration:none;				/* リンク線：なし */
}

a:visited {								/* 読込済 */
	color: #666666;
}

a:hover {								/* マウスON */
	color: #bdccd4;
	text-decoration:none;				/* リンク線：なし */
}

li{										/* リスト */
	list-style-type: none;
}

img {									/* 画像 */
	border: none;
	vertical-align: top;
	max-width: 100%;
	height: auto;
}

::selection {background: #e6e6e6; color: #666666;}			/* 文字選択色 */
::-moz-selection {background: #e6e6e6; color: #666666;}


/*-------------------------------------------
   ベーススタイル
---------------------------------------------*/


body {
	font-size: 85%;
}

div#container {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
}


/*  ヘッダースタイル
--------------------------------------------*/

div#head {
	background-color: #FFFFFF;
	width: 1000px;
}

div#head #snsbar {
	height: 20px;
	margin: 10px 0 10px auto;
}

div#head #snsbar #dstore {
	float: left;
	text-align: left;
	width: 160px;
	height: 40px;
}

div#head #snsbar #dstore a {
	display: block;
	overflow: hidden;
	width: 160px;
	height: 0 !important;							/* 高さ ：優先 */
	padding-top: 40px;
}

div#head #snsbar ul {
	float: right;
	text-align: right;
	width: 160px;
	height: 20px;
}

div#head #snsbar ul li {
	display: inline;
	float: left;
}

div#head #snsbar ul li a {
	display: block;
	overflow: hidden;
	width: 40px;
	height: 0 !important;							/* 高さ ：優先 */
	padding-top: 20px;
}

/* 通常---------------*/
	#dstore a { background-image: url(../img/nav_dsstore.jpg); background-size: 160px 80px;}
	#sns1 a { background-image: url(../img/nav_twitter.jpg);background-size: 40px 40px; }
	#sns2 a { background-image: url(../img/nav_fb.jpg); background-size: 40px 40px;}
	#sns3 a { background-image: url(../img/nav_insta.jpg); background-size: 40px 40px;}
	#sns4 a { background-image: url(../img/nav_ravelry.jpg); background-size: 40px 40px;}
/* マウスオーバー-----*/
	#dstore	a:hover { background-position:  0 -40px; }
	#sns1 	a:hover { background-position:  0 -20px; }
	#sns2 	a:hover { background-position:  0 -20px; }
	#sns3 	a:hover { background-position:  0 -20px; }
	#sns4 	a:hover { background-position:  0 -20px; }

div#head #logo {
	height: 120px;
	clear: both;
	text-align: center;
	margin: 40px auto 20px auto;
}


/* ナビゲーションスタイル
---------------------------------------------*/

div#navi{
	width: 1000px;
	clear: both;
}

div#navi ul {
	clear: both;
	width: 100%;
	height: 54px;
}

div#navi ul li {
	display: inline;
	float: left;
}

div#navi ul li a {
	display: block;
	overflow: hidden;
	height: 0 !important;							/* 高さ ：優先 */
	padding-top: 54px;
}


/* グローバルナビ---------------*/
/* 通常---------------*/
	#nav1 	a { width: 130px; background-image: url(../img/nav_home.jpg); background-size: 130px 162px;}
	#nav2 	a { width: 140px; background-image: url(../img/nav_news.jpg); background-size: 140px 162px;}
	#nav3 	a { width: 120px; background-image: url(../img/nav_about.jpg);background-size: 120px 162px; }
	#nav4 	a { width: 160px; background-image: url(../img/nav_products.jpg);background-size: 160px 162px; }
	#nav5 	a { width: 140px; background-image: url(../img/nav_factory.jpg); background-size: 140px 162px;}
	#nav6 	a { width: 150px; background-image: url(../img/nav_history.jpg); background-size: 150px 162px;}
	#nav7 	a { width: 160px; background-image: url(../img/nav_order.jpg);background-size: 160px 162px; }
	
/* マウスオーバー-----------*/
	#nav1 	a:hover { background-position:  0 -54px; }
	#nav2 	a:hover { background-position:  0 -54px; }
	#nav3 	a:hover { background-position:  0 -54px; }
	#nav4 	a:hover { background-position:  0 -54px; }
	#nav5 	a:hover { background-position:  0 -54px; }
	#nav6 	a:hover { background-position:  0 -54px; }
	#nav7 	a:hover { background-position:  0 -54px; }

/* 選択済み-----*/
	#nav1 	a.stay { background-position:  0 -108px; }
	#nav2 	a.stay { background-position:  0 -108px; }
	#nav3 	a.stay { background-position:  0 -108px; }
	#nav4 	a.stay { background-position:  0 -108px; }
	#nav5 	a.stay { background-position:  0 -108px; }
	#nav6 	a.stay { background-position:  0 -108px; }
	#nav7 	a.stay { background-position:  0 -108px; }

/* PRODUCTSナビ---------------*/
/* 通常---------------*/
	#pnav1 	a { width: 105px; 	background-image: url(../img/pnav4_thread.jpg)	; background-size: 105px 162px;}
	#pnav2 	a { width: 105px; 	background-image: url(../img/pnav4_yarn.jpg)	; background-size: 105px 162px;}
	#pnav3 	a { width: 125px; 	background-image: url(../img/pnav4_crochet.jpg)	; background-size: 125px 162px;}
	#pnav4 	a { width: 97px; 	background-image: url(../img/pnav4_book.jpg)	; background-size: 97px 162px;}
	#pnav5 	a { width: 123px; 	background-image: url(../img/pnav4_knittool.jpg); background-size: 123px 162px;}
	#pnav6 	a { width: 125px; 	background-image: url(../img/pnav4_fabric.jpg)	; background-size: 125px 162px;}
	#pnav7 	a { width: 120px; 	background-image: url(../img/pnav4_babykit.jpg)	; background-size: 120px 162px;}
	#pnav8 	a { width: 105px; 	background-image: url(../img/pnav4_sashiko.jpg)	; background-size: 105px 162px;}
	#pnav9 	a { width: 95px; 	background-image: url(../img/pnav4_craft.jpg)	; background-size: 95px 162px;}
	
/* マウスオーバー-----------*/
	#pnav1 	a:hover { background-position:  0 -54px; }
	#pnav2 	a:hover { background-position:  0 -54px; }
	#pnav3 	a:hover { background-position:  0 -54px; }
	#pnav4 	a:hover { background-position:  0 -54px; }
	#pnav5 	a:hover { background-position:  0 -54px; }
	#pnav6 	a:hover { background-position:  0 -54px; }
	#pnav7 	a:hover { background-position:  0 -54px; }
	#pnav8 	a:hover { background-position:  0 -54px; }
	#pnav9 	a:hover { background-position:  0 -54px; }

/* 選択済み-----*/
	#pnav1 	a.stay { background-position:  0 -108px; }
	#pnav2 	a.stay { background-position:  0 -108px; }
	#pnav3 	a.stay { background-position:  0 -108px; }
	#pnav4 	a.stay { background-position:  0 -108px; }
	#pnav5 	a.stay { background-position:  0 -108px; }
	#pnav6 	a.stay { background-position:  0 -108px; }
	#pnav7 	a.stay { background-position:  0 -108px; }
	#pnav8 	a.stay { background-position:  0 -108px; }
	#pnav9 	a.stay { background-position:  0 -108px; }

.fixed {
    position: fixed;
    top: 0;
	width: 100%;
	border-bottom: #CCC solid 1px;
}


/*  コンテンツボックススタイル
--------------------------------------------*/
div#content {
/*
	margin-top: -54px;
	padding-top: 54px;		/* 固定メニュー分打ち消し */

	clear: both;
	width: 1000px;
	overflow: hidden;
	padding-bottom: 20px;
}



/*  ページトップボタン
--------------------------------------------*/
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}



/*  フッタースタイル
--------------------------------------------*/
div#footer {
	clear: both;
	width: 100%;
	min-width: 1000px;
	background-color: #b4b4b4;
	height: 170px;
}

div#footer #ftbox {
	clear: both;
	width: 900px;
	height: 40px;
	margin:0 auto;
	padding: 20px 0 0 0;
}

div#footer #ftbox ul {
}

div#footer #ftbox ul li {
	float: left;
	padding: 0 8px;
}

div#footer #ftbox ul li a {										/* 通常 */
	color: #FFF;
	text-decoration:none;				/* リンク線：なし */
}

div#footer #ftbox ul li a:visited {								/* 読込済 */
	color: #FFF;
}

div#footer #ftbox ul li a:hover {								/* マウスON */
	color: #bdccd4;
	text-decoration:none;				/* リンク線：なし */
}

address {
	float: right;
	text-align: right;
	font-style: normal;
	font-size: 80%;
	color: #FFF;
	padding: 1px 20px 0 0;
}


/* clearスタイル
---------------------------------------------*/

div .end {
	clear: both;
}

div .end img{
	border: none !important;
}


/* Fontスタイル
---------------------------------------------*/

.unbar{ text-decoration: underline;}
.new {color: yellow;}
.red { color: red;}