@media (max-width: 768px) {
    html, body {
        width: 100%;
        font-size: 15px;
    }

    .wrapper {
        width: 100%;
    }

    #logo {
        float: none;
        margin: 0;
    }

    #slider {
        display: none;
    }

    #main {
        margin: 0;
        width: 100%;
    }

    .l-col, .r-col, .m-col, .c-col {
        display: block;
        float: none;
        width: 100%;
    }

    .m-col {
        margin: 0;
    }

    #box-health .box-content > div {
        float: none;
        width: 100%;
    }

    #box-health .box-content > div > div {
        float: none;
        width: auto;
    }

    #box-login {
        display: none;
    }

    #box-video {
        height: auto;
    }

    #box-content ul {
        overflow-x: scroll;
        overflow-y: hidden;
    }

    #box-content .box-content {
        overflow-x: auto;
    }

    #box-video .box-content ul {
        display: flex;
    }

    #box-video .box-content ul li {
        float: none;
    }

    .main-nav {
        float: none;
        margin: 0 auto;
        display: flex;
    }

    .main-nav li {
        float: none;
    }

    #header {
        height: auto;
        background: inherit;
    }

    #header nav {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        height: 55px;
        background: #f0f0f0;
    }

    #header #nav-wrapper {
        height: 40px;
        overflow: hidden;
    }

    #header .main-nav {
        height: 55px;
        padding-bottom: 40px;
    }

    .top-nav {
        display: none;
    }

    .sidebar-content, .box-content * {
        font-size: 14px;
    }

    .r-col.sub-page {
        position: inherit;
        width: auto
    }

    .sub-menu {
        float: none;
        margin: 0;
        width: auto;
        display: none;
    }

    .article {
        float: none;
        width: 100%;
    }
    .article p {
        font-size: 18px;
        text-align: left;
        line-height: 32px;
    }

    .quick-menu {
        display: none;
    }

    #social-media {
        width: 100%;
        overflow: hidden;
    }

    .list {
        background: rgba(255, 255, 255, 0.92);
        padding: 15px;
    }

    .list.col ul li {
        width: 100%;
        float: none;
        padding: 0;
        list-style: none;
    }

    .list.col ul li a {
        display: block;
        padding: 4px 16px;
        background: none;
    }

    .index.signature {
        font-size: 14px;
    }

    .article-nav {
        width: 100%;
        float: none;
    }

    h1#topmenu {
        padding: 10px;
    }

    .index {
        margin: 12px;
    }

    .article-content article, article.article-content {
        padding: 10px 18px;
        background: rgba(255, 255, 255, 0.92);
    }

    .index li {
        float: none;
        width: 100%;
    }

    .side-note h6 {
        font-size: 18px;
        margin-bottom: 6px;
    }

    .side-note p {

    }

    #box-health .box-content p {
        width: 50%;
    }

    .breadcrumb {
        margin: 0;
        background: rgba(255, 255, 255, 0.5);
        padding: 0 6px;
    }

    .sub-menu {
        position: fixed;
        top: 0;
    }
}
