﻿/************************************************************************************/
@media screen and (max-width: 980px) {
}

/************************************************************************************/
@media screen and (max-width: 650px) {
    body {
        min-width: 320px;
        width: 100%;
    }

    .zlayout {
        clear: both;
        margin: 0 auto;
        width: 100%;
    }
    /* header */
    #header {
        min-height: 40px;
    }
        #header > span {
            top: 15px;
            right: 50px;
        }
            #header > span > i {
                display:none;
            }
                #header > span > a.cur {
                    display:none;
                }
    #nav {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 30px;
        height: 30px;
        padding: 0;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
    }
        #nav > div.v {
            display: none;
        }
        #nav > i {
            display: block;
            width: 30px;
            height: 30px;
            font-size: 1rem;
            line-height: 30px;
            color: #FFFFFF;
            z-index: 999;
            cursor:pointer;
        }
        #nav > div.i {
            position: absolute;
            background: #000000;
            z-index: 99999;
            width: 200px;
            margin-left: -170px;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
            overflow:hidden;
        }
            #nav > div.i > span > a {
                display: block;
                padding: 10px 10px 10px 20px;
                color: #FFFFFF;
                font-size: 1rem;
                text-align: left;
                border-bottom: 1px solid #222222;
                transition: All 0.2s ease-in-out;
                -webkit-transition: All 0.2s ease-in-out;
                -moz-transition: All 0.2s ease-in-out;
                -o-transition: All 0.2s ease-in-out;
            }
                    #nav > div.i > span > a:hover {
                        background: #222222;
                        border-bottom: 1px solid #000000;
                    }
            #nav > div.i > span > u, #nav > div.i > span > u > i > u {
                display:none;
                text-decoration: none;
            }
                #nav > div.i > span > u > i > a {
                    display: block;
                    font-style: normal;
                    color: #FAFAFA;
                    text-align: left;
                    font-size: 0.9rem;
                    padding: 10px 10px 10px 30px;
                    background: #333333;
                    border-bottom: 1px solid #666666;
                }
                #nav > div.i > span > u > i > u > i > a {
                    display: block;
                    font-style: normal;
                    color: #FFFFFF;
                    text-align: left;
                    padding: 10px 10px 10px 40px;
                    background: #666666;
                    border-bottom: 1px solid #999999;
                }
        

    #banner {
        display: none;
    }
    #sbanner {
        display:block;
    }
    #links > b {
        padding: 0 0 0 10px;
    }
    #footer {
        padding:15px 0;
    }
        #footer > div > div.menu {
            float:none;
            width: 100%;
            text-align: center;
        }
        #footer > div > div.menu >span{
            margin:0 10px;
        }
            #footer > div > div.menu > a {
                margin: 0 10px;
            }
        #footer > div > div.wx {
            clear:both;
            width: 100%;
            height: auto;
            padding:0 0 20px 0;
            text-align: center;
        }
            #footer > div > div.wx > img {
                margin: 0 auto;
                display: block;
            }
            #footer > div > div.wx > label {
                display: block;
                padding: 10px 0 0 0;
            }
        #footer > div > div.txt {
            width: 96%;
            height: auto;
            line-height: 1.2rem;
            padding: 10px 2%;
            text-align: center;
        }
        #footer > div > div.bottom {
            padding: 10px 0 0 0;
        }
            #footer > div > div.bottom > div.img {
                width: 100%;
                text-align: center;
            }
                #footer > div > div.bottom > div.img > img {
                    margin: 0 10px;
                    height: 25px;
                }
            #footer > div > div.bottom > div.x {
                width: 100%;
                text-align: center;
                line-height: 1.2rem;
            }

    #classlink {
        height: auto;
        padding: 0;
        width: 100%;
        text-align:center;
    }
        #classlink > a {
            display: inline-block;
            margin: 4px 0;
            padding: 0 0 0 2%;
            width: 46%;
            height: 60px;
            line-height: 60px;
            font-size: 1rem;
            text-align:left;
        }
            #classlink > a.r, #classlink > a.ir {
                margin-left: 2%;
            }

    #product-box > span {
        height: 30px;
    }
    #product-box > div {
        padding: 10px 0 10px 0;
    }
        #product-box > div > a {
            margin: 13px 2% 0 2%;
            width: 46%;
            height: auto;
        }
            #product-box > div > a.r, #product-box > div > a.ir {
                margin-right: 0;
            }
            #product-box > div > a > i {
                display: block;
                width:auto;
                height:auto;
                padding: 10px;
            }
                #product-box > div > a > i > img {
                    display: block;
                    width: 100%;
                    height: auto;
                }
                #product-box > div > a > i > b {
                    display: block;
                    font-weight: normal;
                    text-align: center;
                    padding: 15px 0 0 0;
                    font-size: 1rem;
                    font-style: normal;
                }

    #about-box {
        height: auto;
        background: url(/images/about_bg.png) repeat-y -400px 0;
    }
        #about-box > div.zlayout > div.x {
            width: 100%;
        }
            #about-box > div.zlayout > div.x > span {
                height: 40px;
                text-align:center;
            }
            #about-box > div.zlayout > div.x > div.txt {
                padding:0 10px 20px 10px;
            }
            #about-box > div.zlayout > div.x > div.btn-box {
                margin-top:10px;
                padding: 0 0 20px 0;
                text-align: center;
            }
        #about-box > div.zlayout > div.i {
            width: 100%;
            padding: 30px 0;
            background:#000000;
        }
            #about-box > div.zlayout > div.i > video {
                display: block;
                margin: 0 auto;
                width: 100%;
                height:auto;
            }

    #news-box {
        height: auto;
        padding:0 0 20px 0;
        background: url(/images/news_bg.png) repeat-y -40px 0;
    }
        #news-box > span {
            padding: 35px 0 10px 0;
        }
        #news-box > div {
            width: auto;
            padding:0 10px 0 20px;
        }
            #news-box > div > a {
                margin: 15px 0;
                width: 100%;
                height: 80px;
                padding:0;
            }
                #news-box > div > a > b {
                    padding: 13px 5px 15px 70px;
                }
                #news-box > div > a > em {
                    margin: -10px 0 0 -10px;
                }

    #center > div.ulist > a {
        margin: 13px 2% 0 2%;
        width: 46%;
        height: auto;
    }
        #center > div.ulist > a.r, #center > div.ulist > a.ir {
            margin-right: 0;
        }
        #center > div.ulist > a > i {
            display: block;
            width: auto;
            height: auto;
            padding: 10px;
        }
            #center > div.ulist > a > i > img {
                display: block;
                width: 100%;
                height: auto;
            }
            #center > div.ulist > a > i > b {
                display: block;
                font-weight: normal;
                text-align: center;
                padding: 15px 0 0 0;
                font-size: 1rem;
                font-style: normal;
            }
    #center > div.dlist > a.box {
        height:auto;
        min-height:80px;
        padding: 30px 80px 20px 90px;
    }
        #center > div.dlist > a.box > i.down {
            right: 10px;
        }
        #center > div.dlist > a.box > b.title {
            -webkit-line-clamp: 5;
        }
        #center > div.dlist > a.box > label.txt {
            -webkit-line-clamp: 8;
        }
    #center > div.txt {
        width:95%;
    }

    #center > div > div.imgs {
        float:none;
        margin:0 2%;
        width: 96%;
        height: auto;
    }
        #center > div > div.imgs > div.img {
            width: auto;
            height: auto;
            pointer-events: none;
        }
    .box-slider {
        overflow: hidden;
        height: 80px;
        padding: 10px 0 0 0;
        position: relative;
    }
    .box-slider-seta-left {
        position:absolute;
        left:0;
        z-index:9;
        height:80px;
    }
    .box-slider-seta-right {
        position: absolute;
        right: 0;
        z-index: 9;
        height: 80px;
    }
    .box-slider .box-slider-content {
        margin: 0;
        width: 100%;
    }
    .box-slider .item {
        margin:0 0 0 8px;
        width: 70px;
        height: 70px;
    }
        .box-slider .item img {
            width: 70px;
            height: 70px;
        }

    #center > div > div.txt {
        float: none;
        margin: 0 2%;
        width: 96%;
        padding:20px 0 0 0;
    }
        #center > div > div.txt > div.x {
            line-height: 1.5rem;
        }

}
/************************************************************************************/
@media screen and (max-width: 480px) {
    /* disable webkit text size adjust (for iPhone) */
    html {
        -webkit-text-size-adjust: none;
    }
}
