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

.tabWrap {
	display: none;
}

ul.filter_btn {
	text-align: center;
	margin: 1.5em 0;
}

ul.filter_btn li {
	display: inline-block;
	margin: 0.5em 0;
}

ul.filter_btn li a {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	display: inline-block;
	border: 1px solid #cc9c12;
	color: #000;
	padding: 0.5em 0.75em;
	line-height: 1;
	margin: 0 0.5em;
	font-size: 135%;
	text-decoration: none;
}

ul.filter_btn li a {
}

ul.filter_btn li a.selected {
	background: #cc9c12;
	color: #fff;
}

#items, #maintenance, #ordermade, #buy {
	padding: 3vh 0 6vh;
}

/*

#maintenance h3, #ordermade h3, #buy h3,
#maintenance h4, #ordermade h4, #buy h4 {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	font-weight: 600;
	line-height: 2;
	text-align: center;
}

#maintenance h3, #ordermade h3, #buy h3 {
	font-size: 175%;
	position: relative;
}

#maintenance h3:after, #ordermade h3:after, #buy h3:after {
	content: "";
	background: #000;
	position: absolute;
	width: 2em;
	height: 3px;
	bottom: 0;
	left: 50%;
	transform: translateX( -50% );
}

#maintenance h4, #ordermade h4, #buy h4 {
	font-size: 150%;
	position: relative;
	margin: 6vh auto 0.5vh;
}

*/

.items_btn {
	text-align: center;
	margin-top: 2em;
}

.items_btn a {
	display: inline-block;
	border: 1px solid #cc9c12;
	color: #000;
	padding: 0.75em 2em;
	line-height: 1;
	text-decoration: none;
	position: relative;
}

.items_btn a:after {
	content: "\02192";
	position: absolute;
	right: 1em;
	top: 50%;
	display: inline-block;
	transform: scale(1, 1.25) translateY(-50%);
}

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

	ul.filter_btn li a {
		transition: .3s;
	}

	ul.filter_btn li a:hover {
		background: #cc9c12;
		color: #fff;
	}

	ul.plice_list {
	}

	ul.plice_list li {
	}

	ul.plice_list li dl {
		position: relative;
		clear: both;
	}

	ul.plice_list li dl dt {
		width: 15em;
		float: left;
		display: block;
		padding: 1em;
		box-sizing: border-box;
	}

	ul.plice_list li dl dd {
		padding: 1em;
		padding-left: 16em;
		border-bottom: 1px solid #000;
	}

	.items_btn a {
		transition: .3s;
		font-size: 135%;
		padding: 0.75em 4em;
	}

	.items_btn a:after {
		transition: .3s;
	}

	.items_btn a:hover {
		background: #cc9c12;
	}

	.items_btn a:hover:after {
		right: -0.5em;
	}

}

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

	ul.filter_btn {
		margin-bottom: 0;
	}

	ul.filter_btn li {
		margin: 0.25em 0;
	}

	ul.filter_btn li a {
		font-size: 90%;
		margin: 0 0.25em;
		text-decoration: none;
	}

	.tabWrap h3 {
		margin-top: 0;
	}

	ul.plice_list li {
		padding: 0.5em 0;
		position: relative;
		border-bottom: 1px solid #888;
	}

	ul.plice_list li:first-child {
		padding: 0;
	}

	ul.plice_list li:first-child dl {
		display: none;
	}

	ul.plice_list li dl dt {
		font-weight: 600;
		display: block;
	}

	ul.plice_list li dl dd {
	}

}

/*

/////////////////////////////////////////////////////////////////////// */

.voice_wrap {
	max-width: 895px
}

.voice_wrap p {
	margin: 0;
	border: 1px solid #ccc;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
}

.voice_wrap p a {
	width: 100%;
	height: 100%;
	display: block;
	background: rgba( 255, 255, 255, 0.5 );
}

.voice_wrap p img {
	position: absolute;
	transform: translate( -50%,-50% );
	top: 50%;
	left: 50%;
	max-width: 100%;
	box-shadow: 0 0 5px #000;
	max-height: 100%;
}

.voice_wrap p a span.data {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	display: block;
	color: #fff;
	position: absolute;
	background: rgba( 0, 0, 0, 0.7 );
	width: 100%;
	height: 100%;
	top: 70%;
	left: 0;
	padding: 0.5rem;
	box-sizing: border-box;
}

.voice_wrap p a span.data strong {
	display: block;
	font-weight: 300;
	line-height: 1.2;
}

.voice_wrap p a span.data small {
	line-height: 1.2;
}



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

	.voice_wrap p {
		width: 220px;
		height: 220px;
	}

	.voice_wrap p a img,
	.voice_wrap p a span.data {
		transition: .3s;
	}

	.voice_wrap p a:hover span.data {
		top: 50%;
	}

	.voice_wrap p a:hover img {
		max-width: 135%;
		max-height: 135%;
	}

}

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

	.voice_wrap {
		margin: 1.5em 0;
	}

	.voice_wrap p {
		width: 43vw;
		height: 43vw;
		box-sizing: border-box;
	}

}

/*
detail
///////////////////////////////////////////////////////*/

p.thumbs {
	max-width: 640px;
	margin: 0 auto;
}

p.thumbs img {
	display: block;
}

.btn_buy {
	text-align: center;
	margin-top: 3.5vw;
}

.btn_buy a {
	color: #000;
	font-size: 1.4rem;
	display: inline-block;
	min-width: 16em;
	border: 1px solid #cc9c12;
	padding: 1em 0;
	position: relative;
}

.btn_buy a:after {
	content: "\02192";
	position: absolute;
	right: 1em;
	top: 50%;
	display: inline-block;
	transform: translateY(-50%);
}


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

	.btn_buy a {
		transition: .3s;
	}

	.btn_buy a,
	.btn_buy a:after {
		transition: .3s;
	}

	.btn_buy a:hover {
		background: #cc9c12;
	}

	.btn_buy a:hover:after {
		right: -0.5em;
	}

}

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

	.btn_buy {
		margin: 0 auto 1.5em;
	}

	.btn_buy a {
		width: 40%;
		font-size: 1rem;
		text-decoration: none;
	}

}