@charset "utf-8";
body {
	font-family:Avenir, 'Open Sans', sans-serif, "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #777;
}
/*------------------------------------------------------------------------*/

.Item-container { margin: 20px auto 0; overflow: hidden; width: 100%; }

ul#filter { float: left; font-size: 16px; list-style: none; margin-left: 0; width: 100%; right:auto; left:auto; padding:0; margin-bottom:0;}
ul#filter li {
	box-sizing:border-box;
	display:block;
	background:#eee;
	text-align:center;
	width:25%;
    border: 1px solid #ddd;
    float: left;
	border-radius:5px;
}
ul#filter li:last-child { border-right: none; margin-right: 0; padding-right: 0; }
ul#filter a { color: #999; text-decoration: none; }
ul#filter li.current a, ul#filter a:hover { display:block;background:#999; }
ul#filter li.current a { color: #eee; }
ul#portfolio { float: left; list-style: none; margin-left: 0; margin-top:0; width: 100%; padding:0; }
ul#portfolio li {
	box-sizing:border-box;
    border: 1px solid #fff;
    float: left;
    padding: 10px;
    width: 33.3%;
    background:#fff;
}
ul#portfolio a { display: block; width: 100%; }
ul#portfolio a:hover { text-decoration: none; }
ul#portfolio img { border: 1px solid #dedede; display: block;  }/*------------------------------------------------------------------------*/

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














p.b-break {/*自動折り返し*/
	word-break: break-all;
}

/*------------product page↓------------------------------------------------*/
.item-photo{
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.item-subhead {/*アイテム名*/
	margin: 5px 0 10px 0;
	font-weight: 300;
	color: #fff;
	text-align:center;
}
.item-text{
	color:#FFF;
}


/*------------liquid layout↓-----------------------------------------*/
.liquid {
	padding: 10px 0;
}
.liquid-col {
	padding: 5px;
	box-sizing: border-box;
	float: left;
	width: 25%;
}
.liquid-col-inner {
	display:block;
	background: #999;
	padding:5px;
}





/*------------top page srollbox↓------------------------------------------------*/
.custom-restricted {
	height: 160px;
	width: 100%;
	border: 1px solid gray;
	border-radius: 4px;
}



/*------------access page↓------------------------------------------------*/
.access-head {
	font-weight:600;
	font-size:2em;
	text-align:center;
}
.access-subhead {
	font-weight:100;
	margin-top:5px;
	font-size:0.5em;
}
.access-text {
	text-align:center;
}

/*------------mail link↓------------------------------------------------*/
a.mail {
	color: #000;
	text-decoration:none;
	font-weight:500;
}
a.mail:hover {
	color:#86152F
}
a.mail:visited {
	color: #1E8318;
}



/*------------cafe page↓------------------------------------------------*/
.menu_space {/*スペース用空箱*/
	display:block;
	height:20px;
}
.menu-text {
	font-size:1.2em;
	margin:0 0 0 0;
	text-align:center;
	width:100%;
}
.menu_fl {
	padding-top:10px;
	margin-bottom:5px;
	font-weight: 300;
	color: #999;
	font-size:2em;
	text-align:center;
}
.menu_hot {
	background:#f7e6de;
	margin: 0 0 0 0;
}
.menu_cold {
	background:#def2f7;
	margin: 0 0 0 0;
}
.menu_sw {
	background:#f7f5de;
	margin: 0 0 0 0;
}



/*------------slick↓-------------------------------------------------*/

.slider {
	margin: 0 15px;
}
.slick-prev:before, .slick-next:before {/*矢印の色*/
	color: #0ff;
}
.slick-next {/*矢印の位置*/
	right: 20px;
	z-index: 99;
}
.slick-prev {
	left: 15px;
	z-index: 100;
}
.slick-dots li.slick-active button:before, .slick-dots li button:before {
	color: #fff;/*ドットの色*/
}
img {/*画像の横幅*/
	max-width: 100%;
	height: auto;
}



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

.footer-sample {
	clear:both;
	display:block;
	text-align:center;
}
.copyright-sample {
	color: #bbb;
	font-size: 14px;
	line-height: 1.2em;
}



/*------------main slideshow↓----------------------------------------*/
.album {
	margin: 20px auto;
	background-color: white;
	position: relative;
}
.album img {
	width: 100%;
	animation-name: album;
	-webkit-animation-name: album;
	animation-duration: 48s;
	-webkit-animation-duration: 48s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	opacity: 0;
}
.album .img1 {
	display: block;
	margin: 0 auto;
}
.album .img2 {
	animation-delay:12s;
	-webkit-animation-delay:12s;
	position: absolute;
	top: 0;
}
.album .img3 {
	animation-delay:24s;
	-webkit-animation-delay:24s;
	position: absolute;
	top: 0;
}
.album .img4 {
	animation-delay:36s;
	-webkit-animation-delay:36s;
	position: absolute;
	top: 0;
}
 @keyframes album {
 0% {
 opacity: 0;
}
 12.5% {
 opacity: 1;
}
 37.5% {
 opacity: 1;
}
 50% {
 opacity: 0;
}
}
 @-webkit-keyframes album {
 0% {
 opacity: 0;
}
 12.5% {
 opacity: 1;
}
 37.5% {
 opacity: 1;
}
 50% {
 opacity: 0;
}
}



/*------------googlemap↓---------------------------------------------*/
.ggmap {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.ggmap iframe, .ggmap object, .ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/*------------Media Queries↓-----------------------------------------*/

@media screen and (max-width: 768px) and (min-width: 481px) {
 .liquid-col {
 width: 33%;
}
ul#filter li {
	width:50%;
}
ul#portfolio li {
    width:50%;
	padding:0 ;
}
}
@media screen and (max-width: 480px) {
 .liquid-col {
 width: 100%;
}
ul#filter li {
	width:50%;
}
ul#portfolio li {
    width:100%;
	padding:0 ;
}
}