@charset "UTF-8";
*{
font-family:Futura,sans-serif;
font-weight:100;
color:#6C3400;
}

body {
	background-image: url(img/background.png);
	background-repeat: repeat;
	background-attachment: scroll;
	background-position: right top;
	margin: 0px;
	padding: 0px;
}

header{
position: fixed;            /* ヘッダーの固定 */
top: 0px;                   /* 位置(上0px) */
left: 0px;                  /* 位置(右0px) */
width: 100%;                /* 横幅100%　*/
height: 0px;              /* 縦幅150px */
z-index: 1;
}

.headercontainer{
margin: 0 auto;
position: relative;
max-width: 1280px;
}

.headerlist li{
float:right;
list-style:none;
}

.headerbutton{
padding-right:20px;
}

.headerimg{
padding-left:20px;
}

main{
margin: 0 auto;
position: relative;
max-width: 1400px;
}

h1{
text-align: center;
margin:100px 20px 40px 20px;
}

h2{
text-align: center;
margin:100px 20px 50px 20px;
}

h3{
text-align: center;
margin:5px 5px 5px 5px;
}

.housebutton{
text-align: center;
margin:10px 10px 40px 10px ;
}

.houseimg{
	display: inline-block;
	margin:15px 10px 10px 10px;
}

#leatherbuttontext , #woodbuttontext , #candlebuttontext , #glassbuttontext{
	padding: 0 0 1px 0;
	border-bottom: solid 2px #CCC;
}

#allbuttontext{
	padding: 0 0 1px 0;
	border-bottom: solid 2px #6C3400;
}

.square_btn{
   position: relative;
   display: inline-block;
   padding: 0.1em 0 0 0;
   text-decoration: none;
}

.topline{
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	margin-top:20px;
}

.photo{
text-align: center;
margin:20px;
}

.leather , .wood , .candle , .glass{
display: inline-block;
margin:10px 10px 50px 10px;
}

.photo-leather , .photo-wood , .photo-candle ,  .photo-glass , .caption{
margin:5px;
text-align: center;
}

footer{
width:100%;
}

.footercontents{
padding:10px 0px;
text-align: center;
background-color:#DEE566;
}

.footerimg{
margin:10px;
}

.copylight{
text-align: center;
}

@media screen and ( max-width:849px )
{
	#leatherbutton , #woodbutton , #candlebutton ,#glassbutton , #allbutton{
	 width:120px;
	 height:106px;
	}
	
	h1{
	margin:80px 20px 20px 20px;
	}
	
	.housebutton{
	margin:5px 0px 20px 0px ;
	}

}

   /* コンタクトフォーム*/
   form {
    /* フォームをページの中央に置く */
    margin: 50px auto 30px  auto;
    width: 400px;
    /* フォームの範囲がわかるようにする */
    padding: 1em;
    border: 1px solid #CCC;
    border-radius: 1em;
	}

	form div + div {
    	margin-top: 1em;
	}
	
	label {
    /* すべてのラベルを同じサイズにして、きちんと揃える */
    display: inline-block;
    width:150px;
    text-align: right;
	}
	
	input:focus, textarea:focus {
    /* アクティブな要素を少し強調する */
    border-color: #000;
	}
	
	textarea {
    /* 複数行のテキストフィールドをラベルにきちんと揃える */
    vertical-align: top;

    /* テキスト入力に十分な領域を与える */
    height: 5em;

    /* ユーザが textarea を垂直方向にリサイズできるようにする
       これが動作しないブラウザもある */
    resize: vertical;
	}
	
	.button {
    /* ボタンを他のテキストフィールドと同じ場所に置く */
    padding-left: 150px; /* label 要素と同じサイズ */
	}
	
	button {
    /* このマージンは、ラベルとテキストフィールドの間のスペースと
       おおよそ同じスペースを表す */
    margin-left: .5em;
	}
	
	.required{
	font-size:10px;
	color:#fff;
	padding:3px 3px 0px 3px;
	margin:2px;
	border-radius:5px;
	background-color:#FF0004;
	}
	
@media screen and ( max-width:479px )
{
	form {
    width: 280px;
	}
	
	h2{
	font-size:20px;
	margin:100px 20px 20px 20px;
	}
	
	label {
    /* すべてのラベルを同じサイズにして、きちんと揃える */
    display: inline-block;
    width:100px;
    text-align: right;
	font-size:14px;
	}
	
	.button {
    /* ボタンを他のテキストフィールドと同じ場所に置く */
    padding-left: 100px; /* label 要素と同じサイズ */
	}
}

.events{
text-align: center;
margin:0px 10px 50px 10px
}

.eventsday{
font-size:13px;
margin:0px;
}

.eventstext{
font-size:15px;
margin:10px;
}

 /*item*/
 .item {
text-align: center;
overflow: hidden;
margin:100px 0px 20px 0px;
}

.itemphoto , .itemtext {
display: inline-block;
text-align: left;
margin: 20px 5px 0px 5px;
}

.itemtext  h2{
text-align: left;
margin:0px;
font-size:24px;
}

.price{
font-size: 18px;
}

.description{
font-size: 12px;
margin:0px 0px 15px 0px;
}

.itemphotos{
text-align: center;
margin:0px 10px 50px 10px;
}

.itemphoto-s{
display: inline-block;
margin:5px;
text-align: center;
}

#i001{
border-bottom: 2px solid #6C3400 ;	
}