/* tablets col-xxl */
@media (max-width: 1400px) {
    .rwd:after{
        content: 'mx1400';
    }
}
/* tablets col-xl */
@media (max-width: 1200px) {
    .rwd:after{
        content: 'mx1200';
    }
}
/* desktops col-lg  */ 
@media (max-width: 992px) {
    .rwd:after{
        content: 'mx992';
    }
}

/* tablets col-md */
@media (max-width: 768px) {
    .rwd:after{
        content: 'mx768';
    }
}

/* phones col-sm */
@media (max-width: 576px) {
    .rwd:after{
        content: 'mx576';
    }
    .search_block button{
        padding: 0 10px;
    }
    .main_header .menu_block{
        width: 35px;
        height: 20px;
        display: block;
        position: relative;
        transition: all .3s;
        z-index: 99;
    }
    .main_header .menu_block .menu_btn{
        position: absolute;
        top: 50%;
        width: 100%;
        height: 1px;
        background-color: #333;
        transition: all .3s;
    }
    .main_header .menu_block:before{
        content: '';
        display: block;
        position: absolute;
        top: 0%;
        width: 100%;
        height: 1px;
        background-color: #333;
        transition: all .3s;
    }
    .main_header .menu_block:after{
        content: '';
        display: block;
        position: absolute;
        bottom: 0%;
        width: 100%;
        height: 1px;
        background-color: #333;
        transition: all .3s;
    }
    .main_header .menu_block.active{
        margin-right: 10px;
    }
    .main_header .menu_block.active .menu_btn{
        opacity: 0;
    }
    .main_header .menu_block.active:before{
        transform: rotate(45deg) translateX(13px);
    }
    .main_header .menu_block.active:after{
        transform: rotate(-45deg) translateX(13px);
    }
    .main_header .top .logo{
        width: 180px;
    }
    .main_header .main_nav{
        width: 100%;
        height: 100vh;
        position: absolute;
        z-index: 9;
        top: 0;
        left: 0;
        background-color: #fff;
        /*padding: 0 30px;*/
        flex-direction: column;
        justify-content: center;
        border-top: 0px solid #333;
        transform: translateX(100%);
        transition: all .3s;
    }
    .main_header .main_nav.active{
        transform: translateX(0%);
    }
    .main_header .main_nav .nav_list{
        display: flex;
        flex-direction: column;
        /*align-items: center;*/
        gap: 10px;
    }
.main_header .main_nav .nav_list .nav_item > a:hover,
.main_header .main_nav .nav_list .nav_item > a,
.main_header .main_nav .nav_list > div > a.item2{
    font-size: 24px;
    color: #080808;
    border-bottom: 1px solid #ccc;
    padding: 10px 15px;
}
    .main_header .main_nav .nav_list .nav_item .sub{
        position: static;
        visibility: visible;
        /*background-color: #fff;*/
        /*padding: 10px 20px;*/
        transform: scaleY(1);
        /*transform-origin: top center;*/
        /*transition: all .2s;*/
    }
    .main_header .main_nav .nav_list .nav_item .sub .item{
        font-size: 16px;
    }
    .main_header .main_nav .nav_list .nav_item:hover .sub{
        /*visibility: visible;*/
        /*transform: scaleY(1);*/
    }
    .main_header .main_nav .extra{
        justify-content: center;
        margin-top: 30px;
    }
    .main_header .main_nav .extra svg{
        width: 40px;
        height: 40px;
    }
    .main_header .main_nav .nav_list .item{
        padding: 10px 0;
        font-size: 20px;
        text-align: center;
    }
    /**/
    .kv {
        padding-top: 90px;
        padding-bottom: 0px;
    }
    .kv .m{
        display: block;
    }
    .kv .pc{
        display: none;
    }
    .kv .slick-dots {
        bottom: -30px;
    }
    .kv .slick-dots li button:before{
        color: #ccc;
    }
    /**/
    .block_card h2.title span:nth-child(1){
        font-size: 30px;
    }
    .block_card h2.title span:nth-child(2){
        font-size: 16px;
    }
    .block_card h2.title span.plus a{
        font-size: 30px;
    }
    /**/
    .fbstv.block_card h2.title a span:hover,
    .fbstv.block_card h2.title a span.active{
        font-size: 20px;
    }
    .fbstv.block_card h2.title a span{
        font-size: 20px;
    }
    .fbstv.block_card{
        margin-bottom: 30px;
    }
    .fbstv.block_card h2.title{
        flex-wrap: wrap;
        gap: 10px;
    }
    .fbstv.block_card h2.title a + a{
        margin-left: 0px;
    }
    /**/
    .video_detail{
        padding-top: 90px;
    }
    .video_detail h2.title{
        line-height: 1.5;
    }
    .video_detail .head_title{
        margin-top: 30px;
    }
    /**/
    .podcast .podcast_block .item{
        display: block;
        gap: 30px;
        padding-bottom: 20px;
        padding-top: 20px;
    }
    .podcast .podcast_block .item .pic{
        width: 100%;
    }
    .podcast .podcast_block .item .txt{
        margin-top: 15px;
    }
    .podcast .podcast_block .item .txt h2{
        line-height: 1.5;
    }
    .podcast .podcast_block .item .button{
        margin-left: auto;
    }
    .podcast .podcast_block .item .button .btn_inner{
        top: 0%;
        transform: translateY(0%);
    }
    .podcast .podcast_block .item .button{
        width: 50px;
    }
    .podcast .podcast_block .item .txt .pdate{
        margin-top: 20px;
    }
    /**/
    .kv.case .kv_case.m{
        display: block;
    }
    .kv.case .kv_case > div{
        height: auto;
    }
    .kv.case .kv_case.m{
        margin-top: 40px;
    }
    .kv.case .kv_case.m .pic{
        margin-top: 10px;
        background-color: transparent;
    }
    .kv.case .kv_case.pc{
        display: none;
    }
    .case_search form input{
        width: 100%;
        margin-top: 20px;
    }
    .case_search form select{
        width: 100%;
        margin-top: 20px;
    }
    .case_search form button{
        width: 100%;
        margin-top: 20px;
    }
    /**/
    .detail_head{
        padding-top: 80px;
    }
    .detail_head .info{
        margin-top: 20px;
    }
    .detail_head .info .other_info .item,
    .case_detail .other_info .item{
        gap: 20px;
    }
    .detail_head .info .other_info .t,
    .case_detail .other_info .t{
        width: auto;
        white-space: nowrap;
        line-height: 1.5;
    }
    .detail_head .info .other_info .con,
    .case_detail .other_info .con{
        line-height: 1.5;
    }
    .case_detail .other_info{
        margin-top: 0px;
    }
    .case_detail{
        margin-bottom: 30px;
    }
    .case_detail .feature p{
        text-align: justify;
        text-justify:inter-ideograph;
    }
    /**/
    .news_content{
        padding-top: 80px;
    }
    .news_content h2.title,
    .news_content h1.title{
        line-height: 1.5;
    }
    /**/
    .item_nav{
        flex-wrap: wrap;
    }
    /**/
    .news_list.block_card .item{
        flex-wrap: wrap;
    }
    .news_list.block_card .item .pic{
        width: 100%;
    }
    .news_list.block_card .item .desc{
        width: 100%;
    }
}

@media (max-width: 350px) {
    .rwd:after{
        content: 'mx350';
    }
}










