body {scroll-behavior: smooth;}
.product-wh-banner {margin-top: 100px;position: relative;}
.product-wh-banner img {max-width: 100%; width: 100%;min-height:200px;}
.product-wh-banner .product-wh-banner-text {position: absolute;width: 100%; max-width: 800px;top: 50%;left: 50%;transform: translate(-50%,-50%)}
.product-wh-banner .product-wh-banner-text * {color: #fff;}
.product-wh-banner .product-wh-banner-text h1 {font-size: 40px;text-align: center;position: relative;margin-bottom: 25px;}
.product-wh-banner .product-wh-banner-text p {text-align: center;}
.breadcrumbs {text-align: center;padding-bottom: 20px;position: relative;margin-bottom: 30px;}
.breadcrumbs a {color: #fff;}
.breadcrumbs::after {content: "";position: absolute;left: 0px;right: 0px; bottom: 0px;width: 80px;height: 3px;color: #ffc03d;background: #ffc03d;text-align: center;margin: 0 auto;}

.product-wh-content {max-width: 1170px;margin: auto;padding-top: 80px; padding-bottom: 80px;scroll-behavior: smooth;}

.product-wh-p-menu .menu-one{display:flex;}
.product-wh-p-menu .menu-one span {padding: 10px 20px;background-color: #a6a6a6;color: #fff;display: inline-block;cursor: pointer;}
.product-wh-p-menu .menu-one span:hover {background-color:var(--c1);transition: all 0.5s;}
.product-wh-p-menu .menu-one span.active {background-color: var(--c1);}


.menu-two-items { padding: 10px 10px 5px;background-color: #fff;border:1px solid #cfcfcf;}
.menu-two-items .menu-two-item {display: none;}
.menu-two-items .menu-two-item.active {display: block;}
.menu-two-items .menu-two-item span{display: inline-block;padding: 10px 20px;border-radius: 5px;background-color:#fff;cursor: pointer; margin-bottom: 5px;border: 1px solid #fff;}
.menu-two-items .menu-two-item span.active {background-color:var(--c1);color: #fff;}
.menu-two-items .menu-two-item span:hover {background-color: var(--c1);color: #fff;border: 1px solid #fff;transition: all 0.5s;}
.menu-two-items .menu-two-item span a {color: var(--c2);}
.menu-two-items .menu-two-item span:hover a{color: #fff;;transition: all 0.5s;}
.menu-three-items span {display: inline-block;padding: 8px 15px;background-color: antiquewhite;margin-bottom: 10px;margin-right: 10px;border-radius: 5px;cursor: pointer;}
.menu-three-items .menu-three-item {display: none;padding: 10px;background-color: var(--c1);}
.menu-three-items .menu-three-item.active {display: block;}
.menu-three-items span a {color: #000;}

.product-list {margin-top: 50px;}
.product-list h3{position: relative;background-color: #f0f0f0;border-top: 1px solid #c8c8c8;padding: 15px;}
.product-list h3 > div {position: absolute;left: 0;top: -80px;}

.product-list-item-list h4 {border-bottom: 1px solid #c8c8c8;line-height: 3em; font-weight: 300;}
.models-title {font-size: 15px;font-weight: bolder;margin: 0;color: #000; padding-top: 0.5rem;padding-bottom: 0.5rem ;border-bottom: 1px solid #c8c8c8;}
.models-list {margin-top: 20px;}

.models-item a {color: #000;}
.models-item a:hover {color: var(--c1);;transition: all 0.5s;}

.product-list-item h3{position: relative;}
.product-list-item h3 > div {position: absolute;left: 0;top: -82px;}

@media (max-width: 767px) {
  .product-wh-content {padding: 10px;}
  .product-wh-banner .product-wh-banner-text p {display: none;}
  .product-wh-banner .product-wh-banner-text h1 {font-size: 20px;margin-bottom: 5px;}
  .product-wh-wrap h2 {font-size: 18px;margin: 0 0 10px 0;}
  .product-wh-p-menu .menu-one span,.menu-two-items .menu-two-item span {padding: 5px 10px;}
  .product-wh-p-menu .menu-one span a,.menu-two-items .menu-two-item span a {font-size: 14px;}
}