@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 )";
}

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

/* Layout
***********************/
#bodyContents {
	max-width: 600px;
	margin:0 auto;
}
header {
	text-align:right;
}

h1 , h2 {
	display:inline;
	font-weight:normal;
	font-size:11px;
	color:#fefefe;
}

h3 {
text-align: center;
background: #333;
color: #fff;
font-weight: normal;
letter-spacing: 5px;
padding: 5px;
font-size: 14px;
}

.title img {
	width:100%;
}

#select {
}
#select img {
	width:100%;
	display:block;
	padding:20px 0;
	border-bottom:1px dotted #ccc;
}
footer {
	display:none;
}

/* Media Queries
***********************/
@media screen and (max-width: 600px) {
	#bodyContents {
	  max-width:none;
	}
	h1 , h2 {
		display:inline;
		font-weight:normal;
		font-size:11px;
		color:#999;
	}
	footer {
		display:block;
	}

	.sale {
		max-width:700px;
		margin:10px auto;
		border-top:1px dotted #999;
		padding:20px 10px;
		font-size:0.9em;
	}
	.sale .logo {
		text-align:center;
		margin:20px 0;
	}
	.sale .logo img {
		width:100%;
		max-width:600px;
	}
	
	.sale .title {
		float:none;
		font-size: 1.0em;
		color:#333;
		margin-bottom:0.5em;
		text-align:center;
	}
	.sale .link {
		list-style-type:none;
		margin:10px 0;
		padding: 0;
	}
	.sale .link li {
		display:block;
		margin-right:0;
	}
	.sale .link li:before {
		content:"";
	}
	
	.sale .link li a {
		display:block;
		text-align:center;
		border:1px solid #fff;
		padding:1em 10px;
		margin-bottom:1px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-o-border-radius: 10px;
		border-radius: 10px;
	}
	.sale .link li a:after {
		content:" >>";
	}
	
	.sale .link li a:link , .sale .link li a:visited {
		color:#fff;
		background:#941228;
		text-decoration: none;
	}
	.sale .link li a:hover {
		background:#9D384D;
		text-decoration: none;
	}
	.sale .link li a:active{
		background:#000;
		text-decoration: none;
	}
	
	.copyright {
		text-align:center;
		font-size:11px;
		color:#999;
	}
}