.sidebar-title{font-size:24px;color:#222;font-weight: bold;margin:0;text-transform:capitalize;line-height: 2}
.sidebar-title::after{content:'';display:block;width:83px;height:3px;background-color:#00a2e9;margin-bottom: 20px;}
.pro-cate-title{font-size:26px;font-weight: bold;margin:0px;margin-bottom:20px;padding:0px}
.p_problemCategory {float:left;width:100%;text-align:center;background:#00a2e9;color:#fff;height:50px;line-height:50px;margin-bottom:15px;cursor:pointer;}
/*²úÆ·À¸Ä¿*/
 .pro_nav_box{border-radius: 3px;background-color:#fff;box-shadow:0 3px 18px 0 rgba(0,0,0,.16);box-sizing:border-box;padding:20px;margin-bottom:20px;}
 .pro_nav_box .nav_item{width:100%;border-bottom: 1px solid #ebebeb;font-family: Arial;background: #f2f6f9;margin: 4px 0}
 .pro_nav_box .nav_item .top_item{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box;padding:12px;transition:all .2s linear}
 .pro_nav_box .nav_item .top_item a{width: 100%;height: 100%;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

.pro_list_box {float:right;width:calc(100% - 365px);}

/*Êó±ê¾­¹ý*/
 .pro_nav_box .nav_item:hover .top_item{background: #00a2e9;background-size: 100% auto;}
 .pro_nav_box .nav_item:hover .top_item a{width: 100%;height: 100%;display: block; font-weight: bold;color: #FFFFFF;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
/*µã»÷Õ¹¿ª*/
 .pro_nav_box .nav_item.on .top_item{background: #00a2e9;background-size: 100% auto;}
 .pro_nav_box .nav_item.on .top_item a{width: 100%;height: 100%;display: block; font-weight: bold;color: #FFFFFF;}

/*×ÓÀ¸Ä¿¶¨Î»*/
 .pro_nav_box .nav_item.active .top_item{background: #00a2e9;background-size: 100% auto;}
 .pro_nav_box .nav_item.active .top_item a{width: 100%;height: 100%;display: block; font-weight: bold;color: #FFFFFF;}


 .pro_nav_box .nav_item .top_item .plus{transition: all .3s linear; cursor: pointer; color: #cdcdcd;font-size: 28px; width: 52px;height: 52px;line-height: 52px; position: absolute;top: 0px;right: 0px;z-index: 999; text-align: center;}

 .pro_nav_box .nav_item .top_item:hover .plus{color:#FFFFFF;}
 .pro_nav_box .nav_item.active .top_item .plus{color:#FFFFFF;}
 .pro_nav_box .nav_item.on .top_item .plus{color:#FFFFFF;transform: rotate(45deg);}

 .pro_nav_box .nav_item .sub{padding: 0px;display: none;background:#fff;margin-bottom:0px}
 .pro_nav_box .nav_item .sub li{padding: 0px 30px;line-height: 45px;}
 .pro_nav_box .nav_item .sub li a{transition: all .3s linear; width: 100%;padding-right: 30px;box-sizing: border-box; height: 100%;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
 .pro_nav_box .nav_item .sub li:hover a{text-indent: 10px;font-weight: bold;color: #222;}
 .pro_nav_box .nav_item .sub li.on a{text-indent: 10px;font-weight: bold;color: #222;}

@media only screen and (max-width:1440px ) {
   .pro_nav_box{}
    .pro_list_box {float:right;width:calc(100% - 325px);}
}
@media only screen and (max-width:1200px ) {
   .pro_nav_box{}
    .pro_list_box {float:right;width:calc(100% - 305px);}
}

@media only screen and (max-width:900px ) {
   .pro_nav_box{}
    .pro_list_box {float:right;width:calc(100% - 280px);}
   .pro_nav_box .nav_item .top_item{line-height: 60px;}
   .pro_nav_box .nav_item .sub li{line-height: 35px;}
   .pro_nav_box .nav_item .top_item .plus{width: 60px;height: 60px;line-height: 60px;font-size: 26px;}
}
@media only screen and (max-width:768px ) {
   .hidden-xs{display: none;}
   .pro_nav_box{width: 100%;margin-bottom: 30px;}
   .pro_nav_box .nav_item .top_item{line-height: 50px;}
   .pro_nav_box .nav_item .sub li{line-height: 30px;}
   .pro_nav_box .nav_item .top_item .plus{width: 50px;height: 50px;line-height: 50px;font-size: 26px;}
  
   .pro_nav_box .nav_item .top_item a{padding: 0px 20px;}
   .pro_nav_box .nav_item .sub li{padding: 0px;}
    
    .pro_list_box {float:right;width:100%;}
    .pro_list_box .col-sm-3 {padding-right:5px;padding-left:5px;}
}


.visible-lg, .visible-md, .visible-sm, .visible-xs {
    display: none!important;
}

@media (max-width: 767px){
.visible-xs {
    display: block!important;
}

}
