@media(min-width: 1200px) and (max-width: 1640px) {
    .container {
        width: calc(100% - 60px)
    }

    .cate_title {
        font-size: 80px
    }

    .cate_desc, .block_type3 .left .block_scroll, .block_type6 .right .block_scroll {
        font-size: 24px
    }
}

/* Màn ngang */
@media (orientation: landscape) {
    @media(min-width: 768px) and (max-width: 1199px) {
        .container {
            width: calc(100% - 40px)
        }

        .cate_title {
            font-size: 60px
        }

        .cate_desc, .block_type3 .left .block_scroll, .block_type6 .right .block_scroll {
            font-size: 20px
        }

        .block_type3 .left .block_scroll, .block_type6 .right .block_scroll, .block_type4 .content {
            padding: 20px
        }

        .block_type2 .left {
            margin-right: 30px
        }

        .block_type2 .right {
            flex: 0 0 calc(50% - 30px)
        }

        .block_type2 .left .imgc0:before {
            padding-bottom: calc(100vh - 40px)
        }
        .block_type8 .container {padding: 0}
        .block_type8 .imgc0:before {padding-bottom: 100vh}
    }

    @media(max-width: 767px) {
        .container {
            width: calc(100% - 20px)
        }


        .cate_title {
            font-size: 30px;
            padding-bottom: 5px;
            margin-bottom: 10px
        }

        .cate_desc, .block_type3 .left .block_scroll, .block_type6 .right .block_scroll {
            font-size: 15px;
            margin-bottom: 15px
        }

        .block_type3 .left .block_scroll, .block_type6 .right .block_scroll, .block_type4 .content, .block_type6 .right .content {
            padding: 10px;
            font-size: 15px
        }

        .block_type2 .left {
            margin-right: 20px
        }

        .block_type2 .right {
            flex: 0 0 calc(50% - 20px)
        }

        .block_type2 .left .imgc0:before {
            padding-bottom: calc(100% - 20px)
        }

        .block_type2 .right {
            padding-top: 20px
        }

        .position:after {
            height: calc(100% - 25px);
            top: 10px
        }

        .position .item {
            padding: 4px 0 4px 10px;
            font-size: 18px
        }

            .position .item:before {
                width: 6px;
                height: 6px;
                top: 7px;
                left: -4px
            }
        .block_type8 .container {
            padding: 0
        }

        .block_type8 .imgc0:before {
            padding-bottom: 100vh
        }
    }
}

/* Màn dọc */
@media (orientation: portrait) {
    @media(max-width: 1199px) {
        body {background-image: url("../images/body_bg_doc.jpg")}
        .img_doc {
            display: block
        }

        .img_ngang {
            display: none
        }

        .container {
            width: calc(100% - 40px)
        }

        .block_type2 .flex {
            flex-direction: column-reverse;position: relative;padding-bottom: 50px
        }

        .cate_title {
            font-size: 60px
        }

        .cate_desc {
            font-size: 20px
        }
        .block_type2 .cate_desc {margin-bottom: 0}
        .block_type2 .right {padding-top: 20px}
        .block_type2 .right .item {
            display: none
        }

            .block_type2 .right .item.active {
                display: block;
                text-align: center;
                padding: 5px 0
            }
        .block_type2 .right {max-width: none}
        .position {position: absolute;left: 0;width: 100%;bottom: 0}
        .position:after, .position .item:before {
            display: none
        }

        .block_type2 .left .imgc0:before {
            padding-bottom: 100%
        }

        .block_type2 .left .imgc0 {
            top: 0
        }

        .block_type2 .left {
            margin-right: 0
        }

        .block_type3 .flex {
            flex-direction: column-reverse
        }

        .block_type3 .left, .block_type6 .right {
            margin-right: 0;
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            z-index: 2
        }

        .block_type6 .flex {
            flex-direction: column
        }

        .block_type6 .left {
            flex: 0 0 100%;
            margin-right: 0
        }

        .block_type4 .content {
            width: 100%;
            max-width: 500px;
            margin: 0 auto
        }
        .block_type8 .container {
            padding: 0
        }

        .block_type8 .imgc0:before {
            padding-bottom: 100vh
        }
    }

    @media(max-width: 767px) {
        .container {
            width: calc(100% - 20px)
        }

        .cate_title {
            font-size: 40px
        }

        .cate_desc {
            font-size: 15px;
            margin-block: 15px
        }

        .block_type2 .right .item {
            font-size: 30px
        }

        .block_type3 .left .block_scroll, .block_type6 .right .block_scroll, .block_type4 .content {
            font-size: 16px;
            padding: 20px
        }
    }
}