/* Product detail panel only.
   style.css keeps tables left with:
   .jgc-product-tabs .woocommerce-Tabs-panel table { display:block; overflow-x:auto }
   That block is the full panel width, so the rows stay on the left.
   display:table and width:max-content put the table in the middle. */
.jgc-product-tabs .woocommerce-Tabs-panel--description {
	text-align: center;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description :is(h2, h3, h4, p, li, div) {
	text-align: center;
}
.jgc-product-tabs .woocommerce-Tabs-panel.woocommerce-Tabs-panel--description table {
	display: table !important;
	float: none !important;
	width: max-content !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	text-align: center !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description :is(th, td) {
	text-align: center !important;
	float: none !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description img {
	display: block;
	width: auto !important;
	max-width: min(720px, 100%) !important;
	height: auto !important;
	margin-left: auto;
	margin-right: auto;
	float: none;
}

/* Specifications / 商品属性 only. Packaging tables stay on the rules above. */
.jgc-product-tabs .woocommerce-Tabs-panel--description table.jgc-attr-table {
	display: table !important;
	width: min(720px, 100%) !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	border-collapse: collapse !important;
	border: 1px solid #d0d0d0 !important;
	text-align: left !important;
	table-layout: fixed !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description table.jgc-attr-table :is(th, td) {
	text-align: left !important;
	vertical-align: top;
	border: 1px solid #d0d0d0 !important;
	padding: 8px 12px;
	white-space: normal;
	overflow-wrap: break-word;
	word-break: break-word;
	float: none !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description table.jgc-attr-table th {
	width: 34%;
	font-weight: 700;
	background: #f6f6f6;
}

/* Spec blocks are attribute tables, even when they have no jgc-attr-table class.
   max-content tables clip long values on a phone. */
.jgc-product-tabs .woocommerce-Tabs-panel--description .jgc-spec-blocks table {
	display: table !important;
	width: min(720px, 100%) !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	border-collapse: collapse !important;
	border: 1px solid #d0d0d0 !important;
	text-align: left !important;
	table-layout: fixed !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description .jgc-spec-blocks table :is(th, td) {
	text-align: left !important;
	vertical-align: top;
	border: 1px solid #d0d0d0 !important;
	padding: 8px 12px;
	white-space: normal !important;
	overflow-wrap: break-word;
	word-break: break-word;
	float: none !important;
}
.jgc-product-tabs .woocommerce-Tabs-panel--description .jgc-spec-blocks table th {
	width: 38%;
	font-weight: 700;
	background: #f6f6f6;
}