body.pro {
    background: #F1F3F7;
}

.main-right{margin:0 0 0 370px;}
.main-left{float:left;width:300px;}
.main-right{margin-left:340px;}
/*----------------------------------------*/

.main-left h3{height:50px;line-height:50px;padding:0 0 0 20px;background:var(--btn-bg);font-size:20px;color:#fff;font-weight:600;text-transform:uppercase;}
.main-left h3::after{display:none;font-family:"qico";content: "\e727";float:right;font-size:20px;font-weight:normal;margin-top:0px;margin-right:15px;-webkit-transition: -webkit-transform .3s ease;transition: -webkit-transform .3s ease;transition: transform .3s ease;transition: transform .3s ease, -webkit-transform .3s ease;}
.main-left h3.active::after{-webkit-transform: rotate(45deg) scale(1.08);-ms-transform: rotate(45deg) scale(1.08);transform: rotate(45deg) scale(1.08);}

.sidemenu {
    margin: 0 0 15px
  }
  .sidemenu ul {
    border: 1px solid #ededed;
    border-top: none
  }
  .sidemenu ul li {
    margin: 3px 0 0;
    border-bottom: 1px solid #ededed;
    background: #B9C7E1;
  }
  .sidemenu ul li h5 {
    line-height: 24px;
    display: block;
    font-size: 16px;
    color: #333;
    cursor: pointer;
    position: relative
  }
  .sidemenu ul li h5 a {
    color: #333;
    display: block;
    padding: 10px 50px 10px 20px;
    text-transform: capitalize
  }
  .sidemenu ul li h5 a:hover {
    color: var(--active-color);
    text-decoration: underline
  }
  .sidemenu ul li h5 span {
    position: absolute;
    top: 0;
    right: 0;
    background: url(../images/i4.png) no-repeat center;
    width: 40px;
    height: 45px;
    display: block
  }
  .sidemenu dl {
    display: none
  }
  .sidemenu dl dd {
    line-height: 40px;
    border-bottom: 1px dashed #dcdcdc;
    background: #D1DAEB;
    padding: 0 20px
  }
  .sidemenu dl dd:last-child {
    border-bottom: none
  }
  .sidemenu dl dd a {
    font-size: 15px;
    display: block;
    color: #666;
    padding-left: 15px;
    text-transform: capitalize;
    background: url(../images/i10-1.png) no-repeat left center
  }
  .sidemenu dl dd.active a,.sidemenu dl dd a:hover {
    color: var(--active-color);
    background: url(../images/i10.png) no-repeat left center
  }
  .sidemenu ul li.active h5 {
    border-bottom: 1px solid #ededed
  }
  .sidemenu ul li.active h5 a {
    color: var(--active-color)
  }
  .sidemenu ul li.active span {
    background: url(../images/i4-1.png) no-repeat center
  }
  
.pro-nav{margin-bottom:48px;padding:20px 20px;background:#fff;}
.pro-nav ul{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.pro-nav ul li{width:20%;margin:7px 0;}
.pro-nav ul li a{font-size:17px;color:#333;display:block;background:#fff;line-height:22px;background: url(https://okki-shop.oss-cn-hangzhou.aliyuncs.com/465/upload/ad2/2ba9c58aea9083f39462a14230210b39306b715884fe37bd56e31d564a0cdeb7.png) no-repeat left 3px;padding:0 0 0 20px;}
.pro-nav ul li.active a,.pro-nav ul li:hover a{background-image: url(https://okki-shop.oss-cn-hangzhou.aliyuncs.com/465/upload/ad2/7bfe89f58e9eb2b24ce73bfa888e9cd4a718c78c58fb4ccfceaa37ebec49b36c.png);}

.pro-list ul{margin:-20px -30px 0;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.pro-list ul li{width:33.33333333%;text-align:center;padding:20px 30px;}
.pro-list ul li .box{}
.pro-list ul li .pic{background:#fff;display:block;position:relative;overflow:hidden;}
.pro-list ul li .pic > img{width:100%;display:block;transition:transform .5s;-webkit-transition:transform .5s;}
.pro-list ul li .txt{padding:15px 20px;text-align:center;}
.pro-list ul li .txt h6{font-size:18px;color:#000;}
.pro-list ul li .txt h6 a{display:block;line-height:24px;overflow:hidden;}
.pro-list ul li .txt h6 a:hover{color:var(--active-color);}

.pro-list ul li:hover .box{}
.pro-list ul li:hover .pic > img{transform:scale(1.03);-webkit-transform: scale(1.03);}
.pro-list ul li:hover .txt h6 a{color:var(--active-color);}
.pro-list ul li:hover .pic .big{opacity:1;}
                        
.search-result {
  padding-top: 60px;
  padding-bottom: 60px;
}

@media screen and (max-width:1441px) {
  .main-right {margin: 0 0 0 300px;}
}

@media screen and (max-width:1367px) {
  .pro-nav ul li a{font-size:16px;}

  .pro-list ul{margin:-20px -20px 0;}
  .pro-list ul li{padding:20px 20px;}
}

@media screen and (max-width:1281px){
  .main-right {margin: 0 0 0 308px;}
}

@media screen and (max-width:992px){
  .main-right{margin:0;}

  .pro-list ul{margin:-15px -15px 0;}
  .pro-list ul li{padding:15px;}
}

@media screen and (max-width:768px) {

  .pro-nav{margin-bottom:25px;padding:15px;}
  .pro-nav ul li{width:33.33333%;margin:6px 0;}
  .pro-nav ul li a{font-size:16px;background-size:12px;background-position:left 5px;padding:0 0 0 17px;}

  .pro-list ul{margin:-10px -10px 0;}
  .pro-list ul li{width:50%;padding:10px 10px;}
  .pro-list ul li .txt{padding:15px 0 0;}
  .pro-list ul li .txt h6{font-size:17px;}
  .pro-list ul li .txt h6 a{line-height:30px;height:30px;}
}

@media screen and (max-width:600px) {
  .pro-nav ul li{width:50%;}
}



@media screen and (max-width:1080px){
.pro-list ul li .txt h6 a {
    line-height: 12px;
}
.pro-list ul li .txt h6 {
    font-size: 12px;
}
}


@media screen and (max-width:992px){
.main-left {
    display: none;
}
}