@charset "UTF-8";
/* CSS Document */




body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p,
fieldset, input, textarea, p, blockquote, th, td{
    margin: 0; 
    padding: 0;
}

img{
	border:none;
	outline: none;
}

img a{
	border:none;
	outline: none;
}

a:focus{
outline:none;
}

a {
overflow:hidden;
}

html{
	width:100%;
	height:100%;
    /*overflow-y: scroll;*/
}


h1, h2, h3, h4, h5, h6{
    font-size: 100%; 
    font-weight: normal;
}


ol, ul{
    list-style:none;
}

html{
	height:100%;
	width:100%;
}



body{
	height:100%;
	width:100%;
	margin:0px;
	padding:0px;
	text-align:center;
	color:#4C4C4C;
	font-size:12px;
	line-height:1.5;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:#FFF;
	-webkit-font-smoothing: subpixel-antialiased;
}

img{
	vertical-align:bottom;
}


header{
	width:100%;
	margin:0 auto;
	position:relative;
	z-index:10;
	height:auto;
	min-width:990px;
	padding-bottom:40px;
}

header .mb{ display:none;}

header .logo{
	position:absolute;
	top:20px;
	left:20px;
	z-index:20;
}

header h1{
	position:absolute;
	top:49%;
	left:5%;
	width:230px;
}


section #wrapper{
	width:100%;
}

section .itemarea{
	background:#F0F0F0;
}

section .itemareaIn{
	width:950px;
	padding:0 20px;
	margin:0 auto;
}

section .itemareaIn .itemimg{
	float:left;
	width:325px;
}

section .itemareaIn .itemright{
	width:500px;
	float:right;
	text-align:left;
}

section .itemareaIn .itemright h2{
	font-size:2.8em;
	margin:70px 0 25px 0;
}
section .itemareaIn .itemright h3{
	font-size:1.2em;
	line-height:1.8;
}

section .itemareaIn .itemright h4{
	margin-top:20px;
	font-size:2.5em;
	line-height:1.0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:300;
}
section .itemareaIn .itemright h4 span{ font-size:0.7em;}

section .itemareaIn .itemright .price{
	font-size:1.2em;
	margin-top:5px;
}

section .itemareaIn .itemright .icon{
	margin-top:15px;
}



section ul.part{
	width:978px;
	margin:0 auto;
	padding:0 6px;
	margin-top:50px;

}

section ul.part li{
	width:296px;
	float:left;
	margin:15px;
	text-align:left;
}

section ul.part li h2{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:300;
	font-size:1.6em;
	line-height:1.2;
	margin-top:6px;
}

section ul.part li h3{
	margin-bottom:8px;
}
section ul.part li h4{
	height:4.5em;
}



.fabric{
	width:100%;
	border-top:1px solid #CCC;
	margin-top:40px;
	padding-top:20px;
}




section .fabric dl{
	width:950px;
	padding:0 20px;
	margin:0 auto;
	text-align:left;
}
section .fabric dl dt{
	float:left;
	width:90px;
	padding:2px 0;
}
section .fabric dl dd{
	float:left;
	width:850px;
	padding:2px 0;
}






.buy{
	width:100%;
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	margin-top:30px;
	margin-bottom:100px;
}

.buy a{
	padding:45px 0;
	background:#EDEDED;
	display:block;
	width:100%;
	color:#4C4C4C;
	text-decoration:none;
	font-size:2.2em;
}

.buy a:hover{
	background:#4C4C4C;
	color:#FFF;
}




@media only screen and (max-width: 768px) {
	

header{
	width:100%;
	margin:0;
	position:relative;
	z-index:10;
	height:auto;
	min-width:inherit;
	padding-bottom:10px;
}

header .logo{
	position:absolute;
	top:20px;
	left:20px;
	z-index:20;
}

header h1{
	width:50%;
	position:absolute;
	top:40%;
	left:0;
	right:0;
	margin:0 auto;
}

header .pc{
	display:none;
}
header .mb{
	display:block;
}









section .itemareaIn{
	width:100%;
	padding:0;
}

section .itemareaIn .itemimg{
	float:none;
	width:60%;
	margin:0 auto;
	padding-top:5px;
}

section .itemareaIn .itemright{
	width:90%;
	float:none;
	margin:0 auto;
	padding-top:50px;
	text-align:center;
}

section .itemareaIn .itemright h2{
	font-size:2.8em;
	margin:0;
	margin-bottom:15px;
}
section .itemareaIn .itemright h3{
	font-size:1.2em;
	line-height:1.8;
	text-align:left;
}

section .itemareaIn .itemright h4{
	margin-top:20px;
	font-size:2.5em;
	line-height:1.0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:300;
	width:100%;
	text-align:center;
}
section .itemareaIn .itemright h4 br{ display:none;}
section .itemareaIn .itemright h4 span{ font-size:0.7em; margin-left:10px;}

section .itemareaIn .itemright .price{
	font-size:1.2em;
	margin-top:5px;
}

section .itemareaIn .itemright .icon{
	margin-top:10px;
}










section ul.part{
	width:96%;
	margin:0 auto;
	padding:0;
	margin-top:30px;
}

section ul.part li{
	width:45%;
	float:left;
	margin:0 2.5% 2.5% 2.5%;
	text-align:left;
}

section ul.part li h2{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:300;
	font-size:1.6em;
	line-height:1.2;
	margin-top:6px;
}

section ul.part li h3{
	margin-bottom:8px;
}

section ul.part li h4{
	height:6em;
}



.fabric{
	width:100%;
	border-top:1px solid #CCC;
	margin-top:0px;
	padding-top:20px;
}

section .fabric dl{
	width:92%;
	padding:0;
	margin:0 auto;
	text-align:left;
}
section .fabric dl dt{
	float:left;
	width:17%;
}
section .fabric dl dd{
	float:left;
	width:83%;
}











.shopIn{
	width:90%;
}

.shop h3{
	text-align:center;
}

.shop dl{
	width:100%;
	margin:0 auto;
	border-bottom:1px solid #E6E6E6;
}
.shop dl dt{
	float:none;
	width:100%;
	padding:7px 0 0 0;
}
.shop dl dd{
	float:left;
}
.shop dl dd.add{
	width:70%;
	padding:0 0 7px 0;
}
.shop dl dd.tel{
	width:20%;
	padding:0 0 7px 0;
	text-align:right;
}
.shop dl dd.map{
	width:45px;
	text-align:center;
	float:right;
}
.shop dl dd.map a{
	
	padding:0 0 7px 0;
}










}



@media only screen and (max-width: 553px) {
	
	
header{
	padding-bottom:40px;
}

header h1{
	width:70%;
}
	
section .itemareaIn .itemright h2{
	font-size:2.5em;
	margin:0;
	margin-bottom:15px;
}

section .itemareaIn .itemimg{
	width:80%;
	margin:0 auto;
}

section ul.part{
	width:80%;
	margin:40px auto 0 auto;
}

section ul.part li{
	width:100%;
	float:none;
	margin:0;
	text-align:left;
}

.fabric{
	width:100%;
	border-top:1px solid #CCC;
	margin-top:0px;
	padding-top:20px;
}

section .fabric dl{
	width:90%;
	padding:0;
	margin:0 auto;
	text-align:left;
}
section .fabric dl dt{
	float:none;
	width:100%;
	margin-top:5px;
}
section .fabric dl dd{
	float:none;
	width:95%;
	margin:0 auto;
}



.shop dl{
	width:100%;
	margin:0 auto;
	border-bottom:1px solid #E6E6E6;
}
.shop dl dt{
	float:none;
	width:100%;
	padding:7px 0 0 0;
	text-align:center;
}
.shop dl dd{
	float:none;
}
.shop dl dd.add{
	width:100%;
	padding:0;
	text-align:center;
}
.shop dl dd.add span{
	display:none;
}
.shop dl dd.tel{
	width:100%;
	padding:0;
	text-align:center;
}
.shop dl dd.map{
	width:100%;
	text-align:center;
	float:none;
}
.shop dl dd.map a{
	
	padding:0 0 7px 0;
}



}



/* ========================================================
                            Clerfix
   ======================================================== */

#wrapper:after,
ul:after,
dl:after,
section .itemareaIn:after{
	  content: "";
	  display: table;
	  float:none;
	  clear: both;
}














