@charset "utf-8";
/************************************************************************************
smaller than 980
*************************************************************************************/


@media screen and (max-width: 5000px) {
    /*#top .nav2{ display:none}*/
    .h_5000 {
        display: none
    }

    .s_5000 {
        display: block
    }
}

@media screen and (max-width: 1600px) {
}

@media screen and (max-width: 1560px) {
    .m2 .a2 .lk3 .mn1 {
        width: 400px;
        margin-left: -36px
    }

        .m2 .a2 .lk3 .mn1 .b3 {
            width: 100%;
        }
}

@media screen and (max-width: 1400px) {
    .top-bar .a1 {
        width: 50%;
        left: 0;
        margin: 0;
        box-sizing: border-box;
        padding-left: 1.5%
    }

    .top-bar .hd1 {
        width: 50%;
        margin: 0;
        float: right;
        padding-right: 2%;
        box-sizing: border-box;
    }

        .top-bar .hd1 .lk2a {
            width: 100%;
        }

    .top-bar .a1 .b1 {
        width: 400px
    }

        .top-bar .a1 .b1 .sha {
            width: 100%
        }

    .m1 .hd1 .lk2a .lk2 .mn5 {
        top: 50px;
    }
}

@media screen and (max-width: 1280px) {

    .m28 .a39 {
        width: 96%;
    }

    .bn6, .bn6-2, .bn6-3 {
        height: 700px;
    }

    .m26 .a37 {
        width: 96%;
    }

    .m27 .a38 .b35 {
        width: 96%;
    }

    .m29 .a40 {
        width: 96%;
    }

    .ls3 {
        width: 46%;
        margin: 0 2%;
        float: left
    }

    /*橫幅套件*/
    .m3 {
        height: 365px
    }

        .m3 .carousel-caption {
            width: 860px !important;
            margin: 0 0 0 -430px
        }

        .m3 .carousel-indicators {
            margin: 0 0 0 -430px
        }

        .m3 .carousel-control-prev {
            left: 50%;
            margin: 0 0 0 -430px;
            width: 50px;
            transition: all 0.3s;
        }

        .m3 .carousel-control-next {
            right: 50%;
            margin: 0 -430px 0 0;
            width: 50px;
            transition: all 0.3s;
        }
    /*猜你想看*/
    .m3a {
        height: 600px;
        padding: 0 0 20px
    }

        .m3a .a3 {
            width: 860px;
            height: auto;
            top: auto;
            bottom: 20px;
            margin: 0 -430px 0 0;
            box-shadow: 0 1px 8px rgba(0,0,0,0.35);
            padding: 15px 15px 20px
        }

    .m4 .a4 {
        padding: 25px 0 25px
    }

    .m1 .hd1 .lk2a .lk2 .mn5 {
        left: auto;
        right: -15px
    }

    .m1 .a1 .b1 .sha .in1 {
    }

    .m25 .a36 {
        width: 96%
    }

        .m25 .a36 .b34 {
            width: 100%
        }

    .bgt1 {
        width: 94%
    }
}

@media screen and (max-width: 1240px) {
    .m1 .hd1 .lk2a {
        width: 96%
    }

    .m1 .a1 {
        width: 96%
    }

    .top-bar .a1 {
        width: 60%;
    }

    .m2 .a2 {
        width: 96%
    }

    .m4 .a4 {
        width: 96%
    }

    .ls4 a .t4 {
        font: 500 15px/30px 'Noto Sans TC',"Century Gothic","微軟正黑體"
    }

    .m5 .a5 {
        width: 100%;
        height: 560px;
    }

        .m5 .a5 .bn2 {
            float: none
        }

        .m5 .a5 .b5 {
            width: 736px;
            right: 50%;
            margin: 0 -368px 0 0;
            top: auto;
            bottom: 0
        }

    .ls5 a .im4 {
        margin: 0 auto;
        float: none
    }

    .m6 .a6 {
        width: 96%;
    }

        .m6 .a6 .b6 {
            width: 100%;
            float: none
        }

    .ls6 {
        width: 23%;
        margin: 0 1% 20px; /*height:161px*/
    }

    .m6 .a6 .b7 {
        width: 98%;
        height: auto;
        float: none;
        overflow: hidden;
        margin: 0 auto;
        clear: both;
        padding-bottom: 10px
    }

    .ls7 { /*height:271px*/
    }

    .m7 .a7 .b8 {
        width: 96%
    }
    /*.ls9,
.ls10{height:437px}*/
    .m8 .a8 {
        width: 96%
    }

        .m8 .a8 .t13 {
            width: 40%
        }

        .m8 .a8 .t14 {
            width: 60%
        }

    .gd1 .a11 {
        width: 94%
    }

    .m9 .a9 {
        width: 96%
    }

    .m32 .a43 {
        width: 96%
    }

    .bt32 {
        width: 200px;
        height: 204px;
    }

        .bt32 a {
            font: 700 24px/29px 'Noto Sans TC',"Century Gothic","微軟正黑體";
            padding: 82px 0 0
        }

    .m34 .a45 {
        width: 92%
    }
}

@media screen and (max-width: 1140px) {
    .ls8, .ls9, .ls10 {
        width: 23%;
        margin: 0 2% 20px 0;
        height: 470px
    }

    .m9 .a9 .b9 {
        width: 380px
    }

        .m9 .a9 .b9 .sha2 {
            width: 200px
        }

    .m9 .a9 .hd2 {
        width: calc(100% - 390px)
    }
}

@media screen and (max-width: 1100px) {

    .m26 .a37 .im28 {
        width: 92%;
    }

    .m26 .a37 .im28b {
        width: 440px;
    }

    .m26 .a37 .im29 {
        width: 100%;
    }
    /*.m26 .a37 .yt1{width:920px;height:517px }*/
    .m4 .a4 {
        width: 96%
    }

    .ls4 {
        width: 16%;
        margin: 0 2% 25px
    }

        .ls4 a .t4 {
            font: 500 17px/30px 'Noto Sans TC',"Century Gothic","微軟正黑體"
        }

    .d-none {
        display: block !important
    }

    .top-bar .a1 .b1 {
        width: 300px;
    }
}

@media screen and (max-width: 1100px) {
    .kit3 .slick-next {
        right: 14px
    }
}

@media screen and (max-width: 1020px) {
    .m1 .a1 .b1 {
        width: 400px;
    }

    .top-bar .a1 .b1 {
        width: 300px;
    }

    .m1 .a1 .b1 .sha {
        width: 100%
    }

    .m2 {
        display: none
    }

    .m1 .a1 .b2 {
        width: 60px
    }

        .m1 .a1 .b2 .ls1 {
            margin: 0 12px 0 0
        }
    /*.m1 .a1 .b2 .ls1b{display:block}*/
    .m25 .a36 .b34 .c27 {
        width: calc(100% - 40px);
    }

    .m6 .a6 {
        width: 96%
    }

        .m6 .a6 .b6 {
            width: 100%;
            float: none;
        }

        .m6 .a6 .b7 {
            width: 98%;
            float: none;
        }

    .ls8, .ls9, .ls10 {
        height: 440px
    }

    .m8 {
        height: 60px;
    }

    .m8x {
        height: 60px;
    }

    .m8 .a8 {
        font: 500 13px/22px 'Noto Sans TC',"Century Gothic","微軟正黑體";
        margin-top: 8px
    }

        .m8 .a8 .t13 {
            width: 100%;
            text-align: center
        }

            .m8 .a8 .t13 a {
                font: 500 13px/20px 'Noto Sans TC',"Century Gothic","微軟正黑體";
            }

        .m8 .a8 .t14 {
            width: 100%;
            text-align: center
        }

    .ls16 {
        width: 23%;
        margin: 0 2% 20px 0
    }

    .m31 .a42 {
        margin: 40px auto
    }

    .m35 .a46 {
        height: auto
    }

        .m35 .a46 .im34 {
            width: 92%
        }

    .m33 .a44 .b41 {
        width: 84%
    }
}

@media screen and (max-width: 980px) {
    /*.m26 .a37 .yt1{width:840px;height:472px }*/
    .m9 .a9 .hd2 .lk4a {
        display: none
    }
}

@media screen and (max-width: 920px) {
    .m3a .a3 {
        width: 92%;
        ;
        margin: 0;
        right: 4%
    }

    .m1 .a1 .lg1 {
        width: auto;
        height: 40px;
        padding: 20px 0 0;
        margin-right: 20px
    }

        .m1 .a1 .lg1 img {
            width: auto;
            height: 100%
        }

    .m1 .a1 .b1 {
        width: calc(100% - 250px);
    }

    .m1x {
        height: 109px
    }

    .m1 .a1 {
        height: 80px
    }

        .m1 .a1 .b1 .lka1 {
            display: none
        }

        .m1 .a1 .b2 {
            padding-top: 12px
        }

    .ls8, .ls9, .ls10 {
        width: 30.33%;
        margin: 0 3% 20px 0;
        height: 480px
    }
}

@media screen and (max-width: 900px) {
    /*.m26 .a37 .yt1{width:760px;height:427px }*/
    .m26 .a37 .tt1,
    .m32 .a43 .tt3 {
        width: 480px
    }

    .m27 .a38 .tt2 {
        width: 480px
    }

    .bn6, .bn6-2, .bn6-3 {
        height: 600px
    }

    .m28 .a39 .b36 .t137 {
        width: auto;
        height: 70px;
        display: inline-block;
        margin: 0 20px
    }

    .m3 .carousel-caption {
        width: 100% !important;
        left: 0;
        margin: 0
    }

        .m3 .carousel-caption .im1 {
            width: 100% !important
        }

    .m3 .carousel-indicators {
        display: none
    }

    .m3 .carousel-control-next {
        right: 2%;
        margin: 0
    }

    .m3 .carousel-control-prev {
        left: 2%;
        margin: 0
    }

    .ls16 {
        width: 30.3%;
        margin: 0 3% 20px 0
    }

    .m26 .a37 {
        padding: 120px 0 20px
    }

        .m26 .a37 .yt1 {
            width: 440px;
            margin-top: -10px
        }
}

@media screen and (max-width: 830px) {
    .m26 .a37 .im28 {
        width: 90%;
    }

    .m26 .a37 .im28b {
        width: 440px;
    }
    /*.m26 .a37 .yt1{width:680px;height:382px }*/
    .bn6, .bn6-2 {
        height: 500px
    }

    .m28 .a39 .b36 .t137 {
        width: auto;
        height: 70px;
        display: inline-block;
        margin: 0 10px
    }

    .m28 .a39 .lg5 {
        width: auto;
        height: 50px;
        overflow: hidden;
        float: left;
        margin-top: 20px
    }

    .m28 .a39 .b36 {
        width: calc(100% - 200px)
    }

    .m27 .a38 {
        padding: 80px 0 0px
    }

        .m27 .a38 .b35 {
            width: 90%;
        }

    .ls49 {
        width: 46%;
        margin: 0 2% 30px
    }
    /*.m1 .a1 .b1{width:270px;}*/
    .m29 .a40 {
        width: 86%;
        font: 300 20px/32px 'Noto Sans TC',"Century Gothic","微軟正黑體";
        text-align: justify;
        text-justify: inter-ideograph;
    }

    .top-bar .hd1 .lk2a {
        display: none
    }

    .top-bar .hd1 .cart {
        display: block
    }

    .top-bar .a1 {
        width: calc(100% - 60px)
    }

        .top-bar .a1 .b1 {
            width: calc(100% - 180px)
        }

    .ls8, .ls9, .ls10 {
        height: 460px
    }
    /*.m26 .a37 .yt1{right:25px}*/
    .m34 {
        ;
        background: rgba(0,0,0,.8)
    }
}

@media screen and (max-width: 760px) {
    /*.m26 .a37 .yt1{width:620px;height:348px }*/
    .bn6, .bn6-2, .bn6-3 {
        height: 440px
    }

    .m3 {
        height: 320px
    }

    .m3a {
        height: 550px;
        padding: 0 0 10px
    }

    .m3 .carousel-inner > .carousel-item {
        height: 320px
    }

    .m3 .carousel-caption .im1 {
        height: 320px
    }

    .m5 .a5 .bn2 {
        width: 100%;
    }

    .m5 .a5 .b5 {
        width: 92%;
        margin: 0;
        right: 4%
    }

    .ls8, .ls9, .ls10 {
        width: 46%;
        margin: 0 4% 20px 0;
        height: 550px
    }

    .m25 {
        margin-bottom: 0
    }

    .ls16 {
        width: 46%;
        margin: 0 4% 20px 0
    }

    .m32 .a43 .b40 {
        padding: 40px 0 0
    }

        .m32 .a43 .b40 .yt2 {
            width: 400px;
            margin: 0 auto 25px;
            float: none
        }

        .m32 .a43 .b40 .c30 {
            width: 520px;
            margin: 0 auto;
            float: none
        }

    .m34 .a45 .b42 .t143 {
        margin: 0 10px
    }

    .m34 .a45 .lg5 {
        height: 30px;
        margin-top: 30px
    }

    .m34 .a45 .b42 {
        width: calc(100% - 150px);
    }

    .bt32 {
        width: 150px;
        height: 152px;
    }

        .bt32 a {
            font: 700 18px/21px 'Noto Sans TC',"Century Gothic","微軟正黑體";
            padding: 60px 0 0
        }
}

@media screen and (max-width: 700px) {
    /*.m26 .a37 .yt1{width:580px;heigsht:326px }*/
    .m1 .a1 .lg1 {
        display: none
    }

    .m1 .a1 .b1 {
        width: calc(100% - 150px);
    }

    .m1 .a1 .mn1 {
        display: block;
    }

    .m1 .hd1 {
        height: 50px;
        padding: 0 10px
    }

        .m1 .hd1 .lk2a {
            display: none
        }

        .m1 .hd1 .lg6 {
            display: block
        }

    .m1x {
        height: 129px
    }

    .m3 {
        height: 300px
    }

        .m3 .carousel-inner > .carousel-item {
            height: 300px
        }

        .m3 .carousel-caption .im1 {
            height: 300px
        }

    .top-bar .hd1 .lg6 {
        display: none
    }

    .top-bar .a1 .b1 {
        width: calc(100% - 80px)
    }

    .m25 .a36 .b34 .c27 {
        width: calc(100% - 56px);
    }

    .ls48 {
        width: 260px !important;
        margin: 0 20px
    }

        .ls48 a .im27 {
            width: 240px;
            height: 240px
        }

    .kit3 .slick-prev {
        top: 45%
    }

    .kit3 .slick-next {
        right: 30px;
        top: 45%
    }

    .m5 .a5 .bn2 {
        height: 300px
    }

    .ls8, .ls9, .ls10 {
        height: 520px
    }

    .m31 .a42 {
        width: 92%
    }
}

@media screen and (max-width: 640px) {
    .m3a {
        height: 515px;
        padding: 0 0 10px
    }

    .m3 {
        height: 270px
    }

        .m3 .carousel-inner > .carousel-item {
            height: 270px
        }

        .m3 .carousel-caption .im1 {
            height: 270px
        }

    .m25 .a36 .b34 .c27 {
        width: calc(100% - 48px);
    }

    .ls48 {
        width: 260px !important;
        margin: 0 12px
    }

    .m5 .a5 .bn2 {
        height: 274px
    }

    .m25 .a36 .b34 .c27 {
        width: calc(100% - 54px)
    }

    .kit3 {
        width: 94%
    }

    .ls8, .ls9, .ls10 {
        height: 500px
    }

    .kit3 .slick-next {
        right: 20px
    }
}
