@media screen and (min-width:768px) {
    #container {width: 1184px;margin: 32px auto;overflow: hidden;}
    .instrue-left {width: 900px;float: left;}
    .normal-nav{margin-top: 10px}
    .top-category{overflow: hidden;}
    .instrue-right-content{width: 284px;min-height: 343px;float: right;margin-top: 10px;}
    .instrue-right-ross{width:284px;height:343px;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 16px;}
    .instrue-right-ross.none{display: none;}
    .instrue-right-ross.show{display: block;}
    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
    .instrue-left .top-category .normal-nav .nav-list:hover{color:#FF5B00;transform:translateY(-5px);box-shadow:0 8px 8px rgba(102,102,102,0.05), 0 10px 10px rgba(102,102,102,0.05), 0 12px 12px rgba(102,102,102,0.05);}
    .instrue-left .top-category .normal-nav .nav-list {border:1px solid #fff;float: left;margin: 0 16px 16px 0;width: 132px;height: 88px;border-radius: 8px; background: #fff;text-align: center;color: #4a4f58;font-size: 14px;cursor: pointer;transition: all 0.4s}
    .instrue-left .top-category .normal-nav .nav-list a{padding: 0 10px;text-align: center;display: block;line-height: 22px;}
    .instrue-left .top-category .normal-nav .nav-list.active {border: 1px solid #FF5B00;color: #FF5B00;}
    .instrue-right {float: left;width: 252px;background: #fff;padding: 16px;margin-top: 0;min-height: 343px;overflow: auto;border-radius: 8px;}
    .instrue-right .wrap_tittle{padding-bottom: 10px;color: #4a4f58;font-size: 16px;font-weight: bold;border-bottom: 1px solid #f5f5f5;position: relative;}
    .instrue-right .wrap_tittle .line{height: 2px;width: 16px;background: #FF5B00;display: block;position: absolute;bottom: 0}
    .instrue-right .hot-search{padding:24px 0px 0px 0px;}
    .instrue-right .hot-search .hot-list{display: inline-block;height: 32px;border-radius: 16px;line-height: 32px;background: #f7f7f7;margin: 0 12px 12px 0;padding: 0 13px;color: #4a4f58;cursor: pointer;position: relative}
    .instrue-right .hot-search .hot-list:hover{background:#fef6f3;color: #FF5B00 }
    .item_icon{ width: 100%;height: 36px;padding: 12px 0 8px 0;}
    .item_icon img{width: 36px;height: 36px;display: block;margin: 0 auto;}
    .icon.hot:before{width: 25px;height: 20px;background-position: -120px -550px;position: absolute;top: -10px;right: -10px}
    .brand{color: #9aa5b5;margin: 10px 8px;border: 1px solid #e3ebf7;display: inline-block;padding: 0 10px;border-radius: 2px}
}


@media screen and (max-width:768px) {
    #instrueMent{ padding-top: 27vw; }
    footer{ display: none; }
    .instrue-right-content{width: 100%;padding:3vw 0;box-sizing: border-box;background: #fff;}
    .instrue-right-ross{width:100%;height:26vw;background: #F3920D;text-align: center;border-radius: 2px;float: left;margin-bottom: 3vw;}
    .instrue-right-ross>a{width: 100%;height: 100%;display: block;border-radius: 2px;}
    .instrue-right-ross>a img{width: 100%;height: 100%;display: block;border-radius: 2px;}
    .instrue-right{width: 100%;position:relative;float: left;}
    .instrue-right .wrap_tittle{padding: 0 3.2vw;color: #909090; font-size: 3.4vw;}
    .instrue-right .hot-search{padding: 2.7vw;overflow: hidden;height: 4vw;background: #fff;border-radius: 0 0 1.6vw 1.6vw;}
    .instrue-right .hot-search .hot-list{display: inline-block;background: #f7f7f7;color: #4a4f58;font-size: 3.2vw;padding: .7vw 2vw;margin: 0 2.4vw 3.1vw 0;position: relative;}
    .instrue-left{margin-top: 0;}
    .top-category{background: #fff;box-sizing: border-box;padding: 2vw 0;}
    .top-category .nav-list{display: inline-block;width: 24%;height: 21vw;text-align: center;}
    .item_icon{height: 8.8vw;padding: 2.7vw 0;width: 100%}
    .item_icon img{width: 8.8vw;height: 8.8vw;display: block;margin: 0 auto}
    .instrue-right .hot-search .right-box{position:absolute;right: -0.4vw;top:6.5vw;width:10%;text-align:center}
    .close.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -42vw 0px;transition:none}ght .hot-search .left-box{width: 90%;float: left}
    .bg{position: fixed;background: rgba(34,39,46, 0.3);left: 0;width: 100%;height: 100%;z-index: 1000;transition: 0.5s;}
    .mIcon.hot:before{width: 5.3vw;height:4.5vw;background-position: -55.9vw -70.3vw;position: absolute;top: -2.7vw;right: -2.7vw;}
    .open.mIcon:before{width: 5.4vw;height: 5.4vw;background-position: -51vw 0px;transition:none}
    .noclick{pointer-events: none}
}