@charset "utf-8";
/* CSS Document */
body {
	background-color: #FFF;
}
@media only screen and (min-width: 999px) {
body {
	background: #FFF url(../../images/page/common/page_bg.png) repeat-x left top;
}
}
.bottleWrap .pageMainVisual {
	background-image: url(../images/pagetitle_bg.png);
}
.serverWrap .pageMainVisual {
	background-image: url(../images/server_pagetitle_bg.png);
}
.mainteWrap .pageMainVisual {
	background-image: url(../images/server_pagetitle_bg.png);
}
.tabMenu {
	margin: 0 0 20px;
}
.tabMenu li {
	padding-left: 0;	
}
@media only screen and (max-width: 40.0624em) {
	.tabMenu li {
	padding-right: 0;	
}
}
@media only screen and (min-width: 40.0625em) {
	.tabMenu {
	background: url(../../images/page/product/tab_bg.png) no-repeat left top;
	margin: 0 0 30px;
}
}
@media only screen and (min-width: 999px) {
	.tabMenu {
	width: 700px;
}
	.tabMenu li {
	width: 28%;
}
}
.tabMenu a {
	background: #ffffff; /* Old browsers */
background: url(../images/tab_arrow02.png), -moz-linear-gradient(top,  #ffffff 40%, #f2f2f2 100%); /* FF3.6+ */
background: url(../images/tab_arrow02.png), -webkit-gradient(linear, left top, left bottom, color-stop(40%,#ffffff), color-stop(100%,#f2f2f2)); /* Chrome,Safari4+ */
background: url(../images/tab_arrow02.png), -webkit-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* Chrome10+,Safari5.1+ */
background: url(../images/tab_arrow02.png), -o-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* Opera 11.10+ */
background: url(../images/tab_arrow02.png), -ms-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* IE10+ */
background: url(../images/tab_arrow02.png), linear-gradient(to bottom,  #ffffff 40%,#f2f2f2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
background-position: 5% center;
background-repeat: no-repeat;
color: #333333;
display: block;
padding: 5px;
text-align: center;
border: 1px solid #CCC;
font-weight: bold;
-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */
}
.tabMenu a:hover, .tabMenu .cd {
background: #e4f5ff; /* Old browsers */
background: url(../images/tab_arrow01.png), -moz-linear-gradient(top,  #e4f5ff 40%, #c3e8ff 100%); /* FF3.6+ */
background: url(../images/tab_arrow01.png), -webkit-gradient(linear, left top, left bottom, color-stop(40%,#e4f5ff), color-stop(100%,#c3e8ff)); /* Chrome,Safari4+ */
background: url(../images/tab_arrow01.png), -webkit-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* Chrome10+,Safari5.1+ */
background: url(../images/tab_arrow01.png), -o-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* Opera 11.10+ */
background: url(../images/tab_arrow01.png), -ms-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* IE10+ */
background: url(../images/tab_arrow01.png), linear-gradient(to bottom,  #e4f5ff 40%,#c3e8ff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f5ff', endColorstr='#c3e8ff',GradientType=0 ); /* IE6-9 */
background-position: 5% center;
background-repeat: no-repeat;
color: #006cb1;
display: block;
padding: 5px;
text-align: center;
border: 1px solid #CCC;
font-weight: bold;
-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */
}
@media only screen and (min-width: 40.0625em) {
	.tabMenu a {
	background: #ffffff; /* Old browsers */
background: url(../images/tab_arrow02.png), -moz-linear-gradient(top,  #ffffff 40%, #f2f2f2 100%); /* FF3.6+ */
background: url(../images/tab_arrow02.png), -webkit-gradient(linear, left top, left bottom, color-stop(40%,#ffffff), color-stop(100%,#f2f2f2)); /* Chrome,Safari4+ */
background: url(../images/tab_arrow02.png), -webkit-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* Chrome10+,Safari5.1+ */
background: url(../images/tab_arrow02.png), -o-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* Opera 11.10+ */
background: url(../images/tab_arrow02.png), -ms-linear-gradient(top,  #ffffff 40%,#f2f2f2 100%); /* IE10+ */
background: url(../images/tab_arrow02.png), linear-gradient(to bottom,  #ffffff 40%,#f2f2f2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
background-position: 5% center;
background-repeat: no-repeat;
color: #333333;
display: block;
padding: 5px;
text-align: center;
border: 1px solid #CCC;
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
 border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
border-top-right-radius: 3px;
font-weight: bold;
-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */
}
.tabMenu a:hover, .tabMenu .cd {
background: #e4f5ff; /* Old browsers */
background: url(../images/tab_arrow01.png), -moz-linear-gradient(top,  #e4f5ff 40%, #c3e8ff 100%); /* FF3.6+ */
background: url(../images/tab_arrow01.png), -webkit-gradient(linear, left top, left bottom, color-stop(40%,#e4f5ff), color-stop(100%,#c3e8ff)); /* Chrome,Safari4+ */
background: url(../images/tab_arrow01.png), -webkit-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* Chrome10+,Safari5.1+ */
background: url(../images/tab_arrow01.png), -o-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* Opera 11.10+ */
background: url(../images/tab_arrow01.png), -ms-linear-gradient(top,  #e4f5ff 40%,#c3e8ff 100%); /* IE10+ */
background: url(../images/tab_arrow01.png), linear-gradient(to bottom,  #e4f5ff 40%,#c3e8ff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f5ff', endColorstr='#c3e8ff',GradientType=0 ); /* IE6-9 */
background-position: 5% center;
background-repeat: no-repeat;
color: #006cb1;
display: block;
padding: 5px;
text-align: center;
border: 1px solid #CCC;
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
 border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
border-top-right-radius: 3px;
font-weight: bold;
-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */
}
}
.kome {
	margin: 0;
}
.link01 {
	margin: 1em 0 0;
}
.link01 a {
	text-decoration: underline;
}
/*bottle*/
.bottleLineup {
	margin: 0 0 20px;
}
.bottleLineup .box {
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
padding: 1px;
border: 1px solid #CCC;
	
}
.bottleLineup h3 {
	margin: 0 0 35px;
}
.bottleLineup h3 a {
	display: block;
	text-align: center;
	padding: 5px;
	color: #333;
	-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
 border-top-left-radius: 4px;
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
border-top-right-radius: 4px;
font-weight: bold;
font-size: 12px;
background: #cfeeff url(../images/bottlelineup_arrow.png) no-repeat 90% center;
}
@media only screen and (min-width: 40.0625em) {
	.bottleLineup {
	margin: 0 0 50px;
}
	.bottleLineup h3 a {
	font-size: 14px;
}
}
.bottleLineup .photo {
	margin: 0 1px 15px;
	text-align: center;
}
.bottleLineup .description {
	margin: 0 0 5px;
}
.bottleLineup .description dt {
	text-align: center;
	font-weight: bold;
	margin: 0 0 10px;
	background-color: #f5f5f5;
	padding: 10px 0;
	vertical-align: middle;
	width: 100%;
	display: table;
}
.bottleLineup .description .vaM {
	display: table-cell;
	vertical-align: middle;
}
.bottleLineup .description dd {
	margin: 0 10px;
}
.bottleCol dt {
	margin-bottom: 0px;
	text-align: center;
}
.bottleCol dd {
	margin-bottom: 30px;
}
.bottleCol dd .price {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: bold;
}
.bottleCol dd .comment {
	margin-bottom: 10px;
}
@media only screen and (min-width: 64.0625em) {
	.bottleCol dt {
	clear: both;
	float: left;
	width: 225px;
	margin-bottom: 85px;
}
.bottleCol dd {
	padding: 0 0 0 225px;
	margin-bottom: 85px;
}
.bottleCol dd .price {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: bold;
}
.bottleCol dd .comment {
	margin-bottom: 30px;
}
}
.bottleCol dd table {
	width: 100%;
}
.bottleCol dd th {
	text-align: center;
	font-weight: bold;
	padding: 0.5rem;
	background-color: #d8f7f5;
	-webkit-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* CSS3 */
  white-space: nowrap;
}
@media only screen and (min-width: 999px) {
	.bottleCol dd th {
		width: 132px;
	}
}
.bottleCol dd th, .bottleCol dd td {
	border: 1px solid #ccc;
	
}
.bottleCol dd td {
	padding: 0.5em 10px;
	background-color: #FFF; 
}
.bottleCol dd th.firstC {
		-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* CSS3 */

}
.bottleCol dd th.lastC {
		-webkit-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */

}
.bottleCol dd .notes {
	font-size: 1rem;
	color: #F00;
}
@media only screen and (min-width: 40.0625em) {
	.bottleCol dd .notes {
	font-size: 1.2rem;
}

}
/* SERVER */
.serverLineup {
	margin: 0 0 20px;
}
.serverLineup .box {
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
padding: 1px;
border: 1px solid #CCC;
	
}
.serverLineup h3 {
	margin: 0 0 35px;
}
.serverLineup h3 a {
	display: block;
	text-align: center;
	padding: 5px;
	color: #333;
	-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
 border-top-left-radius: 4px;
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
border-top-right-radius: 4px;
font-weight: bold;
font-size: 12px;
background: #cfeeff url(../images/bottlelineup_arrow.png) no-repeat 90% center;
}
@media only screen and (min-width: 40.0625em) {
	.serverLineup {
	margin: 0 0 50px;
}
	.serverLineup h3 a {
	font-size: 14px;
}
}
.serverLineup .photo {
	margin: 0 1px 15px;
	text-align: center;
}
.serverLineup .description {
	margin: 0 0 5px;
}
.serverLineup .description dt {
	text-align: center;
	font-weight: bold;
	margin: 0 0 10px;
	background-color: #f5f5f5;
	padding: 10px 0;
	display: t;
	vertical-align: middle;
	width: 100%;
	display: table;
}
.serverLineup .description .vaM {
	display: table-cell;
	vertical-align: middle;
}
@media only screen and (max-width: 40.0624em) {

}
.serverLineup .description .fontS {
	font-size: 1.2rem;
}
.serverLineup .description dd {
	margin: 0 10px;
}
.serverCol dt {
	margin-bottom: 20px;
	text-align: center;
}
.serverCol dd {
	margin-bottom: 30px;
}

.serverCol dd .price {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: bold;
}
.serverCol dd .comment {
	margin-bottom: 10px;
}
@media only screen and (min-width: 64.0625em) {
	.serverCol dt {
	clear: both;
	float: left;
	width: 225px;
	margin-bottom: 85px;
}
.serverCol dd {
	padding: 0 0 0 225px;
	margin-bottom: 85px;
}
.serverCol dt.exc, .serverCol dd.exc  {
	margin-bottom: 40px;
}
.serverCol dd .price {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: bold;
}
.serverCol dd .comment {
	margin-bottom: 30px;
}
}
.serverCol dd table {
	width: 100%;
}
.serverCol dd caption {
font-weight: bold;
margin: 0px 0px 10px 5px;
text-align: left;
}
.serverCol dd th {
	text-align: center;
	font-weight: bold;
	padding: 0.5rem;
	background-color: #d8f7f5;
	-webkit-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* CSS3 */
  white-space: nowrap;
}
.serverCol dd .faucet {
	margin-bottom: 2rem;
}
.serverCol dd .faucet th {
	text-align: center;
	font-weight: bold;
	padding: 0 5px;
	background-color: #fff;
	-webkit-box-shadow: inset 0px 0px 0px 0 #ffffff,inset 0px 0px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset  0px 0px 0px 0 #ffffff,inset 0px 0px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset  0px 0px 0px 0 #ffffff,inset 0px 0px 0px 0 #ffffff; /* CSS3 */
  white-space: normal;
}
@media only screen and (min-width: 40.0625em) and (max-width: 998px) {
	.serverCol dd .faucet th img {
  width: 100px;
}
}
@media only screen and (min-width: 999px) {
	.serverCol dd th {
		width: 132px;
	}
}
.serverCol dd th, .serverCol dd td {
	border: 1px solid #ccc;
	
}
.serverCol dd td {
	padding: 0.5em 10px;
	background-color: #FFF; 
}
.serverCol dd th.firstC {
		-webkit-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 1px 0px 0 #ffffff,inset -1px 0px 0px 0 #ffffff; /* CSS3 */

}
.serverCol dd th.lastC {
		-webkit-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Safari, Chrome用 */
  -moz-box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* Firefox用 */
  box-shadow: inset 1px 0px 0px 0 #ffffff,inset -1px -1px 0px 0 #ffffff; /* CSS3 */

}
.serverCol dd .notes {
	font-size: 1rem;
	color: #F00;
}
.dlStl01 {
	clear: both;
	margin: 0 0 85px 10px;
}
.dlStl01 dt {
	font-weight: bold;
	margin-bottom: 5px;
}
.dlStl01 dd {
	margin-bottom: 20px;
}
@media only screen and (min-width: 40.0625em) {
	.serverCol dd .notes {
	font-size: 1.2rem;
}
.dlStl01 {
	margin: 0 0 85px 10px;
	clear: both;
}
.dlStl01 dt {
	font-weight: bold;
	margin-bottom: 5px;
}
.dlStl01 dd {
	margin-bottom: 30px;
}

}
/* MAINTENANCE */
.maintenanceCol {
	margin-bottom: 0;
}
.maintenanceCol .photo {
	text-align: center;
	margin-bottom: 20px;
}
.maintenanceCol dl {
}
@media only screen and (min-width: 40.0625em) {
		.maintenanceCol {
	margin-bottom: 85px;
}
	.maintenanceCol .photo {
	float: left;
	width: 40%;
	text-align: left;
}
.maintenanceCol dl {
	float: left;
	width: 60%;
}
}
@media only screen and (min-width: 999px) {

.maintenanceCol .photo {
	width: 252px;
}
.maintenanceCol dl {
	width: 438px;
}
}
.maintenanceCol dt {
	margin-bottom: 5px;
	min-height: 30px;
	padding: 0 0 0 40px;
	font-size: 14px;
	font-weight: bold;
}
.maintenanceCol dt .hosoku {
	display: inline-block;
	background-color: #5bcbbf;
	font-size: 12px;
	padding: 5px 8px;
	vertical-align: middle;
	margin: 0 0 0 10px;
	color: #FFF;
}
.maintenanceCol .tit01 {
	background: url(../images/maintenance_no01.png) no-repeat left top;
}
.maintenanceCol .tit02 {
	background: url(../images/maintenance_no02.png) no-repeat left top;
}
.maintenanceCol .tit03 {
	background: url(../images/maintenance_no03.png) no-repeat left top;
}
.maintenanceCol .tit04 {
	background: url(../images/maintenance_no04.png) no-repeat left top;
}
.maintenanceCol .tit05 {
	background: url(../images/maintenance_no05.png) no-repeat left top;
}
.maintenanceCol .tit06 {
	background: url(../images/maintenance_no06.png) no-repeat left top;
}
.maintenanceCol dd {
	margin-bottom: 30px;
	margin-left: 5px;
}
.maintenanceCol .warning {
	border: 1px solid #CCC;
	-webkit-box-shadow: inset 3px 3px 0px 0 #ffff00,inset -3px -3px 0px 0 #ffff00; /* Safari, Chrome用 */
  -moz-box-shadow: inset 3px 3px 0px 0 #ffff00,inset -3px -3px 0px 0 #ffff00; /* Firefox用 */
  box-shadow: inset 3px 3px 0px 0 #ffff00,inset -3px -3px 0px 0 #ffff00; /* CSS3 */
	margin: 30px 0 15px;
	padding: 10px 10px;
	display: table;
}
.maintenanceCol .warning .icn {
	display: table-cell;
	text-align: center;
	padding: 10px 10px 10px 5px;
	vertical-align: middle;
	width: 45px;
}
.maintenanceCol .warning .txt01 {
	display: table-cell;
	font-size: 12px;
	vertical-align: middle;
}

