@charset "utf-8";
/* Reset Styles
***********************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
#bodyContents:before {content:'kyoto kimonomachi';color:#fff;font-size:x-large;line-height:1.5;display:block;background:#c00;}
#kimonomachi #bodyContents:before {content:none;}
#bodyContents:after {content:'copyright kyoto kimonomachi';color:#fff;font-size:x-large;line-height:1.5;display:block;background:#c00;padding:20px;}
#kimonomachi #bodyContents:after {content:none;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q demo
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse;
border-spacing: 0;}
strong {font-weight: bold;}
em {font-style: italic;}


/* General
***********************/

body {
	background-color: #fff;
	margin: 0px;
	padding: 0px;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14px;
	line-height:1.2;
}
a:hover img {
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
em {
	color:#6c0;
	font-style:normal;
}

/* --Clearfix */
.cf:before,
.cf:after {content:""; display:table;}
.cf:after {clear:both;}
.cf {zoom:1;}

/* Layout
***********************/
header {
	width: 630px;
	margin:0 auto;
}
#select {
	width: 630px;
	margin:0 auto;
	overflow:hidden;
}
.mainImageBox {
	display:none;
/*mainImage有の場合*/
/*	float: left;
	width: 450px;
	margin-right:8px;
	overflow:hidden;*/
}
.thumbnailBox {
	width: 100%;
/*mainImage有の場合*/
/*	float: left;
	width: 170px;*/
}

/* Header
***********************/
h1.title {
	padding:5px 0;
	text-align:center;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size:24px;
	font-weight:normal;
	letter-spacing:0.2em;
	color:#993;
	/*background: url(../parts/title-kimono.gif) no-repeat;
	height:45px;
	width:100%;
	text-indent:-9999px;
	overflow:hidden;*/
}
h1.title .en {
	font-size:12px;
	padding-right:1em;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
h1.title img {
	width:100%;
	max-width:300px;
}

/*-----------------------------------*/

.mouse {
	font-size:13px;
	color:#999;
	padding:5px;
	text-align:center;
}
.mouse .arrow {
	color:#3C94A3;
}

#select img {
	border:none;
}

.mainImage {
	width: 450px;
	height:650px;
	overflow:hidden;
}

nav ul {margin: 0; overflow: hidden;}
nav ul li {
	width: 25%;
	float: left;
	margin: 0;
	overflow:hidden;
}
nav ul li a {
	display:block;
	height:150px;
	margin: 0;
	text-decoration: none;
	/*text-shadow: 1px 1px 0px #000 , -1px -1px 0px #000 ,-1px 1px 0px #000 , 1px -1px 0px #000;*/
}
nav ul li a:link , nav ul li a:visited {
	color:#333;
	border:1px solid #fff;
}
nav ul li a:hover ,nav ul li a:active {
	color:#666;
	border:1px solid #ccc;
}

nav ul li:hover {opacity: 0.8;}


/* Products
***********************/
nav ul.obi .no01 {background:url(../images2015/obi01.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no02 {background:url(../images2015/obi02.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no03 {background:url(../images2017/obi03.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no04 {background:url(../images2015/obi04.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no05 {background:url(../images2017/obi05.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no06 {background:url(../images2015/obi06.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no07 {background:url(../images2015/obi07.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no08 {background:url(../images2017/obi08.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no09 {background:url(../images2015/obi09.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no10 {background:url(../images2015/obi10.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no11 {background:url(../images2017/obi11.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no12 {background:url(../images2016/obi12.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no13 {background:url(../images2016/obi13.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no14 {background:url(../images2016/obi14.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no15 {background:url(../images2016/obi15.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no16 {background:url(../images2015/obi16.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no17 {background:url(../images2015/obi17.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no18 {background:url(../images2015/obi18.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no19 {background:url(../images2015/obi19.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no20 {background:url(../images2015/obi20.jpg) center no-repeat;background-size:auto auto;}
nav ul.obi .no21 {background:url(../images2015/obi21.jpg) center no-repeat;background-size:auto auto;}

/*新商品・完売など*/
nav ul .label {
	color:#f00;
	font-size:0.9em;
	font-weight:bold;
	height:100%;
	margin: 0 0 0 5px;
	text-shadow: 1px 1px 0px #fff , -1px -1px 0px #fff ,-1px 1px 0px #fff , 1px -1px 0px #fff;
}

/*完売*/
nav ul li.soldout {
/*	margin: 1px;*/
	opacity: 0.5;
	filter: alpha(opacity=50);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=50)";  /* ie 8 */
	zoom:1;/*ie6/7 hack*/
	height:150px;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
}
nav ul li.soldout a {
	display:inline;
	height:auto;
}
nav ul li.soldout a:link , nav ul li.soldout a:visited ,
nav ul li.soldout a:hover , nav ul li.soldout a:active {
	/*color:#6c0;*/
	text-decoration: none;
	font-weight:normal;
	border:none;
}

.tanpin {
	margin:0 10px 10px 10px;
}
.tanpin a {
	display:block;
	text-decoration:none;
	text-align:center;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius:10px;
	margin:5px 0;
	padding:5px;
	border:1px solid #333;
}
.tanpin a:link , .tanpin a:visited {
	background:#fff;
	color:#333;
	box-shadow: 2px 2px;
}
.tanpin a:hover , .tanpin a:active {
	background:#ddd;
	color: #666;
	box-shadow: none;
}

.attention {
	padding:5px;
	background:#c00;
	color:#fff;
}

/* Media Queries
***********************/
@media screen and (max-width: 629px) {
	/* Layout
	***********************/
	header {
		width:100%;
	}
	#select {
		width: 100%;
	}
	/*mainImage有の場合*/
	/*.mainImageBox {
		display:none;
	}
	.thumbnailBox {
		float: none;
		width: 100%;
	}*/

	header {
		width:100%;
	}
	h1.title {
		font-size:21px;
	}
	h1.title .en {
		display:block;
		font-size:11px;
	}

	nav ul li , nav ul li.soldout {
		width: 24%;
		height:120px;
		float: left;
		margin: 0;
		border:1px solid #fff;
	}
	nav ul li a {
		display:block;
		height:100%;
		margin: 0;
		text-shadow: 1px 1px 0px #000 , -1px -1px 0px #000 ,-1px 1px 0px #000 , 1px -1px 0px #000;
	}
	nav ul li a:link , nav ul li a:visited {
		color:#fff;
		text-decoration: none;
	}
	nav ul li a:hover {
		color:#cfc;
		text-decoration: none;
		font-weight:normal;
	}
	nav ul li a:active{
		color:#fcc;
		text-decoration: none;
	}
	nav ul .label {
		text-shadow: 1px 1px 0px #fff , -1px -1px 0px #fff ,-1px 1px 0px #fff , 1px -1px 0px #fff;
	}
	nav ul li.soldout {
		margin: 0;
	}
	nav ul li.soldout a:link , nav ul li.soldout a:visited ,
	nav ul li.soldout a:hover , nav ul li.soldout a:active {
		color:#fff;
	}

	
}