﻿/************************************************************************************/
@media screen and (max-width: 980px) {
}
/************************************************************************************/
@media screen and (max-width: 641px) {
    body {
        min-width: 320px;
        max-width: 640px;
        padding-top: 60px;
    }
    .zlayout {
        width: 100%;
    }
    #header {
        height: 60px;
    }
        #header > ul.top {
            height: 50px;
            padding: 5px 0;
        }
            #header > ul.top > li {
                height: 50px;
                position: relative;
                padding:0 5px;
            }
                #header > ul.top > li a > img {
                    height: 50px;
                }
                #header > ul.top > li > b {
                    line-height: 50px;
                    font-size: 12px;
                    padding:0 0 0 10px;
                }
                    #header > ul.top > li > b > em {
                        display: block;
                        padding:0;
                    }
                #header > ul.top > li > span {
                    display:none;
                }
        #header > ul.nav {
            position: absolute;
            top: 15px;
            right: 10px;
            width: 30px;
            height: 30px;
            border-radius: 3px;
            background: #0094FF;
        }
            #header > ul.nav > i {
                display: block;
                width: 30px;
                height: 30px;
                text-align: center;
                line-height: 30px;
                color: #FFFFFF;
                font-size: 1.2rem;
            }
            #header > ul.nav > li {
                position: fixed;
                display:none;
                width: 100%;
                height: auto;
                left: 0;
                top: 60px;
                z-index: 9999;
                overflow: auto;
                border-top: 1px solid #E1E1E1;
            }
            #header > ul.nav > li > i {
                display:none;
            }
                #header > ul.nav > li > span {
                    display: block;
                    position: relative;
                    width: 100%;
                    box-sizing: border-box;
                    background: #FAFAFA;
                    padding: 0 10px;
                    box-sizing: border-box;
                    border-bottom: 1px solid #E1E1E1;
                }
                    #header > ul.nav > li > span > b {
                        display: block;
                        width: 100%;
                    }
                        #header > ul.nav > li > span > b > i {
                            position: absolute;
                            top: 0;
                            right: 15px;
                            display: block;
                            width: auto;
                            height: 2.5rem;
                            font-size: 1rem;
                            color: #666666;
                            text-align: center;
                            line-height: 2.5rem;
                        }
                        #header > ul.nav > li > span > b > a {
                            display: block;
                            width:100%;
                            text-align: left;
                        }
                            #header > ul.nav > li > span > b > a.o {
                                pointer-events:none;
                            }

                    #header > ul.nav > li > span:hover > b > a, #header > ul.nav > li > span.cur > b > a {
                        background: #FAFAFA;
                    }
                    #header > ul.nav > li > span > em {
                        position: relative;
                        display:none;
                        height: auto;
                        width:100%;
                        background:none;
                    }
                    #header > ul.nav > li > span:hover > em.f130 {
                        margin-left: 0;
                    }
                    #header > ul.nav > li > span:hover > em.f395 {
                        margin-left: 0;
                    }
                        #header > ul.nav > li > span > em > label {
                            position: relative;
                            display: block;
                            height:auto;
                            padding:0;
                        }
                            #header > ul.nav > li > span > em > label > b {
                                display: block;
                                position:relative;
                                width:100%;
                                text-align:left;
                            }
                                #header > ul.nav > li > span > em > label > b > a {
                                    display: block;
                                    color:#333333;
                                    font-size:13px;
                                }
                                #header > ul.nav > li > span > em > label > a {
                                    color: #222222;
                                    line-height:20px;
                                    margin:0 10px 5px 0;
                                }
                    #header > ul.nav > li > span:hover > em.o > a {
                        display: inline-block;
                        width: auto;
                        color: #222222;
                        line-height: 20px;
                        margin: 0 10px 5px 0;
                    }
    #footer {
        min-width: 320px;
    }
        #footer > ul {
            width: 100%;
        }
            #footer > ul > li.menu {
                height: auto;
                line-height: 24px;
                text-align: center;
                padding: 10px 0;
            }
            #footer > ul > li.text {
                min-height: 150px;
                line-height: 20px;
                width:100%;
                padding:10px;
                box-sizing:border-box;
            }
                #footer > ul > li.text > span.img {
                    clear:both;
                    display:block;
                    margin:20px 0 0 0;
                    position: relative;
                    line-height: 25px;
                    color: #FFFFFF;
                    text-align:center;
                }
            #footer > ul > li.link {
                padding: 10px;
            }
                #footer > ul > li.link > b {
                    position: relative;
                    display:block;
                }

    #productbox {
        height: auto;
    }
        #productbox > span.title {
            line-height: 30px;
        }
            #productbox > span.title > em {
                font-size:20px;
                padding: 0;
            }
        #productbox > span.classify {
            padding: 10px 0 0 0;
        }
            #productbox > span.classify > a {
                margin: 5px 3px;
            }
        #productbox > div.list {
            margin: 0 auto;
            width: 100%;
            height: auto;
            padding: 25px 35px 20px 35px;
            position: relative;
            box-sizing:border-box;
        }
            #productbox > div.list > a {
                top: 30%;
            }

    #scroll {
        width: 100%;
        height: auto;
    }
        #scroll div.swiper-slide {
            width:50%;
        }
        #scroll div.swiper-slide > a {
            width: 100%;
            height: auto;
        }
            #scroll div.swiper-slide > a > img {
                width: 100%;
                height: auto;
                padding: 9px;
                box-sizing:border-box;
            }
            #scroll div.swiper-slide > a > b {
                font-size: 13px;
                height:auto;
                padding: 10px 0 0 0;
            }

    #solutionbox {
        height: auto;
    }
        #solutionbox > span.title {
            line-height: 30px;
        }
        #solutionbox > span.title > em {
            font-size: 20px;
            padding: 0 0 10px 0;
        }
        #solutionbox > div.list {
            margin: 0 auto;
            width: 100%;
            height: auto;
            padding: 25px 35px 20px 35px;
            position: relative;
            box-sizing: border-box;
        }
            #solutionbox > div.list > a {
                top: 30%;
            }
                #solutionbox > div.list > a.isbp {
                    text-align: center;
                }
    #iscroll {
        display: block;
        width: 100%;
        height: auto;
        position: relative;
        overflow: hidden;
    }
        #iscroll div.swiper-slide {
            width:50%;
        }
            #iscroll div.swiper-slide > a {
                width: 100%;
                height: auto;
                box-sizing: border-box;
            }
            #iscroll div.swiper-slide > a > img {
                display: block;
                width: 100%;
                height: auto;
                padding: 9px;
                border: 1px solid #D3D3D3;
                box-sizing:border-box;
            }
                #iscroll div.swiper-slide > a > b {
                    height: 30px;
                    font-size: 13px;
                    padding: 10px 0 0 0;
                }


    #aboutbox {
        height: auto;
        background: url(/images/cusbg.jpg) center 0;
        padding:0 0 20px 0;
    }
        #aboutbox > span.title {
            line-height: 30px;
        }
            #aboutbox > span.title > em {
                padding: 0;
                font-size: 20px;
            }
        #aboutbox > ul {
            height: auto;
        }
            #aboutbox > ul > li.txt {
                float: initial;
                width: 100%;
                line-height: 26px;
                font-size: 13px;
                padding: 10px;
                box-sizing:border-box;
            }
            #aboutbox > ul > li.img {
                float: initial;
                width: 90%;
                margin:0 auto;
                display:none;
            }
                #aboutbox > ul > li.img > img {
                    display: block;
                    width: 100%;
                }
            #aboutbox > ul > li.item {
                float: initial;
                width: 100%;
                padding:0 10px;
                box-sizing:border-box;
            }

    #newsbox {
        height: auto;
        padding: 20px 10px;
        box-sizing:border-box;
    }
        #newsbox > span.title {
            line-height: 30px;
        }
            #newsbox > span.title > em {
                padding: 0;
                font-size:20px;
            }
        #newsbox > div {
            float: initial;
            margin-right: 0;
            width: 100%;
            height: auto;
            box-sizing:border-box;
        }
            #newsbox > div > b {
                display: block;
                height: 38px;
                font-size: 15px;
                line-height: 35px;
                font-weight: normal;
                color: #076BB6;
                position: relative;
                padding:10px 0 0 0;
            }

    #contact {
        height: auto;
        padding: 30px 0 0 0;
    }
        #contact > div.zlayout > div.left {
            width: 100%;
        }
        #contact > div.zlayout > div.right {
            width: 100%;
            padding: 20px 0;
        }

    #pagecur {
        height: 40px;
        line-height: 40px;
        padding:0 10px;
        box-sizing:border-box;
    }
    #pagebox {
        padding: 0 5px 10px 5px;
        width: 100%;
        box-sizing: border-box;
    }
        #pagebox > div.clist {
            padding: 0;
            font-size:0;
            text-align:left;
        }
            #pagebox > div.clist > a {
                float: initial;
                margin: 5px 1%;
                display: inline-block;
                position:relative;
                width: 48%;
                height:auto;
                vertical-align:top;
                box-sizing:border-box;
            }
                #pagebox > div.clist > a > span > img {
                    width: 100%;
                    height: auto;
                }
                #pagebox > div.clist > a > span > em {
                    position: absolute;
                    width: 100%;
                    box-sizing: border-box;
                }
                #pagebox > div.clist > a:hover > span > em {
                    height: 100%;
                }
                #pagebox > div.clist > a:hover > span > h3 {
                    bottom: 40%;
                }

            #pagebox > div.slist > a {
                display: block;
                position: relative;
                height: auto;
                min-height:100px;
                overflow:hidden;
                padding: 10px 0 10px 110px;
            }
                #pagebox > div.slist > a > img {
                    position: absolute;
                    left: 0;
                    top: 10px;
                    width: 100px;
                    height: auto;
                }
                #pagebox > div.slist > a > b {
                    font-size: 14px;
                    padding:0;
                    height:auto;
                }
                #pagebox > div.slist > a > label {
                    font-size: 12px;
                    height: auto;
                    line-height: 20px;
                }


        #pagebox > div.plist {
            padding: 0 0 10px 0;
            position:relative;
            font-size:0;
        }
            #pagebox > div.plist > a {
                float: initial;
                margin: 5px 1%;
                display: inline-block;
                position: relative;
                width: 48%;
                height: auto;
                vertical-align: top;
                box-sizing: border-box;
            }
                #pagebox > div.plist > a.r {
                    margin-right: 1%;
                }
                #pagebox > div.plist > a > img {
                    width: 100%;
                    height: auto;
                }
                #pagebox > div.plist > a > b {
                    font-size: 13px;
                    padding:5px 0 0 0;
                }

            #pagebox > div.nlist > a > b {
                height: auto;
                font-size: 13px;
                font-weight:normal;
            }

    #nviewl {
        float: initial;
        width: auto;
    }
    #nviewr {
        float: initial;
        width: 100%;
        padding: 0 10px;
        box-sizing: border-box;
    }
    .rlbox {
        padding: 20px 0 0 0;
    }
        .rlbox > h3 {
            font-size: 13px;
            height: 30px;
        }

        #pagebox > div.view {
            padding: 30px 10px;
            box-sizing:border-box;
        }
            #pagebox > div.view img {
                max-width:100%;
                height:auto;
            }

            #pagebox > div.view > div.unbox {
                height: auto;
                padding: 10px 0 0 0;
            }
                #pagebox > div.view > div.unbox label {
                    display: block;
                    width: 100%;
                    height: 30px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }

        #pagebox > div.bottom {
            padding: 0 10px 30px 10px;
            box-sizing:border-box;
        }
            #pagebox > div.bottom > div.l {
                clear:both;
                float: initial;
                width: 100%;
                padding:0 0 10px 0;
            }
            #pagebox > div.bottom > div.c {
                margin-left: 0;
                clear: both;
                float: initial;
                width: 100%;
                padding: 0 0 10px 0;
            }
            #pagebox > div.bottom > div.r {
                clear: both;
                float: initial;
                width: 100%;
            }
            #pagebox > div.bottom > div > b {
                font-size: 14px;
            }
            #pagebox > div.bottom > div.cl {
                float:initial;
                width: 100%;
            }
            #pagebox > div.bottom > div.cr {
                float: initial;
                width: 100%;
            }

        #pagebox > div.per {
            clear: both;
            height: 50px;
            padding: 20px 0 0 0;
        }

    #pagebox > table.aform tr td.item {
        width: 75px;
        font-size:12px;
        padding:0;
    }
    #pagebox > table.aform tr td input {
        width: 90%;
        padding: 0 5px;
    }
    #pagebox > table.aform tr td textarea {
        height: 100px;
        width: 100%;
        box-sizing: border-box;
    }
    #pagebox > div.mform {
        margin: 0 auto;
        width: 100%;
        padding: 5px 20px 20px 10px;
        box-sizing:border-box;
        background: #F0F1EC url(/images/answer_title.jpg) no-repeat 20px -20px;
    }
        #pagebox > div.mform span {
            position: relative;
            display: block;
            height: 45px;
            padding: 10px 0 0 40px;
        }
            #pagebox > div.mform span label {
                display: inline-block;
                position: absolute;
                top: 10px;
                left: 0;
                width: 40px;
                height: 45px;
                text-align: right;
                line-height: 35px;
            }
            #pagebox > div.mform span input {
                width: 85%;
                height: 33px;
                padding: 0 5px;
                border: 1px solid #CCCCCC;
            }
                #pagebox > div.mform span.txt textarea {
                    width: 90%;
                    height: 90px;
                    padding: 5px;
                    line-height: 24px;
                    color: #666666;
                    border: 1px solid #CCCCCC;
                    box-sizing:border-box;
                }

            #dock {
                top: auto;
                right: 5px;
                bottom: 5px;
                width: 100px;
            }
            #dock > a > img {
                display: block;
                width: 100%;
            }

            #dock > a > b {
                left: 10px;
                bottom: 10px;
                width: 80px;
            }
}
/************************************************************************************/
@media screen and (max-width: 480px) {
    /* disable webkit text size adjust (for iPhone) */
    html {
        -webkit-text-size-adjust: none;
    }
}