body {
	-webkit-text-size-adjust: 100%;
}
#tableTemplate img{
	height:auto;
}
#tableTemplate .pc {
    display: block;
}
#tableTemplate .sp {
    display: none;
}
@media screen and (max-width: 767px) {
    #tableTemplate .pc {
        display: none;
    }
    #tableTemplate .sp {
        display: block;
    }
}
#tableTemplate {
	width: 100%;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', "メイリオ", Meiryo, Osaka, 'ＭＳ Ｐゴシック', sans-serif;
	line-height: 1.4;
	font-size:12px;
	color: #333;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
#tableTemplate a {
    color: #562a2a;
    /*text-decoration: underline;*/
}
#tableTemplate a:hover {
    text-decoration: none;
}
#tableTemplate table th {
    font-weight: bold;
		text-transform:none;
		white-space:normal;
}
#tableTemplate table td,
#tableTemplate table th {
    text-align: center;
    padding: 9px 5px;
    border:1px solid #ccc;
}
#tableTemplate thead th {
	background: #e6e6e6;
}
/*#tableTemplate table td {
    height: 103px;
}*/
#tableTemplate {
	width: 1170px;
	margin: 0 auto;
}
@media screen and (max-width: 1024px) {
    #tableTemplate {
        width: auto;
        margin: 0;
    }
}
#tableTemplate .inner {
    margin: 10px;
}
#tableTemplate .mainVisual {
	width: 1170px;
    margin: 0 0 30px;
}
@media screen and (max-width: 1024px) {
    #tableTemplate .mainVisual {
        width: auto;
				margin: 0 0 20px;
    }
}
#tableTemplate .mainVisual h1 {
	display: block;
	width: 1170px;
  height: 240px;
}
@media screen and (max-width: 1024px) {
    #tableTemplate h1.mainVisual {
        background: none;
        width: auto;
        height: auto;
        padding: 0;
    }
    #tableTemplate h1.mainVisual img {
        width: 100%;
    }
}
@media screen and (max-width: 767px) {
    #tableTemplate h1.mainVisual {
			margin: 0;
		}
}
#tableTemplate #itemnavi p{
	display:none;
}
#tableTemplate #itemnavi ul{
	overflow:hidden;
}
#tableTemplate #itemnavi ul li{
	float:left;
	width:193px;
	margin:0 2px 2px 0;
	background:#ddd;
}
#tableTemplate #itemnavi ul li a{
	display:block;
	width:100%;
	padding:8px 2px;
	font-size:16px;
	text-align:center;
	color:#333;
	text-decoration:none;
	cursor:pointer;
  position:relative;
}
#tableTemplate #itemnavi ul li a:before{
  display: block;
  width: 8px;
  height: 8px;
	transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
  content: "";
  position:absolute;
	left:4%;
  top:35%;
	border-radius:2px;
	border-left: 2px solid #562a2a;
	border-top: 2px solid #562a2a;
}
@media screen and (max-width: 1024px) {
	#tableTemplate #itemnavi ul{
		margin:20px 10px 0;
	}
	#tableTemplate #itemnavi ul li{
		width:19.5%;
		margin:0 2px 2px 0;
	}
	#tableTemplate #itemnavi ul li a{
		padding:8px 0 8px 7px;
		font-size:13px;
	}
}
@media screen and (max-width: 767px) {
	#tableTemplate #itemnavi{
		border:2px solid #c8a657;
		margin-bottom:30px;
	}
	#tableTemplate #itemnavi p{
		display:block;
		font-size:16px;
		padding:14px 10px;
		color:#7b5500;
		cursor:pointer;
	}
	#tableTemplate #itemnavi p.s_open{ background:url(../img/btn_minus.gif) right 5px bottom 14px no-repeat #FFF; background-size:20px 20px; border-bottom:1px solid #c8a657;}
	#tableTemplate #itemnavi p.s_close{ background:url(../img/btn_plus.gif) right 5px bottom 14px no-repeat #FFF; background-size:20px 20px;}
	#tableTemplate #itemnavi ul{
		display:none;
		margin:0;
	}
	#tableTemplate #itemnavi ul li{
		width:50%;
		margin:0;
		background:#fff;
		border-bottom:1px solid #c8a657;
	}
	#tableTemplate #itemnavi ul li:nth-child(odd){
		border-right:1px solid #c8a657;
	}
	#tableTemplate #itemnavi ul li:last-child{
		border-bottom:none;
	}
	#tableTemplate #itemnavi ul li a{
		padding:14px 10px 14px 5px;
		font-size:14px;
		text-align:left;
		position:relative;
	}
	#tableTemplate #itemnavi ul li a:before{
		display:none;
	}
	#tableTemplate #itemnavi ul li a:after{
		display: block;
		width: 8px;
		height: 8px;
		transform: rotate(225deg);
		-moz-transform: rotate(225deg);
		-webkit-transform: rotate(225deg);
		content: "";
		position:absolute;
		right:4%;
		top:35%;
		border-radius:2px;
		border-left: 2px solid #562a2a;
		border-top: 2px solid #562a2a;
	}
}
#tableTemplate h2.h2Category {
    font-size: 18px;
    background: #e8d8b0;
    color: #664700;
    margin-top: 40px;
    padding: 15px 10px;
    border-radius: 4px;
}
@media screen and (max-width: 1024px) {
    #tableTemplate h2.h2Category {
        margin: 20px 10px 0;
    }
}
#tableTemplate .pCategory {
		font-size:14px;
    margin:15px 0 0;
}
@media screen and (max-width: 1024px) {
    #tableTemplate .pCategory {
				font-size:11px;
        margin:5px 10px 0;
    }
}
#tableTemplate .pRightCaution{
		display:none;
}
@media screen and (max-width: 768px) {
    #tableTemplate .pRightCaution {
				display:block;
				font-size:11px;
				color:#bbb;
				text-align:right;
        margin:2px 10px 0 35%;
    }
}
@media screen and (max-width: 414px) {
    #tableTemplate .pRightCaution {
        margin:2px 10px 0 48%;
    }
}
#tableTemplate table.responsive {
    width: 100%;
}
#tableTemplate table ul {}
#tableTemplate table ul li {
    text-align: left;
    line-height: 2;
}
#tableTemplate table .nameHead {
    font-weight: bold;
    background: #faf4ea;
    color: #664700;
    text-align: left;
    width: 140px;
}
@media screen and (max-width: 1024px) {
    #tableTemplate table .nameHead {
        font-size: 12px;
        width: 100px;
    }
}
@media screen and (max-width: 414px) {
    #tableTemplate table .nameHead {
        font-size: 11px;
    }
}
#tableTemplate table .nameHead a{
	display:block;
	overflow:hidden;
}
#tableTemplate table .nameHead .series {
	display:block;
	font-size:12px;
	padding:3px;
	margin-bottom:5px;
	text-align:center;
	color:#FFF;
}
@media screen and (max-width: 414px) {
	#tableTemplate table .nameHead .series {
		font-size:11px;
		padding:2px;
	}
}
#tableTemplate table .nameHead  .eco{ background:#a67082; }
#tableTemplate table .nameHead  .pile{ background:#a28e62; }
#tableTemplate table .nameHead  .hotel{ background:#798147; letter-spacing:-1px;}
#tableTemplate table .nameHead  .imabari{ background:#8c8c8c; }
#tableTemplate table .nameHead  .micro{ background:#816453; }
#tableTemplate table .nameHead  .ultrakoukin{ background:#9ea4c1; }

#tableTemplate table .nameHead .fl{
	float:left;
	width:175px;
	margin-right:20px;
}
@media screen and (max-width: 1024px) {
	#tableTemplate table .nameHead .fl{
		width:66%;
		margin-right:4%;
	}
}
#tableTemplate table .nameHead .productname{
	color:#562a2a;
	font-weight:bold;
}
#tableTemplate table .nameHead .bgprice,
#tableTemplate table .nameHead .unit {
	font-weight: normal;
	color:#C00;
	display: block;
}
#tableTemplate table .nameHead .itemimg{
	float:left;
	width:90px;
	text-align:center;
	background:#fff;
	display:block;
	position:relative;
}
@media screen and (max-width: 1024px) {
	#tableTemplate table .nameHead .itemimg{
		width:30%;
	}
}
#tableTemplate table .nameHead .itemimg img{
	width:100%;
	position:absolute;
	top:50%;
	transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(0%);
}

#tableTemplate table .function {}
@media screen and (max-width: 1024px) {
    #tableTemplate table .function {
        font-size: 10px;
        min-width: 150px !important;
    }
}
table.responsive td,
table.responsive th {
}
@media screen and (max-width: 1024px) {
    table.responsive td,
    table.responsive th {
        min-width: 200px !important;
    }
}
.block{
	display:block;
	font-size:11px;
}

/* テーブルのレスポンシブ調整 */
/* 外枠 */
.dataArea {
    width: 1170px;
    margin-top: 10px;
    overflow: hidden;
}
@media screen and (max-width: 1024px) {
    .dataArea {
        width: auto;
        margin: 0px 10px 0;
        /*border-right: 1px solid #CCC;*/
    }
}
/* ロック部分 */
.lockBox {
    float: left;
    width: 300px;
}
@media screen and (max-width: 1024px) {
    .lockBox {
        width: 30%;
    }
}
@media screen and (max-width: 414px) {
    .lockBox {
        width: 48%;
    }
}
.lockBox table {
    width: 300px;
}
@media screen and (max-width: 1024px) {
    .lockBox table {
        width: 100%;
    }
}
/* 横スクロール部分 */
.scrollBox {
    float: left;
    width: 870px;
}
@media screen and (max-width: 1024px) {
    .scrollBox {
        width: 70%;
        overflow-y: hidden;
        overflow-x: scroll;
    }
		/*.scrollBox::-webkit-scrollbar{height:10px;}
		.scrollBox::-webkit-scrollbar-track{background:#dddddd; border-radius:10px;}
		.scrollBox::-webkit-scrollbar-thumb{background:#555; border-radius:10px;}*/
}
@media screen and (max-width: 414px) {
    .scrollBox {
        width: 52%;
    }
}
.scrollBox table {
    width: 869px;
}
@media screen and (max-width: 1024px) {
    .scrollBox table {
        width: 704px;
    }
}
@media screen and (max-width: 768px) {
    .scrollBox table {
        width: 524px;
    }
}
@media screen and (max-width: 414px) {
    .scrollBox table {
        width: 300px;
    }
}

table.data {
/*    table-layout: fixed;*/
    border-collapse: collapse;
    border-spacing: 0;
}
table.data th,
table.data td {
    vertical-align: middle;
    padding: 2px;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
/*  overflow: hidden;  データが幅を超えたとき非表示に */
/*  white-space: nowrap;  データの折り返しを防止 */
}
table.data th {
    border-top: 1px solid #CCC;
    background: #EEF1F4;
}
/*
.imgWidth {
    width: 120px;
}*/
table.data td p {
    margin: 0; /* 余分なマージンを消去 */
		text-align:left;
}

@media screen and (max-width: 414px) {
	table.data tr td:nth-child(1){
		width:72px;
	}
}


/* ---------------------カラーCSS---------------------- */
#tableTemplate table td.color{
	overflow:hidden;
}
#tableTemplate table td.color div{
	width:16px;
	height:16px;
	border:1px solid #ddd;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	float:left;
	margin:0 2px 5px 2px;
}
#tableTemplate table td.color div.w{
	background:#FFF;
}
#tableTemplate table td div.b{
	background:#d7cfc9;
}
#tableTemplate table td div.sb{
	background:#a79170;
}
#tableTemplate table td div.db{
	background:#6c5857;
}
#tableTemplate table td div.ccb{
	background:#846050;
}
#tableTemplate table td div.bk{
	background:#000;
}
#tableTemplate table td div.mb{
	background:#9a8882;
}
#tableTemplate table td div.pp{
	background:#efae9d;
}
#tableTemplate table td div.p{
	background:#f9dadd;
}
#tableTemplate table td div.pg{
	background:#9f9f64;
}
#tableTemplate table td div.wr{
	background:#920769;
}
#tableTemplate table td div.dg{
	background:#37563d;
}
#tableTemplate table td div.nv{
	background:#5c6aa6;
}
#tableTemplate table td div.no{
	background:#df863e;
}
#tableTemplate table td div.gl{
	background:#53bd58;
}
#tableTemplate table td div.yl{
	background:#fed465;
}
#tableTemplate table td div.lil{
	background:#ad81db;
}
#tableTemplate table td div.p2{
	background:#f0b8d8;
}
#tableTemplate table td div.cp{
	background:#fd8897;
}
#tableTemplate table td div.cb{
	background:#e1bdc5;
}
#tableTemplate table td div.rp{
	background:#cb8785;
}
#tableTemplate table td div.rs{
	background:#f8d6c5;
}
#tableTemplate table td div.ki{
	background:#f5e7ce;
}
#tableTemplate table td div.gr{
	background:#d3d7b4;
}
#tableTemplate table td div.dn{
	background:#444;
}
#tableTemplate table td div.grayge{
	background:#a39984;
}
#tableTemplate table td div.cr{
	background:#b3939c;
}
#tableTemplate table td div.wgreen{
	background:#cec0b7;
}
#tableTemplate table td div.fgray{
	background:#dcdadb;
}
#tableTemplate table td div.lvash{
	background:#c4b4b5;
}
#tableTemplate table tbody td div.gry{
	background:#777;
}
#tableTemplate table tbody td div.olive{
	background:#626344;
}
#tableTemplate table tbody td div.olive2{
	background:#777d54;
}
#tableTemplate table tbody td div.camelb{
	background:#dab59d;
}
#tableTemplate table td div.koukingrayge{
	background:#dbcbcc;
}
#tableTemplate table td div.agray{
	background:#b6b1ba;
}
#tableTemplate table tbody td div.silverm{
	background:#ddd9d1;
}
#tableTemplate table tbody td div.sagegreen{
	background:#dfd8c1;
}
#tableTemplate table tbody td div.silkybeige{
	background:#f3ecd2
}
/* ---------------------関連bnr---------------------- */
#kanrenbnr{
	width:1170px;
	margin:40px auto 0;
	padding:0 110px;
}
#kanrenbnr li:nth-child(even){
	margin-top:20px;
}
#kanrenbnr li a{
	font-size:28px;
	padding:14px;
	display:block;
	position:relative;
	color:#FFF;
	text-align:center;
	text-decoration:none;
	background: linear-gradient(to bottom,#a58130,#8b6b23);
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}
#kanrenbnr li a:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 5px;
	width: 8px;
	height: 8px;
	margin: -4px 0 0 0;
	border-top: solid 2px #FFF;
	border-right: solid 2px #FFF;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#kanrenbnr li a span{
	display:inline-block;
	padding-left:16px;
}
@media screen and (max-width: 1024px) {
	#kanrenbnr{
		width:auto;
		margin:4% 0 0;
		padding:0 4%;
	}
}
@media screen and (max-width:767px){
	#kanrenbnr li a{
		font-size:20px;
		padding:10px;
	}
	#kanrenbnr li a span{
		padding-left:0;
	}
}
@media screen and (max-width: 414px) {
	#kanrenbnr{
		width:auto;
		margin:8% 0 0;
		padding:8% 4%;
		background:#ededed;
	}
}

/* ---------------------匁ツールチップ---------------------- */
#tableTemplate #tooltip{
	display:none;
}
#tableTemplate .openTooltip{
  width: 17px;
  height: 17px;
	background-color:#555;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
	display:inline-block;
	color:#fff;
	margin-left:10px;
	cursor:pointer;
}
@media screen and (max-width: 767px) {
	#tableTemplate .openTooltip{
		margin-left:0;
	}
}
#tooltip{
	background: rgba(0,0,0,0.7);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	position: absolute;
	z-index: 100;
	padding: 15px;
	cursor:pointer;
}
#tooltip .tooltipTxt{
	margin-right:10px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 0.875em;
	line-height: 1.5;
	color: #fff;
	float:left;
}
#tooltip .tooltipClose{
	width:26px;
	height:26px;
	text-align:center;
	line-height:26px;
	overflow:hidden;
	font-size:20px;
	background:#fff;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	float:left;
}
#tooltip:after{
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #333;
	border-top-color: rgba(0,0,0,0.7);
	content: '';
	position: absolute;
	left: 50%;
	bottom: -10px;
	margin-left: -10px;
}
#tooltip.top:after{
	border-top-color: transparent;
	border-bottom: 10px solid #333;
	border-bottom-color: rgba(0,0,0,0.7);
	top: -20px;
	bottom: auto;
}
#tooltip.left:after{
	left: 10px;
	margin: 0;
}
#tooltip.right:after{
	right: 10px;
	left: auto;
	margin: 0;
}

/* ---------------------モーダル,トリガー---------------------- 
#towelbtnMenu{
	width:42px;
	height:42px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	text-align:center;
	position:fixed;
	right:15px;
	bottom:15px;
	z-index:10;
	color:#FFF;
	border:1px solid #FFF;
	background:#b38318;
}
.landscape #towelbtnMenu{
	bottom:15px;
}
#towelbtnMenu a{
	width:40px;
	padding-top:24px;
	height:16px;
	position:relative;
	font-size:9px;
	color:#FFF !important;
	font-size:9px;
	font-weight:bold;
	display:block;
	text-decoration:none;
}
#towelbtnMenu p:after,
#towelbtnMenu a:before,
#towelbtnMenu a:after{
	width:20px;
	height:0;
	position:absolute;
	left:10px;
	top:7px;
	border-top:3px solid #FFF;
	content:" ";
}
#towelbtnMenu p:after{
	top:13px;
}
#towelbtnMenu a:after{
	top:19px;
}
#towelmodalMenu{
	width:100%;
	padding:0 3% 0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	display:none;
	position:absolute;
	left:0;
	top:0 !important;
	z-index:999;
	background-color:rgba(0,0,0,.7);
}
#towelmodalMenu #innerMenu{
	position:absolute;
	width:94%;
}
#towelmodalMenu h2{
	padding:8px 40px 8px 10px;
	background:#d4bf8e;
	color:#7b5500;
	font-size:14px;
}
#towelmodalMenu h3{
	padding:8px 40px 8px 10px;
	color:#7b5500;
	font-size:14px;
	border-top:1px solid #AAA;
}
#towelmodalMenu h3.s_open{ background:url(../img/btn_minus.gif) right 5px bottom 5px no-repeat #f2ece5; background-size:20px 20px;}
#towelmodalMenu h3.s_close{ background:url(../img/btn_plus.gif) right 5px bottom 5px no-repeat #f2ece5; background-size:20px 20px;}
#towelmodalMenu ul{
	background:#FFF;
	overflow:hidden;
}
#towelmodalMenu ul.modalUl1 li{
	width:49.8%;
	float:left;
	background:#FFF;
	border-top:1px solid #AAA;
}
#towelmodalMenu ul.modalUl1 li.wide{
	width:100% !important;
}
#towelmodalMenu ul.modalUl1 li:nth-child(odd){
	border-right:1px solid #AAA;
}
#towelmodalMenu ul.modalUl2 li{
	width:100%;
	background:#FFF;
	border-top:1px solid #AAA;
	background:#f2ece5;
}
#towelmodalMenu ul .linkafter:after{
  display: block;
  width: 5px;
  height: 5px;
	transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  content: "";
  position:absolute;
  top:50%;
	right:6%;
	border-radius:2px;
	border-top: 2px solid #0A3162;
	border-right: 2px solid #0A3162;
}
#towelmodalMenu ul li a{
	padding:10px 26px 10px 10px;
	font-size:12px;
	display:block;
	text-decoration:none;
	position:relative;
	color:#333;
	box-sizing:content-box;
}
#towelmodalMenu ul li a.hover{
	background:#EEE;
	opacity:1.0;
}
#closeMenu{
	width:27px;
	height:27px;
	position:absolute;
	right:20px;
	top:20px;
}
#closeMenu:before,
#closeMenu:after{
	content:'';
	height:2px;
	width:27px;
	background:#FFF;
	position:absolute;
	top:0;
	right:-5px;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg)
}
#closeMenu:after{
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
}
*/
/* ---------------------モーダル,トリガー---------------------- */
#towelbtngotop{
	position:fixed;
}
#towelbtngotop .btn-go-top {
	padding:5px 5px;
	display:block;
	border-radius: 5px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border:1px solid #fff;
	vertical-align: middle;
	text-align:center;
	text-decoration:none;
  background-color: #999999;
  color: #ffffff;
	font-size:14px;
}
@media (min-width: 768px) {
	#towelbtngotop{
		right:10px;
		bottom:10px;
	}
  #towelbtngotop .btn-go-top {
		width:50px;
		height:50px;
		padding:10px;
		font-size:17px;
  }
}
@media (max-width: 767px) {
	#towelbtngotop{
		right:10px;
		bottom:10px;
		z-index:2;
	}
  #towelbtngotop .btn-go-top {
		width:40px;
		height:40px;
  }
}