@charset "utf-8";


/* common*/
.productcatalog h1,
.productcatalog h2 { font-size: 1.5rem; text-align: center; margin:1.5em 0; }
.productcatalog h3 { width: 90%; font-size: 1.5rem; text-align: center; margin:1.5em auto; font: bold; display: block; }
.productcatalog p { margin-bottom: 1.5em; }

.productcatalog { width: 100%; margin: 0 auto; padding: 0 0 3em; background: #fff; color: #000; line-height: 1.8em; font-size: 16px; }

.brandheader { width: 100%; margin: 0; padding: 1.5em; }
.brandheader img { width: 15%; filter: invert(100%); }

.brandstory { width: 80%; margin: 1em auto; }
.brandstory p { }
.brandstory .brandlogo,
.brandstory img { width: 100%; margin: 5em auto; display: block; }
.brandstory .brandlogo { width: 50%; }

.brandnews { width: 80%; margin: 1em auto; }
.brandnews dl {}
.brandnews dt { display: inline-block; width: 20%; vertical-align: top; }
.brandnews dd { display: inline-block; width: 78%; margin-bottom: 0.5em; }
.brandnews a { background: #00F; padding: 1em 2em; border-radius: 1.5em; color: #FFF; display: inline-block; } 


.productspec, { }
.productspec h2 { text-align: center; }
.productspec table { width: 95%; margin: 2em auto; background: #fff; color: #000; }
.productspec table tr { }
.productspec table tr th { background-color: #ccc; padding: 0.5em 1em; }
.productspec table tr td { padding: 0.5em 1em; }
.productspec table tr th:first-child { width: 25%; }
.productspec table tr th,
.productspec table tr td { border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; vertical-align: top; }

.onlinestore {}
.onlinestore ul { list-style: none; text-align: center; }
.onlinestore ul li { width: 24%; margin: 1%; display: inline-block; text-align: center; padding: 2em; border: 1px solid #ccc; border-radius: 1em; background: #fff; vertical-align: top; }
.onlinestore li img { display: block; width: 90%; margin: 1em auto; }
.onlinestore li a { padding: 0.5em 1em; background: #00F; color: #fff !important; border-radius: 1em; display: block; margin: 1em 0; }
.onlinestore li a i { margin-left: 0.5em; }
.onlinestore li a:hover { opacity: 0.5; }

.productlist { }
.productlist ul { text-align: center; }
.productlist ul li { width: 24%; margin: 1%; display: inline-block; text-align: center; padding: 2em; border: 1px solid #ccc; border-radius: 1em; background: #fff; vertical-align: top; }
.productlist ul li img { display: block; width: 90%; margin: 1em auto; }
.productlist .category { font-size: 1em !important; color: #fff; background: #777; width: 93%; border-radius: 0.5em; padding: 0.4em 0; }

.brandlink { margin: 1.5em auto; text-align: center; }
.brandlink a { color: #fff; width: 50%; background: #1d529e; padding: 0.8em 5em; border-radius: 0.5em; }
.brandlink a:hover { opacity: 0.8; }




@media only screen and (max-width: 960px) { 
table.productinfo { display: flex; overflow-x: scroll; } 
.productoption { font-size: 0.8em; }
.productlist ul li { width: 80%; }

.brandstory img { width: 100%; }

}