@charset "utf-8";


/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table.table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table.table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
/* -------------------------------------------------------------- */


/* all
------------------------------------------------------------*/


/* body */

body {
	color:#111;
	font-family:verdana,"ヒラギノ丸ゴ ProN W4","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	line-height:150%;
	-webkit-text-size-adjust: none;
	background:url(../images/bg_tile.gif);
	font-size:14px;
	}


/* link */


a{
	text-decoration:none;
}
	
a:hover{
	}


/* layout */


#wrapper{
	margin:0 auto;
	width:100%;
	}


.inner{
	margin:0 auto;
	width:100%;
}

#btm_wrap{
	padding:30px 0 0 0;
	width:100%;
	background:url(../images/bg_btm.gif);
	background-repeat:repeat-x;
}



.m20{
	margin:0 0 20px 0;
	}

.bold{
	font-weight:bold;
	}

.s75{
	font-size:75%;
	}


/* header */

#header{
	position:relative;
	height:365px;
	background:#FFF;
}
#header h1.logo{
	text-align:center;
	padding: 60px 0 0 0;
	text-indent:-9999px;
	background:url(../images/logo_top1.jpg) 50% 60px no-repeat;
	height:198px;
}
p#eyecatch{
	width: 100%;
	text-align:center;
	position:absolute;
	z-index:4;
}
p#menuBtn{
	display:none;
	position:fixed;
	top:2%;
	right:0;
	z-index:7;
	width: 12%;
	max-height:80px;
	overflow:hidden;
}
p#menuBtn img{
    /*width: 80%;*/
    max-height: 70px;
}
p#eyecatch img{
	width: 20%;
	height: auto;
	max-width: 250px;
}
/*nav#mainnavi{
	overflow:hidden;
	position:absolute;
	top:47%;
	right:7%;
}
nav#mainnavi li{
	float:left;
	padding-left:25px;
}
*/
nav#mainnavi{
	overflow:hidden;
	position:absolute;
	top:47%;
	right:7%;
    z-index: 5;
}

nav#mainnavi dl{
	float:left;
	padding-left:25px;
}
nav#mainnavi a dt img{
    transition: all 1s ease;
    -webkit-transition: all 0.5s ease;
}
nav#mainnavi a:hover dt img{
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
}


nav#menubox{
	overflow:hidden;
	position:fixed;
    top: 100px;
	display:none;
    background: rgba(0,0,0,0.9);
    z-index:10;
    width:100%;
    height:100%;
}
nav#menubox ul{
	padding:0; 
	zoom:1.5;
	margin:10% 5%;
	text-align:center;
}
nav#menubox li{
	background:url(../images/ico_navi_w.png) 50% 0px no-repeat;
	padding: 30px 0; 
	display: inline-block;
	vertical-align: text-top;
	width: 10%;
}
nav#menubox p{
	text-align:center;
}
nav#menubox p img{
	cursor:pointer;
}
div#menubar{
	position:fixed;
	top:0px;
	text-align:center;
	width:100%;
	background:#FFF;
	display:none;
	z-index:6;
}

/**************************
/* スライダー
**************************/

#slider{
	background-color:#fff;
}

	
#slider .slider_inner ul{
	position:relative;
}
#slider .slider_inner ul li{
	position:absolute;
	top:0px;
	left:0px;
	z-index:2;
	width:100%;
}
#slider .slider_inner ul li:first-child{
	position:relative;
	z-index:3;
}

#slider .slider_inner ul li img{
	width:100%;
	height:auto;
}
#slider .thumb{
	overflow:hidden;
	padding:50px 0;
	width: 1080px;
	margin: 0 auto;
}
#slider .thumb p{
	height:150px;
    line-height: 150px;
    width:40px;
}
#slider .thumb p img{
	vertical-align:middle;
}
#slider .thumb p.left{
	float:left;
	text-align:right;
}
#slider .thumb p.right{
	float:right;
	text-align:left;
}
#slider .thumb div{
	position:relative;
	text-align:center;
    height:150px;
    overflow:hidden;
}
#slider .thumb ul{
	position:absolute;
	width:9999px;
}
#slider .thumb ul li{
	float:left;
	display:inline-block;
	width: 333px;
}
#slider .thumb ul li img{
	width: 90%;
	height: auto;
}
#slider .thumb a {
	transition: all 0.2s ease-in-out 0s;
}
#slider .thumb a:hover {
	opacity: 0.7;
	transition: all 0.2s ease-in-out 0s;
}



/*************
メイン コンテンツ
*************/

div#container{
	background:url(../images/bg_washi.jpg) repeat;
}

body#post section#news,
body#post section#newgoods,
body#post section.newgoods,
body#post section#pickup{
	position:relative;
}

section#news,
section#newgoods,
section.newgoods,
section#pickup{
	padding:0 50px 80px;
/*	background:url(../images/bg_washi.jpg) repeat;*/
	background-repeat: no-repeat;
    background-position: top right;
    background-size:27%;
/*	position:relative;*/
}

section#newgoods,
section.newgoods,
section#pickup{
	border-top:1px solid #cccccc;
}

section h2{
	text-align:center;
	padding: 50px 0 30px ;
}
section p.more{
	position:absolute;
	top:50px;
	right:10%;
}


section ul{
	text-align:center;
}
section.news ul li,
section#news ul li{
	position:relative;
	margin: 30px 20px;
	padding: 0 0 30px 0;
	display:inline-block;
	width:300px;
	background:#FFF;
	cursor:pointer;
	transition: all 0.2s ease-in-out 0s;
}
section#news ul li>a{
	color:#000;
}
section.news ul li:hover,
section#news ul li:hover {
    background-color: #e8e8e8;
	transition: all 0.2s ease-in-out 0s;
}
section#newgoods ul li,
section.newgoods ul li,
section#pickup ul li{
	position:relative;
	margin: 30px 20px;
	padding: 0 0 10px 0;
	display:inline-block;
	width:300px;
	background:#FFF;
	cursor: pointer;
	transition: all 0.2s ease-in-out 0s;
}
section#newgoods ul li:hover,
section.newgoods ul li:hover,
section#pickup ul li:hover {
    background-color: #e8e8e8;
	transition: all 0.2s ease-in-out 0s;
}
section#news ul li:before,
section#newgoods ul li:before,
section.newgoods ul li:before,
section#pickup ul li:before{
	content:url(../images/bg_corner1.png);
	position:absolute;
	left:-18px;
	top:-17px;
    z-index: 2;
}
section#news ul li:after,
section#newgoods ul li:after,
section.newgoods ul li:after,
section#pickup ul li:after{
	content:url(../images/bg_corner2.png);
	position:absolute;
	right:-17px;
	bottom:-19px;
    z-index: 2;
}
section#news ul li p,
section#newgoods ul li p,
section.newgoods ul li p,
section#pickup ul li p{
	position:relative;
	display:inline-block;
	width:250px;
	text-align:left !important;
	padding: 0 5px;
	font-size:90%;
	margin:0;
}
section#news .flipsnap li p{
	margin:0 0 0 0;
}
section#news .flipsnap li p.body{
    overflow: hidden;
	height:6.8em;
}
#container #contents #pickup .flipsnap li .image,
#container #contents #newgoods .flipsnap li .image,
#container #contents .newgoods .flipsnap li .image{
	margin:0;
    height: 180px;
    overflow: hidden;
}
section#newgoods ul li p,
section.newgoods ul li p,
section#pickup ul li p{
	padding: 0 5px 0px;
	margin:0 0 20px 0;
}
section#newgoods ul li p.body,
section.newgoods ul li p.body,
section#pickup ul li p.body{
	overflow: hidden;
	height: 6.8em;
}
section#news ul li .date{
	margin:20px 0 10px 0;
	color:#000000;
}
section#news ul li img.flag,
section#newgoods ul li img.flag,
section.newgoods ul li img.flag,
section#pickup ul li img.flag{
	position:absolute;
	top:-4px;
	right:12px;
    z-index: 2;
}
section#news ul li p.title,
section#newgoods ul li p.title,
section.newgoods ul li p.title,
section#pickup ul li p.title{
	padding: 25px;
	color:#003255;
	font-size:108%;
	font-weight:bold;
}
section#newgoods ul li p.title,
section.newgoods ul li p.title,
section#pickup ul li p.title{
	padding:0 25px !important;
	margin:20px 0 10px 0;
}

section#news ul li p.title{
	padding-left: 5% !important;
	padding-right: 20% !important;
	width: 75% !important;
}

section ul li p.date{
	padding-top:10px;
	padding-bottom:5px;
	font-size:90%;
	font-weight:bold;
}
section ul li p.price{
	color:#003255;
	padding: 0 5px 15px 5px !important;
	margin:0 20px 15px 20px;
	font-weight:bold;
	border-bottom:1px dashed #9c9c9c;
}

section#news ul li p.image,
section#newgoods ul li p.image,
section.newgoods ul li p.image,
section#pickup ul li p.image{
	padding:0px;
	width:auto;
}
.center{
	text-align:center;
}
.tleft{
	text-align:left;
}

section#shoplist{
	background-color:#fff;
}



section#shoplist ul{
	text-align:center;
	padding: 0 50px 0;
}
section#shoplist ul li{
	position:relative;
	margin: 30px 70px;
	padding: 0 0 15px 0;
	display:inline-block;
	width:400px;
	background:#FFF;
}
#post #shoplist li {
    background-color: transparent !important;
}
section#shoplist ul li p{
	text-align:center;
	color:#003255;
	font-size:90%;
}
section#shoplist ul li p.title{
	padding: 0 0 25px 0;
	font-size:130%;
	font-weight:bold;
}
section#shoplist ul li p.title img{
	display:block;
    margin: 0 auto;
	padding: 0 0 15px 0;
}
section#shoplist ul li p.index{
	padding: 20px 0 0 0;
	font-weight:bold;
}
section#shoplist ul li p.access{
	border-top:1px dotted #003255;
	border-bottom:1px dotted #003255;
	margin:20px 0 0 0;
	padding: 20px 0;
	font-weight:bold;
	line-height:25px;
}

section#shoplist ul li p.access a{
	color:#003255;
}
section#shoplist ul li p.access a{
	position: relative;
	display: inline-block;
	padding: 0 16px 7px 0;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
	}
	

section#shoplist ul li p.access img{
	padding: 0px 0 0 0;
	}
	
/*section#shoplist ul li p.access a::before,
section#shoplist ul li p.access a::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
section#shoplist ul li p.access a::before{
	box-sizing: border-box;
	width: 4px;
	height: 4px;
	border: 4px solid transparent;
	border-left: 4px solid;
}
section#shoplist ul li p.access a::after{
	right: 2px;
	width: 6px;
	height: 4px;
	border-left: 4px solid;
}*/

/* 店舗詳細
------------------------------------------------------------*/
section#shop div{
	text-align:center;
}




















/* footer
------------------------------------------------------------*/


#footer{
	padding: 0 0 50px;
	position:relative;
	background:#333;
	tect-alin:center;
}

#footer .inner p{
	padding:50px 0 0;
	text-align:center;
}
#footer .inner ul{
	padding:50px 0 0;
	text-align:center;
}
#footer .inner ul li{
	display:inline-block;
    vertical-align: top;
	padding:0 7px;
}
#footer .inner p.totop{
	position:absolute;
	bottom:0px;
	right:10%;
}
#footer .inner p.totop img{
    vertical-align: bottom;
}


address{
clear:both;
padding:50px 0 20px 0;
text-align:center;
font-style:normal;
font-size:12px;
color:#666;
}

address img{
	width:200px;
}

.dl_table a{
	color: #6A9600;
	}

.form th td{
	padding:5px;
}

.form{
	margin:20px 0;
}

/* clear */

.clearfix:after {
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
	}

.clearfix {
	min-height: 1px; /*IE6、7対策*/
	}

* html .clearfix {
	height: 1px;
	/*\*//*/ /*MAC IE5.x対策*/
	height: auto;
	overflow: hidden;
	/**/
	}
	




.pointer {
  display:none;
  text-align: center; 
}

.pointer span {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  margin:0 1%;
  background: #CCC;
/*  border: 1px solid #000;*/
}

.pointer span.current {
  background: #000000; }
  
  
  
  


/*  モーダルウィンドウ  */
div#mordal{
	display:none;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	position:fixed;
	top:0px;
	left:0px;
    z-index: 10;
}
div#mordal div.mordal_inner{
	position:relative;
	background:#FFF;
	width:70%;
	margin:100px auto 0 auto;
	padding:65px 5% 0;
	overflow: auto;
    max-height: 600px;
}
div#mordal div.mordal_inner img.image{
	float:left;
	width:40%;
}
div#mordal div.mordal_inner p.flag{
	position:absolute;
	top:-4px;
	left:7%;
}

div#mordal div.mordal_inner div{
	float:right;
	width:55%;
}
div#mordal div.mordal_inner p.close{
	padding:60px 0 20px 0;
	clear:both;
	text-align:center;
}
div#mordal div.mordal_inner p.close img{
	cursor: pointer;
}
div#mordal div.mordal_inner p.date{
    font-weight: bold;
    color: #000;
	margin-bottom:1em;
}
div#mordal div.mordal_inner p.title{
    color: #003255;
    font-size: 140%;
    font-weight: bold;
    padding: 0 0 10px;
}
div#mordal div.mordal_inner p.price{
    color: #003255;
    font-size: 120%;
    font-weight: bold;
    padding:0;
}
div#mordal div.mordal_inner p.modal_body{
    padding:20px  0 0 ;
	line-height:1.7em;
}


@media only screen and (min-width:759px){
#menubar img {
    height: 77px;
    padding: 10px 0;
}
}
@media only screen and (max-width:1080px){
nav#mainnavi {
	width: 200px;
	overflow: hidden;
	top: 30px;
}
nav#mainnavi dl {
	height: 140px;
}
nav#mainnavi dl img{
	width: 80%;
	height: auto;
}


}

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:759px){

	html{
		zoom:0.8;
	}
	nav#mainnavi{
	}
	
	
	section#news, section#newgoods, section.newgoods, section#pickup {
    	padding: 0px;
    }
    
	section.main{margin-top:0px;}
	#header{
		height:auto;
	}

	#header h1.logo{
		background:url(../images/logo_top3smp.png) 50% 25px no-repeat;
		-webkit-background-size: 80% auto;
		-moz-background-size: 80% auto;
		-o-background-size: 80% auto;
		background-size: 80% auto;
		height:110px;
		margin:0 auto;
	}
	#header h1.logo img{ width:100%;}
	div#menubar img{
		width:24%;
		margin:1% 0;
	}

	
	#mainnavi{
		display:none;
	}
	
	.logo,.info{
	clear:both;
	width:100%;
	float:none;
	margin:0;
	}
	
	p#menuBtn{
		display:block;
	}
	p#eyecatch {
	    top: 80px;
	}
	p#eyecatch img{
	width: 30%;
	height: auto;
	}


#slider .thumb{
	overflow:hidden;
	padding:25px 0;
	width: 100%;
}
#slider .thumb p{
	min-height:120px;
    line-height: 100px;
    width:5%;
}
#slider .thumb p img{
	vertical-align:middle;
}
#slider .thumb p.left{
	float:left;
	text-align:right;
}
#slider .thumb p.right{
	float:right;
	text-align:left;
}
#slider .thumb div{
	position:relative;
	text-align:center;
	min-height:120px;
    overflow:hidden;
}
#slider .thumb ul{
	position:absolute;
	width:100%;
}
#slider .thumb ul li{
	float:left;
	display:inline-block;
	width: 50%;
	min-height:120px;
}
#slider .thumb ul li img{
	width: 90%;
	height: auto;
}


	
	.box h3{padding-top:0;}

  .alignleft,.alignright{
	float:none;
	display:block;
	margin:0 auto 10px;
	}
	
	#gallery .grid{float:left;}
	
	
	.viewport {
	    width: 100%;
	    overflow: hidden;
	    margin: 0 auto;
	    -webkit-transform: translateZ(0); /* Optional: When heavy at iOS6+ */
	}

	.flipsnap {
	    width:99999px;
	    padding-left:170px;
	}

	.flipsnap:after {
	    content: '';
	    display: block;
	    clear: both;
	    height: 0;
	}

	.flipsnap li {
	    float: left;
	    text-align: center;
	    padding: 50px 0;
	}
	.pointer{
		display:block;
	}
	
	address{
	clear:both;
	padding:20px 2%;
	font-size:0.7rem;
	}
	
	address img{
	width:25%;
	margin:0 auto;
}


}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:640px){
	.grid{width:100%;}
	.box img{max-width:100px;}
	.mainBanner h2,.mainBanner p{font-size:80%;}
	#sidebar p{text-align:center;}
	
	
	html{
		zoom:0.7;
	}
	div#menubar,
	p#menuBtn{
		zoom:0.8;
	}
	div#menubar{
		padding:3% 0 2%;
		box-shadow: 0 0.2em 0.3em rgba(0,0,0,0.13);
	}
	div#menubar img{
		width:26%;
	}
	p#eyecatch{
		zoom:0.6;
	    top: 80px;
	}
	p#eyecatch img{
	width: 30%;
	height: auto;
	margin-top: 0.7em;
	}




#slider .thumb{
	overflow:hidden;
	padding:25px 0;
	width: 100%;
}
#slider .thumb p{
	height:100px;
    line-height: 100px;
    width:5%;
}
#slider .thumb p img{
	vertical-align:middle;
}
#slider .thumb p.left{
	float:left;
	text-align:right;
}
#slider .thumb p.right{
	float:right;
	text-align:left;
}
#slider .thumb div{
	position:relative;
	text-align:center;
    height:100px;
    overflow:hidden;
}
#slider .thumb ul{
	position:absolute;
	width:100%;
}
#slider .thumb ul li{
	float:left;
	display:inline-block;
	width: 50%;
	height:100px;
}
#slider .thumb ul li img{
	width: 90%;
	height: auto;
}

	section#shoplist ul li{
	    width: 100%;
	    margin:0;
	}

	section#shoplist ul li p.image img{
	    width: 100%;
	    height:auto;
	}

	#footer .inner ul{
		zoom:1.5;
	}

	.mt_10{margin-top:10px !important}
	
	/*taniguchi add 160808*/
	#contents #news h2{
		margin:2% 0 0 0;
	}
	section p.more{
		position:absolute;
		top:2%;
		right:2%;
	}
	section#shoplist ul li p.access{
		margin:20px 0 30px 0;
}

	.pointer{
		padding-bottom:20px;
}


section#news,
section#newgoods,
section.newgoods,
section#pickup{
	padding:0 0px 80px;
/*	background:url(../images/bg_washi.jpg) repeat;*/
	background-repeat: no-repeat;
    background-position: top right;
    background-size:40%;
/*	position:relative;*/
}

section#news ul li p,
section#newgoods ul li p,
section.newgoods ul li p,
section#pickup ul li p {
	font-size: 70%;
}
section#news ul li p.title,
section#newgoods ul li p.title,
section.newgoods ul li p.title,
section#pickup ul li p.title {
	font-size: 85% !important;
	line-height: 1.3em;
}
section#news ul li p.body,
section#newgoods ul li p.body,
section.newgoods ul li p.body,
section#pickup ul li p.body {
	height: 7.5em !important;
	line-height: 1.3em !important;
}

#footer .inner ul{
	padding:10% 0 10%;
	text-align:center;
	margin:0 auto;
	width: 55%;
}
#footer .inner ul li{
	display:inline-block;
	vertical-align: top;
	padding: 0;
	width:14%;
}
#footer .inner ul li img{
	width:100%;
	height: auto;
}

address{
clear:both;
padding:20px 2%;
font-size:0.7rem;
}



#footer .inner p.totop {
    position: absolute;
    bottom: 0px;
    right: unset;
    width: 100%;
}



/*  モーダルウィンドウ  */
div#mordal{
	display:none;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	position:fixed;
	top:0px;
	left:0px;
    z-index: 10;
}
div#mordal div.mordal_inner{
	position:relative;
	background:#FFF;
	width:75%;
	margin:100px auto 0 auto;
	padding:6% 5% 0;
	overflow: auto;
}
div#mordal div.mordal_inner img.image{
	float:none;
	width:100%;
	height: auto;
	margin-bottom: 0.5em;
}
div#mordal div.mordal_inner p.flag{
	position:absolute;
	top:-4px;
	left:7%;
}

div#mordal div.mordal_inner div{
	float:none;
	width:100%;
}
div#mordal div.mordal_inner p.close{
	padding:1em 0 1em 0;
	clear:both;
	text-align:center;
}
div#mordal div.mordal_inner p.close img{
	cursor: pointer;
	width: 32%;
	height: auto;
}
div#mordal div.mordal_inner p.date{
    font-weight: bold;
    font-size: 50%;
    color: #000;
	margin-bottom:0.3em;
}
div#mordal div.mordal_inner p.title{
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 0.5em;
}
div#mordal div.mordal_inner p.price{
    font-size: 80%;
}

div#mordal div.mordal_inner p.modal_body{
	line-height:1.3em;
	font-size:70%;
}

address img {
    width: 33%;
}

}

div#stock_notice {clear:both;width:100%;max-width:1000px;margin:30px auto 0;font-size:.8em;color:#999;}
div#stock_notice::after {display:block;clear:both;content:'';}
div#stock_notice p {float:right;}
div#stock_notice p br {display:none;}
div#stock_notice p::before {
	position:absolute;
	margin-left:-20px;
	content:'※'
}
@media screen and (max-width:767px) {
	div#stock_notice p {float:unset;margin-left:30px;font-size:.9em;text-align:center;}
	div#stock_notice p br {display:inline;}
}
section.newgoods#sec_0 {border-top:0;}