@media (min-width: 768px) {
  .header:hover {background-color: rgba(246, 245, 235, 1);}
  .header:hover .navbar > li {padding-top: 18rem; padding-bottom: 18rem;}
  .header:hover .navbar a {color: #545d18;}
  .header:hover .navbar a i {border-top-color: var(--primary-color); border-right-color: var(--primary-color);}
  .header:hover .smlogo a {background-position: center bottom;}
  .header:hover .smlogo small {display: none;}
  .navbar > li:hover .dropmenu {z-index: 11; pointer-events: all; opacity: 1; transform: translateY(0);}
  .navbar > li:hover a i {top: -4rem; transform: rotate(135deg);}
  .navbar > li:hover .dropmenu li:hover .submenu {pointer-events: all; opacity: 1;}
  .dropmenu {width: 155%;}
  .dropmenu a {white-space: nowrap;}
  .dropmenu a:hover {background-color: #545d18; color: #e7ed49 !important;}
  .footer li a:hover {color: #8b9931;}
  .copyright .col-xs-12:last-child {text-align: right;}
  .idx3 li:hover {-webkit-box-flex: 1 1 15%; -webkit-flex: 1 1 15%; flex: 1 1 15%; width: 15%;}
  .idx3 li:hover .textbox {transform: translateY(50%); -webkit-transform: translateY(50%);}
  .idx3 li:hover p, .idx3 li:hover a {opacity: 1;}
  .idx3 li:first-child:hover::before {background-color: var(--primary-color); opacity: .9;}
  .idx3 li:first-child:hover a:hover {border-bottom-color: #fff;}
  .idx3 li:last-child:hover::before {background-color: #bbc69c; opacity: .9;}
  .idx3 li:last-child:hover * {color: var(--primary-color);}
  .idx3 li:last-child:hover a:hover {border-bottom-color: var(--primary-color);}
  .idx4 li:first-child .row {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: flex-start;}
  .idx4 li:first-child .row .col-xs-12 {display: inline-block; float: none; width: auto;}
  .idx4 li:first-child .row .col-xs-12:last-child {padding-right: 0;}
  .pronav {width: 94.5%;}
  .pro .cont {float: right; padding-left: 30rem;}
  .prodetail .col-xs-12:last-child {padding-right: 0;}
  .prodetail .col-xs-12:first-child {padding-left: 0;}
  .contact2 ul {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: flex-start;}
  .contact2 .itembox {width: 72.55%;}
  .about1 .col-sm-8 {width: 70.5%;}
  .about1 .col-sm-8 img {margin-left: 11%; width: 52.4%;}
  .about1 .col-sm-4 p {width: 85%;}
  .about1 .down {left: 11%;}
  .about1 .col-sm-4 {width: 29.5%;}
  .about2 .col-sm-4 {width: 29.513%;}
  .about2 .col-sm-8 {width: 70%;}
}

@media (min-width: 1200px) {
  .pagination a:hover, .breadcrumb a:hover {color: var(--high-color);}
  .pagination .btn-prev:hover::before, .pagination .btn-next:hover::before {border-top-color: var(--high-color); border-left-color: var(--high-color);}
  .pagination .btn-prev:hover::after, .pagination .btn-next:hover::after {background: var(--high-color);}
  .idx2 a:hover {background-color: rgba(84, 93, 24, .75);}
  .idx4 li:first-child {padding-right: 1%; width: 37.8%;}
  .idx4 li:last-child {float: right; width: 62.2%;}
  .news .itembox:hover { box-shadow: 0 10rem 20rem rgba(0, 0, 0, .1);}
  .news .itembox:hover img {-webkit-transform: scale(1.1); transform: scale(1.1);}
  .news .more:hover {padding-left: 40rem;}
  .news .more:hover::before {right: 36rem; width: 20rem; opacity: 1;}
  .news .more:hover::after {right: 40rem;}
  /*.newlist .imgbox:hover img {-webkit-transform: scale(1.1); transform: scale(1.1);}*/
  .newlist .imgbox:hover {box-shadow: 0 10rem 15rem rgba(0, 0, 0, .15);}
  .newlist .imgbox:hover .bg {opacity: 0;}
  .pronav dd a:hover {color: #BDC5A0;}
  .pro .tabs li:hover {padding-top: 0;}
  .pro .tabs li:hover a {color: var(--high-color); background: var(--primary-color);}
  .pro .list li a:hover h3 {color: #BDC5A0;}
  .pro .list li:nth-child(4n) a {border-right: 0;}
  .prodetail .col-xs-12:last-child {padding-left: 5rem; width: 34%;}
  .prodetail .col-xs-12:first-child {width: 66%;}
  .prodetail .picbox, .prodetail .smpicbox {width: 96.824%;}
  .contact1 .col-sm-4 {width: 32.1%;}
  .contact2 .itembox:hover {background: var(--primary-color);}
  .contact2 .itembox:hover h3 {padding: 2rem 20rem; background: var(--high-color); color: var(--primary-color); border-radius: 17rem;}
  .contact2 .itembox:hover p {color: var(--light-color);}
}
@media (min-width: 768px) and (max-width: 1199px) {
  .pro .list li:nth-child(3n) a {border-right: 0;}
}
@media (min-width: 1200px) and (max-width: 1400px) {
  .f12 {font-size: 10px;}
  .f14 {font-size: 12px;}
  .f16 {font-size: 14px;}
}
/*@media (min-width: 1800px) {*/
/*  .idx4 .container-fluid > ul > li p br {display: block;}*/
/*}*/
@media (min-width: 768px) and (max-width: 1366px) {
  .navbar > li > a {padding-left: 15rem; padding-right: 15rem;}
}
@media (max-width: 1660px) {
  .footer .menu li {padding-left: 38rem; padding-right: 38rem;}
}
@media (max-width: 1366px) {
  .footer .menu li {padding-left: 24rem; padding-right: 24rem;}
}
@media (max-width: 991px) {
  .news .imgbox {height: calc(40vw * (250 / 438));}
  .prodetail .col-xs-12:first-child {padding-right: 0;}
  .prodetail .col-xs-12:last-child {padding-left: 0;}
}
@media (max-width: 767px) {
  .f10, .f12 {font-size: 10px;}
  .f14 {font-size: 12px;}
  .f15 {font-size: 13px;}
  .f16, .f17, body {font-size: 14px;}
  .f18 {font-size: 15px;}
  .f20 {font-size: 16px;}
  .f22 {font-size: 17px;}
  .f24, .f25 {font-size: 18px;}
  .f26 {font-size: 19px;}
  .f28 {font-size: 20px;}
  .header {height: 101rem;}
  .header .logo {left: 5%;}
  .header.on .logo a, .wrapper .header .logo a {background-position: center bottom;}
  .header.on .menubtn i, .wrapper .header .menubtn i {background-color: var(--primary-color);}
  .navbar {position: fixed; z-index: 1001; top: 0; right: 0; bottom: 0; margin: 0; padding-top: 111rem; width: 60%; overflow-y: auto; background: #fff; display: block !important; opacity: 0; transform: translateX(100%); transition: all .5s;}
  .navbar.on {opacity: 1; transform: translateX(0);}
  .navbar > li {display: block; padding-top: 0 !important; padding-bottom: 0 !important; text-align: left; border-bottom: 1px solid #ebebeb;}
  .navbar > li > a  {color: var(--primary-color);}
  .navbar > li > a i {width: 15rem; height: 15rem; border-top-color: var(--primary-color); border-right-color: var(--primary-color);}
  .navbar > li.on > a > i {top: -4rem; transform: rotate(135deg);}
  .navbar > li.on .dropmenu {display: block;}
  .dropmenu {position: static; padding-top: 0; padding-bottom: 0; pointer-events: all; display: none; opacity: 1; transform: translateY(0);}
  .dropmenu a {padding: 22rem 45rem; color: #999;}
  .dropmenu .submenu {position: static; display: none; padding-left: 30rem;}
  .footer > img {width: 110%; margin-left: -5%; max-width: none;}
  .footer .menu li {padding: 20rem;}
  .footer .copyright {bottom: 20rem; text-align: center;}
  .footer .copyright .f20 {font-size: 12px;}
  .pagination .pager i {height: 12px;}
  .idx1 .swiper-button-prev {left: 10%;}
  .idx1 .swiper-button-next {right: 10%;}
  .idx3 ul {display: block;}
  .idx3 li {width: 100%; height: calc(100vw * (1038 / 960));}
  .idx3 li:first-child::before {background-color: var(--primary-color); opacity: .9;}
  .idx3 li:last-child::before {background-color: #bbc69c; opacity: .9;}
  .idx3 li .textbox {transform: translateY(50%);}
  .idx3 li p, .idx3 li a {opacity: 1;}
  .idx4 li .row > div:last-child {margin-top: 50rem;}
  .news .banner {height: 600rem;}
  .news .imgbox, .news .txtbox, .news .txtbox h3, .news .txtbox p {height: auto;}
  .news .txtbox p {min-height: 180rem;}
  .news .more {height: 60rem; line-height: 60rem;}
  .pro .container {width: 83.5%;}
  .pro .adbar p {width: 65%;}
  .pro .adbar p br {display: none;}
  .pro .list li:nth-child(2n) a {border-right: 0;}
  .pro .list li h3 {line-height: 30rem; height: 60rem;}
  .prodetail > div {padding: 0;}
  .prodetail .picbox {height: 60vw;}
  .prodetail .smpicbox {height: 22vw;}
  .contact1 .row {display: block;}
  .whygds .img {width: 75%;}
  .whygds .faq li h3 {padding-left: 0; padding-right: 0;}
  .about1 .row {padding-bottom: 160rem;}
  .about1 .down {left: 50%;}
  .brand1 .imgbox {height: 480rem;}
  .brand1 h2 {font-size: 70rem;}
  .brand1 p {font-size: 15px;}
  .brand2 dl {height: auto !important;}
  .news .banner h2 {font-size: 44rem; line-height: 1.4;}
  .news .banner h2 br {display: none;}
  .news .banner p {font-size: 20rem;}
}  
@media (max-width: 480px) {
  .footer .menu {top: 7%;}
  .footer .menu li {padding-top: 12rem; padding-bottom: 12rem;}
  .idx1 .swiper-button-prev {left: 5%;}
  .idx1 .swiper-button-next {right: 5%;}
}