
/* --------------------------------------------------------------------------------------
   WINE
--------------------------------------------------------------------------------------- */

.lead {
	border: 1px solid #f8b516;
	padding: 15px;
	width: 800px;
	margin: 50px auto 0;
	text-align: center;
}

.column {
	margin-top: 50px;
	border-left: 5px solid #f8b516;
	padding-left: 5px;
	overflow: hidden;
}

.list .imgfont { float: left; }

.list .champagne .imgfont {
	background: url(../img/wine/title_wine_champagne.jpg) no-repeat;
	width: 188px;
	height: 75px;
}

.list .white .imgfont {
	background: url(../img/wine/title_wine_white.jpg) no-repeat;
	width: 146px;
	height: 50px;
}

.list .rose .imgfont {
	background: url(../img/wine/title_wine_rose.jpg) no-repeat;
	width: 132px;
	height: 50px;
}

.list .red .imgfont {
	background: url(../img/wine/title_wine_red.jpg) no-repeat;
	width: 147px;
	height: 50px;
}

.list .glass .imgfont {
	background: url(../img/wine/title_wine_osusume.png) no-repeat;
	width: 190px;
	height: 75px;
}


.list .alsace .imgfont {
	width: 132px;
	height: 50px;
}


.column div {
	float: right;
	width: 775px;
}

.column div h3 {
	border: 1px solid #f8b516;
	font-family: "Times New Roman", Times, serif;
	font-size: 180%;
	font-style: italic;
	font-weight: bold;
	margin-top: 30px;
	padding: 9px;
}

.column div h3:first-child { margin-top: 0; }

.list table { width: 100%; }

.list tr,
.list table:last-child { border-bottom: 1px solid #cec8bc; }
.list tr:last-child { border-bottom: none; }

.list th,
.list td {
	padding: 10px;
	text-align: left;
	vertical-align: middle;
	word-wrap: break-word;
}

.list th { width: 260px; }
.list td:nth-child(2) { width: 240px; }

.list td:last-child {
	text-align: right;
	font-weight: bold;
	width: 120px;
}

.last {
	margin-top: 40px;
	text-align: center;
}

/* --------------------------------------------------------------------------------------
   タブレット
--------------------------------------------------------------------------------------- */

@media (max-width: 1024px) and (min-width: 767px) {
	
	.lead {
		width: auto;
		margin: 4%;
	}
	
	.column {
		border: 3px double #c4bcac;
		padding: 4% !important;
		margin-left: 4%;
		margin-right: 4%;
	}
	
	.list .imgfont { float: none; }
	
	.column div {
		float: none;
		width: 100%;
		margin-top: 5%;
	}
}

/* --------------------------------------------------------------------------------------
  スマホ用
--------------------------------------------------------------------------------------- */

@media(max-width: 766px) {
	
	.lead {
		width: auto;
		margin: 4%;
	}
	
	.column {
		border: 3px double #c4bcac;
		padding: 4% !important;
		margin: 4% 4% 0;
	}
	
	.list .imgfont { float: none; }
	
	.column div {
		float: none;
		width: 100%;
		margin-top: 5%;
	}
	
	.column div h3 { font-size: 135%; }
	
	.list table br {
		display: none;
	}
	
	.list th,
	.list td {
		padding: 0;
		display: block;
	}
	
	.list th {
		width: auto !important;
		padding: 2%;
	}
	
	.list td:nth-child(2) {
		color: #888;
		width: auto !important;
		font-size: 90%;
		padding: 0 2%;
		
	}
	
	.list td:nth-child(3) { text-align: right; }
	
	.last { margin: 4% 4% 0; }
}