﻿@charset "utf-8";
/* 設計師用 RWD版CSS檔 style_rwd.css */
/* 說明：
    可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/

@media (min-width: 576px) {
    .page-link {
        min-width: 42px;
        padding: 0.5rem 0.75rem;
    }
}

@media (min-width: 768px) {
    .h5 {
        font-size: 1.4rem;
        margin-bottom: 20px;
    }

    .header .navbar-collapse {
        flex-grow: unset;
    }

    .header .navbar .small-btn-box {
        width: 100%;
    }

    .nav-item .caret {
        display: none;
    }
    /* 父按鈕滑入效果 */
    .nav-item.dropdown.fadeup > .nav-link::before {
        content: "";
        position: absolute;
        width: 0%;
        height: 5px;
        border-radius: 5px;
        background: var(--main-color);
        bottom: 0px;
        left: 50%;
        transform: translate(-50%,0px);
        transition: .3s;
    }

    .nav-item.dropdown.fadeup:hover > .nav-link::before {
        width: 100%;
    }
    /* 子按鈕*/
    .nav-item.dropdown > .navbar-nav {
        /* width: 100%;
        left: 0px;
        clip: unset;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        align-content: center;
        flex-direction: unset;
        margin-top: 0px; */
        background: #fff;
        /* display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start;
        flex-wrap: wrap;
        max-height: 415px; */
        /* width: 300px; */
    }

        .nav-item.dropdown > .navbar-nav .nav-item {
            width: 100%;
        }
    /* 子按鈕過多 */
    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav {
        /*width: 380px;*/
        width: 200px;
        display: flex;
        /*overflow: hidden;*/
    }
        /* .nav-item.dropdown.nav_more_btn_01>.navbar-nav>.nav-item {
        width: 50%;
    }
    .nav-item.dropdown.nav_more_btn_01>.navbar-nav .navbar-nav {
        width: 300px;
    } */
        .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box {
            width: 100%;
            display: flex;
            justify-content: flex-start;
            align-items: flex-start;
            align-content: flex-start;
            flex-direction: column;
            flex-wrap: wrap;
            /*max-height: 320px;*/
        }

    .nav-item.dropdown > .navbar-nav .overflow_box {
        padding: 10px 0px;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box.nav_move {
        transform: translateX(-50%);
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav > .overflow_box > .nav-item {
        width: 100%;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box .navbar-nav {
        width: 190px;
    }
    /* 子按鈕過多 */
    .nav-item.dropdown.fadeup .sub_all_btn {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        align-content: center;
    }

    .nav-item.dropdown > .navbar-nav .nav-item .nav-link {
        padding: 6px 10px;
        transition: all ease .3s;
        text-decoration: underline;
        text-decoration-color: transparent;
        text-decoration-thickness: 1px;
        text-underline-offset: 2px;
    }

    .nav-item.dropdown > .navbar-nav .nav-item.active > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:active:focus > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:active > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:focus > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item.active > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:active:focus > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:active > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:focus > .nav-link,
    .nav-item.dropdown > .navbar-nav .nav-item:hover > .nav-link {
        /*text-decoration-color: var(--main-color);*/
        background: #f7f7f7;
        /*text-decoration-color: var(--second-color);*/
        color: var(--second-color);
    }

    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item .nav-link.trigger:before {
        /*border-color: transparent transparent transparent var(--second-color);*/
        border: 0 !important;
        content: "\f285";
        display: inline-block;
        font-family: bootstrap-icons !important;
        top: 50%;
        transform: translateY(-50%);
        line-height: 1em;
        font-size: 12px;
        font-weight: 700;
        width: auto;
        height: auto;
        margin: 0;
    }

    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item:hover .nav-link.trigger:before {
        /*border-right: 0;*/
        /*border-left: solid 5px var(--second-color);*/
        color: var(--main-color);
    }

    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item:hover > .nav-link.trigger:before {
        /*border-left: solid 5px var(--second-color);*/
        /*transform: translateY(-50%) rotateY(-180deg);*/
        color: var(--main-color);
    }
    /* 孫按鈕 */
    .nav-item.dropdown > .navbar-nav .nav-item {
        /*position: unset;*/
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav {
        /* clip: unset;
        position: unset;
        width: 100%; */
        max-height: 320px;
        /*min-height: 320px;*/
        overflow-y: auto;
        overflow-x: hidden;
        padding: 10px 0px;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav {
        /* clip: unset; */
        top: -10px;
        left: 100%;
        right: unset;
        z-index: 10;
        opacity: 0;
        pointer-events: none;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box.nav_move .nav-item > .navbar-nav {
        right: -50%;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item:hover > .navbar-nav {
        opacity: 0;
        pointer-events: none;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav.opensub {
        opacity: 1;
        pointer-events: unset;
        clip: unset;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav > .nav-item > .navbar-nav {
        /* position: relative;*/
        position: initial;
        max-height: unset;
        min-height: unset;
        opacity: 1;
        pointer-events: none;
        display: none;
    }

        .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav > .nav-item > .navbar-nav.opensub02 {
            display: block;
            pointer-events: unset;
            right: 0px;
        }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav > .nav-item:not(.trigger) {
        pointer-events: auto;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav > .nav-item > .navbar-nav a {
        color: #bbbbbb;
        transition: .3s;
    }

        .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .nav-item > .navbar-nav > .nav-item > .navbar-nav a:hover {
            color: var(--main-color);
        }

    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item > .navbar-nav > .nav-item .nav-link.trigger:before {
        /*border-width: 4px 4px 0px 4px;*/
        /*border-color: var(--second-color) transparent transparent transparent;*/
        /*border-right: solid 4px transparent;*/
        /* transform: translateY(-50%) rotate(90deg); */
        color: var(--second-color);
    }

    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item > .navbar-nav > .nav-item:hover .nav-link.trigger:before,
    .nav-item.dropdown.dropdown-left .navbar-nav .nav-item > .navbar-nav > .nav-item.in .nav-link.trigger:before {
        /*border-right: solid 4px transparent;*/
        /*border-left: solid 4px transparent;*/
        /*border-top: solid 4px var(--main-color);*/
        /* transform: translateY(-50%) rotate(90deg) scaleX(-1); */
        color: var(--main-color);
    }

    .sub_in_close {
        display: none;
    }

    .product-info-area .info-box {
        padding: 0;
    }

    .product-info-area, .product-info-area .item.desc .cont {
        font-size: 1rem;
    }

        .product-info-area .item {
            margin-bottom: 10px;
        }

            .product-info-area .item .label {
                width: 6em;
                margin-right: 25px;
                flex: 0 0 6em;
            }
}

@media (min-width: 992px) {
    .navbar .btn-search {
        display: none;
    }

    .navbar .search-area {
        position: unset;
        padding: 0px;
        display: block;
    }

    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav {
        /*width: 450px;*/
    }

        .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box .navbar-nav {
            /*width: 225px;*/
            width: 285px;
        }

    .banner .item img {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .nav-item.dropdown.nav_more_btn_01 > .navbar-nav {
        /*width: 600px;*/
    }

        .nav-item.dropdown.nav_more_btn_01 > .navbar-nav .overflow_box .navbar-nav {
            /*width: 300px;*/
        }
}

@media (min-width: 1280px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1240px;
    }
}

@media (min-width: 1921px) {
    .banner .item {
        background-size: unset;
    }
}

@media (max-width: 1920px) {
    .banner .item {
        background-size: 1920px;
        height: 390px;
    }
}

@media (max-width: 1279px) {
    .pro_news_box .pro_news_pic iframe {
        height: 17.5rem;
    }

    .navbar .navbar-brand {
        margin-right: 2%;
    }

    .navbar .nav_all_btn {
        width: calc(96% - 605px);
    }

    .navbar .search_box input {
        height: 35px;
        padding: 10px;
        padding-right: 35px;
        width: 345px;
    }
}

@media (max-width: 1240px) {
    .banner .slick .slick-prev {
        left: 10px;
    }

    .banner .slick .slick-next {
        right: 10px;
    }

    .banner .item {
        background-size: 156%;
        height: 32vw;
    }
}

@media (max-width: 1199px) {
    .navbar .navbar-brand {
        width: 160px;
        height: 45px;
        margin-right: 10%;
    }

    .navbar .nav_all_btn {
        /* width: calc(96% - 540px); */
        width: calc(90% - 220px);
    }

    .header .navbar .small-btn-box {
        margin-bottom: 10px;
    }

    .navbar .search {
        margin-left: 0px;
        margin-right: 5px;
        position: unset;
        bottom: unset;
    }

    .navbar .search_box input {
        font-size: 0.82rem;
        width: 320px;
        height: 32px;
    }

    .navbar .search_box .btn_search {
        height: 32px;
    }

        .navbar .search_box .btn_search img {
            max-width: 30px;
        }

    .navbar .nav_other_box .cart_link_btn {
        width: 270px;
        height: 25px;
    }
    /* .nav-item.dropdown.fadeup>.nav-link {
        font-size: 16px;
    }
     */
    .my_title {
        font-size: 26px;
        margin-bottom: 25px;
    }

    .service_flex_box .service_box .service_info .service_title {
        font-size: 26px;
    }

    .service_flex_box .service_box .service_info .service_text {
        font-size: 16px;
    }

    .service_flex_box .service_box .service_info .service_arrow img {
        width: 18px;
    }

    .pro_news_box {
        padding: 35px;
        margin-bottom: 25px;
    }

        .pro_news_box .pro_news_pic iframe {
            height: 14.5rem;
        }

        .pro_news_box .pro_news_info .pro_news_title {
            font-size: 24px;
            margin-bottom: 10px;
        }

        .pro_news_box .pro_news_info .pro_news_text {
            font-size: 16px;
            -webkit-line-clamp: 4;
        }

    .more_btn {
        font-size: 17px;
    }

        .more_btn .more_icon {
            width: 17px;
            height: 17px;
        }

    .gallery-list .item .title {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .gallery-list .item .info-box {
        font-size: 16px;
        -webkit-line-clamp: 4;
    }

    .gallery-list[data-mode=mode2] .item .title {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .gallery-list[data-mode=mode2] .item .item-info {
        padding: 10px 15px;
    }

    .gallery-list[data-mode=mode2] .item .info {
        padding: 5px 0 5px 25px;
    }

    .footer .footer_content {
        padding: 50px 0px 25px;
    }

    .footer_flex_box {
        max-width: 750px;
        margin: 40px auto 30px;
        align-items: center;
        align-content: center;
    }

    .footer_logo {
        width: 205px;
        margin-bottom: 0px;
    }

    .footer_text {
        padding-left: 48px;
    }

        .footer_text .footer_title {
            font-size: 16px;
            margin-bottom: 5px;
        }

        .footer_text .footer_s_text {
            font-size: 12px;
        }

    .footer_sitemap_flex {
        max-width: 750px;
    }

        .footer_sitemap_flex .footer_sitemap {
            margin: 0px 10px;
        }

            .footer_sitemap_flex .footer_sitemap a.sitemap_title {
                font-size: 16px;
            }

            .footer_sitemap_flex .footer_sitemap a {
                font-size: 14px;
            }
}

@media (max-width: 991px) {
    .navbar .navbar-brand {
        width: 160px;
        margin: 5px auto;
    }

    .navbar .nav_all_btn {
        width: 100%;
    }

    .navbar .nav_other_box {
        /* justify-content: center;
        margin-top: 10px; */
        margin-top: 10px;
    }

    .header .navbar .small-btn-box {
        margin-bottom: 0px;
    }

    .navbar .search {
        margin-right: 0px;
    }

    .navbar .search-area {
        width: 100%;
        background: #ebeef1;
        padding: 15px 20px;
    }

    .navbar .search_box input {
        width: calc(100% - 32px);
        padding: 8px;
    }

    .navbar .nav_other_box .cart_link_btn {
        width: 30px;
        height: 30px;
        background: url("../images/all/cart_link.png") no-repeat 99% center;
        background-size: 230px;
        opacity: 0.9;
    }

    .banner .slick-dots {
        bottom: 5px;
    }

    .banner .slick .slick-arrow {
        width: 22px;
        height: 40px;
        margin: 0px 5px;
    }

    .banner .item {
        background-size: unset;
        height: unset;
    }

    .main .side .wid {
        margin-top: 0;
    }


    body.search .main .content > .bg {
        padding-top: 0;
    }


    .my_title {
        font-size: 22px;
        margin-bottom: 20px;
    }

    .service_flex_box .service_box .service_info a {
        padding: 16px 25px;
    }

    .service_flex_box .service_box .service_info .service_title {
        font-size: 22px;
        margin-bottom: 12px;
    }

    .service_flex_box .service_box .service_info .service_text {
        font-size: 15px;
        line-height: 22px;
        padding-right: 25px;
        margin-bottom: 10px;
    }

    .gallery-list .item .title {
        font-size: 22px;
        margin-bottom: 10px;
    }

    .gallery-list .item .info-box {
        font-size: 15px;
        line-height: 1.5em;
    }

    .gallery-list[data-mode=mode2] .item .title {
        font-size: 22px;
        margin-bottom: 10px;
    }

    .gallery-list[data-mode=mode2] .item .item-info {
        padding: 16px 25px;
    }

        .gallery-list[data-mode=mode2] .item .item-info .pic {
            flex: 0 0 180px;
        }

    .gallery-list[data-mode=mode2] .item .info {
        padding: 0 0 0 20px;
    }


    .bg.pro_news_bg {
        padding-top: 0px;
    }

    .pro_news_box {
        padding: 25px;
        margin-bottom: 20px;
    }

        .pro_news_box .pro_news_info .pro_news_title {
            font-size: 20px;
            margin-bottom: 5px;
        }

        .pro_news_box .pro_news_info .pro_news_text {
            font-size: 15px;
            /* -webkit-line-clamp: 3; */
            line-height: 22px;
        }

        .pro_news_box .pro_news_pic {
            width: calc(52% - 25px);
            margin-right: 25px;
        }

        .pro_news_box:nth-child(even) .pro_news_pic {
            margin-left: 25px;
        }

        .pro_news_box .pro_news_pic iframe {
            height: 11rem;
        }

    .pro_news.reverse .pro_news_box:nth-child(even) .pro_news_pic {
        margin-right: 0;
    }

    .pro_news.reverse .pro_news_box:nth-child(odd) .pro_news_pic {
        margin-left: 0;
    }


    .more_btn {
        font-size: 16px;
    }

    .footer .footer_content {
        padding: 40px 0px 20px;
    }

    .footer_flex_box {
        margin: 30px auto 20px;
    }

    .footer_sitemap_flex {
        width: 100%;
        justify-content: center;
        margin-bottom: 10px;
        /* border-top: 1px #d3d3d3 solid; */
        border-bottom: 1px #d3d3d3 solid;
        padding: 0px 0px 30px;
        /* order: -1; */
    }

        .footer_sitemap_flex .footer_sitemap {
            margin: 0px;
            text-align: center;
        }

    .footer_text {
        padding-left: 30px;
        width: calc(100% - 205px);
    }

    .copyright_box {
        margin-right: 0px;
        position: unset;
        width: 100%;
        text-align: center;
        padding: 10px 0px;
        bottom: 0px;
    }
}

@media (max-width: 767px) {
    .navbar .navbar-brand {
        width: 160px;
        margin: 5px 0px;
    }

    .header .navbar {
        padding: 0 15px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-content: center;
    }

        .header .navbar > .container {
            width: unset;
            margin: unset;
            max-width: 100%;
        }

        .header .navbar .small-btn-box {
            order: 1;
            padding: 0px 10px;
        }

    .navbar .nav_other_box {
        margin: 0px;
        margin-right: 5px;
        width: calc(100% - 28px);
    }

    .navbar-toggler {
        width: 28px;
        height: 22px;
    }

        .navbar-toggler .navbar-toggler-icon,
        .navbar-toggler .navbar-toggler-icon::after,
        .navbar-toggler .navbar-toggler-icon::before {
            height: 2px;
        }

    .bsnav-mobile.full .navbar {
        transform: scale(1);
        background: #FFFFFF;
    }

    .bsnav-mobile.full.in .navbar {
        background: rgba(255, 255, 255, 0.95);
        display: flex;
    }

    .is_scroll .header .bsnav-mobile .navbar {
        background: rgba(255, 255, 255, 0.95);
    }

    .bsnav-mobile.full .navbar-nav .nav-item .navbar-nav {
        background: unset;
        font-size: 14px;
        padding: 0;
        bottom: 0;
        overflow-y: scroll;
        background: rgba(0,0,0,.03);
    }

    .bsnav-mobile.full .navbar-nav .nav-item.in .navbar-nav {
        margin-bottom: 15px;
    }

    .bsnav-mobile.full .navbar-nav .nav-item .nav-link {
        color: var(--second-color);
    }

    .bsnav-mobile.full .navbar-nav .nav-item:hover > .nav-link {
        color: var(--main-color);
    }

    .bsnav-mobile.full .navbar-nav .nav-item .nav-link .title-main {
        font-size: 16px;
    }

    .nav-item .caret {
        margin-left: 7px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        border: 0;
        width: 13px;
        height: 13px;
        font-size: 13px;
        transition: all ease .3s;
    }

        .nav-item .caret::before {
            content: "\f282";
            font-family: bootstrap-icons !important;
            line-height: 1;
            font-weight: 700;
        }

    .nav-item.in > .nav-link > .caret {
        transform: translateY(-50%) scaleY(-1);
    }

    .bsnav-mobile .navbar-nav .nav-item .nav-link {
        padding: 10px 0;
    }

    .bsnav-mobile .navbar-nav .nav-item .navbar-nav .nav-link {
        padding: 10px 0;
        color: #878787;
    }

    .bsnav-mobile .navbar .navbar-mobile-wrapper {
        max-height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
        width: 100%;
        height: 100%;
        text-align: center;
        padding-top: 30px;
    }

        .bsnav-mobile .navbar .navbar-mobile-wrapper .navbar-brand {
            margin: 0px 0px 10px;
            width: 180px;
            height: 45px;
        }

    .bsnavclose.close-btn {
        width: 25px;
        height: 25px;
        right: 14px;
        top: 13px;
    }

        .bsnavclose.close-btn img {
            max-width: 100%;
        }

    .bsnav-mobile .nav-1 {
        transition: .3s;
        height: calc(100% - 50px);
    }

    .nav-1 {
        position: relative;
    }

    .bsnav-mobile {
    }

        .bsnav-mobile .sub_in {
            transform: translate(-100%, 0px);
        }

    .sub_in_all_btn {
        position: absolute;
        top: 0px;
        left: 100%;
    }

    .sub_in_close {
        padding: 12px 0px;
        color: #878787;
        border-top: 1px #cccccc solid;
        border-bottom: 1px #cccccc solid;
        margin: 0 0 10px;
        background: #e6e6e6;
        position: sticky;
        top: 0;
        z-index: 1;
    }

        .sub_in_close a {
            position: relative;
            transition: .3s;
        }

            .sub_in_close a:hover {
                color: var(--main-color);
            }

            .sub_in_close a::before {
                content: "\F284";
                font-family: bootstrap-icons !important;
                line-height: 1;
                position: absolute;
                top: 50%;
                transform: translate(0px, -50%);
                font-size: .8em;
                left: -20px;
            }

    .search-section {
        padding: 40px 0 15px;
    }

        .search-section.more-gap {
            padding: 65px 0 45px;
        }

        .search-section .h1 {
            font-size: 1.75rem;
        }

            .search-section .h1 .title {
            }

            .search-section .h1 .sub {
                font-size: 1rem;
            }

        .search-section .search_box input {
            font-size: 1rem;
            height: 56px;
            padding: 5px 10px;
            padding-right: 45px;
        }

        .search-section .search_box .btn_search {
            width: 20px;
            right: 15px;
        }

    .my_title {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .service_flex_box .service_box .service_info a {
        padding: 15px 20px;
    }

    .service_flex_box .service_box .service_info .service_title {
        font-size: 20px;
        margin-bottom: 10px;
    }

    .service_flex_box .service_box .service_info .service_text {
        font-size: 14px;
        line-height: 20px;
        padding-right: 0px;
        /* margin-bottom: 5px; */
    }

    .service_flex_box .service_box .service_info .service_arrow {
        display: none;
    }

    .pro_news_box {
        padding: 0px;
    }

        .pro_news_box .pro_news_info .pro_news_title {
            font-size: 18px;
            line-height: 25px;
        }

        .pro_news_box .pro_news_info .pro_news_text {
            font-size: 14px;
            -webkit-line-clamp: 2;
            line-height: 20px;
        }

        .pro_news_box .pro_news_pic {
            width: 50%;
            margin-right: 0px;
        }

        .pro_news_box.pic_right .pro_news_pic {
            margin-left: 0;
        }

        .pro_news_box:nth-child(even) .pro_news_pic {
            margin-left: 0px;
        }

        .pro_news_box .pro_news_pic iframe {
            height: 9rem;
        }

        .pro_news_box .pro_news_info {
            width: 50%;
            padding: 17px 20px;
        }

            .pro_news_box .pro_news_info .more_btn {
                display: none;
            }

    .gallery-list .item .title {
        font-size: 18px;
        line-height: 1.4em;
        height: 4.2em;
    }

    .gallery-list[data-mode=mode1] .item .info .title {
        height: 4.2em;
    }

    .gallery-list[data-mode=mode2] .item .title {
        font-size: 18px;
        line-height: 1.4em;
    }

    .gallery-list[data-mode=mode2] .item .info {
        padding: 5px 10px 5px 15px;
    }

    .gallery-list[data-mode=mode2] .item .item-info {
        padding: 10px;
    }

    .footer_flex_box {
        margin: 30px auto;
    }

    .footer_logo {
        width: 160px;
    }

    .footer_text {
        width: calc(100% - 190px);
    }

    .footer_sitemap_flex {
        padding: 10px 0px;
    }

        .footer_sitemap_flex .footer_sitemap {
            flex: 0 0 33.333333%;
            width: 33.333333%;
            padding: 0px 8px;
            margin-bottom: 25px;
        }

            .footer_sitemap_flex .footer_sitemap a.sitemap_title {
                font-size: 15px;
            }

            .footer_sitemap_flex .footer_sitemap a {
                font-size: 13px;
                line-height: 20px;
            }

            .footer_sitemap_flex .footer_sitemap ul li {
                display: table;
                margin: 0 auto;
            }

    .copyright_box {
        border-top: 1px #d3d3d3 solid;
    }
}

@media (max-width: 575px) {
    .header .navbar > .container {
        padding: 0px 5px;
    }

    .navbar .navbar-brand {
        width: 142px;
        height: 40px;
    }

    .bsnav-mobile .navbar .navbar-mobile-wrapper .navbar-brand {
        width: 160px;
        height: 40px;
    }

    .header .navbar .small-btn-box {
        padding: 0px 5px;
    }

    .navbar .search {
        margin-right: 0px;
    }

    .navbar .btn-search {
        /* width: 28px;
        height: 28px; */
    }

    .navbar .nav_other_box {
        /* padding: 0px; */
        margin-right: 0px;
    }

    .banner .slick .slick-arrow {
        width: 18px;
        height: 30px;
        margin: 0px 0px;
    }

    .banner .slick .slick-next {
        right: 2%;
    }

    .banner .slick .slick-prev {
        left: 2%;
    }

    .wid-float-section ul li a {
        width: 4em;
        height: 4em;
    }

        .wid-float-section ul li a .icon {
            font-size: 24px;
        }

    .service_flex_box .service_box .service_info a {
        padding: 15px 3vw;
    }

    .service_flex_box .service_box:first-child {
        margin-right: 10px;
    }

    .service_flex_box .service_box {
        width: calc(50% - 5px);
    }

    .pro_news_box .pro_news_pic iframe {
        height: 27vw;
    }

    .gallery-list .item .title {
        font-size: 16px;
        margin-bottom: 5px;
    }

    .gallery-list .item .info-box {
        font-size: 14px;
    }

        .gallery-list .item .info-box .label {
            width: 4em;
            margin-right: 5px;
            flex: 0 0 4em;
        }

    .gallery-list[data-mode=mode2] .item .title {
        font-size: 16px;
        margin-bottom: 5px;
    }

    .gallery-list[data-mode=mode2] .item .item-info {
        padding: 5px;
    }

        .gallery-list[data-mode=mode2] .item .item-info .pic {
            flex: 0 0 150px;
        }

    .gallery-list[data-mode=mode2] .item .info {
        padding: 0 0 0 10px;
    }

    .gallery-list.related[data-mode=mode2] .item .item-info .pic {
        flex: 0 0 100px;
    }

    .gallery-list.series .item .info-box .label {
        width: 6em;
        flex: 0 0 6em;
    }

    .search .gallery-list .item .info-box .label {
        width: 6em;
        flex: 0 0 6em;
    }

    .download-list li.title {
        display: none;
    }

        .download-list li.title ~ li {
            margin-top: 0;
            padding-top: 0;
            border-top: 0;
        }

    .footer .footer_content {
        padding: 30px 0px 0px;
    }

    .footer_text {
        width: 100%;
        text-align: center;
        padding-left: 0px;
    }

    .footer_logo {
        width: 160px;
        margin: 0px auto 5px;
    }

    .footer_text .footer_title {
        margin-bottom: 5px;
    }

    .footer_text .footer_s_text {
        display: block;
        margin-right: 0px;
    }

    .footer_sitemap_flex .footer_sitemap {
        flex: 0 0 50%;
        width: 50%;
        margin-bottom: 20px;
    }
}

@media (max-width: 480px) {
    .service_flex_box .service_box {
        width: 100%;
        margin-bottom: 20px;
    }

        .service_flex_box .service_box:last-child {
            margin-bottom: 0px;
        }

        .service_flex_box .service_box:first-child {
            margin-right: 0px;
        }

        .service_flex_box .service_box .service_info a {
            padding: 16px 5vw;
        }

    .pro_news_box {
        flex-wrap: wrap;
        padding: 25px 6vw;
    }

        .pro_news_box .pro_news_pic {
            width: 100%;
        }

        .pro_news_box:nth-child(even) .pro_news_pic {
            order: unset;
        }

        .pro_news_box .pro_news_pic iframe {
            height: 46vw;
        }

        .pro_news_box .pro_news_info {
            width: 100%;
            padding: 15px 0px 0px;
            order: 2;
        }

            .pro_news_box .pro_news_info .pro_news_title {
                font-size: 20px;
            }

    .pro_news.reverse .pro_news_box:nth-child(even) .pro_news_pic {
        order: 1;
    }

    .pro_news.reverse .pro_news_box:nth-child(odd) .pro_news_pic {
        order: 1;
    }

    .gallery-list[data-mode=mode1].two_col .item .item-info {
        flex-wrap: wrap;
    }

    .gallery-list[data-mode=mode1].two_col .item .pic {
        flex: 1 1 100%;
    }

    .gallery-list[data-mode=mode1].two_col .item .info {
        margin-left: 0;
    }

    .tab-area .tab-title a {
        font-size: .815rem;
        padding: 6px 10px 4px;
    }

    .function-bar .filter-item .filter-btn-area small {
        display: none;
    }
}

@media (max-width: 375px) {
    .gallery-list[data-mode=mode2] .item .item-info {
        flex-wrap: wrap;
    }

        .gallery-list[data-mode=mode2] .item .item-info .pic {
            flex: 1 1 100%;
        }

    .gallery-list[data-mode=mode2] .item .info {
        padding: 10px;
    }

    .gallery-list.related[data-mode=mode2] .item .item-info .pic {
        flex: 1 1 100%;
    }
}
