body, .bg {
    /*background-image: url(../images/bg_img.jpg);*/
    background-color:#fff;
    background-position: center center, center center;
    background-repeat: repeat, repeat;
}



.topnav {
    overflow: hidden;
    /*background-color: #333;*/
}

    .topnav a {
        float: left;
        display: block;
        color: #000;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        font-size: 16px;
    }

.active {
    /*background-color: #04AA6D;*/
    color: #000;
    /*border-bottom: 2px solid #ffc107;*/
}

.topnav .icon {
    display: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

    .dropdown .dropbtn {
        font-size: 16px;
        border: none;
        outline: none;
        color: #000;
        padding: 14px 16px;
        background-color: inherit;
        font-family: inherit;
        margin: 0;
    }

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;

}

    .dropdown-content a {
        float: none;
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        text-align: left;
        font-size:15px;

    }

.topnav a:hover, .dropdown:hover .dropbtn {
    color: #000;
    border-bottom: 2px solid #ffc107;

}

.dropdown-content a:hover {

    color: black;
}

.dropdown:hover .dropdown-content {
    display: block;
}

@media screen and (max-width: 600px) {
    .topnav a:not(:first-child), .dropdown .dropbtn {
        display: none;
    }

    .topnav a.icon {
        float: right;
        display: block;
    }
    .nav-tabs .nav-link {
        padding: 10px;
    }
}

@media screen and (max-width: 600px) {
    .topnav.responsive {
        position: relative;
    }

        .topnav.responsive .icon {
            position: absolute;
            right: 0;
            top: 0;
        }

        .topnav.responsive a {
            float: none;
            display: block;
            text-align: left;
        }

        .topnav.responsive .dropdown {
            float: none;
        }

        .topnav.responsive .dropdown-content {
            position: relative;
        }

        .topnav.responsive .dropdown .dropbtn {
            display: block;
            width: 100%;
            text-align: left;
        }
}

.banner-bg {
    position: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-position: bottom;
    height: 500px;
}

.mask_img {
    height: 250px;
    width: calc(100% + 98px);
    background: url(../images/banner_mask04.png) no-repeat;
    margin-top: -170px;
    background-size: Contain;
}

.mask_img2 {
    height: 150px;
    width: calc(100% + 98px);
    background: url(../images/banner_mask05-1.png) repeat-x;
    background-size: cover;
    margin: -50px 0 0 -50px;
}


.featured_block {
    padding: 80px 0px 0px 0px;
    background: url(../images/bg_img04.jpg) no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.recommend_block {
    content: "";

    width: 100%;
    background: url(../images/banner_mask05-1.png) no-repeat;
    background-size: cover;
    bottom: -100px;
}
    /*banner文字*/

    .logo {
    float: right;
    margin: 10px 20px 0 20px;
}

.menu {
    float: left;
    margin: 10px 0px 0 20px;
}
@media (max-width:1680px) {
    .mask_img {
        background-size: cover;
        background-position-x: 50%;
        background-position-y: 100%;
        width: 100%;
    }
}
@media (max-width:580px) {
    .mask_img {
        height: 230px;

        background: url(../images/banner_mask04.png) no-repeat;
        margin-top: -70px;
        /*background-size: Contain;*/
        overflow:hidden;
    }

    .mask_img2 {
        height: 150px;
        width: calc(100% + 98px);
        background: url(../images/banner_mask05-1.png) repeat-x;
        background-size: cover;
        margin: -50px 0 0 -50px;

    }

    }

/*footer*/
@media (min-width:990px) {
    .logo {
        float: left;
    }
    .menu {
        float: right;
        margin: 10px 30px 0 0;
    }
}

.accordion {
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    /*font-size: 15px;*/
    transition: 0.4s;
}

.menu_line {
    color: #444;
    font-size: 15px;
    cursor: pointer;
    padding: 5px 0px 5px 20px;
    width: 100%;
    transition: 0.4s;
}

.panel {
    padding: 0 18px 5px;
    display: none;

    overflow: hidden;
}

.categaty-w-bg {
    color: rgba(0, 0, 0, 0.8);
    animation-name: example;
    animation-duration: 2s;
}

.t-D-none {
text-decoration:none;
}

.p-menu {
padding:30px 10px 0 10px;
}

.txt1 {
    font-size: 40px;
    letter-spacing: 4px;
    font-family: 'Noto Sans TC', sans-serif;
    color: #7c3114;
    margin-top: 0px !important;
    font-weight: bold;
    line-height: 55px
}

.txt2 {
    font-size: 15px;
    color: #888;
    line-height: 1.5;
    Letter-spacing: 1.5px;
}

    .btn-cafe {
        color: #fff;
        background-color: #553527;
        border-color: #7a452d;
    }

        .btn-cafe:hover {
            color: #fff;
            background-color: #a45e22;
            border-color: #553527;
        }

    article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
        display: block
    }


    .RWDmenu_plus02 ol, .RWDmenu_plus02 ul {
        list-style: none;
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline
    }

    blockquote, q {
        quotes: none
    }

        blockquote:after, blockquote:before, q:after, q:before {
            content: '';
            content: none
        }

    .RWDmenu_plus02 table {
        border-collapse: collapse;
        border-spacing: 0
    }

    *, ::after, ::before {
        box-sizing: border-box
    }

    html {
        font-size: 100%
    }

    body {
        font-size: 16px;
        font-family: sans-serif;
        color: #2e3233;
        background-color: #fff;
        font-family: 微軟正黑體,Microsoft JhengHei,MingLiU,arial,verdana,helvetica,tahoma,Sans-serif
    }

    @media (max-width:1199px) {
        body.overflow-hidden {
            overflow: hidden
        }
    }

    .RWDmenu_plus02 a {
        color: #69aa6f;
        text-decoration: none
    }

    .RWDmenu_plus02 img {
        max-width: 100%
    }

    .RWDmenu_plus02 input {
        font-family: sans-serif;
        font-size: 1.6rem
    }

        .RWDmenu_plus02 input[type=search]::-ms-clear {
            display: none
        }

    input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration {
        display: none
    }

    header {
        position: relative !important;
        border-bottom: none !important
    }

    .cd-main-content, .cd-main-header {
        position: relative;
        -webkit-transition: -webkit-transform .3s;
        transition: transform .3s
    }

    .cd-main-header {
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
        will-change: transform
    }

    .cd-main-header {
        position: relative;
        -webkit-transition: -webkit-transform .3s;
        transition: transform .3s
    }

    @media (max-width:1199px) {
        .cd-main-content.nav-is-visible, .cd-main-header.nav-is-visible {
            -webkit-transform: translateX(-260px);
            -moz-transform: translateX(-260px);
            -ms-transform: translateX(-260px);
            -o-transform: translateX(-260px);
            transform: translateX(-260px)
        }

        .nav-on-left .cd-main-content.nav-is-visible, .nav-on-left .cd-main-header.nav-is-visible {
            -webkit-transform: translateX(260px);
            -moz-transform: translateX(260px);
            -ms-transform: translateX(260px);
            -o-transform: translateX(260px);
            transform: translateX(260px)
        }

        .wrapper_bg.is-visible .cd-main-header {
            -webkit-transition: -webkit-transform .5s;
            transition: transform .5s
        }
    }

    .cd-main-content {
        z-index: 10
    }

    .cd-main-header {
        height: 50px;
        background: #fff;
        z-index: 11;
        left: 0
    }

    .nav-is-fixed .cd-main-header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }

    @media (min-width:1200px) {
        .cd-main-header {
            height: 80px
        }

            .cd-main-header::after {
                clear: both;
                content: "";
                display: table
            }
    }

    .cd-logo {
        position: absolute;
        top: 12px;
        left: 5%
    }

        .cd-logo img {
            display: block
        }

    @media (max-width:1199px) {
        .nav-on-left .cd-logo {
            left: auto;
            right: 5%
        }
    }

    @media (min-width:1200px) {
        .cd-logo {
            top: 26px;
            left: 4em
        }
    }

    .cd-header-buttons {
        position: absolute;
        display: inline-block;
        top: 3px;
        right: 5%;
        padding-left: 0
    }

        .cd-header-buttons li {
            display: inline-block;
            margin-top: 2px
        }

    @media (max-width:1199px) {
        .nav-on-left .cd-header-buttons {
            right: auto;
            left: 5%
        }

            .nav-on-left .cd-header-buttons li {
                float: right
            }
    }

    @media (min-width:1200px) {
        .cd-header-buttons {
            top: 18px;
            right: 4em
        }
    }

    .cd-nav-trigger, .cd-search-trigger {
        position: relative;
        display: block;
        width: 44px;
        height: 44px;
        overflow: hidden;
        white-space: nowrap;
        color: transparent;
        z-index: 3
    }

        .cd-search-trigger::after, .cd-search-trigger::before {
            content: '';
            position: absolute;
            -webkit-transition: opacity .3s;
            transition: opacity .3s;
            -webkit-transform: translateZ(0);
            -moz-transform: translateZ(0);
            -ms-transform: translateZ(0);
            -o-transform: translateZ(0);
            transform: translateZ(0);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden
        }

        .cd-search-trigger::before {
            top: 11px;
            left: 11px;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            border: 3px solid #2e3233
        }

        .cd-search-trigger::after {
            height: 3px;
            width: 8px;
            background: #2e3233;
            bottom: 14px;
            right: 11px;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .cd-search-trigger span {
            position: absolute;
            height: 100%;
            width: 100%;
            top: 0;
            left: 0
        }

            .cd-search-trigger span::after, .cd-search-trigger span::before {
                content: '';
                position: absolute;
                display: inline-block;
                height: 3px;
                width: 22px;
                top: 50%;
                margin-top: -3px;
                left: 50%;
                margin-left: -11px;
                background: #2e3233;
                opacity: 0;
                -webkit-transform: translateZ(0);
                -moz-transform: translateZ(0);
                -ms-transform: translateZ(0);
                -o-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                -webkit-transition: opacity .3s,-webkit-transform .3s;
                transition: opacity .3s,transform .3s
            }

            .cd-search-trigger span::before {
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                transform: rotate(45deg)
            }

            .cd-search-trigger span::after {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                transform: rotate(-45deg)
            }

        .cd-search-trigger.search-is-visible::after, .cd-search-trigger.search-is-visible::before {
            opacity: 0
        }

        .cd-search-trigger.search-is-visible span::after, .cd-search-trigger.search-is-visible span::before {
            opacity: 1
        }

        .cd-search-trigger.search-is-visible span::before {
            -webkit-transform: rotate(135deg);
            -moz-transform: rotate(135deg);
            -ms-transform: rotate(135deg);
            -o-transform: rotate(135deg);
            transform: rotate(135deg)
        }

        .cd-search-trigger.search-is-visible span::after {
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .cd-nav-trigger span, .cd-nav-trigger span::after, .cd-nav-trigger span::before {
            position: absolute;
            display: inline-block;
            height: 3px;
            width: 24px;
            background: #2e3233
        }

        .cd-nav-trigger span {
            position: absolute;
            top: 50%;
            right: 10px;
            margin-top: -2px;
            -webkit-transition: background .3s .3s;
            transition: background .3s .3s
        }

            .cd-nav-trigger span::after, .cd-nav-trigger span::before {
                content: '';
                right: 0;
                -webkit-transform: translateZ(0);
                -moz-transform: translateZ(0);
                -ms-transform: translateZ(0);
                -o-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                -webkit-transform-origin: 0 50%;
                -moz-transform-origin: 0 50%;
                -ms-transform-origin: 0 50%;
                -o-transform-origin: 0 50%;
                transform-origin: 0 50%;
                -webkit-transition: -webkit-transform .3s .3s;
                transition: transform .3s .3s
            }

            .cd-nav-trigger span::before {
                top: -6px
            }

            .cd-nav-trigger span::after {
                top: 6px
            }

        .cd-nav-trigger.nav-is-visible span {
            background: rgba(46,50,51,0)
        }

            .cd-nav-trigger.nav-is-visible span::after, .cd-nav-trigger.nav-is-visible span::before {
                background: #2e3233
            }

            .cd-nav-trigger.nav-is-visible span::before {
                -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg);
                -moz-transform: translateX(4px) translateY(-3px) rotate(45deg);
                -ms-transform: translateX(4px) translateY(-3px) rotate(45deg);
                -o-transform: translateX(4px) translateY(-3px) rotate(45deg);
                transform: translateX(4px) translateY(-3px) rotate(45deg)
            }

            .cd-nav-trigger.nav-is-visible span::after {
                -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg);
                -moz-transform: translateX(4px) translateY(2px) rotate(-45deg);
                -ms-transform: translateX(4px) translateY(2px) rotate(-45deg);
                -o-transform: translateX(4px) translateY(2px) rotate(-45deg);
                transform: translateX(4px) translateY(2px) rotate(-45deg)
            }

    @media (min-width:1200px) {
        .cd-nav-trigger {
            display: none
        }
    }

    .cd-primary-nav, .cd-primary-nav ul {
        position: fixed;
        top: 0;
        right: 0;
        width: 260px;
        margin: 0;
        background: #2e3233;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        z-index: 99;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: -webkit-transform .5s;
        transition: transform .5s
    }

        .cd-primary-nav ul::-webkit-scrollbar, .cd-primary-nav::-webkit-scrollbar {
            width: 5px
        }

        .cd-primary-nav ul::-webkit-scrollbar-track, .cd-primary-nav::-webkit-scrollbar-track {
            background: 0 0
        }

        .cd-primary-nav ul::-webkit-scrollbar-thumb, .cd-primary-nav::-webkit-scrollbar-thumb {
            background: rgba(0,0,0,.2);
            border-radius: 3px
        }

            .cd-primary-nav ul::-webkit-scrollbar-thumb:hover, .cd-primary-nav::-webkit-scrollbar-thumb:hover {
                background: rgba(0,0,0,.6)
            }

        .cd-primary-nav a, .cd-primary-nav ul a {
            display: block;
            padding: 0 20px;
            color: #2d2d2d;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            border-bottom: 1px solid #ececec;
            -webkit-transform: translateZ(0);
            -moz-transform: translateZ(0);
            -ms-transform: translateZ(0);
            -o-transform: translateZ(0);
            transform: translateZ(0);
            will-change: transform,opacity;
            -webkit-transition: -webkit-transform .3s,opacity .3s;
            transition: transform .3s,opacity .3s
        }

    @media (max-width:1199px) {
        .cd-primary-nav a, .cd-primary-nav ul a {
            padding: 0;
            font-size: 16px
        }
    }

    .cd-primary-nav .cd-secondary-nav {
        display: none;
        width: 100%;
        max-width: 360px
    }

        .cd-primary-nav .cd-secondary-nav ul li.active > a {
            background-color: #9c9c9c;
            color: #fff
        }

    .cd-primary-nav.nav-is-visible .cd-secondary-nav a {
        height: 60px;
        line-height: 60px
    }

    .cd-primary-nav .social-select .cd-secondary-nav a * + span {
        margin-left: 15px
    }

    .cd-primary-nav ul.is-hidden, .cd-primary-nav.is-hidden {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }

    .cd-primary-nav ul.moves-out > li > a, .cd-primary-nav.moves-out > li > a {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0;
        transition: transform .3s,opacity .1s !important
    }

    @media (max-width:1199px) {
        .nav-on-left .cd-primary-nav, .nav-on-left .cd-primary-nav ul {
            right: auto;
            left: 0
        }
    }

    .cd-primary-nav .see-all a {
        color: #69aa6f
    }

    .cd-primary-nav .cd-nav-gallery .cd-nav-item, .cd-primary-nav .cd-nav-icons .cd-nav-item {
        height: 80px;
        line-height: 80px
    }

        .cd-primary-nav .cd-nav-gallery .cd-nav-item h3, .cd-primary-nav .cd-nav-icons .cd-nav-item h3 {
            overflow: hidden;
            text-overflow: ellipsis
        }

    .cd-primary-nav .cd-nav-gallery .cd-nav-item {
        padding-left: 90px
    }

        .cd-primary-nav .cd-nav-gallery .cd-nav-item img {
            position: absolute;
            display: block;
            height: 40px;
            width: auto;
            left: 20px;
            top: 50%;
            margin-top: -20px
        }

    .cd-primary-nav .cd-nav-icons .cd-nav-item {
        padding-left: 75px
    }

        .cd-primary-nav .cd-nav-icons .cd-nav-item p {
            color: #2e3233;
            font-size: 1.3rem;
            display: none
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item::before {
            content: '';
            display: block;
            position: absolute;
            left: 20px;
            top: 50%;
            margin-top: -20px;
            width: 40px;
            height: 40px;
            background-repeat: no-repeat;
            background-position: center center;
            background-size: 40px 40px
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-1::before {
            background-image: url(img/line-icon-1.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-2::before {
            background-image: url(img/line-icon-2.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-3::before {
            background-image: url(img/line-icon-3.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-4::before {
            background-image: url(img/line-icon-4.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-5::before {
            background-image: url(img/line-icon-5.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-6::before {
            background-image: url(img/line-icon-6.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-7::before {
            background-image: url(img/line-icon-7.svg)
        }

        .cd-primary-nav .cd-nav-icons .cd-nav-item.item-8::before {
            background-image: url(img/line-icon-8.svg)
        }

    @media (max-width:1199px) {
        .cd-primary-nav {
            visibility: hidden;
            -webkit-transition: visibility 0s .3s;
            transition: visibility 0s .3s;
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
            transition: all .5s
        }

            .cd-primary-nav.nav-is-visible {
                visibility: visible;
                -webkit-transition: visibility 0s 0s;
                transition: visibility 0s 0s;
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
                transform: translateX(0)
            }
    }

    @media (min-width:1200px) {
        .cd-primary-nav {
            position: static;
            padding: 0 150px 0 0;
            margin-bottom: 0;
            height: auto;
            width: auto;
            float: right;
            overflow: visible;
            background: 0 0
        }

            .cd-primary-nav::after {
                clear: both;
                content: "";
                display: table
            }

            .cd-primary-nav.moves-out > li > a {
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
                transform: translateX(0);
                opacity: 1
            }

            .cd-primary-nav ul {
                position: static;
                width: auto;
                background: 0 0;
                overflow: visible;
                z-index: 3
            }

                .cd-primary-nav ul.is-hidden {
                    -webkit-transform: translateX(0);
                    -moz-transform: translateX(0);
                    -ms-transform: translateX(0);
                    -o-transform: translateX(0);
                    transform: translateX(0)
                }

                .cd-primary-nav ul.moves-out > li > a {
                    -webkit-transform: translateX(0);
                    -moz-transform: translateX(0);
                    -ms-transform: translateX(0);
                    -o-transform: translateX(0);
                    transform: translateX(0);
                    opacity: 1
                }

            .cd-primary-nav > li {
                float: left;
                margin-left: 3em
            }

                .cd-primary-nav > li > a {
                    position: relative;
                    display: inline-block;
                    height: 80px;
                    line-height: 80px;
                    padding: 0 10px;
                    color: #2e3233;
                    overflow: visible;
                    border-bottom: none;
                    -webkit-transition: color .3s,box-shadow .3s;
                    -moz-transition: color .3s,box-shadow .3s;
                    transition: color .3s,box-shadow .3s;
                    padding-left: 0;
                    cursor: pointer
                }

                    .cd-primary-nav > li > a:hover {
                        color: #9c9c9c
                    }

                    .cd-primary-nav > li > a.selected {
                        color: #9c9c9c;
                        box-shadow: inset 0 -2px 0 #69aa6f
                    }

            .cd-primary-nav .go-back, .cd-primary-nav .see-all {
                display: none
            }

            .cd-primary-nav .cd-nav-gallery, .cd-primary-nav .cd-nav-icons, .cd-primary-nav .cd-secondary-nav {
                position: absolute;
                top: 80px;
                width: 100vw;
                background: #fff;
                padding: 48px 64px 130px;
                box-shadow: inset 0 1px 0 #e2e3df,0 3px 6px rgba(0,0,0,.05);
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
                transform: translateX(0)
            }

                .cd-primary-nav .cd-nav-gallery::after, .cd-primary-nav .cd-nav-icons::after, .cd-primary-nav .cd-secondary-nav::after {
                    clear: both;
                    content: "";
                    display: table
                }

                .cd-primary-nav .cd-nav-gallery > .see-all, .cd-primary-nav .cd-nav-icons > .see-all, .cd-primary-nav .cd-secondary-nav > .see-all {
                    display: block;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    height: 80px;
                    width: 100%;
                    overflow: hidden;
                    margin: 0;
                    padding: 0
                }

                    .cd-primary-nav .cd-nav-gallery > .see-all a, .cd-primary-nav .cd-nav-icons > .see-all a, .cd-primary-nav .cd-secondary-nav > .see-all a {
                        position: absolute;
                        width: 100%;
                        height: 100%;
                        top: 0;
                        left: 0;
                        font-size: 2.2rem;
                        font-weight: 700;
                        text-align: center;
                        line-height: 80px;
                        border-top: 1px solid #e2e3df;
                        border-bottom: none;
                        margin: 0;
                        padding: 0
                    }

                        .cd-primary-nav .cd-nav-gallery > .see-all a:hover, .cd-primary-nav .cd-nav-icons > .see-all a:hover, .cd-primary-nav .cd-secondary-nav > .see-all a:hover {
                            background: #2e3233;
                            border-color: #2e3233;
                            color: #fff
                        }

                .cd-primary-nav .cd-secondary-nav > li {
                    width: 23%;
                    float: none;
                    margin-right: 2.66%;
                    overflow: hidden;
                    overflow-x: hidden;
                    -webkit-overflow-scrolling: touch
                }

                    .cd-primary-nav .cd-secondary-nav > li:nth-child(4n+2) {
                        margin-right: 0;
                        border-right: none
                    }

                    .cd-primary-nav .cd-secondary-nav > li > a {
                        color: #69aa6f;
                        font-weight: 700;
                        font-size: 1.6rem;
                        margin-bottom: .6em
                    }

                .cd-primary-nav .cd-secondary-nav a {
                    padding: 0 18% 0 0;
                    color: #2e3233;
                    border-bottom: none;
                    font-size: 1.4rem
                }

                    .cd-primary-nav .cd-secondary-nav a:hover {
                        color: #9c9c9c
                    }

                .cd-primary-nav .cd-secondary-nav ul {
                    -webkit-transform: translateZ(0);
                    -moz-transform: translateZ(0);
                    -ms-transform: translateZ(0);
                    -o-transform: translateZ(0);
                    transform: translateZ(0)
                }

                    .cd-primary-nav .cd-secondary-nav ul ul {
                        position: absolute;
                        top: 0;
                        left: 100%;
                        width: 100%;
                        background: #fff;
                        box-shadow: 0 2px 10px rgba(43,43,43,.36);
                        display: none
                    }

                        .cd-primary-nav .cd-secondary-nav ul ul .go-back {
                            display: none
                        }

                            .cd-primary-nav .cd-secondary-nav ul ul .go-back a {
                                color: transparent
                            }

                        .cd-primary-nav .cd-secondary-nav ul ul .see-all {
                            display: block
                        }

                .cd-primary-nav .cd-secondary-nav .moves-out > li > a {
                    -webkit-transform: translateX(-100%);
                    -moz-transform: translateX(-100%);
                    -ms-transform: translateX(-100%);
                    -o-transform: translateX(-100%);
                    transform: translateX(-100%)
                }

                .cd-primary-nav .cd-nav-gallery li {
                    width: 22%;
                    float: left;
                    margin: 0 4% 40px 0
                }

                    .cd-primary-nav .cd-nav-gallery li:nth-child(4n+2) {
                        margin-right: 0
                    }

                .cd-primary-nav .cd-nav-gallery .cd-nav-item {
                    border-bottom: none;
                    padding: 0;
                    height: auto;
                    line-height: 1.2
                }

                    .cd-primary-nav .cd-nav-gallery .cd-nav-item img {
                        position: static;
                        margin-top: 0;
                        height: auto;
                        width: 100%;
                        margin-bottom: .6em
                    }

                    .cd-primary-nav .cd-nav-gallery .cd-nav-item h3 {
                        color: #69aa6f;
                        font-weight: 700;
                        padding: 0 .4em
                    }

                .cd-primary-nav .cd-nav-icons li {
                    width: 32%;
                    float: left;
                    margin: 0 2% 20px 0
                }

                    .cd-primary-nav .cd-nav-icons li:nth-child(3n+2) {
                        margin-right: 0
                    }

                .cd-primary-nav .cd-nav-icons .cd-nav-item {
                    border-bottom: none;
                    height: 80px;
                    line-height: 1.2;
                    padding: 24px 0 0 85px;
                    position: relative
                }

                    .cd-primary-nav .cd-nav-icons .cd-nav-item:hover {
                        background: #f6f6f5
                    }

                    .cd-primary-nav .cd-nav-icons .cd-nav-item h3 {
                        color: #69aa6f;
                        font-weight: 700
                    }

                    .cd-primary-nav .cd-nav-icons .cd-nav-item p {
                        display: block
                    }

                    .cd-primary-nav .cd-nav-icons .cd-nav-item::before {
                        left: 25px
                    }
    }

    .cd-primary-nav .has-children {
        position: relative
    }

    .go-back a, .has-children > a {
        position: relative
    }

        .go-back a::after, .go-back a::before, .has-children > a::after, .has-children > a::before {
            content: '';
            position: absolute;
            top: 50%;
            margin-top: -1px;
            display: inline-block;
            height: 2px;
            width: 7px;
            background: #464c4e;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden
        }

        .go-back a::before, .has-children > a::before {
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .go-back a::after, .has-children > a::after {
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg)
        }

    @media (min-width:1200px) {
        .go-back a::after, .go-back a::before, .has-children > a::after, .has-children > a::before {
            background: #c9cbc4
        }

        .go-back a:hover::after, .go-back a:hover::before, .has-children > a:hover::after, .has-children > a:hover::before {
            background: #69aa6f
        }
    }

    .has-children > a {
        padding-right: 40px
    }

        .has-children > a::after, .has-children > a::before {
            right: 20px;
            -webkit-transform-origin: 7px 50%;
            -moz-transform-origin: 7px 50%;
            -ms-transform-origin: 7px 50%;
            -o-transform-origin: 7px 50%;
            transform-origin: 7px 50%
        }

    .cd-primary-nav .go-back a {
        padding-left: 40px
    }

        .cd-primary-nav .go-back a::after, .cd-primary-nav .go-back a::before {
            left: 20px;
            -webkit-transform-origin: 1px 50%;
            -moz-transform-origin: 1px 50%;
            -ms-transform-origin: 1px 50%;
            -o-transform-origin: 1px 50%;
            transform-origin: 1px 50%
        }

    @media (min-width:1200px) {
        .has-children > a::after, .has-children > a::before {
            right: 8%
        }

        .cd-primary-nav > .has-children > a {
            padding-right: 30px !important
        }

            .cd-primary-nav > .has-children > a::after, .cd-primary-nav > .has-children > a::before {
                width: 7px;
                margin-top: 1px;
                -webkit-transform-origin: 50% 50%;
                -moz-transform-origin: 50% 50%;
                -ms-transform-origin: 50% 50%;
                -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
                background: #c9cbc4;
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                -webkit-transition: width .3s,-webkit-transform .3s;
                -moz-transition: width .3s,-moz-transform .3s;
                transition: width .3s,transform .3s
            }

            .cd-primary-nav > .has-children > a::before {
                right: 10px
            }

            .cd-primary-nav > .has-children > a::after {
                right: 5px
            }

            .cd-primary-nav > .has-children > a.selected::after, .cd-primary-nav > .has-children > a.selected::before {
                width: 12px;
                background-color: #fff
            }

            .cd-primary-nav > .has-children > a.selected::before {
                -webkit-transform: translateX(5px) rotate(-45deg);
                -moz-transform: translateX(5px) rotate(-45deg);
                -ms-transform: translateX(5px) rotate(-45deg);
                -o-transform: translateX(5px) rotate(-45deg);
                transform: translateX(5px) rotate(-45deg)
            }

            .cd-primary-nav > .has-children > a.selected::after {
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                transform: rotate(45deg)
            }

        .cd-secondary-nav > .has-children > a::after, .cd-secondary-nav > .has-children > a::before {
            display: none
        }

        .cd-primary-nav .go-back a {
            padding-left: 20px
        }

            .cd-primary-nav .go-back a::after, .cd-primary-nav .go-back a::before {
                left: 1px
            }
    }

    .cd-search {
        position: absolute;
        height: 50px;
        width: 100%;
        top: 50px;
        left: 0;
        z-index: 3;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s 0s,visibility 0s .3s;
        -moz-transition: opacity .3s 0s,visibility 0s .3s;
        transition: opacity .3s 0s,visibility 0s .3s
    }

        .cd-search form {
            height: 100%;
            width: 100%
        }

        .cd-search input {
            border-radius: 0;
            border: none;
            background: #fff;
            height: 100%;
            width: 100%;
            padding: 0 5%;
            box-shadow: inset 0 1px 0 #e2e3df,0 3px 6px rgba(0,0,0,.05);
            -webkit-appearance: none;
            -moz-appearance: none;
            -ms-appearance: none;
            -o-appearance: none;
            appearance: none
        }

            .cd-search input::-webkit-input-placeholder {
                color: #c9cbc4
            }

            .cd-search input::-moz-placeholder {
                color: #c9cbc4
            }

            .cd-search input:-moz-placeholder {
                color: #c9cbc4
            }

            .cd-search input:-ms-input-placeholder {
                color: #c9cbc4
            }

            .cd-search input:focus {
                outline: 0
            }

        .cd-search.is-visible {
            opacity: 1;
            visibility: visible;
            -webkit-transition: opacity .3s 0s,visibility 0s 0s;
            -moz-transition: opacity .3s 0s,visibility 0s 0s;
            transition: opacity .3s 0s,visibility 0s 0s
        }

    .nav-is-fixed .cd-search {
        position: fixed
    }

    @media (min-width:1200px) {
        .cd-search {
            height: 120px;
            top: 80px
        }

            .cd-search input {
                padding: 0 2em;
                font-size: 3.2rem;
                font-weight: 300
            }
    }

    .cd-search.full {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        padding: 0 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        height: auto;
        z-index: 99
    }

        .cd-search.full.is-visible {
            z-index: 99999
        }

        .cd-search.full .search-in {
            max-width: 1170px;
            width: 100%;
            position: relative
        }

        .cd-search.full input {
            border-bottom: 1px solid #fff;
            height: auto;
            color: #fff;
            background: 0 0;
            width: 100%;
            font-size: 40px;
            padding: 0 220px 30px 40px;
            letter-spacing: 3px;
            box-shadow: inset 0 0 0 #e2e3df
        }

            .cd-search.full input::-webkit-input-placeholder {
                color: #fff
            }

            .cd-search.full input::-moz-placeholder {
                color: #fff
            }

            .cd-search.full input:-ms-input-placeholder {
                color: #fff
            }

            .cd-search.full input:-moz-placeholder {
                color: #fff
            }

        .cd-search.full .ibtn, .cd-search.full input {
            line-height: 1.5em
        }

        .cd-search.full .btn-box {
            position: absolute;
            top: 0;
            right: 20px
        }

        .cd-search.full .ibtn {
            font-size: 45px;
            position: static;
            padding: 0 20px;
            color: #fff
        }

            .cd-search.full .ibtn:focus {
                outline: 0
            }

        .cd-search.full .ii-search1:before {
            content: "\e918";
            font-family: iicon !important
        }

        .cd-search.full .ii-close1:before {
            content: "\e902";
            font-family: iicon !important
        }

        .cd-search.full .search-close-full {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            padding: 0;
            border: none;
            background: 0 0;
            width: 100%
        }

    @media (max-width:992px) {
        .cd-search.full .btn-box {
            top: 5px
        }

        .cd-search.full .ibtn {
            font-size: 30px;
            padding: 0 15px
        }

        .cd-search.full input {
            font-size: 35px;
            padding: 0 144px 30px 40px
        }
    }

    @media (max-width:767px) {
        .cd-search.full {
            padding: 0 30px
        }

            .cd-search.full .btn-box {
                top: 2px;
                right: 0
            }

            .cd-search.full .ibtn {
                font-size: 20px;
                padding: 0 10px
            }

            .cd-search.full input {
                font-size: 21px;
                letter-spacing: 0;
                padding: 0 94px 20px 10px
            }

        .lang_cn .cd-search.full input, .lang_sg-cn .cd-search.full input, .lang_tw .cd-search.full input {
            font-size: 23px
        }
    }

    @media (max-width:320px) {
        .cd-search.full input {
            font-size: 15px
        }
    }

    .cd-overlay {
        position: fixed;
        z-index: 2;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        cursor: pointer;
        background-color: rgba(105,170,111,.8);
        visibility: hidden;
        opacity: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: opacity .3s 0s,visibility 0s .3s,-webkit-transform .3s 0s;
        -moz-transition: opacity .3s 0s,visibility 0s .3s,-moz-transform .3s 0s;
        transition: opacity .3s 0s,visibility 0s .3s,transform .3s 0s
    }

        .cd-overlay.is-visible {
            opacity: 1;
            visibility: visible;
            -webkit-transition: opacity .3s 0s,visibility 0s 0s,-webkit-transform .3s 0s;
            -moz-transition: opacity .3s 0s,visibility 0s 0s,-moz-transform .3s 0s;
            transition: opacity .3s 0s,visibility 0s 0s,transform .3s 0s
        }

    @media (max-width:1199px) {
        .cd-overlay.is-visible {
            -webkit-transform: translateX(-260px);
            -moz-transform: translateX(-260px);
            -ms-transform: translateX(-260px);
            -o-transform: translateX(-260px);
            transform: translateX(-260px)
        }

        .nav-on-left .cd-overlay.is-visible {
            -webkit-transform: translateX(260px);
            -moz-transform: translateX(260px);
            -ms-transform: translateX(260px);
            -o-transform: translateX(260px);
            transform: translateX(260px)
        }

            .cd-overlay.is-visible.search-is-visible, .nav-on-left .cd-overlay.is-visible.search-is-visible {
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
                transform: translateX(0)
            }
    }

    .no-js .cd-primary-nav {
        position: relative;
        height: auto;
        width: 100%;
        overflow: visible;
        visibility: visible;
        z-index: 2
    }

    .no-js .cd-search {
        position: relative;
        top: 0;
        opacity: 1;
        visibility: visible
    }

    @media (min-width:1200px) {
        .no-js .cd-primary-nav {
            position: absolute;
            z-index: 3;
            display: inline-block;
            width: auto;
            top: 0;
            right: 150px;
            padding: 0
        }

        .no-js .nav-is-fixed .cd-primary-nav {
            position: fixed
        }
    }

    .RWDmenu_plus06 {
        transform: translate(0,0);
        transition: transform ease .3s
    }

    body.is-visible {
        overflow: hidden
    }

    input:focus {
        outline: 0
    }

    @media (min-width:1200px) {
        .RWDmenu_plus02 .inside {
            font-family: 微軟正黑體,Microsoft JhengHei,MingLiU,arial,verdana,helvetica,tahoma,Sans-serif;
            position: fixed;
            width: 100%;
            top: 0;
            z-index: 100;
            background: #fff
        }

            .RWDmenu_plus02 .inside.is-up {
                box-shadow: 1px 1px 15px rgba(43,43,43,.12)
            }
    }

    .RWDmenu_plus02 .inside {
        transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s;
        -moz-transition: all .5s
    }

        .RWDmenu_plus02 .inside.is-push {
            transform: translateX(-360px);
            -o-transform: translateX(-360px);
            -webkit-transform: translateX(-360px);
            -moz-transform: translateX(-360px)
        }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .inside {
            position: static;
            width: auto;
            top: auto;
            background: 0 0
        }
    }

    .RWDmenu_plus02 a {
        text-decoration: none;
        color: #fff
    }

    .RWDmenu_plus02 .container {
        width: 1170px;
        margin: 0 auto;
        position: relative
    }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .container {
            width: 100%;
            padding: 0
        }
    }

    .clearfix {
        display: block;
        clear: both
    }

    .cd-main-content.is-push, .push_by_menu {
        transform: translateX(-300px);
        -o-transform: translateX(-300px);
        -webkit-transform: translateX(-300px);
        -moz-transform: translateX(-300px)
    }

    @media (max-width:1199px) {
        .cd-main-content.nav-is-visible, .cd-main-header.nav-is-visible, .push_by_menu {
            -webkit-transform: translateX(-360px);
            -moz-transform: translateX(-360px);
            -ms-transform: translateX(-360px);
            -o-transform: translateX(-360px);
            transform: translateX(-360px)
        }
    }

    @media (max-width:600px) {
        .cd-main-content.nav-is-visible, .cd-main-header.nav-is-visible, .push_by_menu {
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            transform: translateX(-100%)
        }
    }

    .cd-logo {
        width: 160px;
        float: left;
        position: relative;
        top: auto;
        left: auto;
        margin-top: 20px;
        margin-left: 10px
    }

        .cd-logo img {
            width: 100%
        }

    @media (max-width:1199px) {
        .cd-logo {
            width: 130px;
            margin-top: 8px
        }
    }

    @media (min-width:1200px) {
        .cd-primary-nav {
            position: relative
        }
    }

    @media (max-width:1199px) {
        .cd-primary-nav > .has-children > a::after, .cd-primary-nav > .has-children > a::before {
            display: block
        }
    }

    .cd-primary-nav > li {
        margin-left: 0;
        position: relative;
        letter-spacing: 1px;
        list-style: none
    }

        .cd-primary-nav > li > a {
            padding: 0 20px;
            line-height: 83px;
            letter-spacing: 1px;
            font-size: 14px;
            cursor: pointer
        }

            .cd-primary-nav > li > a:hover {
                color: #9c9c9c;
                transition: all .5s ease;
                -o-transition: all .5s ease;
                -webkit-transition: all .5s ease;
                -moz-transition: all .5s ease
            }

    @media (min-width:1200px) {
        .cd-primary-nav > li > a:hover:after, .cd-primary-nav > li > a:hover:before {
            background-color: #bfbfbf
        }
    }

    @media (max-width:1199px) {
        .cd-primary-nav > li > a {
            font-size: 16px
        }

            .cd-primary-nav > li > a:hover {
                background-color: transparent
            }
    }

    @media (min-width:1200px) {
        .cd-primary-nav > li:after {
            position: absolute;
            display: block;
            bottom: 15px;
            left: 33%;
            right: 33%;
            height: 1px;
            content: "";
            background: 0 0;
            z-index: -1;
            -webkit-transition: all .5s ease;
            -moz-transition: all .5s ease;
            -o-transition: all .5s ease;
            transition: all .5s ease
        }

        .cd-primary-nav > li:hover:after {
            left: 0;
            right: 0;
            background: #9c9c9c;
            z-index: 9999
        }

        .cd-primary-nav > li > a.selected {
            color: #7d7d7d;
            box-shadow: inset 0 -2px 0 transparent;
            background-color: #9c9c9c;
            color: #fff
        }
    }

    @media (max-width:1199px) {
        .cd-primary-nav > li {
            margin: 0 30px
        }

            .cd-primary-nav > li > a {
                line-height: 60px;
                padding: 0;
                height: 60px;
                padding-left: 0
            }
    }

    @media (min-width:1200px) {
        .cd-primary-nav > .has-children > a {
            padding-right: 20px !important
        }

        nav.cd-nav {
            float: right;
            margin-left: 70px;
            font-size: 14px
        }

        .cd-primary-nav {
            float: none;
            padding: 0
        }

            .cd-primary-nav .cd-secondary-nav {
                width: 200px;
                padding: 0;
                left: 0
            }

                .cd-primary-nav .cd-secondary-nav > li {
                    width: 100%;
                    margin-right: 0;
                    border-bottom: 1px solid #efefef
                }

                    .cd-primary-nav .cd-secondary-nav > li:last-child {
                        border: none
                    }

                    .cd-primary-nav .cd-secondary-nav > li > a {
                        font-size: 14px;
                        padding: 8px 15px;
                        margin-bottom: 0;
                        color: #2b2b2b;
                        font-weight: 400;
                        transition: all ease .3s;
                        -o-transition: all ease .3s;
                        -webkit-transition: all ease .3s
                    }

                        .cd-primary-nav .cd-secondary-nav > li.active > a, .cd-primary-nav .cd-secondary-nav > li > a:hover {
                            background-color: #797979;
                            color: #fff
                        }

                .cd-primary-nav .cd-secondary-nav a {
                    padding: 8px 15px;
                    font-size: 14px;
                    color: #737373;
                    transition: all .5s;
                    -o-transition: all .5s;
                    -webkit-transition: all .5s;
                    padding-left: 30px
                }

                    .cd-primary-nav .cd-secondary-nav a:hover {
                        color: #9c9c9c
                    }
    }

    .cd-search button {
        position: absolute;
        right: 10px;
        top: 30px;
        font-size: 18px;
        letter-spacing: 2px;
        border: none;
        box-shadow: none;
        background-image: none;
        background-color: transparent;
        color: #333;
        transition: all .3s ease;
        -o-transition: all .3s ease;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease
    }

    @media (max-width:1199px) {
        .cd-search button {
            top: 17px;
            font-size: 16px
        }
    }

    @media (min-width:1200px) {
        .cd-search {
            height: 80px;
            top: 130px
        }

            .cd-search input {
                font-size: 20px;
                letter-spacing: 1px;
                font-family: 微軟正黑體,"Microsoft JhengHei",MingLiU,arial,verdana,helvetica,tahoma,sans-serif
            }
    }

    @media (max-width:1199px) {
        .cd-search input {
            font-size: 16px;
            letter-spacing: 1px;
            font-family: 微軟正黑體,"Microsoft JhengHei",MingLiU,arial,verdana,helvetica,tahoma,sans-serif
        }
    }

    @media (max-width:1199px) {
        .cd-search {
            position: fixed;
            top: 50px
        }
    }

    .cd-header-buttons {
        position: relative;
        display: block;
        float: right;
        right: 0;
        font-size: 13px
    }

    .RWDmenu_plus02 .sub-nav {
        transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s
    }

        .RWDmenu_plus02 .sub-nav.sub-up {
            margin-top: -50px
        }

    .RWDmenu_plus02 .language-block {
        width: auto;
        height: 30px;
        float: right;
        margin-top: 15px;
        background-color: transparent;
        border-radius: 0;
        position: relative;
        padding: 7px;
        font-size: 13px;
        cursor: pointer;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease;
        letter-spacing: 1px;
        text-align: right;
        float: right
    }

        .RWDmenu_plus02 .language-block a {
            color: #333;
            padding-right: 8px;
            transition: all .3s;
            -o-transition: all .3s;
            -webkit-transition: all .3s
        }

    .fa-angle-down:before {
        display: none
    }

    .RWDmenu_plus02 .language-block:after {
        position: absolute;
        right: 10px;
        transition: all .3s ease;
        -o-transition: all .3s ease;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease
    }

    .RWDmenu_plus02 #lan-02 {
        font-size: 13px;
        margin-top: 12px;
        margin-left: 15px
    }

        .RWDmenu_plus02 #lan-02 a {
            color: #333;
            padding: 0 4px;
            transition: all .3s;
            -o-transition: all .3s;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
            cursor: pointer
        }

            .RWDmenu_plus02 #lan-02 a:hover {
                color: #9c9c9c
            }

    .lang-select {
        position: relative;
        margin: 3px 0 0 15px;
        padding: 0 2px;
        font-size: 13px;
        color: #545454
    }

    @media (max-width:1199px) {
        .lang-select {
            vertical-align: top;
            margin-top: 0
        }
    }

    @media (max-width:767px) {
        .cd-header-buttons .lang-select {
            display: none
        }

        .card-img,
        .card-img-top {
            height: auto;
        }
    }

    .sub-nav .lang-select {
        float: right;
        margin-top: 13px
    }

    .lang-select-label {
        line-height: 40px;
        cursor: pointer
    }

        .lang-select-label:hover {
            color: #9c9c9c
        }

    .cd-main-header .lang-select-label:after {
        content: '';
        width: 8px;
        height: 8px;
        border: 1px solid #c9cbc4;
        border-width: 1px 1px 0 0;
        display: inline-block;
        vertical-align: middle;
        top: 50%;
        right: 0;
        margin-top: -5px;
        margin-left: 2px;
        -webkit-transform: rotate(136deg);
        -ms-transform: rotate(136deg);
        transform: rotate(136deg);
        transition: all .3s ease;
        -o-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -webkit-transition: all .3s ease
    }

    .lang-select-label > * + * {
        margin-left: 3px
    }

    .lang-select-symbol {
        display: inline-block;
        margin-left: 0;
        font-style: normal
    }

    .no-symbol .lang-select-symbol {
        display: none
    }

    .lang-select-label:not(.no-symbol) .lang-select-symbol + * {
        margin-left: 0
    }

    .lang-select-options {
        display: none;
        position: absolute;
        top: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 100;
        background-color: #fff;
        box-shadow: inset 0 1px 0 #e2e3df,0 3px 6px rgba(0,0,0,.05)
    }

        .lang-select-options > li {
            float: left;
            border-bottom: 1px solid #efefef;
            border-right: 1px solid #efefef
        }

        .lang-select-options a {
            display: block;
            width: 169px;
            font-size: 14px;
            text-align: center;
            padding: 8px 15px;
            color: #2b2b2b
        }

            .lang-select-options a:hover {
                background-color: #797979;
                color: #fff
            }

    .fa.ic_lang-select {
        font-size: 16px;
        line-height: 40px
    }

    .ic_lang-select:before {
        content: "\f0ac"
    }

    .lang-select-options .flag-icon + span {
        display: inline-block;
        width: 100%;
        max-width: 85px;
        text-align: left
    }

    .flag-icon + span {
        margin-left: 4px
    }

    .flag-icon {
        background-size: contain;
        background-position: 50%;
        background-repeat: no-repeat;
        position: relative;
        display: inline-block;
        width: 1.33333333em;
        height: 1em;
        vertical-align: middle
    }

        .flag-icon:before {
            content: ""
        }

    .flag-icon-cn {
        background-image: url(/public/img/flag/cn.svg)
    }

    .flag-icon-de {
        background-image: url(/public/img/flag/de.svg)
    }

    .flag-icon-es {
        background-image: url(/public/img/flag/es.svg)
    }

    .flag-icon-french {
        background-image: url(/public/img/flag/fr.svg)
    }

    .flag-icon-hk-cn {
        background-image: url(/public/img/flag/hk.svg)
    }

    .flag-icon-idn {
        background-image: url(/public/img/flag/id.svg)
    }

    .flag-icon-italian {
        background-image: url(/public/img/flag/it.svg)
    }

    .flag-icon-jp {
        background-image: url(/public/img/flag/jp.svg)
    }

    .flag-icon-kh {
        background-image: url(/public/img/flag/kh.svg)
    }

    .flag-icon-kr {
        background-image: url(/public/img/flag/kr.svg)
    }

    .flag-icon-my {
        background-image: url(/public/img/flag/mm.svg)
    }

    .flag-icon-my-cn, .flag-icon-my-en {
        background-image: url(/public/img/flag/my.svg)
    }

    .flag-icon-ru {
        background-image: url(/public/img/flag/ru.svg)
    }

    .flag-icon-sg-cn, .flag-icon-sg-en {
        background-image: url(/public/img/flag/sg.svg)
    }

    .flag-icon-thai {
        background-image: url(/public/img/flag/th.svg)
    }

    .flag-icon-tw {
        background-image: url(/public/img/flag/tw.svg)
    }

    .flag-icon-en {
        background-image: url(/public/img/flag/us.svg)
    }

    .flag-icon-vn {
        background-image: url(/public/img/flag/vn.svg)
    }

    .RWDmenu_plus02 input::-webkit-inner-spin-button, .RWDmenu_plus02 input::-webkit-outer-spin-button {
        -webkit-appearance: none !important;
        margin: 0
    }

    .RWDmenu_plus02 input[type=number] {
        -moz-appearance: textfield
    }

    .fa-angle-down:after, nav.cd-nav .fa-angle-down:after {
        content: "\f107"
    }

    .RWDmenu_plus02 .editor {
        float: right;
        margin-right: 20px;
        margin-top: 21px
    }

    .RWDmenu_plus02 .cart-block, .RWDmenu_plus02 .member-block, .RWDmenu_plus02 .querycar-block {
        float: right;
        margin-top: 10px;
        margin-left: 15px;
        display: block;
        letter-spacing: 1px;
        font-size: 13px;
        position: relative
    }

        .RWDmenu_plus02 .cart-block:hover i {
            color: #9c9c9c
        }

        .RWDmenu_plus02 .cart-block span, .RWDmenu_plus02 .member-block span, .RWDmenu_plus02 .querycar-block span {
            -webkit-transition: all .5s ease;
            -moz-transition: all .5s ease;
            -o-transition: all .5s ease;
            transition: all .5s ease
        }

        .RWDmenu_plus02 .cart-block i.qty {
            color: #6f6f6f;
            font-style: normal;
            background: #fff;
            border-radius: 99em;
            box-shadow: 1px 1px 3px #ccc;
            padding: 0 7px;
            font-size: 12px;
            position: absolute;
            top: -9px;
            right: -15px
        }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .cart-block i.qty {
            font-size: 13px
        }
    }

    .RWDmenu_plus02 .cart-block:hover span, .RWDmenu_plus02 .member-block:hover span, .RWDmenu_plus02 .querycar-block:hover span {
        color: #9c9c9c
    }

    .RWDmenu_plus02 .cart-block:after, .RWDmenu_plus02 .member-block:after, .RWDmenu_plus02 .querycar-block:after {
        position: absolute;
        display: block;
        bottom: -10px;
        left: 33%;
        right: 33%;
        height: 1px;
        content: "";
        background: 0 0;
        z-index: -1;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        -o-transition: all .5s ease;
        transition: all .5s ease
    }

    .RWDmenu_plus02 .cart-block:hover:after, .RWDmenu_plus02 .member-block:hover:after, .RWDmenu_plus02 .querycar-block:hover:after {
        left: 0;
        right: 0;
        background: #9c9c9c;
        z-index: 9999
    }

    .RWDmenu_plus02 .cart-block .ii, .RWDmenu_plus02 .member-block .ii, .RWDmenu_plus02 .querycar-block .ii {
        font-size: 17px
    }

    .RWDmenu_plus02 .cart-block .glyphicon, .RWDmenu_plus02 .member-block .glyphicon, .RWDmenu_plus02 .querycar-block .glyphicon {
        font-size: 14px
    }

    .RWDmenu_plus02 .querycar-block .ii {
        padding-right: 2px
    }

    .RWDmenu_plus02 .cart-block .glyphicon, .RWDmenu_plus02 .cart-block .ii, .RWDmenu_plus02 .member-block .glyphicon, .RWDmenu_plus02 .member-block .ii, .RWDmenu_plus02 .querycar-block .glyphicon, .RWDmenu_plus02 .querycar-block .ii {
        vertical-align: middle
    }

    .RWDmenu_plus02 .cart-block + .querycar-block {
        margin-right: 10px
    }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .cart-block {
            margin-top: 10px;
            margin-right: 20px;
            margin-left: 12px;
            font-size: 14px
        }
    }

    @media (max-width:600px) {
        .RWDmenu_plus02 .cart-block {
            font-size: 18px;
            margin-top: 11px
        }

            .RWDmenu_plus02 .cart-block .ii {
                font-size: 20px
            }
    }

    .RWDmenu_plus02 .cart-block a, .RWDmenu_plus02 .member-block a, .RWDmenu_plus02 .querycar-block a {
        color: #545454;
        cursor: pointer
    }

    .RWDmenu_plus02 .querycar-block {
        font-size: 14px
    }

        .RWDmenu_plus02 .querycar-block:hover i {
            color: #9c9c9c
        }

        .RWDmenu_plus02 .querycar-block i.qty {
            color: #6f6f6f;
            font-style: normal;
            background: #fff;
            border-radius: 99em;
            box-shadow: 1px 1px 3px #ccc;
            padding: 0 7px;
            font-size: 12px;
            position: absolute;
            top: -9px;
            right: -15px
        }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .querycar-block i.qty {
            font-size: 13px
        }

        .RWDmenu_plus02 .querycar-block {
            margin-top: 10px;
            margin-right: 20px;
            margin-left: 12px;
            font-size: 14px
        }
    }

    @media (max-width:600px) {
        .RWDmenu_plus02 .querycar-block {
            font-size: 18px;
            margin-top: 11px
        }

            .RWDmenu_plus02 .querycar-block .ii {
                font-size: 20px
            }
    }

    .RWDmenu_plus02 .member-block.logn-out {
        cursor: pointer;
        margin-left: 5px;
        margin-top: 13px
    }

    .RWDmenu_plus02 .member-block.my-account {
        cursor: pointer
    }

    .RWDmenu_plus02 .member-block.my-account {
        transition: all .5s ease;
        -o-transition: all .5s ease;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease
    }

    .RWDmenu_plus02 .phone-menu {
        float: right
    }

    .hvr-underline-from-center {
        display: inline-block;
        vertical-align: middle;
        -webkit-transform: perspective(1px) translateZ(0);
        transform: perspective(1px) translateZ(0);
        box-shadow: 0 0 1px transparent;
        position: relative;
        overflow: hidden
    }

        .hvr-underline-from-center:before {
            content: "";
            position: absolute;
            z-index: -1;
            left: 50%;
            right: 50%;
            bottom: 0;
            background: #2098d1;
            height: 4px;
            -webkit-transition-property: left,right;
            transition-property: left,right;
            -webkit-transition-duration: .3s;
            transition-duration: .3s;
            -webkit-transition-timing-function: ease-out;
            transition-timing-function: ease-out
        }

        .hvr-underline-from-center:active:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:hover:before {
            left: 0;
            right: 0
        }

    .cd-search-trigger::before {
        top: 11px;
        left: 11px;
        width: 13px;
        height: 13px;
        border-radius: 50%;
        border: 2px solid #2e3233
    }

    .cd-search-trigger::after {
        height: 2px;
        width: 7px;
        background: #2e3233;
        bottom: 18px;
        right: 17px
    }

    .cd-nav-trigger span, .cd-nav-trigger span::after, .cd-nav-trigger span::before {
        height: 2px
    }

    .cd-search-trigger span::after, .cd-search-trigger span::before {
        height: 2px;
        width: 18px
    }

    .cd-nav-trigger.nav-is-visible {
        opacity: 0;
        width: 0
    }

    .cd-overlay {
        background-color: rgba(19,19,19,.87);
        z-index: 99;
        transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        opacity: 0;
        height: 100vh
    }

        .cd-overlay.is-push {
            opacity: 1;
            visibility: visible;
            z-index: 99999;
            transform: translateX(-360px);
            -o-transform: translateX(-360px);
            -webkit-transform: translateX(-360px);
            -moz-transform: translateX(-360px)
        }

    @media (max-width:600px) {
        .cd-overlay.is-push {
            transform: translateX(-100%);
            -o-transform: translateX(-100%);
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%)
        }
    }

    @media (max-width:1199px) {
        .cd-overlay {
            top: 0
        }

            .cd-overlay.is-visible {
                -webkit-transform: translateX(-360px);
                -moz-transform: translateX(-360px);
                -ms-transform: translateX(-360px);
                -o-transform: translateX(-360px);
                transform: translateX(-360px);
                -webkit-transition: opacity .5s 0s,visibility 0s 0s,-webkit-transform .5s 0s;
                -moz-transition: opacity .5s 0s,visibility 0s 0s,-moz-transform .5s 0s;
                transition: opacity .5s 0s,visibility 0s 0s,transform .5s 0s;
                top: 0
            }
    }

    @media (max-width:600px) {
        .cd-overlay.is-visible {
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            transform: translateX(-100%);
            top: 0
        }
    }

    .cd-search {
        z-index: 999
    }

    @media (max-width:1199px) {
        .cd-primary-nav, .cd-primary-nav ul {
            background: #f7f7f7;
            width: 360px;
            padding-top: 30px;
            font-size: 14px;
            padding-left: 0;
            list-style: none;
            bottom: .5px
        }

            .cd-primary-nav ul {
                padding: 0 30px;
                padding-top: 30px
            }

        #cd-primary-nav > li > ul > li.go-back {
            position: relative;
            top: -20px;
            border: none
        }

            #cd-primary-nav > li > ul > li.go-back a {
                border: none
            }

        #cd-primary-nav > li > ul > li > ul > li.go-back {
            position: relative;
            top: -20px
        }

            #cd-primary-nav > li > ul > li > ul > li.go-back a {
                border: none
            }

        #cd-primary-nav > li > ul > li > ul > li > ul > li.go-back {
            position: relative;
            top: -20px
        }

            #cd-primary-nav > li > ul > li > ul > li > ul > li.go-back a {
                border: none
            }
    }

    @media (max-width:600px) {
        #cd-primary-nav > li > ul > li.go-back {
            position: relative;
            top: -60px
        }

        #cd-primary-nav > li > ul > li > ul > li.go-back {
            position: relative;
            top: -60px
        }

        #cd-primary-nav > li > ul > li > ul > li > ul > li.go-back {
            position: relative;
            top: -60px
        }

        #cd-primary-nav > li > ul > li:nth-child(2) {
            margin-top: -37px
        }

        #cd-primary-nav > li > ul > li > ul > li:nth-child(2) {
            margin-top: -37px
        }

        #cd-primary-nav > li > ul > li > ul > li > ul > li:nth-child(2) {
            margin-top: -37px
        }
    }

    @media (max-width:600px) {
        .cd-primary-nav, .cd-primary-nav .cd-secondary-nav, .cd-primary-nav ul {
            width: 100%;
            max-width: none
        }
    }

    .RWDmenu_plus02 .cart-menu {
        position: fixed;
        width: 360px;
        height: 100vh;
        background-color: #fbfbfb;
        z-index: 99999;
        top: 0;
        right: 0;
        transition: all .5s;
        -o-transition: all .5s;
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        transform: translateX(360px);
        -o-transform: translateX(360px);
        -webkit-transform: translateX(360px);
        -moz-transform: translateX(360px)
    }

    @media (max-width:600px) {
        .RWDmenu_plus02 .cart-menu {
            width: 100%;
            transform: translateX(100%);
            -o-transform: translateX(100%);
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%)
        }
    }

    .RWDmenu_plus02 .cart-menu.is-visible {
        transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0)
    }

    .RWDmenu_plus02 .cart-menu .cart-cancel-btn {
        position: absolute;
        top: 40px;
        left: 30px;
        cursor: pointer;
        transition: all .3s ease;
        -o-transition: all .3s ease;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease
    }

        .RWDmenu_plus02 .cart-menu .cart-cancel-btn:hover {
            color: #999
        }

    .RWDmenu_plus02 .cart-menu .title {
        text-align: center;
        width: 85%;
        padding: 40px 10px;
        border-bottom: 2px solid #797979;
        letter-spacing: 2px;
        font-size: 18px;
        margin: 0 auto;
        margin-bottom: 20px
    }

        .RWDmenu_plus02 .cart-menu .title span {
            color: #fff;
            background: #6f6f6f;
            box-shadow: 1px 1px 5px #dedede;
            border-radius: 99em;
            padding: 4px 7px;
            padding-left: 8px;
            font-size: 12px
        }

    .RWDmenu_plus02 .cart-menu ul.content li {
        padding: 20px 30px;
        padding-bottom: 15px;
        border-bottom: 1px solid #ececec;
        transition: all .3s ease;
        -o-transition: all .3s ease;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease
    }

        .RWDmenu_plus02 .cart-menu ul.content li:last-child {
            border-bottom: none
        }

        .RWDmenu_plus02 .cart-menu ul.content li:hover {
            box-shadow: 1px 1px 20px #efefef
        }

        .RWDmenu_plus02 .cart-menu ul.content li .pic {
            width: 90px;
            height: 90px;
            background-color: #ececec;
            float: left;
            opacity: 1;
            transition: all .3s;
            -o-transition: all .3s;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
            position: relative;
            text-align: center
        }

    @media (max-width:400px) {
        .RWDmenu_plus02 .cart-menu ul.content li .pic {
            width: 70px;
            height: 70px
        }
    }

    .RWDmenu_plus02 .cart-menu ul.content li .pic:hover {
        opacity: .8
    }

    .RWDmenu_plus02 .cart-menu ul.content li .pic img {
        max-width: 100%;
        position: absolute;
        margin: auto;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box {
        width: 160px;
        float: left;
        font-size: 13px;
        margin-left: 25px;
        letter-spacing: 1px
    }

    @media (max-width:400px) {
        .RWDmenu_plus02 .cart-menu ul.content li .text-box {
            width: 130px;
            margin-left: 15px
        }
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .plusbuytag {
        margin-bottom: 5px;
        font-size: 15px;
        letter-spacing: 1px;
        line-height: 22px;
        color: #2f80ed
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .name {
        margin-bottom: 10px;
        font-size: 15px;
        letter-spacing: 1px;
        line-height: 22px;
        word-break: break-all
    }

        .RWDmenu_plus02 .cart-menu ul.content li .text-box .name a {
            color: #333;
            transition: all .3s;
            -o-transition: all .3s;
            -webkit-transition: all .3s;
            -moz-transition: all .3s
        }

            .RWDmenu_plus02 .cart-menu ul.content li .text-box .name a:hover {
                color: #999
            }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .spec {
        margin-bottom: 10px;
        font-size: 14px;
        line-height: 22px
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .qty-box {
        text-align: center;
        margin-bottom: 10px
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .qty {
        height: 30px;
        text-align: center;
        float: left;
        background-color: transparent;
        box-shadow: none;
        border: 1px solid #ccc;
        border-radius: 0;
        font-size: 14px
    }

    .RWDmenu_plus02 .choice_num_typea select {
        width: 70px;
        padding: 0 0 0 12px
    }

    .RWDmenu_plus02 .cart-menu ul.content .choice_num_typeb .qty {
        width: 40px
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box input.qtyplus {
        width: 30px;
        height: 30px;
        float: left;
        background-color: transparent;
        box-shadow: none;
        border: 1px solid #ccc;
        border-radius: 0;
        font-size: 14px;
        border-left: none;
        font-weight: 900;
        text-align: center;
        padding: 0;
        margin: 0
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box input.qtyminus {
        width: 30px;
        height: 30px;
        float: left;
        background-color: transparent;
        box-shadow: none;
        border: 1px solid #ccc;
        border-radius: 0;
        font-size: 14px;
        border-right: none;
        font-weight: 900;
        text-align: center;
        padding: 0;
        margin: 0
    }

    .RWDmenu_plus02 .cart-menu.querycar_menu ul.content li .text-box input.qtyminus, .RWDmenu_plus02 .cart-menu.querycar_menu ul.content li .text-box input.qtyplus {
        display: none
    }

    .RWDmenu_plus02 .choice_num_typec input {
        width: 60px
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .dre-text {
        letter-spacing: 1px;
        margin-bottom: 10px;
        font-size: 13px
    }

    .RWDmenu_plus02 .cart-menu ul.content li .text-box .price {
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: 900
    }

        .RWDmenu_plus02 .cart-menu ul.content li .text-box .price .unit {
            margin-left: 3px
        }

    .RWDmenu_plus02 .cart-menu ul.content li .cancel-btn {
        font-size: 14px;
        float: right;
        cursor: pointer;
        transition: all .3s;
        -o-transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s
    }

        .RWDmenu_plus02 .cart-menu ul.content li .cancel-btn:hover {
            color: #999
        }

    .RWDmenu_plus02 .cart-menu .buy-btn a {
        width: 100%;
        background-color: #4a4a4a;
        color: #fff;
        display: block;
        text-align: center;
        padding: 20px 15px;
        letter-spacing: 3px;
        font-size: 16px;
        margin-top: 0;
        cursor: pointer;
        font-weight: 600;
        box-shadow: 0 -3px 3px rgba(152,152,152,.25);
        transition: all .3s;
        -o-transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        font-family: 微軟正黑體,"Microsoft JhengHei",MingLiU,arial,verdana,helvetica,tahoma,sans-serif
    }

    .RWDmenu_plus02 .cart-menu .buy-btn:hover a {
        color: #fff
    }

    @media (max-width:600px) {
        .RWDmenu_plus02 .cart-menu .buy-btn a {
            margin-top: 0
        }
    }

    .RWDmenu_plus02 .cart-menu .buy-btn:hover {
        background-color: #928662
    }

    .go-back a::after, .go-back a::before, .has-children > a::after, .has-children > a::before {
        height: 1px
    }

    @media (max-width:600px) {
        .has-children > a::after, .has-children > a::before {
            right: 0
        }
    }

    .go-back a::after, .go-back a::before, .has-children > a::after, .has-children > a::before {
        transition: all .2s;
        -o-transition: all .2s;
        -webkit-transition: all .2s
    }

    @media (min-width:1200px) {
        nav.cd-nav ul .close-btn {
            display: none
        }
    }

    @media (max-width:1199px) {
        nav.cd-nav ul .close-btn {
            width: 78px;
            height: 60px;
            cursor: pointer;
            position: relative;
            transition: all .2s ease-out;
            z-index: 18;
            text-align: right;
            font-size: 12px;
            margin: -20px 0 23px 30px;
            line-height: 60px;
            padding-left: 40px;
            opacity: 1
        }

            nav.cd-nav ul .close-btn:after, nav.cd-nav ul .close-btn:before {
                background-color: #333;
                content: "";
                height: 1px;
                left: 0;
                top: 50%;
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
                transition: all .4s cubic-bezier(.25,.6,.36,1);
                position: absolute;
                top: 50%;
                width: 25px
            }

            nav.cd-nav ul .close-btn:before {
                -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
                transition-delay: 65ms
            }

            nav.cd-nav ul .close-btn:hover:before {
                -webkit-transform: rotate(135deg);
                transform: rotate(135deg)
            }

            nav.cd-nav ul .close-btn:hover:after {
                -webkit-transform: rotate(225deg);
                transform: rotate(225deg)
            }
    }

    nav.cd-nav ul .close-btn.is-push {
        transform: translateX(-300px);
        -o-transform: translateX(-300px);
        -webkit-transform: translateX(-300px);
        -moz-transform: translateX(-300px);
        opacity: 0;
        transition: transform .2s ease-out
    }

    nav.cd-nav .bottom-copyright {
        text-align: center;
        width: 100%;
        font-size: 13px;
        letter-spacing: 1px;
        margin-top: 40px;
        margin-bottom: 40px;
        -webkit-transition: all .3s;
        transition: all .3s
    }

    nav.cd-nav .cd-primary-nav.moves-out .bottom-copyright {
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0
    }

    nav.cd-nav .bottom-copyright span {
        color: #333
    }

    nav.cd-nav .phone-language select {
        box-shadow: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background: 0 0
    }

    nav.cd-nav .phone-language.fa-angle-down:before {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 5px 0 5px;
        border-color: #999 transparent transparent transparent;
        position: absolute;
        right: 20px;
        top: 50%;
        margin-top: -3px
    }

    @media (min-width:1200px) {
        .cd-primary-nav .go-back a::after, .cd-primary-nav .go-back a::before {
            left: 12px
        }
    }

    @media (max-width:1199px) {
        .cd-primary-nav .go-back a::after, .cd-primary-nav .go-back a::before {
            left: 0
        }
    }

    @media (max-width:600px) {
        .cd-primary-nav .go-back a {
            margin-top: 46px;
            font-weight: 600;
            border-bottom: none
        }

            .cd-primary-nav .go-back a::after, .cd-primary-nav .go-back a::before {
                left: 0
            }
    }

    nav.cd-nav .phone-language, nav.cd-nav .phone-member {
        margin-top: 60px;
        border-bottom: 1px solid #ececec;
        opacity: 1;
        transition: all .6s;
        -webkit-transition: all .6s;
        transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -o-transform: translateX(0);
        -moz-transform: translateX(0)
    }

    nav.cd-nav .phone-language {
        position: relative;
        width: 85%;
        margin: 0 30px
    }

        nav.cd-nav .phone-language:after {
            position: absolute;
            right: 0;
            top: 21px;
            font-size: 20px;
            display: block;
            pointer-events: none
        }

        nav.cd-nav .phone-language select {
            height: 60px;
            border: none;
            border-radius: 0;
            box-shadow: none;
            font-size: 16px;
            letter-spacing: 1px;
            background-color: transparent;
            padding-left: 0;
            color: #333
        }

        nav.cd-nav .phone-language.fa-angle-down:before {
            right: 0
        }

        nav.cd-nav .phone-language select::-ms-expand {
            display: none
        }

    nav.cd-nav .phone-member {
        position: relative
    }

        nav.cd-nav .phone-member span {
            position: absolute;
            right: 0
        }

    #cd-primary-nav > li.phone-member.hidden-lg > a:nth-child(1) > span {
        left: 50px
    }

    nav.cd-nav .phone-member a {
        display: inline;
        border: none;
        transition: all .3s;
        -webkit-transition: all .3s
    }

        nav.cd-nav .phone-member a:hover {
            color: #9c9c9c
        }

    nav.cd-nav .phone-language {
        margin-top: 0
    }

        nav.cd-nav .phone-language span {
            display: none
        }

        nav.cd-nav .phone-language.is-push, nav.cd-nav .phone-member.is-push {
            transform: translateX(-130%);
            -o-transform: translateX(-130%);
            -webkit-transform: translateX(-130%);
            -o-transform: translateX(-130%);
            -moz-transform: translateX(-130%);
            opacity: 0;
            transition: transform .3s ease
        }

    .phone-menubelow {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        -webkit-transition: all .3s;
        transition: all .3s
    }

    .cd-primary-nav.nav-is-visible .phone-menubelow {
        margin: 30px
    }

    nav.cd-nav .phone-group {
        display: inline-block;
        margin: 0 30px;
        margin-top: 30px;
        text-align: left;
        transition: all .5s;
        -webkit-transition: all .5s;
        transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -o-transform: translateX(0);
        -moz-transform: translateX(0)
    }

    nav.cd-nav .phone-menubelow .phone-group {
        margin: 8px 0
    }

    nav.cd-nav .phone-group a {
        display: inline-block;
        border: none;
        margin-right: 7px;
        padding: 8px
    }

        nav.cd-nav .phone-group a:hover {
            color: #9c9c9c
        }

    nav.cd-nav .phone-group.is-push {
        transform: translateX(-100%);
        -o-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        -moz-transform: translateX(-100%)
    }

    nav.cd-nav .phone-group i {
        vertical-align: middle;
        font-size: 20px;
        margin-right: 0;
        transition: all .3s;
        -webkit-transition: all .3s
    }

    nav.cd-nav .phone-group img {
        vertical-align: middle
    }

    nav.cd-nav .phone-group span {
        font-size: 13px;
        vertical-align: middle
    }

    nav.cd-nav .phone-lang {
        position: relative;
        display: block;
        float: right;
        text-align: center
    }

        nav.cd-nav .phone-lang::before {
            content: "";
            display: inline-block;
            vertical-align: middle;
            height: 100%
        }

    nav.cd-nav .phone-lang-label {
        position: relative;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        font-size: 11px;
        border: 0;
        padding: 10px;
        cursor: pointer
    }

        nav.cd-nav .phone-lang-label:hover {
            text-decoration: none;
            color: #9c9c9c
        }

        nav.cd-nav .phone-lang-label i.fa {
            display: block;
            line-height: initial;
            font-size: 20px
        }

        nav.cd-nav .phone-lang-label span {
            display: block;
            font-size: 11px;
            line-height: initial
        }

        nav.cd-nav .phone-lang-label .lang-select-symbol + i.flag-icon {
            display: inline-block
        }

        nav.cd-nav .phone-lang-label .lang-select-symbol ~ span {
            display: inline-block
        }

    .phone-lang .cd-secondary-nav {
        text-align: left
    }

    .phone-lang li.go-back a {
        margin-top: 0
    }

    @media (min-width:1200px) {
        .cd-main-header {
            height: auto
        }
    }

    @media (max-width:1199px) {
        .cd-main-header {
            width: 100%;
            position: fixed
        }
    }

    @media (min-width:1200px) {
        #cd-search.is-up {
            top: 80px
        }
    }

    @media (min-width:1200px) {
        .cd-primary-nav ul.moves-out > li > a {
            font-weight: 900
        }
    }

    @media (max-width:1199px) {
        .cd-overlay.is-visible.search-is-visible {
            top: 50px
        }
    }

    @media (max-width:1199px) {
        .cd-primary-nav.nav-is-visible {
            overflow-x: hidden
        }
    }

    #scrollbox3 {
        overflow: auto;
        height: 78vh;
        width: auto !important
    }

    @media (max-width:1199px) {
        #scrollbox3 {
            height: 82vh
        }
    }

    @media (max-width:600px) {
        #scrollbox3 {
            height: 80vh
        }
    }

    @media (max-width:400px) {
        #scrollbox3 {
            height: 75vh
        }
    }

    .track3 {
        width: 10px;
        background: rgba(0,0,0,0);
        margin-right: 2px;
        border-radius: 10px;
        -webkit-transition: background 250ms linear;
        transition: background 250ms linear
    }

        .track3.dragging, .track3:hover {
            background: #d9d9d9;
            background: rgba(0,0,0,.15)
        }

    .handle3 {
        width: 7px;
        right: 0;
        background: #999;
        background: rgba(0,0,0,.4);
        border-radius: 7px;
        -webkit-transition: width 250ms;
        transition: width 250ms;
        padding: 0 !important
    }

    .track3.dragging .handle3, .track3:hover .handle3 {
        width: 10px
    }

    .cd-header-buttons li {
        float: right
    }

    @media (max-width:1199px) {
        .cd-header-buttons li {
            float: none
        }
    }

    .cd-header-buttons li.search-btn {
        margin-top: 3px;
        margin-left: 20px
    }

    .carempty {
        margin: 30px;
        color: #333;
        text-align: center
    }

    @media (min-width:1199px) {
        .cd-primary-nav .has-children.first-click {
            position: relative
        }

            .cd-primary-nav .has-children.first-click:after {
                position: absolute;
                top: 18px;
                right: 10px;
                content: '';
                display: block;
                width: 7px;
                height: 1px;
                z-index: 9;
                background: #868686;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transition: all .3s ease;
                transition: all .3s ease
            }

            .cd-primary-nav .has-children.first-click:before {
                position: absolute;
                top: 23px;
                right: 10px;
                content: '';
                display: block;
                width: 7px;
                height: 1px;
                background: #868686;
                z-index: 9;
                -webkit-transform: rotate(135deg);
                -moz-transform: rotate(135deg);
                -ms-transform: rotate(135deg);
                -o-transform: rotate(135deg);
                transform: rotate(135deg);
                -webkit-transition: all .3s ease;
                transition: all .3s ease
            }

            .cd-primary-nav .has-children.first-click:after, .cd-primary-nav .has-children.first-click:before {
                display: none
            }

            .cd-primary-nav .has-children.first-click:hover:before {
                background: #fff
            }

            .cd-primary-nav .has-children.first-click:hover:after {
                background: #fff
            }

            .cd-primary-nav .has-children.first-click.open:before {
                background: #fff
            }

            .cd-primary-nav .has-children.first-click.open:after {
                background: #fff
            }

        .cd-primary-nav .has-children.first-click {
            position: relative
        }

            .cd-primary-nav .has-children.first-click:hover:after {
                color: #fff
            }

        .cd-primary-nav ul.moves-out > li > a.selected {
            background-color: #797979;
            color: #fff
        }
    }

    @media (min-width:1200px) {
        .cd-primary-nav .cd-secondary-nav ul.moves-out {
            min-height: 200px;
            transition: all .5s ease
        }

        .cd-primary-nav .cd-secondary-nav ul ul .go-back a {
            padding-left: 30px;
            font-weight: 600;
            color: #333
        }
    }

    .RWDmenu_plus02 .share-group {
        text-align: left;
        transition: all .5s;
        -webkit-transition: all .5s;
        transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -o-transform: translateX(0);
        -moz-transform: translateX(0)
    }

        .RWDmenu_plus02 .share-group a {
            display: inline;
            border: none;
            color: #545454;
            padding: 0 3px
        }

            .RWDmenu_plus02 .share-group a:hover {
                color: #9c9c9c
            }

        .RWDmenu_plus02 .share-group.main_share {
            margin-top: 8px;
            margin-left: 15px
        }

    @media (max-width:1199px) {
        ul.cd-header-buttons .share-group {
            display: none
        }
    }

    .RWDmenu_plus02 .share-group.sub_share {
        float: right;
        margin-top: 20px
    }

    .RWDmenu_plus02 .share-group i {
        font-size: 16px;
        font-style: normal;
        margin-right: 0;
        transition: all .3s;
        -webkit-transition: all .3s;
        vertical-align: middle
    }

    .ii-fb1:before {
        content: "\e903"
    }

    .ii-line3:before {
        content: "\e90c"
    }

    .ii-google1:before {
        content: "\e905"
    }

    .ii-ig1:before {
        content: "\e908"
    }

    .ii-youtube1:before {
        content: "\e921"
    }

    .ii-query1:before {
        content: "\e970"
    }

    .ii-bag2:before {
        content: "\e917"
    }

    .ii-people2:before {
        content: "\e95b"
    }

    .ii-fb1-line:before {
        content: "\e94f"
    }

    .ii-fb3:before {
        content: "\e950"
    }

    .ii-google1-line:before {
        content: "\e951"
    }

    .ii-gstore1:before {
        content: "\e952"
    }

    .ii-ig2:before {
        content: "\e953"
    }

    .ii-ig2-line:before {
        content: "\e954"
    }

    .ii-line1-line:before {
        content: "\e955"
    }

    .ii-mail3:before {
        content: "\e956"
    }

    .ii-mail3-line:before {
        content: "\e957"
    }

    .ii-messenger1:before {
        content: "\e958"
    }

    .ii-messenger1-line:before {
        content: "\e959"
    }

    .ii-pchome1:before {
        content: "\e95a"
    }

    .ii-people2:before {
        content: "\e95b"
    }

    .ii-pixnet3:before {
        content: "\e95c"
    }

    .ii-pixnet3-line:before {
        content: "\e95d"
    }

    .ii-plurk2:before {
        content: "\e95e"
    }

    .ii-plurk2-line:before {
        content: "\e95f"
    }

    .ii-qq2:before {
        content: "\e960"
    }

    .ii-qq2-line:before {
        content: "\e961"
    }

    .ii-rakuten1:before {
        content: "\e962"
    }

    .ii-ruten1:before {
        content: "\e963"
    }

    .ii-shopee1:before {
        content: "\e964"
    }

    .ii-skype1-line:before {
        content: "\e965"
    }

    .ii-snapchat1:before {
        content: "\e966"
    }

    .ii-snapchat1-line:before {
        content: "\e967"
    }

    .ii-twitter1-line:before {
        content: "\e968"
    }

    .ii-wechat1-line:before {
        content: "\e969"
    }

    .ii-weibo1-line:before {
        content: "\e96a"
    }

    .ii-whatsapp1:before {
        content: "\e91f"
    }

    .ii-whatsapp2:before {
        content: "\e96b"
    }

    .ii-whatsapp2-line:before {
        content: "\e96c"
    }

    .ii-yahoo1:before {
        content: "\e96d"
    }

    .ii-yahoo2:before {
        content: "\e96e"
    }

    .ii-youtube1-line:before {
        content: "\e96f"
    }

    .ii-fb1:before {
        content: "\e903"
    }

    .ii-google1:before {
        content: "\e905"
    }

    .ii-line1:before {
        content: "\e90a"
    }

    .ii-line2:before {
        content: "\e90b"
    }

    .ii-line3:before {
        content: "\e90c"
    }

    .ii-skype1:before {
        content: "\e91a"
    }

    .ii-twitter1:before {
        content: "\e91c"
    }

    .ii-wechat1:before {
        content: "\e91d"
    }

    .ii-weibo1:before {
        content: "\e91e"
    }

    .ii-youtube1:before {
        content: "\e921"
    }

    .ii-youtube2:before {
        content: "\e922"
    }

    .RWDmenu_plus02 .share-group img {
        vertical-align: middle
    }

    .RWDmenu_plus02 .share-group span {
        font-size: 13px;
        vertical-align: middle
    }

    .RWDmenu_plus02 .share-group * ~ span {
        margin-left: 2px
    }

    @media (max-width:1199px) {
        .cd-primary-nav > li.only-pc {
            display: none
        }
    }

    @media (min-width:1200px) {
        .cd-primary-nav > li.only-mobile {
            display: none
        }
    }

    @media (min-width:1200px) {
        .cd-primary-nav .has-children.first-click {
            overflow: inherit
        }

        .cd-primary-nav .cd-secondary-nav ul.first-block {
            position: absolute;
            width: 200px;
            z-index: 99;
            left: 200px;
            background-color: #fff;
            box-shadow: 0 2px 10px rgba(43,43,43,.36)
        }

        .cd-primary-nav ul.moves-out > li > a {
            font-weight: 300
        }
    }

    @media (min-width:1200px) {
        .RWDmenu_plus02 .sub-nav .member-block {
            font-size: 13px;
            margin-top: 22px
        }
    }

    @media (max-width:1199px) {
        .RWDmenu_plus02 .inside.is-up .cd-main-header {
            box-shadow: -3px 2px 8px 1px rgba(47,47,47,.12)
        }

        .cd-primary-nav .cd-secondary-nav ul.first-block {
            overflow: hidden
        }

        .collapsing_header header {
            position: fixed !important;
            padding: 0 15px
        }

        .collapsing_header .cd-main-header .cd-logo {
            margin-top: 12px
        }

        #RWDfullscreen01 .cd-main-header {
            z-index: 11;
            position: fixed !important
        }

            #RWDfullscreen01 .cd-main-header .cd-logo {
                margin-top: 12px
            }

        #RWDfullscreen02 .cd-main-header {
            z-index: 11;
            position: fixed !important
        }

            #RWDfullscreen02 .cd-main-header .cd-logo {
                margin-top: 12px
            }

        #cd-primary-nav.moves-out {
            overflow: hidden;
            transform: none
        }

            #cd-primary-nav.moves-out ul.cd-secondary-nav:not(.is-hidden) {
                overflow-x: hidden;
                overflow-y: auto;
                transform: none;
                -webkit-overflow-scrolling: touch
            }

            #cd-primary-nav.moves-out ul.cd-secondary-nav.moves-out:not(.is-hidden) {
                overflow: hidden
            }

            #cd-primary-nav.moves-out .cd-secondary-nav.moves-out .first-block:not(.is-hidden):not(.moves-out) {
                -webkit-transform: translate3d(0,0,0);
                transform: translate3d(0,0,0);
                overflow-x: hidden;
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
                -ms-overflow-style: -ms-autohiding-scrollbar;
                z-index: 100
            }
    }

    @media (max-width:480px) {
        header {
            position: fixed !important
        }
    }

    .shoppingcar001 {
        position: fixed;
        right: 0;
        z-index: 99;
        top: 23%;
        width: 39px;
        overflow: hidden
    }

        .shoppingcar001 .car_block {
            float: left;
            position: relative;
            width: 40px;
            color: #333;
            font-size: 12px;
            cursor: pointer;
            background-color: #fff;
            text-align: center
        }

        .shoppingcar001 .val-shopnum {
            color: #ff1b1b
        }

        .shoppingcar001 .car_icon {
            width: 60%;
            margin: 20% auto
        }

        .shoppingcar001 .line {
            width: 60%;
            margin: 20% auto;
            height: 1px;
            background-color: #cbcbcb
        }

        .shoppingcar001 .money {
            color: #ff1b1b
        }

        .querycar001 .scrolltop, .shoppingcar001 .scrolltop {
            width: 100%;
            height: 38px;
            margin-top: 20%;
            background-color: #111;
            background-image: url(../../model/sample/baseimg/shoppingcar001/scrolltop.png);
            background-position: center center;
            background-size: 100% auto;
            background-repeat: no-repeat
        }

        .shoppingcar001 .car_icon img {
            width: 100%
        }

        .shoppingcar001 .car_list {
            float: left;
            width: 300px;
            position: relative;
            background-color: #efefef
        }

        .shoppingcar001 .list_block {
            position: relative;
            margin: 0 25px
        }

        .shoppingcar001 .car_outer {
            position: relative;
            width: 1000px
        }

        .shoppingcar001 .car_list .subject {
            color: #111;
            font-size: 16px;
            margin: 34px 0 17px 0
        }

        .shoppingcar001 .checkout_it {
            text-align: center;
            width: 100%;
            display: block;
            background-color: #fff;
            color: #111;
            line-height: 40px;
            font-size: 14px;
            margin: 12px 0;
            -webkit-transition: all .3s linear;
            transition: all .3s linear;
            text-decoration: none
        }

            .shoppingcar001 .checkout_it:hover {
                background-color: #f3ebeb;
                color: #111
            }

    .cart-block img, .member-block img, .querycar-block img {
        max-width: 20px
    }

    .querycar001 {
        position: fixed;
        right: 0;
        z-index: 99;
        top: 23%;
        width: 39px;
        overflow: hidden
    }

        .querycar001 .car_block {
            float: left;
            position: relative;
            width: 40px;
            color: #333;
            font-size: 12px;
            cursor: pointer;
            background-color: #fff;
            text-align: center
        }

        .querycar001 .querycar-val-shopnum {
            color: #ff1b1b
        }

        .querycar001 .car_icon {
            width: 60%;
            margin: 20% auto
        }

        .querycar001 .line {
            width: 60%;
            margin: 20% auto;
            height: 1px;
            background-color: #cbcbcb
        }

        .querycar001 .money {
            color: #ff1b1b
        }

        .querycar001 .car_icon img {
            width: 100%
        }

        .querycar001 .car_list {
            float: left;
            width: 300px;
            position: relative;
            background-color: #efefef
        }

        .querycar001 .list_block {
            position: relative;
            margin: 0 25px
        }

        .querycar001 .car_outer {
            position: relative;
            width: 1000px
        }

        .querycar001 .car_list .subject {
            color: #111;
            font-size: 16px;
            margin: 34px 0 17px 0
        }

        .querycar001 .checkout_it {
            text-align: center;
            width: 100%;
            display: block;
            background-color: #fff;
            color: #111;
            line-height: 40px;
            font-size: 14px;
            margin: 12px 0;
            -webkit-transition: all .3s linear;
            transition: all .3s linear;
            text-decoration: none
        }

            .querycar001 .checkout_it:hover {
                background-color: #f3ebeb;
                color: #111
            }



    .info {
        position: relative;
        width: 35%;
        padding: 30px;
        background: #fff;
        height: 100%;
        border-top-right-radius: 30px;
    }

    .cardDIV {
        /*width: 900px;*/
        background-color: #fff;
        border: 5px #efefef solid;
        border-radius: 8px;
    }

    .btn-card {
        font-size: 16px;
        display: inline-block;
        color: #fff;
        letter-spacing: 3px;
        text-transform: uppercase;
        font-weight: 600;
        background: #ffc107;
        padding: 14px 30px;
        border-radius: 35px;
    }

    .btn-card-sm {
        font-size: 16px;
        display: inline-block;
        color: #fff;
        letter-spacing: 3px;
        text-transform: uppercase;
        font-weight: 600;
        background: #ffc107;
        padding: 7px 15px;
        border-radius: 20px;
    }


    .btn-outline-card {
        font-size: 16px;
        display: inline-block;
        color: #ffc107;
        letter-spacing: 3px;
        text-transform: uppercase;
        font-weight: 600;
        border: 1px #ffc107 solid;
        padding: 14px 30px;
        border-radius: 35px;
        background-color: #f9f5e7;
        s
    }

    .pp-pic-div {
        width: 200px;
        z-index: 9999;
    }

    .pp-pic {
        width: 300px;
        margin-top: -200px;
    }

    @media (max-width: 880px) {
        .flipster {
            display: block;
            overflow-x: hidden;
            overflow-y: visible;
            position: relative;
        }

        .flipster__container li {
            width: 100%;
        }

        .cardDIV {
            width: 100% !important;
        }

        .pp-pic {
            margin-top: -100px;
        }
    }

    /*文字*/
    .f-EN {
        font-family: 'Microsoft JhengHei UI';
    }

    .wh25 {
        line-height: 25px;
    }

    .f13 {
        font-size: 13px;
        font-weight: bold;
    }
    .f20 {
    font-size: 25px;
    font-weight: bold;
    line-height: 35px;
}

    .f25 {
        font-size: 25px;
        font-weight: bold;
        line-height: 35px;
    }

    .f32 {
        font-size: 32px;
        font-weight: bold;
    }

    .f15 {
        font-size: 15px;
        font-weight: normal;
        line-height: 20px;
    }

    .f16 {
        font-size: 16px;
        font-weight: normal;
        line-height: 25px;
    }


    .f18 {
        font-size: 16px;
        font-weight: normal;
        line-height: 25px;
        text-align:left;
    }

    .c-gary {
        color: #ccc;
    }

    .lead {
        font-size: .85rem;
        font-weight: 400;
        line-height: 22px;
    }

    .c-cafe {
        color: #ad7900;
    }

    .pt-18 {
        padding-top: 30px;
    }

    .pt-15 {
        padding-top: 150px;
    }

    .pb-15 {
        padding-bottom: 150px;
    }

    .py-15 {
        padding-top: 250px;
        padding-bottom: 250px;
    }

    .item-w20 {
        font-size: 15px;
        line-height: 25px;
    }

    .p-border {
        border: 3px solid rgba(0, 0, 0, 0.15);
        padding: 1px;
        background-color: 1px solid rgba(0, 0, 0, 0.55);
    }

    .mr-2, .mx-2 {
        margin-right: 0.75rem !important;
    }

    .pr-1,
    .px-1 {
        padding-right: 0.375rem !important;
    }

    .pb-1,
    .py-1 {
        padding-bottom: 0.375rem !important;
    }

    .pl-1,
    .px-1 {
        padding-left: 0.375rem !important;
    }

    .p-2 {
        padding: 0.75rem !important;
    }


    .pr-2,
    .px-2 {
        padding-right: 0.75rem !important;
    }



    /*-- //featured_services --*/

    .featured_services {
        text-align: center;
    }

    .w3_agile_services_grid {
        text-align: left;
    }

    .w3_service_grid_left_grid {
        width: 120px;
        height: 120px;
        border: 1px solid #212121;
        margin: 0 auto;
        padding-top: 1em;
        position: relative;
        overflow: hidden;
    }

        .w3_service_grid_left_grid img {
            margin: 0 auto;
        }

    .w3l_service_grid_left h4 {
        font-size: 1.1em;
        color: #fff;
        font-weight: 600;
        margin: 1em 0;
        letter-spacing: 3px;
        line-height: 1.5em;
        text-transform: uppercase;
    }

    .w3l_service_grid_left p {
        color: #fff;
        line-height: 2em;
        margin-bottom: 1.5em;
    }

    .w3_agile_service_more a {
        font-size: 1.2em;
        color: #212121;
        letter-spacing: 2px;
        text-decoration: none;
    }

        .w3_agile_service_more a i {
            padding-left: 1em;
            color: #48b7ec;
        }

        .w3_agile_service_more a:hover {
            color: #48b7ec;
        }

            .w3_agile_service_more a:hover i {
                color: #212121;
            }

    .w3_service_grid_left_grid img {
        transition: transform 0.5s;
        transform: scale(1.10);
        -webkit-transform: scale(1.10);
        -moz-transform: scale(1.10);
        -o-transform: scale(1.10);
        -ms-transform: scale(1.10);
    }

    .w3l_service_grid_left:hover .w3_service_grid_left_grid img {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
    }

    .w3l_service_grid_left:hover .w3_service_grid_left_grid {
        border: 1px solid #48b7ec;
    }

    .agile_services_grid_pos {
        position: absolute;
        /*ottom: -13%;*/
        left: 2%;
        width: 55px;
        height: 55px;
        background: #ffc107;
        border-radius: 50px;
        border: 2px solid #fff;
        text-align: center;
    }

        .agile_services_grid_pos i {
            font-size: 1.3em;
            color: #fff;
            line-height: 2.5em;
        }

    .agile_services_grid figure {
        margin: 0;
        padding: 0;
        overflow: hidden;
    }


    /* Rotate */

    .hover06 figure img {
        -webkit-transform: rotate(0) scale(1);
        transform: rotate(0) scale(1);
        -moz-transform: rotate(0) scale(1);
        -o-transform: rotate(0) scale(1);
        -ms-transform: rotate(0) scale(1);
        width: 100%;
    }

    .hover06 figure:hover img,
    .w3_agile_services_grid:hover .hover06 figure img {
        -ms-transform: rotate(5deg) scale(1.1);
        -o-transform: rotate(5deg) scale(1.1);
        -moz-transform: rotate(5deg) scale(1.1);
        -webkit-transform: rotate(5deg) scale(1.1);
        transform: rotate(5deg) scale(1.1);
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
        -moz-transition: .3s ease-in-out;
        -o-transition: .3s ease-in-out;
        -ms-transition: .3s ease-in-out;
    }

    .agile_services_grid {
        position: relative;
    }

    .w3_agile_services_grid h4 {
        font-size: 1.2em;
        color: #111;
        margin: 2em 0 0.5em;
        letter-spacing: 0px;
        font-weight: 600;
        text-transform: uppercase;
    }

    .w3_agile_services_grid p {
        color: #555;
        font-size: 15px;
        letter-spacing: 1px;
        line-height: 28px;
    }

    .agile_inner_info a {
        font-size: 14px;
        display: inline-block;
        color: #fff;
        letter-spacing: 3px;
        text-transform: uppercase;
        font-weight: 600;
        background: #ffc107;
        padding: 10px 20px;
        border-radius: 35px;
        text-decoration: none;
    }

        .agile_inner_info a:hover {
            color: #333;
            text-decoration: none;
        }
    /*-- //featured_services --*/

    .border-radius-35 {
        border-radius: 35px;
    }


    #cart {
        position: fixed;
        top: 0px;
        right: calc(65% - 10px);
        border-radius: 0 0 5px 5px;
        color: #FFF;
        text-align: center;
        background: linear-gradient(to bottom, #FFB300 70%, yellow 100%);
        line-height: 25px;
    }

    .count_btn {
        display: inline-block;
        font-weight: 400;
        line-height: 1.5;
        color: #212529;
        text-align: center;
        text-decoration: none;
        vertical-align: middle;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: transparent;
        border: 1px solid transparent;
        padding: 0.875rem 0.75rem;
        font-size: 1rem;
        border-radius: 0 !important;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }

    .table .thead-dark th {
        color: #fff;
        background-color: #ffc107;
        border-color: #ffc107;
    }


    .border-b {
        border-bottom: 1px #dee2e6 solid;
        border-right: 1px #dee2e6 solid;
        border-left: 1px #dee2e6 solid;
        background-color: #fff;
    }


    #detail-list:hover {
        background-color: rgba(255, 255, 255, 0.5);
        box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.05);
        cursor: pointer;
    }

    /*放影片*/
    .video-container {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0;
        overflow: hidden;
        margin-bottom: 10px;
    }

        .video-container iframe, .video-container object, .video-container embed {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

    .navbar-ontop {
        background-color: transparent !important;
    }

    .cd-nav {
        float: left;
        margin-left: 100px;
        transition: 0.4s;
    }

    .is-up nav.cd-nav {
        margin-left: 180px;
        transition: 0.4s;
    }

    .RWDmenu_plus02 .inside {
        background: transparent;
    }

    .cd-main-header {
        background: transparent;
        transition: 0.4s;
    }
    /*副選單*/
    .RWDmenu_plus02 .sub-nav {
        position: absolute;
        right: 0px;
        top: 0px;
    }

    .RWDmenu_plus02 .editor {
        margin: 0px;
        right: 0px;
        padding: 16px 30px;
    }

        .RWDmenu_plus02 .editor a {
            color: #fff;
            font-size: 16px;
            letter-spacing: 1px;
        }

            .RWDmenu_plus02 .editor a span {
                font-size: 22px;
                font-weight: bold;
                display: block
            }

        .RWDmenu_plus02 .editor .menu_phone {
            text-align: center;
        }

            .RWDmenu_plus02 .editor .menu_phone i {
                margin-right: 8px
            }

    .RWDmenu_plus02 .sub-nav::before {
        content: "";
        background: #FFB300;
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: -1
    }

    .cd-header-buttons {
        right: 250px
    }
    /*下滑*/
    .RWDmenu_plus02 .sub-nav.sub-up {
        margin-top: 0px;
    }

    .is-up .cd-main-header {
        background: rgba(255, 255, 255, 0.9);
        transition: 0.4s;
    }



    .fixed-sidebar-top {
        position: fixed;
        top: 150;
        left: 0;
        z-index: 1030;
    }

    /*諮詢*/
    .Phone_div {
        position: relative;
        width: 120px;
        height: 80px;
        background-color: #ffc107;
        color: #fff;
        text-align: center;
        line-height: 20px;
        padding: 20px 10px 0 10px;
    }

    .phone_w {
        position: absolute;
        color: blue;
        bottom: 0;
        right: 0;
    }

    @media (max-width: 990px) {
        .Phone_div {
            position: relative;
            width: 100%;
            height: 30px;
            background-color: #ffc107;
            color: #fff;
            text-align: center;
            line-height: 20px;
            padding: 5px 0px 10px 0px;
        }
    }


    /* Style the input container */
    .topnav .login-container {
        float: right;
    }

    /* Style the input field inside the navbar */
    .topnav input[type=text] {
        padding: 6px;
        margin-top: 8px;
        font-size: 17px;
        border: none;
        width: 150px; /* adjust as needed (as long as it doesn't break the topnav) */
    }

    /* Style the button inside the input container */
    .topnav .login-container button {
        float: right;
        padding: 6px;
        margin-top: 8px;
        margin-right: 16px;
        background: #ddd;
        font-size: 17px;
        border: none;
        cursor: pointer;
    }

        .topnav .login-container button:hover {
            background: #ccc;
        }

    /* Add responsiveness - On small screens, display the navbar vertically instead of horizontally */
    @media screen and (max-width: 600px) {
        .topnav .login-container {
            float: none;
        }

            .topnav a, .topnav input[type=text], .topnav .login-container button {
                float: none;
                display: block;
                text-align: left;
                width: 100%;
                margin: 0;
                padding: 14px;
            }

        .topnav input[type=text] {
            border: 1px solid #ccc;
        }
    }



    .tab-content > .tab-pane {
        display: none;
    }

    .tab-content > .active {
        display: block;
    }

    .form-group {
        margin-bottom: 1rem;
    }

    .form-text {
        display: block;
        margin-top: 0.25rem;
    }

    .form-row {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-right: -5px;
        margin-left: -5px;
    }

        .form-row > .col,
        .form-row > [class*="col-"] {
            padding-right: 5px;
            padding-left: 5px;
        }

    .form-check {
        position: relative;
        display: block;
        padding-left: 1.25rem;
    }

    .form-check-input {
        position: absolute;
        margin-top: 0.3rem;
        margin-left: -1.25rem;
    }

        .form-check-input:disabled ~ .form-check-label {
            color: #6c757d;
        }

    .form-check-label {
        margin-bottom: 0;
    }

    .form-check-inline {
        display: -ms-inline-flexbox;
        display: inline-flex;
        -ms-flex-align: center;
        align-items: center;
        padding-left: 0;
        margin-right: 0.75rem;
    }

        .form-check-inline .form-check-input {
            position: static;
            margin-top: 0;
            margin-right: 0.3125rem;
            margin-left: 0;
        }

    .form-inline {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        -ms-flex-align: center;
        align-items: center;
    }

        .form-inline .form-check {
            width: 100%;
        }

    @media (min-width: 576px) {
        .form-inline label {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: center;
            justify-content: center;
            margin-bottom: 0;
        }

        .form-inline .form-group {
            display: -ms-flexbox;
            display: flex;
            -ms-flex: 0 0 auto;
            flex: 0 0 auto;
            -ms-flex-flow: row wrap;
            flex-flow: row wrap;
            -ms-flex-align: center;
            align-items: center;
            margin-bottom: 0;
        }

        .form-inline .form-control {
            display: inline-block;
            width: auto;
            vertical-align: middle;
        }

        .form-inline .form-control-plaintext {
            display: inline-block;
        }

        .form-inline .input-group,
        .form-inline .custom-select {
            width: auto;
        }

        .form-inline .form-check {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: center;
            justify-content: center;
            width: auto;
            padding-left: 0;
        }

        .form-inline .form-check-input {
            position: relative;
            -ms-flex-negative: 0;
            flex-shrink: 0;
            margin-top: 0;
            margin-right: 0.25rem;
            margin-left: 0;
        }

        .form-inline .custom-control {
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: center;
            justify-content: center;
        }

        .form-inline .custom-control-label {
            margin-bottom: 0;
        }
    }

    .input-group-text-d {
        display: flex;
        align-items: center;
        padding: 10px;
        font-size: 1rem;
        font-weight: 400;
        line-height: 20px;
        color: goldenrod;
        text-align: center;
        white-space: nowrap;
        background-color: #fff7e3;
        border: 1px solid goldenrod;
        border-radius: 0.25rem 0 0 0.25rem;
        margin-top: 2px;
    }




    * {
        box-sizing: border-box
    }

    /* Set a style for all buttons */
    /*button {
    background-color: #04AA6D;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

    button:hover {
        opacity: 1;
    }*/

    /* Float cancel and delete buttons and add an equal width */
    .cancelbtn, .deletebtn {
        float: left;
        width: 50%;
    }

    /* Add a color to the cancel button */
    .cancelbtn {
        background-color: #ccc;
        color: black;
    }

    /* Add a color to the delete button */
    .deletebtn {
        background-color: #f44336;
    }

    /* Add padding and center-align text to the container 
.container {
    padding: 16px;
    text-align: center;
}*/

    /* The Modal (background) */
    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1050; /* Sit on top */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: #474e5d;
        padding-top: 50px;
    }

    /* Modal Content/Box */
    .modal-content {
        background-color: #fefefe;
        margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
        border: 1px solid #888;
        width: 80%; /* Could be more or less, depending on screen size */
    }

    /* Style the horizontal ruler */
    hr {
        border: 1px solid #f1f1f1;
        margin-bottom: 25px;
    }

    /* The Modal Close Button (x) */
    .close {
        position: absolute;
        right: 35px;
        top: 15px;
        font-size: 40px;
        font-weight: bold;
        color: #f1f1f1;
    }

        .close:hover,
        .close:focus {
            color: #f44336;
            cursor: pointer;
        }

    /* Clear floats */
    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }

    /* Change styles for cancel button and delete button on extra small screens */
    @media screen and (max-width: 300px) {
        .cancelbtn, .deletebtn {
            width: 100%;
        }
    }

    /*rwd-table*/
    .rwd-table {
        background: #fff;
        overflow: hidden;
    }

        .rwd-table tr:nth-of-type(2n) {
            /*background: #eee;*/
        }

        .rwd-table th,
        .rwd-table td {
            margin: 0.5em 1em;
        }

    .rwd-table {
        min-width: 100%;
    }

        .rwd-table th {
            display: none;
            border-bottom: 2px solid #7a7a7a;
        }

        .rwd-table td {
            display: block;
        }

            .rwd-table td:before {
                content: attr(data-th);
                font-weight: bold;
                width: 7em;
                display: inline-block;
            }

        .rwd-table th, .rwd-table td {
            text-align: left;
        }

            .rwd-table th, .rwd-table td:before {
                color: #000;
                font-weight: bold;
                /*font-size:18px;*/
            }

    @media (min-width: 768px) {
        .rwd-table td:before {
            display: none;
        }

        .rwd-table th, .rwd-table td {
            display: table-cell;
            padding: 0.25em 0.5em;
        }

            .rwd-table th:first-child,
            .rwd-table td:first-child {
                padding-left: 0;
            }

            .rwd-table th:last-child,
            .rwd-table td:last-child {
                padding-right: 0;
            }

        .rwd-table th,
        .rwd-table td {
            padding: 1em !important;
        }
    }

    .bg-orgred {
        background-color: #f44336;
    }

    .bg-f-30 {
        background-color: rgba(255, 255, 255, 0.5);
    }

    .line-25 {
        line-height: 25px;
    }

    @media (max-width: 580px) {
        .col {
            flex: 0 0 auto;
            width: 100%;
        }

        .col-sm-4 {
            flex: 0 0 auto;
            width: 33%;
        }

        .col-sm-5 {
            flex: 0 0 auto;
            width: 41.66666667%;
        }

        .col-sm-7 {
            flex: 0 0 auto;
            width: 58.33333333%;
        }

        .sm-pt {
            margin-top: 25%;
        }

        .order-sm-1 {
            order: 1 !important;
        }
    }

    .li_circle {
        list-style-type: circle !important!important;
        list-style-position: inside !important;
        display: flex !important;
    }

    .f-w {
        width: 28% !important;
        margin-right: 7px;
    }

    .text-g-30 {
        color: #ccc;
    }

    .fZbFLE {
        flex-shrink: 0;
        width: 50px;
        height: 50px;
        order: 2;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 50%;
        cursor: pointer;
        overflow: hidden;
        box-shadow: rgb(0 0 0 / 40%) 2px 2px 6px;
        transition: all 0.5s ease 0s;
        position: relative;
        z-index: 200;
        display: block;
        border: 0px;
        background-color: rgb(0, 132, 255) !important;
    }

    #msg {
        position: fixed;
        bottom: 0;
        right: 0;
        margin: 5px;
        color: #236ee2;
        text-align: center;
        /*border-bottom: 2px solid #808080;*/
    }

    .fb-color {
        color: #1b73e6;
    }

    .yt-color {
        color: #ff0000;
    }

    .carousel-control-prev,
    .carousel-control-next {
        border: none;
        background: transparent;
    }

    .ig-color {
        color: #ee0f4a;
    }

    input[type=text], select, textarea {
        width: 100%;
        padding: 8px;
        border: 1px solid #ced4da;
        border-radius: 4px;
        box-sizing: border-box;
        margin-top: 6px;
        margin-bottom: 16px;
        resize: vertical;
        color: #9c9c9c;
    }




    /* style inputs and link buttons */
    input,
    .btn {
        /*width: 100%;*/
        padding: 9px;
        /*border: none;*/
        border-radius: 4px;
        margin: 6px 0;
        opacity: 0.85;
        display: inline-block;
        font-size: 15px;
        line-height: 20px;
        text-decoration: none; /* remove underline from anchors */
    }

        input:hover,
        .btn:hover {
            opacity: 1;
        }

    /* add appropriate colors to fb, twitter and google buttons */
    .fb {
        background-color: #3B5998;
        color: white;
    }

    .twitter {
        background-color: #55ACEE;
        color: white;
    }

    .google {
        background-color: #dd4b39;
        color: white;
    }

    /* style the submit button */
    input[type=submit] {
        background-color: #04AA6D;
        color: white;
        cursor: pointer;
    }

        input[type=submit]:hover {
            background-color: #45a049;
        }

    /* Two-column layout */
    .col {
        float: left;
        width: 50%;
        margin: auto;
        padding: 0 50px;
        margin-top: 6px;
    }

    /* Clear floats after the columns */
    .row:after {
        content: "";
        display: table;
        clear: both;
    }

    /* vertical line */
    .vl {
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        border: 2px solid #ddd;
        height: 175px;
    }

    /* text inside the vertical line */
    .vl-innertext {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        background-color: #f1f1f1;
        border: 1px solid #ccc;
        border-radius: 50%;
        padding: 8px 10px;
    }

    /* hide some text on medium and large screens */
    .hide-md-lg {
        display: none;
    }

    /* bottom container */
    .bottom-container {
        text-align: center;
        background-color: #666;
        border-radius: 0px 0px 4px 4px;
    }

    /* Responsive layout - when the screen is less than 650px wide, make the two columns stack on top of each other instead of next to each other */
    @media screen and (max-width: 650px) {
        .col {
            width: 100%;
            margin-top: 0;
        }
        /* hide the vertical line */
        .vl {
            display: none;
        }
        /* show the hidden text on small screens */
        .hide-md-lg {
            display: block;
            text-align: center;
        }
    }



    /*日曆*/

    ody a:hover,
    body button:hover {
        text-decoration: none;
        transition: 0.3s all;
        -webkit-transition: 0.3s all;
        -moz-transition: 0.3s all;
        -o-transition: 0.3s all;
        -ms-transition: 0.3s all;
    }

    .calendar,
    .datepicker {
        /*max-width: 300px;*/
        margin: auto;
    }

    .calendar {
        border: 1px solid #cccccc;
        border-radius: 10px;
        padding: 1em;
    }

    .datepicker input {
        margin: 0;
        font-family: inherit;
        display: block;
        /*width: 85%;*/
        height: calc(2.25rem + 2px);
        padding: 0.375rem 0.75rem 0.375rem 2.75rem !important;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color: #495057;
        background-color: #fff;
        background-clip: padding-box;
        border: 1px solid #ced4da;
        border-radius: 0.25rem;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }

        .datepicker input:focus {
            color: #495057;
            background-color: #fff;
            border-color: #f28388;
            outline: 0;
            box-shadow: 0 0 0 0.2rem rgba(219, 61, 68, 0.25);
        }

    .datepicker i {
        position: absolute;
    }

    .icon {
        padding: 10px;
        font-size: larger;
        color: #555555;
        z-index: 999;
    }

    .title {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .title .arrow-control {
            border: none;
            border-radius: 50px;
            background-color: transparent;
            width: 35px;
            height: 35px;
        }

            .title .arrow-control:hover {
                background-color: #db3d44;
                color: white;
                cursor: pointer;
            }

        .title .year-month:hover,
        .title .year:hover {
            color: #cccccc;
            cursor: pointer;
            transition: 0.3s all;
        }

    .week .day {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 14.28%;
        font-weight: bold;
    }

    .list, .week {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

        .list .date {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 14.28%;
            height: 42px;
            margin-top: 1em;
            /* padding: 7.14%; */
            border: none;
            border-radius: 50px;
            background-color: transparent;
        }

            .list .date:hover, .list .date:focus,
            .list .mon:hover, .list .mon:focus {
                background-color: #db3d44;
                color: white;
                cursor: pointer;
            }

    .active {
        /*background-color: #db3d44 !important;*/
        color: #2e3233;
    }

    .list .fadeout {
        color: #eeeeee;
    }

    .list .today {
        color: #db3d44;
    }

        .list .today.active {
            color: white;
        }

    .list .mon {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 25%;
        height: 50px;
        margin-top: 1em;
        /* padding: 7.14%; */
        border: none;
        border-radius: 50px;
        background-color: transparent;
    }

    #yearlist .mon:first-child,
    #yearlist .mon:last-child {
        color: #9d9d9d;
    }



    .d-none {
        display: none;
    }

    .col-25 {
        float: left;
        width: 25%;
        margin-top: 6px;
    }

    .col-75 {
        float: left;
        width: 75%;
        margin-top: 6px;
    }

    .col-date {
        float: left;
        width: 20%;
        margin: auto;
        padding: 0 50px;
        margin-top: 6px;
    }

    .date {
        font-size: 23px;
        line-height: 23px;
    }

    /* Clear floats after the columns */
    .row:after {
        content: "";
        display: table;
        clear: both;
    }

.index-logo {
    order: -1 !important;
}

    .index-menu {
        order: 2 !important;
    }

    .index-icon {
        order: 99 !important;
    }

    /* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
    @media screen and (max-width: 768px) {
        .col-25, .col-75, input[type=submit] {
            width: 100%;
            margin-top: 0;
        }

        .col-2, .col-md-3, .col-md-6, .col-md-12 {
            flex: 0 0 auto;
            width: 100%;
        }

        .d-none-menu {
            display: none;
        }
    }

    @media screen and (max-width: 768px) {
        .col-date {
            float: left;
            width: auto;
            margin: auto;
            padding: 0 0;
            margin-top: 6px;
            flex: 1 0 0%;
        }

        .date {
            font-size: 15px;
        }

        .index-logo {
            order: 2 !important;
        }

        .index-menu {
            order: 1 !important;
        }

        .index-icon {
            order: 99 !important;
        }

        .i-logo {
            width: 60% !important;
        }
        .sm-center {
            text-align: center !important;
        }
    }

    span.price {
        float: right;
        color: grey;
    }

    hr {
        border: 1px solid lightgrey;
    }

.more {
    border-radius: 15px 0px 15px 0px;
    letter-spacing: 3px;
    padding: 8px 30px;
    margin: 20px;
    color: #ffffff;
    background-color: #009a3e;
    font-weight: bold;
    font-size: 15px;
}
.more:hover {
        color: #ffffff;
        background-color: #d77e00;
    }

    .bg-v {
        border-radius: 35px;
        letter-spacing: 3px;
        padding: 15px 80px;
        margin: 20px;
        color: #ffffff;
        background-color: #a86413 !important;
        font-weight: bold;
        font-size: 15px;
    }

    .m a:hover {
        border-bottom: 3px solid red;
    }

    .bg-g {
        background-color: #f4f4f5;
    }


    .icon-top {
        position: fixed;
        right: 1rem;
        bottom: 1rem;
        width: 2.75rem;
        height: 2.75rem;
        font-size: 24px;
        text-align: center;
        color: #fff;
        background: rgba(90, 92, 105, 0.5);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }

    .search-color {
        background-color: #1368a8;
        border: none;
    }

.s-order {
    color: #009a3e !important;
}

    .pr {
        color: #fc0202;
        font-weight: bold;
        font-size: 15px;
    }

    .pr_no {
        color: #fc0202;
        font-weight: bold;
        font-size: 18px;
    }

    .p-list {
        color: #1368a8;
    }

    .p-list-bg a {
        color: #020268;
    }

    .p-list-bg:hover {
        background-color: #f4f4f5;
    }

    .btn-icon {
        color: #0e35c6 !important;
        background-color: transparent;
    }
@media (max-width:760px) {
    .txt1 {
        font-size: 24px;
        letter-spacing: 1px;
        color: #553527;
        margin-top: 0px !important;
        font-weight: bold;
        line-height: 30px
    }

    .pt-18 {
        padding-top: 10px;
    }
    .item-w20 {
        font-size: 14.5px;
        line-height: 20px;
    }
    .nav-link {
        display: block;
        padding: 3px 5px;
        color: #12bbad;
        text-decoration: none;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
    }
}

.m a:hover {
    border-bottom: 3px solid red;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 999;
    top: 100px;
    left: 0;
    background-color: #fff;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 45px;
}

    .sidenav a {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 18px;
        color: #fff;
        display: block;
        transition: 0.3s;
  
    }

        .sidenav a:hover {
            color: #fff !important;
            background-color: #026baf;
        }

    .sidenav .closebtn {
        position: absolute;
        top: 0;
        right: 5px;
        font-size: 36px;
        margin-left: 50px;
        color: #026baf;
    }
        .sidenav .closebtn:hover {
            color: #ff9600 !important;
            background-color: transparent !important;
        }

#main {
    transition: margin-left .5s;
    padding: 16px;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

        .sidenav a {
            font-size: 18px;
        }
}




.bg-bar {
    background-color: #009a3e;
}

section {
    padding: 60px 0;
    overflow: hidden;
    position: relative;
}

.section-title {
    text-align: center;
    padding-bottom: 30px;
    position: relative;
}

    .section-title h2 {
        font-size: 40px;
        font-weight: bold;
        text-transform: uppercase;
        margin-bottom: 20px;
        padding-bottom: 20px;
        position: relative;
        color: #553527;
        letter-spacing: 4px;
    }

        .section-title h2::after {
            content: "";
            position: absolute;
            display: block;
            width: 18%;
            height: 3px;
            background: #ff9600;
            bottom: 0;
            left: calc(41%);
        }

@media (max-width:758px) {
    .section-title h2 {
        font-size: 24px;
        letter-spacing: 1px;
    }

        .section-title h2::after {
            width: 25%;
            left: calc(38%);
        }
}

.top100 {
    margin-top: 100px!important;
}

.top130 {
    margin-top: 130px!important;
}

.img_wap {
    padding-top: 56.25%;
    width: 100%;
    position: relative;
}

    .img_wap img {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }