/* カタログ */

.desc{
	padding: 0 0 20px;
}
.photo{
	float: left;
	text-align: center;
	display: inline;
	width: 210px;
	margin: 0 10px 20px;
	line-height: 18px;
}

.photo img{
	width: auto;
}

.photo.wide{
	width: 360px;
	margin: 0 0 20px 65px;
}

.photo.wide2{
	float: none;
	width: 360px;
	margin: 0 auto;
	display: block;
}

#photo_contents{
	padding-left: 15px;
	overflow: hidden;
}

.photo span{
	color: #ff5800;
	font-weight: bold;
	font-size: 12px;
}

.photo .name{
	padding-bottom: 10px;
}





#description{
	padding: 10px 10px 0;
}

@media (width > 640px){
	#description{
		padding: 0 10px 0;
	}
	#description .sp{
		display: none;
	}
}



.catalog_contents{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 80px;
	margin: 30px 0;
}

@media (width <= 640px){
	.catalog_contents{
		grid-template-columns: repeat(1, 40%);
		gap: 20px;
		justify-content: center;
		margin: 20px 10px;
	}
}



/* サンプル */
#breadcrumb{
	text-align: right;
	padding-right: 20px;
	font-size: 12px;
}


/* スライドバナー */

#slider{
	border: 1px solid #cccccc;
	overflow: hidden;
	width: 300px;
}
#slider_wide{
	border: 1px solid #cccccc;
	overflow: hidden;
	width: 600px;
	margin: 0 auto 20px;
}
#slider_wide2{
	border: 1px solid #cccccc;
	overflow: hidden;
	width: 744px;
	margin: 0 auto 20px;
}
#slider_wide img{
	vertical-align: bottom;
}

#slider_wide2 img{
	vertical-align: bottom;
}

.bx-pager{
	overflow: hidden !important;
	height: auto;
	padding: 7px 0;
	text-align: center;
	width: 300px;
}

.bx-pager a{
	display: inline-block;
	margin: 0 4px;
}
.bx-pager a img {
	width: 60px;
	height: auto;
	opacity: 0.5;
	filter: alpha(opacity=50);
	border: 1px solid #cccccc;
}
.bx-pager a.active img {
	opacity: 1;
	filter: alpha(opacity=100);
}

.detail .left{
	width: 302px;
	margin-left: 100px;
}

.detail .right{
	width: 408px;
	margin-left: 40px;
}

.detail.wide .left{
	width: 408px;
	margin-left: 100px;
}

.detail.wide .right{
	width: 302px;
	margin-left: 40px;
	padding-top: 30px;
}

.detail .photo{
	float: left;
	width: 60px;
	height: auto;
	display: inline;
	margin: 0 13px;
	padding: 0;
}

.detail .photo img{
	width: 60px;
	height: auto;
	padding: 0;
}

.detail .name{
	float: left;
	text-align: left;
	margin: 9px 0 0 0;
}

.detail .name strong{
	font-size: 16px;
	font-weight: normal;
}

.detail .name span{
	font-size: 12px;
}

.detail .staff_top{
	width: 408px;
	height: 10px;
	background: url(../img/staff/staff_top.png) no-repeat;
}

.detail .staff_bottom{
	width: 408px;
	height: 12px;
	background: url(../img/staff/staff_bottom.png) no-repeat bottom;
}

.detail #comment{
	min-height: 352px;
}

.detail.wide #comment{
	min-height: 0;
	clear: both;
	width: 750px;
	margin: 0 auto;
}

.detail #comment_inner{
	padding: 15px 10px 20px;
	text-align: left;
	line-height: 24px;
}

.detail #comment h3{
	color: #ff5800;
	padding-bottom: 10px;
}

#reserve a:hover img{
	opacity: 0.8;
	filter: alpha(opacity=80);
	background: #fff0c9 \9;
}












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

	.desc{
		padding: 20px 20px 20px;
	}
	.photo{
		float: left;
		text-align: center;
		display: inline;
		width: 44%;
		margin: 0 0 20px 4%;
		line-height: 18px;
	}

	.photo img{
		width: 100%;
	}

	.photo.wide{
		float: none;
		width: auto;
		display: block;
		margin: 0 10px 20px;
	}

	.photo.wide2{
		float: none;
		width: auto;
		display: block;
		margin: 0 10px 20px;
	}


	#photo_contents{
		padding-left: 0px;
		overflow: hidden;
	}

	#slider{
		border: 1px solid #cccccc;
		overflow: hidden;
		width: auto;
	}
	#slider_wide{
		border: 1px solid #cccccc;
		overflow: hidden;
		width: auto;
		margin: 0 10px 20px;
	}
	#slider_wide2{
		border: 1px solid #cccccc;
		overflow: hidden;
		width: auto;
		margin: 0 10px 20px;
	}

	.bx-pager{
		overflow: hidden !important;
		height: auto;
		padding: 7px 0;
		text-align: center;
		width: auto;
	}

	.detail.wide .left{
		width: auto;
		margin: 0 10px;
	}

	.detail.wide .right{
		width: auto;
		margin: 0 10px;
		padding-top: 0px;
	}

	.detail #comment{
		min-height: auto;
	}

	.detail.wide #comment{
		min-height: 0;
		clear: both;
		width: auto;
		margin: 0 ;
	}

	.detail #comment_inner{
		padding: 15px 10px 20px;
		text-align: left;
		line-height: 24px;
	}

}

