.subnav {
    margin-top: -2em;
    margin-bottom: 4em;
    clear: both;
}

    .subnav hr {
        margin: 6em 0 4em 0;
        clear: both;
        border-bottom: 1px solid #004183;
    }

    .subnav ul {
        list-style: none;
    }

        .subnav ul li {
            width: 8em;
            line-height: 2.4em;
            background: #e0e0e0;
            float: left;
            margin-right: 1.0em;
            margin-bottom: 1em;
            text-align: center;
        }

            .subnav ul li a {
                color: #666;
                font-size: 1.2em;
            }

            .subnav ul li.active {
                background: #80b5ea;
            }

                .subnav ul li.active a {
                    color: #fff;
                }

/*--- about Start --*/

.about {
    margin-bottom: 6em;
}

.historys h1 {
    text-align: left;
    font-size: 2.4em;
    color: #004183;
    margin-bottom: 1.4em;
}

.historys ul {
    list-style: none;
}

    .historys ul li {
        border: 1px solid #efefef;
        margin-bottom: 1.4em;
        line-height: 60px;
        font-size: 1.2em;
        color: #999999;
    }

    .historys ul strong {
        background: #f6f6f6;
        color: #004183;
        font-size: 1.8em;
        line-height: 60px;
        display: block;
        width: 10%;
        float: left;
        text-align: center;
        margin-right: 0.6em;
    }

.brands {
}

    .brands .photo {
        text-align: center;
        margin-bottom: 2em;
    }

        .brands .photo img {
            max-width:180px;
        }

    .brands .text {
    }

        .brands .text h2 {
            text-align: left;
            font-size: 1.8em;
            font-weight: 600;
            color: #004183;
            margin-bottom: 1.0em;
        }

        .brands .text p {
            text-align: left;
            font-size: 1.1em;
            line-height: 1.6em;
            color: #999;
            margin-bottom: 1.4em;
        }

.intro {
}

    .intro h1 {
        text-align: left;
        font-size: 2.4em;
        color: #004183;
        margin-bottom: 1.4em;
    }

    .intro h2 {
        text-align: left;
        font-size: 1.6em;
        color: #004183;
        margin-bottom: 1.4em;
    }

    .intro p {
        text-align: left;
        font-size: 1.1em;
        line-height: 1.6em;
        color: #999;
        margin-bottom: 1.4em;
    }

.culture {
}

    .culture h1 {
        text-align: left;
        font-size: 2.4em;
        color: #004183;
        margin-bottom: 1.4em;
    }

    .culture h2 {
        text-align: center;
        font-size: 3em;
        color: #ffffff;
        margin-bottom: 1em;
        line-height: 2em;
    }

        .culture h2.c1 {
            background: #40b0e9;
        }

        .culture h2.c2 {
            background: #6686ff;
        }

        .culture h2.c3 {
            background: #9878ff;
        }

    .culture p {
        text-align: center;
        font-size: 1.6em;
        line-height: 2em;
        color: #999;
        margin-bottom: 1.4em;
    }


/*--- about End --*/

.factory {
    background: #163662;
    padding: 8em 5em 5em 5em;
}

    .factory h2 {
        font-size: 4.0em;
        font-weight: 600;
        color: #d3a555;
    }

    .factory div.title {
        margin-bottom: 8em;
    }

        .factory div.title img {
            margin: 0 auto;
        }

    .factory h3 {
        font-size: 2.8em;
        color: #d3a555;
        margin-bottom: 2em;
    }

    .factory h4 {
        border-left: 8px solid #d3a555;
        padding-left: 16px;
        font-size: 2.4em;
        font-weight: 600;
        color: #d3a555;
    }

    .factory h5 {
        border-left: 8px solid #d3a555;
        padding-left: 16px;
        font-size: 1.6em;
        color: #d3a555;
        margin-bottom: 1.6em;
    }

    .factory h6 {
        border-left: 8px solid #fff;
        padding-left: 16px;
        font-size: 2.2em;
        font-weight: 600;
        color: #fff;
        margin-bottom: 1.0em;
    }

    .factory p {
        text-align: left;
        font-size: 2em;
        line-height: 2em;
        color: #fff;
        margin-bottom: 2em;
    }
        .factory p strong {
            color: #d3a555;
        }

    .factory img.icons {
        max-width: 120px;
        margin: 14px 20px 10px 0;
    }


@media(max-width:1024px) {
    .brands {
    }

        .brands .photo {
            width: 100%;
            float: none;
            text-align: center;
            margin-bottom: 2em;
        }

            .brands .photo img {
                margin: 0 auto;
                max-width: 180px;
            }

        .brands .text {
            width: 100%;
            float: none;
        }

            .brands .text h2 {
                text-align: center;
                font-size: 1.4em;
                font-weight: 600;
            }

            .brands .text p {
                text-align: left;
                font-size: 1.1em;
                line-height: 1.6em;
                color: #999;
                margin-bottom: 1.4em;
            }

}

@media (max-width: 768px) {

    .brands {
    }

        .brands .photo {
            width: 100%;
            float: none;
            text-align: center;
            margin-bottom: 2em;
        }

            .brands .photo img {
                margin: 0 auto;
                max-width: 180px;
            }

        .brands .text {
            width: 100%;
            float: none;
        }

            .brands .text h2 {
                text-align: center;
                font-size: 1.4em;
                font-weight: 600;
            }

            .brands .text p {
                text-align: left;
                font-size: 1.1em;
                line-height: 1.6em;
                color: #999;
                margin-bottom: 1.4em;
            }

    .factory {
        padding: 2em 2em 2em 2em;
    }

        .factory .logob img {
            max-width: 120px;
        }

        .factory h2 {
            font-size: 1.8em;
            font-weight: 600;
        }

        .factory div.title {
            margin-bottom: 8em;
        }

        .factory h3 {
            font-size: 1.4em;
            margin-bottom: 1.6em;
        }

        .factory h4 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
        }

        .factory h5 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.2em;
            margin-bottom: 1.6em;
        }

        .factory h6 {
            border-left: 8px solid #fff;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
            margin-bottom: 1.0em;
        }

        .factory p {
            text-align: left;
            font-size: 1.2em;
            line-height: 1.6em;
            margin-bottom: 1em;
        }

        .factory img.icons {
            max-width: 80px;
            margin: 8px 20px 10px 0;
        }
}

@media (max-width: 640px) {

    .brands {
    }

        .brands .photo {
            width: 100%;
            float: none;
            text-align: center;
            margin-bottom: 2em;
        }

            .brands .photo img {
                margin: 0 auto;
                max-width: 180px;
            }

        .brands .text {
            width: 100%;
            float: none;
        }

            .brands .text h2 {
                text-align: center;
                font-size: 1.4em;
                font-weight: 600;
            }

            .brands .text p {
                text-align: left;
                font-size: 1.1em;
                line-height: 1.6em;
                color: #999;
                margin-bottom: 1.4em;
            }

    .factory {
        padding: 2em 2em 2em 2em;
    }

        .factory .logob img {
            max-width: 120px;
        }

        .factory h2 {
            font-size: 1.8em;
            font-weight: 600;
        }

        .factory div.title {
            margin-bottom: 8em;
        }

        .factory h3 {
            font-size: 1.4em;
            margin-bottom: 1.6em;
        }

        .factory h4 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
        }

        .factory h5 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.2em;
            margin-bottom: 1.6em;
        }

        .factory h6 {
            border-left: 8px solid #fff;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
            margin-bottom: 1.0em;
        }

        .factory p {
            text-align: left;
            font-size: 1.2em;
            line-height: 1.6em;
            margin-bottom: 1em;
        }

        .factory img.icons {
            max-width: 80px;
            margin: 8px 20px 10px 0;
        }
}

@media (max-width: 480px) {
    .subnav {
        margin-top: 1em;
        margin-bottom: 1em;
    }

        .subnav hr {
            margin: 2em 0 2em 0;
        }

        .subnav ul {
            list-style: none;
        }

            .subnav ul li {
                width: 4.2em;
                line-height: 1.8em;
                margin-right: 0.3em;
                margin-bottom: 1em;
            }

                .subnav ul li a {
                    font-size: 0.9em;
                }

    /*--- about Start --*/

    .about {
        margin-bottom: 2em;
    }

    .historys h1 {
        font-size: 1.4em;
        margin-bottom: 1.0em;
    }

    .historys ul li {
        border: none;
        margin-bottom: 1.2em;
        line-height: 1.8em;
        font-size: 1.0em;
    }

    .historys ul strong {
        border-bottom: 1px solid #efefef;
        background: none;
        display: block;
        font-size: 1.2em;
        line-height: 1.8em;
        float: none;
        text-align: center;
        margin-right: 0.6em;
    }

    .brands {
    }

        .brands .photo {
            width:100%;
            float:none;
            text-align: center;
            margin-bottom: 2em;
        }

            .brands .photo img {
                margin:0 auto;
                max-width:180px;
            }

        .brands .text {
            width:100%;
            float:none;
        }

            .brands .text h2 {
                text-align:center;
                font-size: 1.4em;
                font-weight: 600;
            }

            .brands .text p {
                text-align: left;
                font-size: 1.1em;
                line-height: 1.6em;
                color: #999;
                margin-bottom: 1.4em;
            }

    .intro {
    }

        .intro h1 {
            font-size: 1.4em;
            margin-bottom: 1.0em;
        }

        .intro h2 {
            text-align: left;
            font-size: 1.2em;
            color: #004183;
            margin-bottom: 1.4em;
        }

        .intro p {
            text-align: left;
            font-size: 1.1em;
            line-height: 1.6em;
            color: #999;
            margin-bottom: 1.4em;
        }

    .culture {
    }

        .culture h2 {
            font-size: 2em;
            margin-bottom: 1em;
            line-height: 2em;
        }

        .culture p {
            font-size: 1.4em;
            line-height: 2em;
            margin-bottom: 1.4em;
        }


    /*--- about End --*/
    .factory {
        padding: 2em 2em 2em 2em;
    }

        .factory .logob img {
            max-width: 120px;
        }

        .factory h2 {
            font-size: 1.8em;
            font-weight: 600;
        }

        .factory div.title {
            margin-bottom: 8em;
        }

        .factory h3 {
            font-size: 1.4em;
            margin-bottom: 1.6em;
        }

        .factory h4 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
        }

        .factory h5 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.2em;
            margin-bottom: 1.6em;
        }

        .factory h6 {
            border-left: 8px solid #fff;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
            margin-bottom: 1.0em;
        }

        .factory p {
            text-align: left;
            font-size: 1.2em;
            line-height: 1.6em;
            margin-bottom: 1em;
        }

        .factory img.icons {
            max-width: 80px;
            margin: 8px 20px 10px 0;
        }
}

@media (max-width: 320px) {
    .subnav {
        margin-top: 1em;
        margin-bottom: 2em;
    }

        .subnav hr {
            margin: 2em 0 2em 0;
        }

        .subnav ul {
            list-style: none;
        }

            .subnav ul li {
                width: 4.4em;
                line-height: 1.8em;
                margin-right: 0.4em;
                margin-bottom: 1em;
            }

                .subnav ul li a {
                    font-size: 1.0em;
                }

    .brands {
    }

        .brands .photo {
            width: 100%;
            float: none;
            text-align: center;
            margin-bottom: 2em;
        }

            .brands .photo img {
                margin: 0 auto;
                max-width: 180px;
            }

        .brands .text {
            width: 100%;
            float: none;
        }

            .brands .text h2 {
                text-align: center;
                font-size: 1.4em;
                font-weight: 600;
            }

            .brands .text p {
                text-align: left;
                font-size: 1.1em;
                line-height: 1.6em;
                color: #999;
                margin-bottom: 1.4em;
            }

    .factory {
        padding: 2em 2em 2em 2em;
    }

        .factory .logob img {
            max-width: 120px;
        }

        .factory h2 {
            font-size: 1.8em;
            font-weight: 600;
        }

        .factory div.title {
            margin-bottom: 8em;
        }

        .factory h3 {
            font-size: 1.4em;
            margin-bottom: 1.6em;
        }

        .factory h4 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
        }

        .factory h5 {
            border-left: 8px solid #d3a555;
            padding-left: 16px;
            font-size: 1.2em;
            margin-bottom: 1.6em;
        }

        .factory h6 {
            border-left: 8px solid #fff;
            padding-left: 16px;
            font-size: 1.4em;
            font-weight: 600;
            margin-bottom: 1.0em;
        }

        .factory p {
            text-align: left;
            font-size: 1.2em;
            line-height: 1.6em;
            margin-bottom: 1em;
        }

        .factory img.icons {
            max-width: 80px;
            margin: 8px 20px 10px 0;
        }
}