@charset "utf-8";

/*-------------------------------------------------------------
  01: main
 --------------------------------------------------------------*/
#container #main{
}
#container #main ul{
	width:960px;
	display:table;
	margin:0 auto;
}
#container #main ul li{
	display:table-cell;
	vertical-align:middle;
}
#container #main ul li.imgArea{
	width:100%;
	text-align:left;
}
#container #main ul li.txtArea{
	text-align:center;
}
#container #main ul li.txtArea img{
	margin-bottom:10px;
}
#container #main ul li.txtArea .txt01{
	font-size:140%;
	line-height:1.2;
	margin-bottom:10px;
}
#container #main ul li.txtArea .txt02{
	font-size:90%;
}

@media screen and (max-width: 767px) {
	#container #main ul{
		width:auto;
		display:block;
		margin-bottom:10px;
	}
	#container #main ul li{
		display:block;
	}
	#container #main ul li.imgArea{
		width:auto;
		text-align:center;
	}
	#container #main ul li.imgArea img{
		width:80%;
		height:auto;
	}
	#container #main ul li.txtArea{
		background-color:#f7f7f7;
		padding:20px 0;
	}
	#container #main ul li.txtArea img{
		width:80%;
		height:auto;
	}
	#container #main ul li.txtArea .txt01{
		font-size:120%;
		line-height:1.2;
		margin-bottom:10px;
	}
	#container #main ul li.txtArea .txt02{
		font-size:78%;
	}
}

/*-------------------------------------------------------------
  02: detail
 --------------------------------------------------------------*/
#container .detail{
	background-color:#eae6df;
}
#container .detail:nth-child(even){
	background-color:#dbd3c7;
}
#container .detail .inner{
	width:960px;
	margin:0 auto;
	padding:35px 0 30px;
}
#container .detail .lesd{
	width:478px;
	font-size:100%;
	font-weight:bold;
	color:#612e1c;
	text-align:center;
	border-left:solid 1px #612e1c;
	border-right:solid 1px #612e1c;
	margin-bottom:35px;
}
#container .detail .leftArea{
	width:480px;
	float:left;
	display:table;
}
#container .detail .leftArea .imgArea{
	width:160px;
	text-align:center;
	vertical-align:middle;
	display:table-cell;
}
#container .detail .leftArea .txtArea{
	width:318px;
	vertical-align:top;
	display:table-cell;
}
#container .detail .leftArea .txtArea h2{
	font-size:140%;
}
#container .detail .leftArea .txtArea .smallTxt{
	font-size:70%;
	margin-bottom:20px;
}
#container .detail .leftArea .txtArea .txt{
	margin-bottom:20px;
}
#container .detail .leftArea .txtArea h3{
	color:#ffffff;
	text-align:center;
	background-color:#717071;
	margin-bottom:20px;
}
#container .detail .leftArea .txtArea dl{
	font-size:80%;
	border-bottom:solid 1px #323232;
	margin-bottom:14px;
}
#container .detail .leftArea .txtArea dl dt{
	width:106px;
	float:left;
	clear:both;
	border-top:solid 1px #323232;
}
#container .detail .leftArea .txtArea dl dd{
	overflow:auto;
	border-top:solid 1px #323232;
}
#container .detail .leftArea .txtArea .price{
	font-size:80%;
}

#container .detail .rightArea{
	width:480px;
	text-align:center;
	float:right;
}
#container .detail .rightArea .img{
	margin-bottom:20px;
}
#container .detail .rightArea .link{
	width:80%;
	background-color:#612e1c;
	margin:0 auto;
}
#container .detail .rightArea .link:hover{
	background-color:#794d3e;
}
#container .detail .rightArea .link span{
	color:#ffffff;
	cursor:pointer;
	display:block;
	text-decoration:none;
	background:url(../img/arrow_next.png) 97% center no-repeat;
	background-size:9px 14px,auto;
	padding:3px 0;
}
#container .detail .rightArea .link span em{
	font-size:70%;
	font-style:normal;
}

@media screen and (max-width: 767px) {
	#container .detail .inner{
		width:auto;
		padding:30px 0 2px;
	}
	#container .detail .lesd{
		width:auto;
		font-size:90%;
		margin:0 10px 20px;
		padding:0 10px;
	}
	#container .detail .leftArea{
		width:100%;
		float:none;
		margin-bottom:40px;
	}
	#container .detail .leftArea .imgArea{
		width:90px;
		vertical-align:top;
	}
	#container .detail .leftArea .imgArea img{
		width:70%;
		height:auto;
		margin-top:5px;
	}
	#container .detail .leftArea .txtArea{
		padding-right:10px;
	}
	#container .detail .leftArea .txtArea h2{
		font-size:120%;
	}
	#container .detail .leftArea .txtArea p{
		font-size:90%;
	}
	#container .detail .leftArea .txtArea .smallTxt{
		margin-bottom:10px;
	}
	#container .detail .leftArea .txtArea .txt{
		margin-bottom:10px;
	}
	#container .detail .leftArea .txtArea h3{
		margin-bottom:10px;
	}
	#container .detail .leftArea .txtArea dl{
		margin-bottom:10px;
	}

	#container .detail .rightArea{
		width:auto;
		float:none;
	}
	#container .detail .rightArea .img{
		margin-bottom:30px;
	}
	#container .detail .rightArea .img img{
		width:80%;
		height:auto;
	}
	#container .detail .rightArea .link{
		width:90%;
		margin-bottom:20px;
	}
}

/*-------------------------------------------------------------
  03: aside
 --------------------------------------------------------------*/
#container aside{
	text-align:center;
	background-color:#9fa0a0;
	margin-bottom:20px;
}
#container aside ul{
	width:960px;
	margin:0 auto;
}
#container aside ul li{
	width:50%;
	float:left;
	background-color:#231815;
}
#container aside ul li:hover{
	background-color:#4f4644;
}
#container aside ul li:first-child{
	background-color:#612e1c;
}
#container aside ul li:first-child:hover{
	background-color:#815849;
}
#container aside ul li a,
#container aside ul li span{
	color:#ffffff;
	cursor:pointer;
	text-decoration:none;
	display:block;
	background:url(../img/arrow_next.png) 97% center no-repeat;
	background-size:9px 14px;
	padding:10px 0;
}

@media screen and (max-width: 767px) {
	#container aside{
		background-color:#dbd3c7;
		margin-bottom:0;
		padding-bottom:25px;
	}
	#container aside ul{
		width:90%
	}
	#container aside ul li{
		width:auto;
		float:none;
	}
	#container aside ul li a,
	#container aside ul li span{
		font-size:90%;
		padding:5px 0;
	}
}