﻿
/* Header */
.nk-header {
    position: relative;
    left: 0;
    top: 0;
    right: 0;
    z-index: 1000;
    background-color: rgba(255,255,255,0.7);
}
/* Logo Top */
.nk-logo-top {
    position: absolute;
    top: 0px;
    left: 50%;
    padding: 0px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 1;
}

    .nk-logo-top.nk-logo-top-light, .nk-logo-top.nk-logo-top-light.nk-logo-top-solid {
        color: inherit;
        background-color: rgba(255, 255, 255, 0.85);
    }

    .nk-logo-top.nk-logo-top-transparent {
        background-color: transparent;
    }

    .nk-logo-top.nk-logo-top-solid {
        background-color: rgba(28, 28, 28, 0.75);
    }

/* Contacts before Top Navbar */
.nk-contacts-top {
    color: #fff;
    font-size: 0.85rem;
    padding: 10px 0;
}

    .nk-contacts-top:after {
        content: '';
        display: table;
        clear: both;
    }

    .nk-contacts-top.nk-contacts-top-light, .nk-contacts-top.nk-contacts-top-light.nk-contacts-top-solid {
        background-color: rgba(255, 255, 255, 0.85);
        color: inherit;
    }

        .nk-contacts-top.nk-contacts-top-light a, .nk-contacts-top.nk-contacts-top-light span, .nk-contacts-top.nk-contacts-top-light input.form-control {
            color: #444;
            border-color: #ccc;
        }

    .nk-contacts-top.nk-contacts-top-dark .languageSwitch span,
    .nk-contacts-top.nk-contacts-top-dark .nk-contacts-left span,
    .nk-contacts-top.nk-contacts-top-dark .nk-contacts-right span,
    .nk-contacts-top.nk-contacts-top-dark input.form-control {
        color: #363737;
    }

    .nk-contacts-top.nk-contacts-top-dark .languageSwitch a,
    .nk-contacts-top.nk-contacts-top-dark .nk-contacts-left a,
    .nk-contacts-top.nk-contacts-top-dark .nk-contacts-right a {
        color: #111111;
    }

        .nk-contacts-top.nk-contacts-top-dark .languageSwitch a:hover,
        .nk-contacts-top.nk-contacts-top-dark .nk-contacts-left a:hover,
        .nk-contacts-top.nk-contacts-top-dark .nk-contacts-right a:hover {
            color: #d6d6d6;
        }

    .nk-contacts-top.nk-contacts-top-transparent {
        background-color: transparent;
    }

    .nk-contacts-top, .nk-contacts-top.nk-contacts-top-solid {
        position: relative;
    }

        .nk-contacts-top .nk-contacts-left {
            float: left;
        }

        .nk-contacts-top .nk-contacts-right {
            float: right;
        }

        .nk-contacts-top .nk-contacts-center {
            text-align: center;
        }

            .nk-contacts-top .nk-contacts-center a {
                color: #363737;
            }

                .nk-contacts-top .nk-contacts-center a:hover {
                    color:  #6DC2A5;
                }

@media (max-width: 543px) {
    .nk-contacts-top .nk-contacts-left, .nk-contacts-top .nk-contacts-right {
        margin-top: 10px;
        float: none;
        text-align: center;
    }
}

.nk-contacts-top ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    .nk-contacts-top ul > li {
        display: inline-block;
        margin-right: 15px;
    }

        .nk-contacts-top ul > li:last-of-type {
            margin-right: 0;
        }

        .nk-contacts-top ul > li a {
            color: #fff;
        }

        .nk-contacts-top ul > li .nk-contact-icon {
            display: inline-block;
            margin-right: 3px;
            font-size: 1.4em;
            vertical-align: bottom;
        }

        .nk-contacts-top ul > li a.nk-contact-icon {
            color: inherit;
            font-size: 1.5em;
        }

            .nk-contacts-top ul > li a.nk-contact-icon:hover {
                opacity: 0.6;
            }

            .nk-contacts-top ul > li a.nk-contact-icon img {
                max-height: 22px;
            }

        .nk-contacts-top ul > li .nk-contact-icon + a {
            font-size: 1.4em;
        }

/* Header Title */
.nk-header-title {
    position: relative;
    display: block;
    color: #fff;
    text-align: center;
    overflow: hidden;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: rgba(28, 28, 28, 0.4);
    z-index: 0;
}

    .nk-header-title .nk-header-table {
        height: 350px;
    }

    .nk-header-title.nk-header-title-sm .nk-header-table {
        height: 250px;
    }

    .nk-header-title.nk-header-title-md .nk-header-table {
        height: 450px;
    }

    .nk-header-title.nk-header-title-lg .nk-header-table {
        height: 550px;
    }

    .nk-header-title.nk-header-title-full {
        padding-top: 0;
        height: 100vh;
    }

        .nk-header-title.nk-header-title-full .nk-header-table {
            height: 100%;
            min-height: 600px;
        }

    .nk-header-title .nk-header-table {
        display: table;
        width: 100%;
    }

    .nk-header-title .nk-header-table-cell {
        display: table-cell;
        vertical-align: middle;
        padding: 60px 0;
    }

    .nk-header-title .nk-sub-title {
        color: inherit;
    }

.nk-header-table-cell a, .nk-header-table-cell h1, .nk-header-table-cell h2 {
    color: inherit;
    text-shadow: 1px 1px 2px #ccc;
}

/* Navbar */
.nk-navbar {
    position: relative;
    padding: 2px 0px;
    color: #000;
    font-size: 0.9rem;
    z-index: 1000;
    transition: .3s background-color;
    will-change: background-color;
}

    .nk-navbar.nk-navbar-fixed {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        transition: .2s -webkit-transform, .2s visibility, .3s background-color;
        transition: .2s transform, .2s visibility, .3s background-color;
        will-change: transform, visibility, background-color;
    }

        .nk-navbar.nk-navbar-fixed.nk-onscroll-hide {
            -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
            transform: translateY(-100%);
            visibility: hidden;
        }

        .nk-navbar.nk-navbar-fixed.nk-onscroll-show {
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
            visibility: visible;
        }

    .nk-navbar.nk-navbar-transparent {
        background-color: rgba(255,255,255,0.7);
    }

    .nk-navbar.nk-navbar-align-center {
        text-align: center;
    }

    .nk-navbar.nk-navbar-align-right {
        text-align: right;
    }

    .nk-navbar .nk-nav-table {
        display: table;
        margin: 10px auto;
        width: 100%;
        max-width: 100%;
        height: 100%;
    }

        .nk-navbar .nk-nav-table > * {
            display: table-cell;
            vertical-align: middle;
        }

        .nk-navbar .nk-nav-table > .nk-nav-row {
            display: table-row;
        }

        .nk-navbar .nk-nav-table > .nk-nav-row-full {
            height: 100%;
        }

        .nk-navbar .nk-nav-table > .nk-nav-row-center > * {
            display: table-cell;
            vertical-align: middle;
        }

    .nk-navbar .nk-nav-logo img {
        max-height: 15vh;
    }

    .nk-navbar .nk-nav-table > .nk-nav-icons, .nk-navbar .nk-nav-table > .nk-nav-logo {
        display: table;
        width: 100%;
    }

    .nk-navbar .nk-nav-table > .nk-nav-icons, .nk-navbar .nk-nav-table > .nk-nav-logo {
        display: table-cell;
        min-width: 10vw;
    }

    .nk-navbar .nk-nav-icons {
        white-space: nowrap;
    }

        .nk-navbar .nk-nav-icons > * {
            white-space: initial;
        }

    .nk-navbar a {
        color: inherit;
    }

    .nk-navbar ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
    }

        .nk-navbar ul > li > a {
            white-space: nowrap;
        }

            .nk-navbar ul > li > a:hover, .nk-navbar ul > li > a:focus {
                text-decoration: none;
            }

    .nk-navbar .nk-navbar-bg {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(255,255,255,0.7);
        z-index: -1;
    }

    .nk-navbar ul li a span.topIcons {
        display: inline-block;
        width: 20px;
    }

    .nk-navbar .nk-nav {
        position: relative;
        padding-left: 20px;
        text-align: center;
    }

        .nk-navbar .nk-nav .nk-nav {
            padding-left: 0;
            padding-right: 0;
        }

        .nk-navbar .nk-nav li.single-icon > a, .nk-navbar .nk-nav li.single-icon > p {
            margin-bottom: 0px;
            padding: 0px 5px;
            color: #363737;
        }

            .nk-navbar .nk-nav li.single-icon > a:hover, .nk-navbar .nk-nav li.single-icon > p:hover {
                color: #111111;
            }

            .nk-navbar .nk-nav li.single-icon > a:before {
                content: none;
            }

            .nk-navbar .nk-nav li.single-icon > a > i, .nk-navbar .nk-nav li.single-icon > a > span, .nk-navbar .nk-nav li.single-icon > span, .nk-navbar .nk-nav li.single-icon > p > .cmIcons {
                height: 32px;
                line-height: 32px;
                font-size: 1.5rem;
                vertical-align: middle;
            }

        .nk-navbar .nk-nav li.single-icon span.nk-badge {
            position: absolute;
            display: inline-block;
            right: -4px;
            bottom: 0px;
            min-width: 15px;
            height: auto;
            height: 15px;
            padding: 0 4px;
            color: #000;
            text-align: center;
            font-size: 15px;
            line-height: 15px;
            background: rgba(255, 255, 255, 1.0);
            border-radius: 7.5px;
            box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
        }

        .nk-navbar .nk-nav li > a .nk-item-descr {
            display: block;
            font-style: italic;
            font-size: 0.7em;
            opacity: 0.7;
        }

        .nk-navbar .nk-nav > li {
            display: table-cell;
            position: relative;
            text-align: center;
            vertical-align: middle;
        }

            .nk-navbar .nk-nav > li.onphonesech {
                padding: 10px;
                display: none;
            }

                .nk-navbar .nk-nav > li.onphonesech .nk-btn {
                    padding: 6px 12px;
                }

            .nk-navbar .nk-nav > li.MobileOnly {
                display: none;
            }

            .nk-navbar .nk-nav > li > a {
                position: relative;
                display: block;
                padding: 6px 12px;
            }

                .nk-navbar .nk-nav > li > a:before, .nk-navbar .nk-nav > li > a:after {
                    content: '';
                    position: absolute;
                    width: 10px;
                    height: 10px;
                    opacity: 0;
                    color: #444;
                    border: 1px solid;
                    transition: -webkit-transform .3s, opacity .3s, width .7s, height .7s;
                    transition: transform .3s, opacity .3s, width .7s, height .7s;
                    transition-timing-function: cubic-bezier(0.17, 0.67, 0.05, 1.29);
                    will-change: transform, opacity, width, height;
                }

                .nk-navbar .nk-nav > li > a:before {
                    top: 0;
                    left: 0;
                    border-width: 1px 0 0 1px;
                    -webkit-transform: translate(10px, 10px);
                    -ms-transform: translate(10px, 10px);
                    transform: translate(10px, 10px);
                }

                .nk-navbar .nk-nav > li > a:after {
                    right: 0;
                    bottom: 0;
                    border-width: 0 1px 1px 0;
                    -webkit-transform: translate(-10px, -10px);
                    -ms-transform: translate(-10px, -10px);
                    transform: translate(-10px, -10px);
                }

            .nk-navbar .nk-nav > li.active > a:before, .nk-navbar .nk-nav > li.active > a:after {
                opacity: 0.4;
                -webkit-transform: translate(0, 0);
                -ms-transform: translate(0, 0);
                transform: translate(0, 0);
            }

            .nk-navbar .nk-nav > li.active > a:hover:before, .nk-navbar .nk-nav > li.active > a:hover:after {
                opacity: 0.6;
            }

        .nk-navbar .nk-nav .dropdown {
            position: absolute;
            display: none;
            margin-top: 12px;
            padding: 12px;
            opacity: 0;
            z-index: 1;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(255,255,255,1);
            -moz-box-shadow: 0px 0px 5px 0px rgba(255,255,255,1);
            box-shadow: 0px 0px 5px 0px rgba(255,255,255,1);
            background-color: rgba(240,240,240,0.7);
        }

            .nk-navbar .nk-nav .dropdown.showLeft {
                right: -50%;
            }

            .nk-navbar .nk-nav .dropdown:before {
                content: '';
                display: block;
                position: absolute;
                width: 100%;
                left: 0;
                top: -20px;
                height: 90px;
                z-index: -1;
            }

            .nk-navbar .nk-nav .dropdown > li {
                position: relative;
            }

                .nk-navbar .nk-nav .dropdown > li > a {
                    display: block;
                    padding: 8px 25px;
                }

                    .nk-navbar .nk-nav .dropdown > li > a:hover {
                        text-decoration: none;
                    }

        .nk-navbar .nk-nav .nk-drop-item .nk-drop-item .dropdown {
            top: 0;
            margin-top: -20px;
            margin-left: 100%;
        }

    .nk-navbar .nk-nav-right {
        text-align: right;
    }

        .nk-navbar .nk-nav-right > * {
            text-align: left;
        }

    .nk-navbar .nk-nav-center {
        text-align: center;
    }

        .nk-navbar .nk-nav-center > * {
            text-align: left;
        }

    .nk-navbar .nk-drop-item.nk-drop-left > a:after {
        border-top: 2px solid transparent;
        border-bottom: 2px solid transparent;
        border-left: none;
        border-right: 2px solid;
    }

    .nk-navbar .nk-drop-item.nk-drop-left .dropdown {
        margin-left: -100%;
    }
/* Navbar Left */
.nk-navbar-left.nk-navbar-side {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: 280px;
    z-index: 999;
}

    .nk-navbar-left.nk-navbar-side ~ .nk-main, .nk-navbar-left.nk-navbar-side ~ .nk-search {
        margin-left: 280px;
    }

    .nk-navbar-left.nk-navbar-side.nk-navbar-lg {
        width: 300px;
    }

        .nk-navbar-left.nk-navbar-side.nk-navbar-lg ~ .nk-main, .nk-navbar-left.nk-navbar-side.nk-navbar-lg ~ .nk-search {
            margin-left: 300px;
        }

@media (max-width: 991px) {
    .nk-navbar-left.nk-navbar-side {
        display: none;
    }

        .nk-navbar-left.nk-navbar-side ~ .nk-main, .nk-navbar-left.nk-navbar-side ~ .nk-search, .nk-navbar-left.nk-navbar-side.nk-navbar-lg ~ .nk-main, .nk-navbar-left.nk-navbar-side.nk-navbar-lg ~ .nk-search {
            margin-left: 0;
        }
}
/* Nav Togglers */
.nk-nav-toggler-right, .nk-nav-toggler-left {
    position: fixed;
    list-style: none;
    right: 20px;
    top: 20px;
    margin: 0;
    padding: 0;
    z-index: 1000;
}

    .nk-nav-toggler-right > li, .nk-nav-toggler-left > li {
        display: inline-block;
    }

        .nk-nav-toggler-right > li + li, .nk-nav-toggler-left > li + li {
            margin-left: 15px;
        }

        .nk-nav-toggler-right > li > a, .nk-nav-toggler-left > li > a {
            display: block;
            padding: 12px;
        }

            .nk-nav-toggler-right > li > a > span, .nk-nav-toggler-left > li > a > span {
                height: 25px;
                vertical-align: text-bottom;
            }

.nk-nav-toggler-left {
    right: auto;
    left: 20px;
}
/*------------------------------------------------------------------
  
	Navbar Side
  
   -------------------------------------------------------------------*/
.nk-navbar-side {
    position: fixed;
    top: 0;
    bottom: 0;
    padding: 0;
    overflow: hidden;
    z-index: 1002;
}

    .nk-navbar-side.nk-navbar-left-side {
        left: 0;
        width: 250px;
        margin-left: -250px;
    }

@media (max-width: 400px) {
    .nk-navbar-side.nk-navbar-left-side {
        width: 200px;
        margin-left: -200px;
    }
}

.nk-navbar-side.nk-navbar-right-side {
    right: 0;
    width: 250px;
    margin-right: -250px;
}

@media (max-width: 400px) {
    .nk-navbar-side.nk-navbar-right-side {
        width: 200px;
        margin-right: -200px;
    }
}

.nk-navbar-side.nk-navbar-lg.nk-navbar-left-side {
    width: 350px;
    margin-left: -350px;
}

@media (max-width: 550px) {
    .nk-navbar-side.nk-navbar-lg.nk-navbar-left-side {
        width: 300px;
        margin-left: -300px;
    }
}

@media (max-width: 450px) {
    .nk-navbar-side.nk-navbar-lg.nk-navbar-left-side {
        width: 250px;
        margin-left: -250px;
    }
}

.nk-navbar-side.nk-navbar-lg.nk-navbar-right-side {
    width: 350px;
    margin-right: -350px;
}

@media (max-width: 550px) {
    .nk-navbar-side.nk-navbar-lg.nk-navbar-right-side {
        width: 300px;
        margin-right: -300px;
    }
}

@media (max-width: 450px) {
    .nk-navbar-side.nk-navbar-lg.nk-navbar-right-side {
        width: 250px;
        margin-right: -250px;
    }
}

.nk-navbar-side .nk-nav-logo {
    display: block;
    width: 100%;
    padding: 15px 35px;
}

.nk-navbar-side .nano {
    height: 100%;
    overflow-y: auto;
    background-color: rgba(255,255,255,0.7);
}

.nk-navbar-side .nk-nav {
    position: relative;
    padding: 0;
    overflow: hidden;
}

    .nk-navbar-side .nk-nav .dropdown > li, .nk-navbar-side .nk-nav > li {
        position: static;
        display: block;
        margin: 12px 40px;
    }

        .nk-navbar-side .nk-nav .dropdown > li > a, .nk-navbar-side .nk-nav > li > a {
            display: block;
            text-align: left;
            color: rgba(255, 255, 255, 0.8);
            white-space: inherit;
        }

    .nk-navbar-side .nk-nav li > a.adrItem {
        padding: 0px;
    }

    .nk-navbar-side .nk-nav .dropdown > li > a:before, .nk-navbar-side .nk-nav .dropdown > li > a:after, .nk-navbar-side .nk-nav > li > a:before, .nk-navbar-side .nk-nav > li > a:after {
        content: none;
    }

    .nk-navbar-side .nk-nav .nk-drop-item > a, .nk-navbar-side .nk-nav > .nk-drop-item > a, .nk-navbar-side .nk-nav .bropdown-back > a {
        position: relative;
    }

        /*
.nk-navbar-side .nk-nav .nk-drop-item .nk-drop-item > a:after, .nk-navbar-side .nk-nav .nk-drop-item > a:after, .nk-navbar-side .nk-nav > .nk-drop-item > a:after {
            content: '';
            display: block;
            position: absolute;
            top: 50%;
            margin-top: -1px;
            right: 40px;
            left: auto;
            color: inherit;
            width: 0;
            height: 0;
            border: none;
            color: #000;
            border-top: 4px solid transparent;
            border-bottom: 4px solid transparent;
            border-left: 4px solid;
            transition: .3s opacity;
            will-change: opacity;
            -webkit-transform: none;
            -ms-transform: none;
            transform: none;
            opacity: 0.6 !important;
        }
    */
        

        .nk-navbar-side .nk-nav .nk-drop-item > a:hover:after, .nk-navbar-side .nk-nav .nk-drop-item > a.hover:after, .nk-navbar-side .nk-nav > .nk-drop-item > a:hover:after, .nk-navbar-side .nk-nav > .nk-drop-item > a.hover:after {
            opacity: 1 !important;
            width: 0;
            height: 0;
        }

    .nk-navbar-side .nk-nav .dropdown {
        display: block;
        opacity: 1;
        background-color: transparent;
        padding: 0;
    }

        .nk-navbar-side .nk-nav .dropdown:before {
            content: none;
        }

    .nk-navbar-side .nk-nav .nk-drop-item > .dropdown, .nk-navbar-side .nk-nav .nk-drop-item .nk-drop-item > .dropdown {
        top: 0px;
        left: 0;
        margin-top: 0;
        margin-left: 0;
        width: 100%;
    }

        .nk-navbar-side .nk-nav .nk-drop-item > .dropdown > li > a, .nk-navbar-side .nk-nav .nk-drop-item .nk-drop-item > .dropdown > li > a {
            display: none;
        }

.nk-navbar-side .dropdown > .bropdown-back > a:after {
    content: '' !important;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    left: 30px;
    color: inherit;
    width: 0;
    height: 0;
    border: none;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
    border-right: 2px solid;
    transition: .3s opacity;
    will-change: opacity;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 0.6;
}

.nk-navbar-side .dropdown > .bropdown-back > a:hover:after, .nk-navbar-side .dropdown > .bropdown-back > a.hover:after {
    opacity: 1;
}

.nk-navbar-side .nk-nav-icons {
    list-style: none;
}

    .nk-navbar-side .nk-nav-icons li {
        position: relative;
        display: inline-block;
        vertical-align: middle;
    }

        .nk-navbar-side .nk-nav-icons li > a {
            padding: 0 15px;
            display: inline-block;
        }

            .nk-navbar-side .nk-nav-icons li > a > i, .nk-navbar-side .nk-nav-icons li > a > span {
                height: 32px;
                line-height: 32px;
                font-size: 1.2rem;
                vertical-align: middle;
            }

.nk-navbar-side .nk-nav-social {
    padding: 30px 20px;
}

    .nk-navbar-side .nk-nav-social > ul li {
        display: inline-block;
    }

        .nk-navbar-side .nk-nav-social > ul li > a {
            display: block;
            margin: 2px 4px;
            width: 40px;
            height: 40px;
        }

            .nk-navbar-side .nk-nav-social > ul li > a:hover, .nk-navbar-side .nk-nav-social > ul li > a.hover {
                background-color: #fff;
                border-color: #fff;
                color: #1c1c1c;
            }

.nk-navbar-overlay {
    position: fixed;
    display: none;
    z-index: 1001;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    background-color: #1c1c1c;
    cursor: url('assets/images/nav-close-cursor.png') 15 15, pointer;
}



.nk-navbar .link-effect-3, .nk-navbar .link-effect-3 .link-effect-shade, .nk-navbar .active > .link-effect-3 {
    color: #fff;
}

    .nk-navbar .link-effect-3 > span, .nk-navbar .link-effect-3 > span .menu-text-en {
        color: #363737;
        font-size: 15px;
    }

        .nk-navbar .link-effect-3 > span .menu-text-en {
            margin-bottom: 0px;
        }


    .nk-navbar .link-effect-3 .link-effect-shade {
        color: #111111;
    }

    .nk-navbar .link-effect-3 + .dropdown span {
        color: #363737;
    }

        .nk-navbar .link-effect-3 + .dropdown span > span {
            color: #111111;
        }

    .nk-navbar .active > .link-effect-3 .link-effect-shade {
        height: 100%;
    }

.nk-navbar .active > a.link-effect-3 {
    letter-spacing: 0px;
}

.nk-navbar .dropdown .link-effect-3 {
    color: rgba(255, 255, 255, 0.7);
    opacity: 1;
}



/*RWD Settings --------------------------------------------------------- */
/*通用 ========================= 平板以下 (筆電、平板、大尺寸手機)*/
@media only screen and (max-width : 991px) {

    .nk-navbar .nk-nav .dropdown {
        box-shadow: none;
    }

    .nk-sidebar {
        display: none;
    }
}

/*iPad in landscape 橫式 [768~1024]*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    .nk-navbar .nk-nav > li > a {
        padding: 6px 12px;
    }

    .nk-navbar .nk-nav-table > .nk-nav-icons {
        padding-right: 34px;
    }
}

/*iPad in portrait 直式 [768~1024]*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .nk-navbar-top .nk-nav-logo {
        display: table-cell;
    }

    .nk-navbar .nk-nav-right {
        text-align: center;
    }

    .nk-navbar .nk-nav {
        padding-left: 0px;
    }

        .nk-navbar .nk-nav > li.onphonesech {
            display: block;
        }

        .nk-navbar .nk-nav > li.advertising {
            display: none;
        }

        .nk-navbar .nk-nav li.single-icon > a {
            padding: 0 10px;
        }

    .nk-navbar .nk-nav-table {
        margin-bottom: 20px;
    }

    .nk-navbar .nk-nav-right {
        text-align: center;
    }

    .nk-navbar .nk-nav-table {
        width: auto;
    }

    .nk-navbar .dropdown span {
        color: #000;
    }

    .nk-navbar-side .nk-nav .dropdown > li > a, .nk-navbar-side .nk-nav > li > a, .nk-navbar-side .nano .nk-nav > li > a {
        padding: 0px;
    }
    /*
    .nk-navbar-side .nk-nav .nk-drop-item .nk-drop-item > a:after, .nk-navbar-side .nk-nav .nk-drop-item > a:after, .nk-navbar-side .nk-nav > .nk-drop-item > a:after {
        display: none;
    }
*/
    .nk-navbar .nk-nav > li.onphonesech {
        padding: 0px;
    }
}

/*通用 ========================= 平板以下 (手機、平板)*/
@media only screen and (max-width : 768px) {
    .nk-navbar .nk-nav-table {
        margin: 10px auto;
    }

    .nk-navbar .nk-nav > li.MobileOnly {
        position: static;
        display: block;
        margin: 0px;
    }

    

    .nk-navbar-side .nk-nav .dropdown > li, .nk-navbar-side .nk-nav > li, .nk-navbar-side .nano .nk-nav > li {
        display: block;
    }

        .nk-navbar-side .nk-nav .dropdown > li.single-icon.PCOnly, .nk-navbar-side .nk-nav > li.single-icon.PCOnly, .nk-navbar-side .nano .nk-nav > li.single-icon.PCOnly {
            display: none;
        }

        .nk-navbar-side .nano .nk-nav > li.MobileOnly {
            margin: 12px 40px;
        }

            .nk-navbar-side .nano .nk-nav > li.MobileOnly.onphonesech {
                margin: 8px 10px;
            }

        .nk-navbar-side .nk-nav .dropdown > li > a, .nk-navbar-side .nk-nav > li > a, .nk-navbar-side .nano .nk-nav > li > a {
            padding: 0px;
        }

    .nk-navbar .link-effect-3 + .dropdown span {
        color: #363737;
    }

        .nk-navbar .link-effect-3 + .dropdown span > span {
            color: #111111;
        }
}

/*通用 ========================= 手機*/
@media only screen and (max-width : 480px) {

    /*
    .nk-navbar-side .nk-nav .nk-drop-item .nk-drop-item > a:after, .nk-navbar-side .nk-nav .nk-drop-item > a:after, .nk-navbar-side .nk-nav > .nk-drop-item > a:after {
        display: none;
    }
        */

    .nk-navbar-side .nk-nav .dropdown > li {
        margin: 12px 25px;
    }

    .nk-navbar-side .dropdown > .bropdown-back > a:after {
        opacity: 0;
    }
}


