@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('../css/icon54/style.css');
@import url('../css/icon54-v2/style.css');
@import url('../css/icon54-v3/style.css');


/* 共用變數 */
:root {
    /* Green */
    --BrandGreen-900: #003a4b;
    --BrandGreen-800: #004f5b;
    --BrandGreen-700: #006d71;
    --BrandGreen-600: #00857e;
    --BrandGreen-500: #009d85;
    --BrandGreen-400: #31c49f;
    --BrandGreen-300: #5ae1b3;
    --BrandGreen-200: #93f5ca;
    --BrandGreen-100: #c8fadf;
    --BrandGreen-50: #ebfff4;
    /* Blue */
    --BrandBlue-900: #001a52;
    --BrandBlue-800: #002563;
    --BrandBlue-700: #00347b;
    --BrandBlue-600: #004693;
    --BrandBlue-500: #005bac;
    --BrandBlue-400: #338ccd;
    --BrandBlue-300: #5cb3e6;
    --BrandBlue-200: #94d7f6;
    --BrandBlue-100: #c8edfa;
    --BrandBlue-50: #edfaff;
    /* black */
    --black-100: rgba(0, 0, 0, 1);
    --black-90: rgba(0, 0, 0, 0.9);
    --black-80: rgba(0, 0, 0, 0.8);
    --black-70: rgba(0, 0, 0, 0.7);
    --black-60: rgba(0, 0, 0, 0.6);
    --black-50: rgba(0, 0, 0, 0.5);
    --black-40: rgba(0, 0, 0, 0.4);
    --black-30: rgba(0, 0, 0, 0.3);
    --black-20: rgba(0, 0, 0, 0.2);
    --black-10: rgba(0, 0, 0, 0.1);
    /* white */
    --white-100: rgba(255, 255, 255, 1);
    --white-90: rgba(255, 255, 255, 0.9);
    --white-80: rgba(255, 255, 255, 0.8);
    --white-70: rgba(255, 255, 255, 0.7);
    --white-60: rgba(255, 255, 255, 0.6);
    --white-50: rgba(255, 255, 255, 0.5);
    --white-40: rgba(255, 255, 255, 0.4);
    --white-30: rgba(255, 255, 255, 0.3);
    --white-20: rgba(255, 255, 255, 0.2);
    --white-10: rgba(255, 255, 255, 0.1);
    --white-0: rgba(255, 255, 255, 0);
    /* grey */
    --Grey-900: #131927;
    --Grey-800: #212936;
    --Grey-700: #394050;
    --Grey-600: #4d5461;
    --Grey-500: #6d717f;
    --Grey-400: #9ea2ae;
    --Grey-300: #d2d5db;
    --Grey-200: #e5e7ea;
    --Grey-100: #f3f4f6;
    --Grey-50: #f9fafb;
    /* Functional */
    --success-dark: #004f5b;
    --success-base: #5ae1b3;
    --success-light: #c8fadf;
    --danger-dark: #65071c;
    --danger-base: #d33928;
    --danger-light: #fce5d3;
    --warning-dark: #754e00;
    --warning-base: #f4bb00;
    --warning-light: #fef7cb;
    /* Background */
    --background-default: rgba(255, 255, 255, 1);
    --background-normal: rgba(249, 250, 251, 1);
    --background-special: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%);
    --background-strong: linear-gradient(180deg, #00857e 0%, #005BAC 100%);
    --background-light: linear-gradient(146.72deg, #C8FADF 15.62%, #94D7F6 108.43%);

    /* Shadows */
    --shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
    --shadow-active: 0px 10px 30px 0px rgba(0, 0, 0, 0.2);
    /*border*/
    --border-color-gray-200: #e5e7ea;
    --border-color-gray-50: #f9fafb;
    --border-color-green-700: #006d71;
    --border-color-green-600: #00857e;
    --border-color-green-500: #009d85;
    --border-color-green-300: #5ae1b3;
    --border-color-blue: #005bac;
    --border-color-red: #d33928;
}

/*icon*/

.icon-ui-chinese:before, .ch-img::before {
    content: "\e968";
}

.icon-logo_icon::before {
    content: '\e965' !important;
}

.icon-ui-tools::before {
    content: '\e917' !important;
}

.icon-ui-speakerphone::before {
    content: '\e91a' !important;
}

.icon-ui-share::before {
    content: '\e92d' !important;
}

.icon-ui-bell::before, .bell-icon::before {
    content: '\e964' !important;
}

.icon-ui-link::before, .link-icon::before, .fa-link::before {
    content: '\e92f' !important;
}

.icon-ui-arrow_right::before, .fa-chevron-right::before,
.fa-chevron-left::before, .fa-arrow-circle-right::before {
    content: '\e962' !important;
}

.fa-chevron-left {
    transform: rotate(180deg);
}

.icon-ui-album::before, .fa-images::before {
    content: '\e961' !important;
}

.icon-ui_sitemap::before {
    content: '\e960' !important;
}

.icon-ui-bill::before {
    content: '\e900' !important;
}

.icon-ui-book::before {
    content: '\e901' !important;
}

.icon-ui-calculator::before {
    content: '\e902' !important;
}

.icon-ui-calendar::before, .calendar-icon::before,
.historyBlk .historyBlk_inner .time::before {
    content: '\e903' !important;
}

.icon-ui-carbon_policy::before {
    content: '\e904' !important;
}

.icon-ui-check_circle::before {
    content: '\e905' !important;
}

.icon-ui-clock::before, .clock-icon::before, .open_time_top::before {
    content: '\e906' !important;
}

.icon-ui-cloud_download::before {
    content: '\e907' !important;
}

.icon-ui-cloud_upload::before {
    content: '\e908' !important;
}

.icon-ui-copy::before {
    content: '\e909' !important;
}

.icon-ui-delete::before, .fa-trash-alt::before {
    content: '\e90a' !important;
}

.icon-ui-edit::before {
    content: '\e90c' !important;
}

.icon-ui-education::before, .name-icon::before {
    content: '\e90d' !important;
}

.icon-ui-English::before {
    content: '\e90e' !important;
}

.icon-ui-english-name::before, .nameEN-icon::before {
    content: '\e90f' !important;
}

.icon-ui-eye::before, .view-icon::before {
    content: '\e910' !important;
}

.icon-ui-facebook::before {
    content: '\e911' !important;
}

.icon-ui-ins::before {
    content: '\e918' !important;
}

.icon-ui-youtube::before {
    content: '\e938' !important;
}

.icon-ui-Rss::before {
    content: '\e928' !important;
}

.icon-ui-font::before {
    content: '\e912' !important;
}

.icon-ui-font_bigger::before {
    content: '\e913' !important;
}

.icon-ui-font_normal::before {
    content: '\e914' !important;
}

.icon-ui-font_smaller::before {
    content: '\e915' !important;
}

.icon-ui-heart_fill::before, .detail .galleryBlk.ranking .item .like::before {
    content: '\e916' !important;
}

.icon-ui-heart_line::before, .like-img::before {
    content: '\e933' !important;
}

.icon-ui-up::before, .fa-chevron-up::before {
    content: '\e934' !important;
}

.icon-ui-down::before {
    content: '\e90b' !important;
}

.icon-ui-left::before {
    content: '\e919' !important;
}

.icon-ui-right::before {
    content: '\e927' !important;
}

.icon-ui-symbols_close::before {
    content: '\e930' !important;
}

.icon-ui-plus::before {
    content: '\e924' !important;
}

.icon-ui-list::before, .family-icon::before {
    content: '\e91b' !important;
}

.icon-ui-location::before, .map-icon::before, .fa-map-marker-alt::before {
    content: '\e91c' !important;
}

.icon-ui-mail::before, .mail-icon::before {
    content: '\e91d' !important;
}

.icon-ui-minus::before {
    content: '\e91e' !important;
}

.icon-ui-money::before, .money-icon::before {
    content: '\e91f' !important;
}

.icon-ui-motion-play::before {
    content: '\e920' !important;
}

.icon-ui-outline_info::before {
    content: '\e921' !important;
}

.icon-ui-phone::before, .phone-icon::before {
    content: '\e922' !important;
}

.icon-ui-pin_angle::before {
    content: '\e923' !important;
}

.icon-ui-QRCODE::before {
    content: '\e925' !important;
}

.icon-ui-reset::before {
    content: '\e926' !important;
}

.icon-ui-scan::before {
    content: '\e929' !important;
}

.icon-ui-search::before, .fa-search::before {
    content: '\e92a' !important;
}

.icon-ui-service::before {
    content: '\e92b' !important;
}

.icon-ui-setting::before {
    content: '\e92c' !important;
}

.icon-ui-speaker::before {
    content: '\e92e' !important;
}

.icon-ui-symbols_home::before {
    content: '\e931' !important;
}

.icon-ui-tag::before, .tag-icon::before, .fa-tag::before {
    content: '\e932' !important;
}

.icon-ui-user::before, .person-icon::before {
    content: '\e935' !important;
}

.icon-ui-user_setting::before {
    content: '\e936' !important;
}

.icon-ui-author::before, .author-icon::before {
    content: '\e963' !important;
}

.icon-ui-window_new::before {
    content: '\e937' !important;
}

.icon-flie-box::before, .fa-file-archive::before {
    content: '\e939' !important;
}

.icon-flie-text::before {
    content: '\e941' !important;
}

.icon-flie-video::before, .fa-video::before, .fa-youtube::before {
    content: '\e942' !important;
}

.icon-flie-voice-line::before {
    content: '\e943' !important;
}

.icon-flie-picture::before, .fa-image::before,
.fa-file-image::before {
    content: '\e93f' !important;
}

.icon-flie-web::before, .earth-icon::before, .fa-globe::before {
    content: '\e944' !important;
}

.icon-flie-pdf::before, .fa-file-pdf::before {
    content: '\e93e' !important;
}

.icon-flie-download::before, .fa-file::before {
    content: '\e93b' !important;
}

.icon-flie-odt::before, .fa-file-alt::before {
    content: '\e93d' !important;
}

.icon-flie-ods::before {
    content: '\e93c' !important;
}

.icon-flie-ppt::before, .fa-file-powerpoint::before {
    content: '\e940' !important;
}

.icon-flie-doc::before, .fa-file-word::before {
    content: '\e93a' !important;
}

.icon-flie-xls::before, .fa-file-excel::before {
    content: '\e945' !important;
}


body {
    overflow-x: hidden;
    font-family: 'Roboto', 'Noto Sans TC', 'Inter', sans-serif;
    font-weight: 400;
    font-size: 1.125rem;
    line-height: 200%;
    scroll-behavior: smooth;
    margin: 0;
    color: var(--Grey-700);
}

table, caption, thead, tbody, tfoot, tr, th, td, figure, img, figcaption,
fieldset, form, legend, label, input, textarea, select, button, ul, li, ol, dl, dt, dd, span,
header, nav, footer, article, aside, section, summary, details, dialog, rp, rt {
    margin: 0;
    padding: 0;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input, textarea, select, button {
    outline: 0;
}

a:link, a:visited {
    text-decoration: none;
}

a:focus, input:focus,
textarea:focus, select:focus,
button:focus {
    outline: 2px dotted orange !important;
}

button i {
    color: var(--Grey-700);
}

a[accesskey="C"] {
    display: block;
    position: absolute !important;
    transform: translate(-20px, 8px);
    opacity: 0;
}

a[accesskey="B"] {
    display: block;
    position: absolute !important;
    transform: translate(-20px, 5px);
    opacity: 0;
}

a[accesskey="Z"] {
    display: block;
    position: absolute !important;
    transform: translate(-20px, -2px);
    opacity: 0;
}

a[accesskey="C"]:hover, a[accesskey="Z"]:hover, a[accesskey="B"]:hover,
a[accesskey="C"]:focus, a[accesskey="Z"]:focus, a[accesskey="B"]:focus {
    opacity: 1;
}


a[accesskey="C"]::before, a[accesskey="Z"]::before, a[accesskey="B"]::before {
    content: none !important;
}

html.large_size {
    font-size: 115%;
}

html.small_size {
    font-size: 92.5%;
}

form {
    width: 100%;
}

@media (max-width: 991px) {
    body.fix {
        overflow-y: hidden;
    }
}

.index h2 {
    font-size: 3.438rem;
    font-weight: 300;
    line-height: 120%;
    letter-spacing: 5px;
    color: var(--BrandGreen-700);
    margin-bottom: 3.75rem;
    position: relative;
    z-index: 3;
    text-align: left;
}

.index h2.org-opencms-gwt-client-ui-css-I_CmsLayoutBundle-I_CmsGeneralCss-inlineBlock {
    color: initial;
    letter-spacing: initial;
    line-height: initial;
}

.exhibition .index h2 {
    margin-bottom: 0rem;
}

@media (max-width: 575px) {
    .index h2 {
        font-size: 3rem;
    }
}

.index h2 .bottom_line {
    display: block;
    width: 120px;
    height: 5px;
    background-color: var(--BrandGreen-500);
    margin-top: 2rem;
    position: relative;
}

.index h2 .bottom_line::after {
    content: '';
    display: block;
    width: 30px;
    height: 5px;
    background-color: var(--BrandBlue-500);
    border-left: #fff 2px solid;
    position: absolute;
    right: 0px;
    top: 0px;
}

.wrapper {
    max-width: 1648px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

div:focus-visible {
    outline: none;
}


@media (max-width:991px) {
    header.sticky {
        position: fixed;
        width: 100%;
        z-index: 11;
    }
}

@media (max-width:480px) {
    header.sticky {
        z-index: 12;
    }
}

header>.wrapper {
    display: flex;
    justify-content: space-between;
    padding: 40px 0 1.75rem 0;
    align-items: center;
}

@media (max-width:991px) {
    header>.wrapper {
        padding: 1.75rem;
    }
}

@media (max-width:575px) {
    header>.wrapper {
        padding: 1.5rem 1rem;
    }
}

header .wrapper:has(.navBlk-menu) {
    padding: 0;
}

body:has(.bannerBlk) .parkBg, body:has(.banner) .parkBg {
    background: linear-gradient(176deg, #C8FADF 4.75%, #94D7F6 136.07%);
}

.parkBg {
    width: 100%;
    height: 350px;
    background: linear-gradient(180deg, #EBFAF7 4.75%, #fff 100%);
    position: absolute;
    top: 116px;
    z-index: -1;
}

@media (max-width:991px) {
    .parkBg {
        top: -120px;
    }
}

.parkBg::before {
    content: '';
    display: block;
    background-color: #fff;
    height: 350px;
    width: calc((100% - 1600px) / 2 + (1600px / 6 * 2));
    position: absolute;
    top: 0px;
}

@media (max-width:1620px) {
    .parkBg::before {
        width: calc(100% / 6 * 2 + 1.5rem);
    }
}

@media (max-width:991px) {
    .parkBg::before {
        width: 68%;
    }
}

.dotBg {
    content: '';
    display: block;
    height: 690px;
    background-image: url(../images/dot.png);
    position: absolute;
    top: 580px;
    left: calc(100% / 6 * -4);
    width: 100%;
    z-index: -1;
}

@media (max-width:991px) {
    header.sticky>.wrapper {
        position: fixed !important;
        top: 0px;
        left: 0px;
        width: 100%;
        z-index: 14;
        backdrop-filter: blur(2px);
        background-color: var(--white-50);
        padding: 1rem 1.75rem;
    }

    header.sticky>.wrapper::before {
        content: none;
    }
}

@media (max-width:575px) {
    header.sticky>.wrapper {
        padding: 0.5rem 1rem;
    }
}

.logoBlk {
    position: relative;
    z-index: 2;
}

.logoBlk h1 {
    text-indent: -9999px;
    margin-bottom: 0;
}

.logoBlk h1 a {
    display: block;
    width: 330px;
    background-image: url('../images/logo.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}

@media (max-width:575px) {
    .logoBlk h1 a {
        width: 280px
    }
}

@media (max-width:430px) {
    .logoBlk h1 a {
        width: 240px
    }
}

body:has(.videoBlk) header .logoBlk h1 a {
    background-image: url('../images/logo-ch-w.svg');
}

@media (max-width:991px) {
    body:has(.videoBlk) header .logoBlk h1 a {
        background-image: url('../images/logo.svg');
    }
}

header .toggleBlk, header .searchBlk {
    display: none;
}

@media (max-width: 991px) {
    header .toggleBlk {
        display: block;
        position: fixed;
        right: 1.75rem;
        top: 1.75rem;
        z-index: 15;
        transition: all 0.2s;
    }
}

header .toggleBlk a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    text-indent: -9999px;
    background-image: url('../images/icon/solar_hamburger-menu-broken.svg');
    background-repeat: no-repeat;
    background-position: center center;
}

header .toggleBlk.active a {
    background-image: url('../images/icon/close_white.svg');
    background-size: cover;
}

header .searchBlk button {
    border: none;
    background-color: initial;
    width: 40px;
    height: 40px;
    font-size: 1.5rem;
    color: var(--Grey-900);
    position: relative;
    overflow: hidden;
}

header .searchBlk button:before {
    content: '\e92a';
    font-family: 'nmnsIcon';
    /* position: absolute; */
    /* top: 0px; */
    /* left: 0px; */
    width: 40px;
    height: 40px;
    font-size: 1.5rem;
    color: var(--Grey-900);
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 991px) {
    header.sticky .toggleBlk {
        top: 1rem;
    }

    header .searchBlk {
        display: block;
        margin: 0 70px 0 20px;
    }
}

@media (max-width: 575px) {
    header .toggleBlk {
        right: 1.25rem;
        top: 1.5rem;
        z-index: 15;
    }

    header.sticky .toggleBlk {
        top: 0.5rem;
    }

    header .searchBlk {
        margin: 0 60px 0 0px;
    }
}

@media (max-width: 430px) {
    header .searchBlk {
        margin: 0 50px 0 0px;
    }
}

@media (min-width: 992px) {
    .index header nav {
        background-color: initial;
        backdrop-filter: initial;
    }
}

header nav {
    height: 85px;
    margin: 0 -0.75rem;
    position: relative;
    backdrop-filter: blur(2px);
    background-color: var(--white-50);
    z-index: 4;
}

@media (max-width: 991px) {
    header nav {
        position: fixed;
        transition: all 0.3s;
        width: 100%;
        height: 100%;
        top: 0px;
        z-index: 14;
        opacity: 0;
        visibility: hidden;
        padding: 70px 2rem 2rem 2rem;
        backdrop-filter: blur(3px);
        background-color: var(--black-70);
    }

    header nav .wrapper {
        padding: 0;
    }

    header nav.active {
        opacity: 1;
        visibility: visible;
    }
}

@media (max-width: 767px) {
    header nav {
        padding: 1.5rem 1.5rem 2rem 1.5rem;
    }
}

#header.sticky {
    position: fixed;
    top: 0;
    z-index: 11;
    width: 100%;
    backdrop-filter: blur(2px);
    background-color: var(--white-50);
}

@media (max-width: 991px) {
    #header.sticky {
        backdrop-filter: blur(3px);
        background-color: var(--black-70);
        z-index: 14;
    }
}

header nav .pull-right {
    position: absolute;
    right: 0;
    top: -72px;
    display: flex;
    align-items: center;
}

@media (max-width:991px) {
    header nav .pull-right {
        display: none;
    }

    header nav.active .pull-right {
        position: initial;
        display: flex;
        margin-bottom: 0.5rem;
    }
}

header nav .pull-right ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

@media (max-width:991px) {
    header nav .pull-right ul {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width:767px) {
    header nav .pull-right ul {
        justify-content: flex-start;
        margin-right: 100px;
    }
}

header nav .pull-right ul li {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 15px;
    transition: all 0.3s ease;
}

@media (max-width:991px) {
    header nav .pull-right ul li {
        width: calc(100% / 5 - 30px);
        position: relative;
    }

    header nav .pull-right ul li.icon-logo_icon {
        display: none;
    }
}

@media (max-width:991px) {
    header nav .pull-right ul li.nmslogo-img {
        display: none;
    }
}

header nav .pull-right ul li .dropdown-menu {
    top: 44px;
    border: none;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    padding: 0;
    border-radius: 0;
}

header nav .pull-right ul li .dropdown-menu a {
    width: 100%;
    border-radius: 0;
    line-height: 32px;
}

@media (max-width:991px) {
    header nav .pull-right ul li .dropdown-menu a {
        aspect-ratio: initial;
        line-height: 42px;
    }
}

header nav .pull-right ul li.login .dropdown-menu a:hover {
    color: var(--white-100);
    background-color: var(--BrandGreen-500);
}

header nav .pull-right ul li a {
    position: relative;
    width: 40px;
    height: 40px;
    display: block;
    border-radius: 10px;
    transition: all 0.3s ease;
}

@media (max-width:991px) {
    header nav .pull-right ul li a {
        width: 100%;
        aspect-ratio: 1.5 / 1;
        height: initial;
        text-align: center;
    }
}

@media (max-width:767px) {
    header nav .pull-right ul li a {
        height: 50px;
        aspect-ratio: initial;
    }
}

header nav .pull-right ul li:not(.dropdownBlk) a:hover,
header nav .pull-right ul li:not(.dropdownBlk) a:focus {
    box-shadow: 0px 0px 10px 0px var(--black-10);
}

@media (max-width:991px) {

    header nav .pull-right ul li:not(.dropdownBlk) a:hover,
    header nav .pull-right ul li:not(.dropdownBlk) a:focus {
        border-radius: 0;
        box-shadow: initial;
    }
}

header nav .pull-right ul li::before {
    font-family: 'nmnsIcon';
    position: absolute;
    line-height: 1;
    font-size: 1.5rem;
    color: var(--Grey-900);
}

@media (max-width:991px) {
    header nav .pull-right ul li::before {
        font-size: 2rem;
        color: var(--white-100) !important;
        top: 3px;
    }
}

@media (max-width:767px) {
    header nav .pull-right ul li::before {
        top: 0px;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 2rem;
    }
}

@media (max-width:575px) {
    header nav .pull-right ul li::before {
        font-size: 2rem;
    }
}

@media (max-width:430px) {
    header nav .pull-right ul li::before {
        font-size: 1.5rem;
    }
}

body:has(.videoBlk) header nav .pull-right ul li::before {
    color: var(--white-100) !important;
}

header nav .pull-right ul li:hover::before {
    color: var(--BrandGreen-700);
}

header nav .pull-right ul li:not(.dropdownBlk) a span {
    position: absolute;
    top: 46px;
    left: -50%;
    background-color: #fff;
    color: var(--black-100);
    padding: 10px 15px;
    white-space: nowrap;
    z-index: 3;
    border-radius: 5px;
    line-height: 1;
    font-size: 0.813rem;
    transition: all 0.3s ease;
    transform: translateY(10px);
    box-shadow: 0px 10px 30px 0px var(--black-20);
    min-width: 82px;
    text-align: center;
    visibility: hidden;
    opacity: 0;
}

@media (max-width:991px) {
    header nav .pull-right ul li:not(.dropdownBlk) a span {
        opacity: initial;
        visibility: initial;
        background-color: initial;
        transform: initial;
        color: var(--white-100);
        font-size: 1.5rem;
        box-shadow: initial;
        display: block;
        padding: 0;
        position: initial;
        margin-top: 3rem;
    }
}

@media (max-width:860px) {
    header nav .pull-right ul li:not(.dropdownBlk) a span {
        font-size: 1.125rem;
    }
}

@media (max-width:767px) {
    header nav .pull-right ul li:not(.dropdownBlk) a span {
        display: none;
    }
}

header nav .pull-right ul li:not(.dropdownBlk) a span::before {
    content: '';
    display: block;
    position: absolute;
    top: -9px;
    left: calc(50% - 7.5px);
    border-style: solid;
    border-width: 0px 7.5px 9px 7.5px;
    border-color: transparent transparent #fff transparent;
}

@media (max-width:991px) {
    header nav .pull-right ul li:not(.dropdownBlk) a span::before {
        content: none;
    }
}

header nav .pull-right ul li a:hover span, header nav .pull-right ul li a:focus span {
    transition: all 0.3s ease;
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
}

.sitemap-img:before {
    content: "\e960";
}

.mail-img:before {
    content: "\e91d";
}

.person-img:before {
    content: "\e935";
}

.en-img:before {
    content: "\e90e";
}

.search-img:before {
    content: "\e92a";
}

.nmslogo-img:before {
    content: "\e965";
}

.dropdownBlk::before {
    color: var(--Grey-500) !important;
}

.dropdownBlk:hover::before {
    color: var(--BrandGreen-700) !important;
}

.dropdownBlk a:hover:not(.dropdown-item),
.dropdownBlk a:focus:not(.dropdown-item) {
    box-shadow: 0px 0px 10px 0px var(--black-10);
}

.dropdownBlk .dropdown-menu::before {
    content: '';
    display: block;
    position: absolute;
    top: -9px;
    left: calc(50% - 7.5px);
    border-style: solid;
    border-width: 0px 7.5px 9px 7.5px;
    border-color: transparent transparent #fff transparent;
}

@media (max-width:1680px) {
    .dropdownBlk .dropdown-menu::before {
        right: 27px;
        left: initial;
    }
}

.dropdownBlk .dropdown-menu {
    transition: all 0.3s ease;
    transform: translateY(10px);
    visibility: hidden;
    opacity: 0;
    display: block;
    top: 30px;
    border: none;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    padding: 20px 24px 5px 24px;
}

@media (max-width:1680px) {
    .dropdownBlk .dropdown-menu {
        right: 0px;
    }
}

.dropdownBlk .dropdown-menu.active {
    transition: all 0.3s ease;
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
    top: 44px;
    padding: 1rem 1.5rem 0 1.5rem;
}

@media (max-width:1680px) {
    .dropdownBlk .dropdown-menu.active {
        right: 0px;
    }
}

.dropdownBlk .dropdown-item {
    width: initial;
    height: initial;
    font-weight: 500;
    padding: 4px 8px 4px 0;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.dropdownBlk .dropdown-item::before {
    content: '';
    display: inline-block;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    margin-right: 10px;
    border-radius: 10px;
    background-position: center center;
    background-color: initial;
}

.fb-img::before {
    background-image: url('../images/icon/facebook_color.png');
}

.ig-img::before {
    background-image: url('../images/icon/instagram_color.png');
}

.line-img::before {
    background-image: url('../images/icon/Line_color.png');
}

.font-up::before {
    content: '\e913' !important;
}

.font-md::before {
    content: '\e914' !important;
}

.font-down::before {
    content: '\e915' !important;
}

.parkimg-nmns::before, .ts-mb-only.parkimg-nmns a::before {
    background-image: url('../images/parkimg-nmns.png');
    background-color: #009D85 !important;
    background-size: 88%;
}

.parkimg-921::before, .ts-mb-only.parkimg-921 a::before {
    background-image: url('../images/parkimg-921.png');
    background-color: #EF5D1E !important;
    background-size: 80%;
}

.parkimg-fhk::before, .ts-mb-only.parkimg-fhk a::before {
    background-image: url('../images/parkimg-fhk.png');
    background-color: #77A133 !important;
    background-position: -9px 0px !important;
    background-size: 119%;
}

.parkimg-cfpp::before, .ts-mb-only.parkimg-cfpp a::before {
    background-image: url('../images/parkimg-cfpp.png');
    background-size: 85%;
    background-color: #10436D !important;
}

.parkimg-kto::before, .ts-mb-only.parkimg-kto a::before {
    background-image: url('../images/parkimg-kto.png');
    background-size: 90%;
    background-color: #373962 !important;
    background-position-y: -3px !important;
}

.dropdownBlk .dropdown-item:focus, .dropdownBlk .dropdown-item:hover {
    background-color: initial;
    color: var(--BrandGreen-700);
}

.navBlk-menu {
    padding: 20px 0;
}

@media (max-width:991px) {
    .navBlk-menu {
        padding: 0;
    }
}

.navBlk-menu>ul {
    display: flex;
}

@media (max-width:991px) {
    .navBlk-menu>ul {
        display: none;
    }
}

.navBlk-menu>ul>li {
    list-style: none;
    flex: 1;
    text-align: center;
}

.navBlk-menu>ul>li>a {
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--Grey-900);
    display: block;
    line-height: 1;
    padding: 10px 0;
}

@media (max-width:1024px) {
    .navBlk-menu>ul>li>a {
        font-size: 1.25rem;
    }
}

body:has(.videoBlk) header .navBlk-menu>ul>li>a {
    color: var(--white-100);
}

body:has(.videoBlk) header .sticky .navBlk-menu>ul>li>a {
    color: var(--Grey-900);
}

.navBlk {
    width: 100%;
    z-index: 11;
    background-color: #fff;
    position: absolute;
    left: 0px;
    top: -2px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    visibility: hidden;
    opacity: 0;
    transition: all 0.7s ease;
    max-height: 0;
    overflow: hidden;
    border-top: 2px solid var(--BrandGreen-500);
}


@media (max-width:991px) {
    .active .navBlk {
        max-height: initial;
        overflow: initial;
        opacity: 1;
        position: initial;
        visibility: initial;
    }
}

.navBlk.active {
    max-height: 800px;
    opacity: 1;
    visibility: visible;
}

.navBlk>ul {
    display: flex;
    max-width: 1648px;
    padding: 0;
    transition: max-width 0.3s ease;
}

@media (max-width:991px) {
    .navBlk>ul {
        display: flex;
        flex-wrap: wrap;
        height: 78vh;
        overflow-y: auto;
    }

    .active .navBlk>ul.wrapper {
        padding: 1rem;
    }
}

@media (max-width:767px) {
    .navBlk>ul {
        height: 86vh;
    }
}

@media (max-width:575px) {
    .active .navBlk>ul.wrapper {
        padding: 0.5rem;
    }
}

.navBlk.active>ul {
    /* max-width: 1720px; */
}

.navBlk>ul>li {
    list-style: none;
    flex: 1;
    /* padding-left: 35px; */
    padding-top: 20px;
    padding-bottom: 40px;
    transition: background-colord 0.3s;
}

@media (max-width:1140px) {
    .navBlk>ul>li {
        padding: 0 0 0 12px;
    }
}

@media (max-width:991px) {
    .navBlk>ul>li {
        padding: 0px;
        position: relative;
        flex: initial;
        width: 100%;
    }
}

@media (max-width:991px) {
    .navBlk>ul>li>.arrow {
        position: absolute;
        right: 0px;
        top: 0px;
        cursor: pointer;
        width: 56px;
        height: 56px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 10px 0 0 10px;
    }

    .navBlk>ul>li>.arrow:before {
        content: '\e927';
        font-family: 'nmnsIcon';
        font-size: 1.5rem;
        font-weight: 600;
        line-height: 1;
        transition: transform 0.3s;
    }

    .navBlk>ul>li.active>.arrow:before {
        transform: rotate(90deg);
    }
}

@media (max-width:767px) {
    .navBlk>ul>li>.arrow {
        width: 52px;
        height: 52px;
    }

    .navBlk>ul>li>.arrow:before {
        font-size: 1.25rem;
    }
}

.navBlk>ul>li.bg {
    background-color: #ebfff4;
}

.navBlk>ul>li>a {
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--Grey-700);
    display: block;
    line-height: 1;
    padding: 10px 0;
    text-align: center;
}

@media (max-width:1140px) {
    .navBlk>ul>li>a {
        font-size: 1.5rem;
        background-color: var(--Grey-50);
        border-radius: 10px;
        /* margin-bottom: 10px; */
        padding: 16px 24px;
    }
}

@media (max-width:991px) {
    .navBlk>ul>li>a {
        text-align: left;
    }
}

@media (max-width:767px) {
    .navBlk>ul>li>a {
        font-size: 1.25rem;
    }
}

@media (max-width:575px) {
    .navBlk>ul>li>a {
        font-size: 1.125rem;
    }
}

.navBlk>ul>li>a:hover {
    color: var(--BrandGreen-700);
}

.navBlk>ul>li>ul {
    position: relative;
    height: 100%;
    margin-top: 20px;
    padding-left: 35px;
}

@media (max-width:991px) {
    .navBlk>ul>li:not(.ts-mb-only)>ul {
        position: relative;
        margin-top: 0;
        margin-bottom: 10px;
        opacity: 0;
        max-height: 0vh;
        visibility: hidden;
        transition: all 0.3s ease;
    }

    .navBlk>ul>li:not(.ts-mb-only).active>ul {
        max-height: 100vh;
        visibility: visible;
        height: initial;
        opacity: 1;
        transition: all 0.3s ease;
        margin-top: 1rem;
    }
}

.navBlk>ul>li:not(.ts-mb-only)>ul::before {
    content: '';
    height: calc(100% + 6px);
    display: block;
    width: 2px;
    background-color: var(--BrandGreen-500);
    opacity: 0.3;
    position: absolute;
    top: 0px;
    left: 35px;
}

@media (max-width:991px) {
    .navBlk>ul>li:not(.ts-mb-only)>ul::before {
        height: 100%;
    }
}

.navBlk>ul>li:not(.linkBlk)>ul>li {
    list-style: none;
    padding-left: 0.85rem;
}

@media (max-width:991px) {
    .navBlk>ul>li:not(.linkBlk)>ul>li {
        padding-left: 1rem;
    }
}

.navBlk>ul>li>ul>li>a {
    color: var(--Grey-700);
    line-height: 38px;
}

@media (max-width:991px) {
    .navBlk>ul>li>ul>li>a {
        font-size: 1.35rem;
        line-height: 52px;
    }
}

@media (max-width:480px) {
    .navBlk>ul>li>ul>li>a {
        font-size: 1.125rem;
        line-height: 42px;
    }
}

.navBlk>ul>li>ul>li>a:hover {
    color: var(--BrandGreen-700);
    font-weight: 500
}

.navBlk .submenu-title {
    position: relative;
}

.navBlk .submenu-title.active .submenu {
    padding: 10px 0 20px 0;
    max-height: 380px;
    visibility: visible;
    transition: all 1s ease;
}


.navBlk .submenu {
    position: relative;
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    transition: all 1s ease;
}

.navBlk .submenu li {
    list-style: none;
}

.navBlk .submenu li a {
    color: #464646;
    font-size: 1rem;
    line-height: 32px;
}

.navBlk .submenu li a:hover {
    color: var(--BrandGreen-700);
    font-weight: 500;
}

.navBlk .submenu li a::before {
    content: '-';
    display: inline-block;
    text-align: center;
    width: 15px;
    line-height: 1;
}

.navBlk .submenu-title .arrow {
    position: absolute;
    left: -8px;
    top: 10px;
    cursor: pointer;
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--BrandGreen-500);
    border-radius: 50%;
}

@media (max-width:991px) {
    .navBlk .submenu-title .arrow {
        left: -12px;
        top: 14px;
        width: 24px;
        height: 24px;
    }
}

@media (max-width:480px) {
    .navBlk .submenu-title .arrow {
        top: 9px;
    }
}

.navBlk .submenu-title.active .arrow,
.navBlk .submenu-title .arrow:hover {
    background-color: var(--BrandBlue-500);
}

.navBlk .submenu-title .arrow::before {
    content: '\e924';
    font-family: 'nmnsIcon';
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
}

@media (max-width:991px) {
    .navBlk .submenu-title .arrow::before {
        font-size: 1rem;
    }
}

.navBlk .submenu-title.active .arrow::before {
    content: '\e91e';
}

.navBlk .ts-mb-only {
    display: none;
}

@media (max-width:991px) {
    .navBlk .ts-mb-only {
        display: block;
        width: calc(100% / 4 - 1rem);
        margin: 0.5rem;
        border-radius: 10px;
        overflow: hidden;
    }
}

@media (max-width:860px) {
    .navBlk .ts-mb-only {
        width: 100%;
        flex-direction: row;
        padding: 0.5rem;
        margin: 5px 0;
    }
}


.navBlk .ts-mb-only a::before {
    content: '';
    display: block;
    width: 80px;
    height: 80px;
    margin-right: 1rem;
    background-repeat: no-repeat;
    background-position: center center;
}

@media (max-width:860px) {
    .navBlk .ts-mb-only a::before {
        width: 60px;
        height: 60px;
    }
}

@media (max-width:575px) {
    .navBlk .ts-mb-only a::before {
        width: 50px;
        height: 50px;
    }
}

.navBlk .ts-mb-only a {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 0;
    background-color: initial;
    padding: 1rem 2.65rem;
    color: var(--white-100);
    line-height: 1.5;
    font-size: 1.25rem;
    width: 100%;
    height: 100%;
}

@media (max-width:900px) {
    .navBlk .ts-mb-only a {
        padding: 1rem 2.25rem;
    }
}

@media (max-width:860px) {
    .navBlk .ts-mb-only a {
        max-width: 100%;
        flex-direction: row;
        padding: 0 0 0 0.5rem;
    }
}

@media (max-width:575px) {
    .navBlk .ts-mb-only a {
        font-size: 1rem;
    }
}


.navBlk .ts-mb-only.parkimg-nmns {
    background-color: #009d85
}

.navBlk .ts-mb-only.parkimg-921 {
    background-color: #ef5d1e
}

.navBlk .ts-mb-only.parkimg-fhk {
    background-color: #77a133
}

.navBlk .ts-mb-only.parkimg-cfpp {
    background-color: #10436d
}

.navBlk .ts-mb-only.parkimg-kto {
    background-color: #373962
}

.navBlk .ts-mb-only.linkBlk {
    width: 100%;
    margin: 0;
    padding: 0;
    /* display: block; */
}

.navBlk .ts-mb-only.linkBlk:before {
    content: none;
}

.navBlk .ts-mb-only.linkBlk a {
    max-width: initial;
    width: 100%;
    height: initial;
    border-radius: 10px;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    padding: 1rem;
}

@media (max-width:480px) {
    .navBlk .ts-mb-only.linkBlk a {
        padding: 0.5rem 0;
    }
}

.navBlk .ts-mb-only.linkBlk a::before {
    content: none;
}

.navBlk .ts-mb-only.linkBlk a .img {
    width: initial;
    font-size: 3rem;
    align-self: center;
    line-height: 1;
    margin-bottom: 0;
}

.navBlk .ts-mb-only.linkBlk a .text {
    margin-bottom: 0;
    font-size: 1.25rem;
    line-height: 1.5;
}


@media (max-width:768px) {
    .navBlk .ts-mb-only.linkBlk a .text {
        font-size: 1rem;
    }
}

@media (max-width:480px) {
    .navBlk .ts-mb-only.linkBlk a .text {
        font-size: 0.85rem;
    }
}

@media (max-width:375px) {
    .navBlk .ts-mb-only.linkBlk a .text {
        font-size: 0.8rem;
    }
}

.navBlk .ts-mb-only.linkBlk ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0.5rem 0 0 0;
    padding: 0 0 1rem 0;
}

@media (max-width:768px) {
    .navBlk .ts-mb-only.linkBlk ul {
        width: 100%;
    }
}

.navBlk .ts-mb-only.linkBlk ul li {
    margin: 0.5rem;
    padding: 0;
    width: calc(100% / 4 - 1rem);
}

@media (max-width:768px) {
    .navBlk .ts-mb-only.linkBlk ul li {
        width: calc(100% / 3 - 1rem);
    }
}

.mainBlk {
    position: relative;
    width: 100%;
    overflow: hidden;
}

body:has(.videoBlk) .mainBlk {
    margin-top: -201px;
}

@media (max-width:991px) {
    body:has(.videoBlk) .mainBlk {
        margin-top: 0rem;
    }
}

.bannercontainer {
    max-width: 1648px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.bannerBlk {
    max-width: 1600px;
    margin: 0 auto;
    aspect-ratio: 5 / 2;
    position: relative;
    overflow: hidden;
    box-shadow: 0px 10px 30px 0px var(--black-20);
}

@media (max-width: 768px) {
    .bannerBlk {
        aspect-ratio: 3 / 4;
    }
}

@media (min-width: 769px) {
    .bannerBlk {
        aspect-ratio: 5 / 2;
    }
}

.bannerBlk .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.bannerBlk ul li {
    list-style: none;
}

.bannerBlk ul li a {
    display: block;
    position: relative;
}

.bannerBlk ul li a:focus {
    border: 3px dotted orange;
}

.bannerBlk ul li a img {
    width: 100%;
    height: auto;
}

.bannerBlk ul li a .text {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 1rem;
    color: #fff;
    font-size: 1rem;
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0) 100%);
}

@media (max-width: 768px) {
    .banner-desktop {
        display: none;
    }

    .banner-mobi {
        display: block;
    }
}

@media (min-width: 769px) {
    .banner-desktop {
        display: block;
    }

    .banner-mobi {
        display: none;
    }
}

.bannerBlk .customContainer {
    background-color: var(--black-30);
    border-radius: 30px;
    padding: 7px 30px;
    bottom: 100px;
}

.bannerBlk .customContainer button.owl-prev::before,
.bannerBlk .customContainer button.owl-next::before {
    color: var(--white-100);
}

.bannerBlk .customContainer .custom-dots button span {
    background-color: #fff;
}

.bannerBlk .customContainer.disabled {
    display: none;
}

.bannerBlk .circle-timer {
    right: 30px;
}

.bannerBlk .circle-timer .bg {
    stroke: var(--white-100);
}

@media (max-width:768px) {
    .bannerBlk .circle-timer .bg {
        display: none;
    }
}

.bannerBlk .circle-timer .progress {
    stroke: var(--white-100);
}

.customContainer button, .owl-nav button {
    border: none;
    background-color: initial
}

.carousel-wrapper {
    text-align: center;
}

.customContainer {
    display: inline-flex;
    position: relative;
    z-index: 2;
    margin: 1em 0;
}

.customContainer.disabled {
    display: none;
}

.customContainer button.owl-prev,
.customContainer button.owl-next,
.owl-nav button {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.customContainer button.owl-prev.disabled,
.customContainer button.owl-next.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.customContainer button.owl-prev:hover,
.customContainer button.owl-next:hover,
.owl-nav button:hover {
    border: 2px solid var(--BrandGreen-300) !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%) !important;

}

.customContainer button.owl-prev::before,
.customContainer button.owl-next::before,
.owl-nav button::before {
    content: '\e962';
    font-family: 'nmnsIcon';
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--BrandGreen-600);
}

.customContainer button.owl-prev:hover::before,
.customContainer button.owl-next:hover::before,
.owl-nav button:hover:before {
    color: var(--BrandGreen-300);
}

.customContainer button span, .owl-nav button span {
    display: none;
}

.customContainer button.owl-prev, .owl-nav button.owl-prev {
    transform: scaleX(-1);
}

.customContainer .custom-dots {
    display: flex;
    align-items: center;
}

.customContainer .custom-dots button, .customContainer .custom-dots.swiper-pagination span {
    position: relative;
    margin: 0 10px;
    height: 5px;
}

.customContainer .custom-dots button span {
    opacity: 0.3;
    transition: all 0.3s;
    width: 5px;
    height: 5px;
    display: block;
    text-indent: -9999px;
    margin: 0 auto;
    background-color: var(--BrandGreen-500);
}

.customContainer .custom-dots.swiper-pagination span {
    opacity: 0.3;
    transition: all 0.3s;
    width: 5px;
    height: 5px;
    display: block;
    background-color: var(--BrandGreen-500);
    border-radius: 0px;
}

.customContainer .custom-dots.swiper-pagination span:hover {
    background-color: var(--BrandGreen-300);
}

.customContainer .custom-dots button.active span,
.customContainer .custom-dots.swiper-pagination span.swiper-pagination-bullet-active {
    opacity: 1;
    width: 35px;
}

.customContainer .custom-dots.swiper-pagination span:focus {
    outline: 2px dotted orange;
}

.customContainer .custom-dots.swiper-pagination {
    position: initial;
}

.information {
    position: fixed;
    right: 0px;
    bottom: 11rem;
    z-index: 10;
    transform: translate(240px, 0px);
    transition: transform 0.3s;
    border-radius: 8px 0 0 8px;
}

.information:has(.historyBlk) {
    transform: translate(240px, 23rem);
}

.zoom .information:has(.historyBlk) {
    transform: translate(480px, 11rem);
    display: flex;
    bottom: 21rem;
}

@media (max-width:575px) {
    .information {
        bottom: 7rem;
    }

    .information:has(.historyBlk) {
        bottom: 11rem;
    }
}

.information.active {
    transform: translate(0px, 0px);
    z-index: 15;
}

.information:has(.historyBlk).active {
    transform: translate(0px, 11rem);
}

.zoom .information:has(.historyBlk).active {
    transform: translate(0px, 11rem);
}

.information .infoBtn i {
    transition: transform 0.3s;
    display: block;
    color: var(--white-100);
}

.information.active .infoBtn i {
    transform: rotate(180deg);
}

body:has(#contributeButton) .information {
    bottom: 13rem;
}

.infoBtn {
    width: 70px;
    height: 290px;
    background-color: var(--BrandGreen-700);
    border-radius: 8px 0 0 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    padding: 1.5rem 0;
    border: none;
    position: relative;
    left: -70px;
    top: 146px;
}

.zoom .infoBtn {
    top: 290px;
}

.infoBtn.close {
    background-color: var(--Grey-500);
}

/* .infoBtn:hover {
    background-color: var(--BrandBlue-500);
} */

@media (max-width:1256px) {
    .infoBtn {
        box-shadow: -3px 2px 5px rgba(0, 0, 0, 0.2);
    }
}

@media (max-width:575px) {
    .infoBtn {
        width: 65px;
        height: 200px;
        padding: 0.75rem 0;
        left: -65px;
        top: 56px;
        box-shadow: -3px 2px 5px rgba(0, 0, 0, 0.2);
    }

    .zoom .infoBtn {
        top: 200px;
    }
}

.zoom .information:has(.historyBlk) .infoBtn {
    left: 0px;
    top: 0px;
}


.infoBtn .museum-img {
    display: block;
    width: 50px;
    height: 50px;
    background-image: url('../images/icon/museum-img_open.png');
    background-size: cover;
    margin-bottom: 0.5rem;
}

@media (max-width:575px) {
    .infoBtn .museum-img {
        width: 36px;
        height: 36px;
        margin-bottom: 0.25rem;
    }
}

.infoBtn.close .museum-img {
    background-image: url('../images/icon/museum-img_close.png');
}

.infoBtn .open {
    display: flex;
    justify-content: center;
}

.infoBtn .open::before {
    content: '今日開館中';
    font-weight: 700;
    line-height: 24px;
    display: block;
    width: 18px;
    color: var(--white-100);
}

@media (max-width:575px) {
    .infoBtn .open::before {
        font-size: 0.9rem;
        line-height: 1.5;
    }
}

.infoBtn.close .open::before {
    content: '今日休館';
}

.infoBtn .arrow {
    color: var(--white-100);
    font-size: 1.5rem;
}

.infoBlk {
    background-color: var(--white-100);
    padding: 1rem 1.25rem;
    width: 240px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    min-height: 290px;
    margin-top: -9rem;
}

@media (max-width:575px) {
    .infoBlk {
        min-height: 200px;
    }
}

.zoom .infoBlk {
    margin-top: initial;
}

@media (max-height:740px) {
    .infoBlk {
        /* padding: 0rem 1rem 1rem 1rem; */
    }
}

.infoBlk .today a {
    display: flex;
    flex-wrap: wrap;
    padding: 0.25rem 0.75rem 0 0.75rem;
    align-items: center;
    margin-bottom: 0.25rem;
    justify-content: center;
    color: var(--Grey-700);
}

.infoBlk .today a:hover {
    color: var(--BrandGreen-700);
}

.infoBlk .calendar {
    font-weight: 300;
    font-size: 2.5rem;
    display: flex;
    letter-spacing: -1px;
    align-items: center;
}

.infoBlk .calendar .day {
    display: flex;
    align-items: flex-end;
}

.infoBlk .calendar .day::before {
    content: '/';
    font-size: 1.25rem;
    margin: 0 0.25rem 0.1rem 0.35rem;
    line-height: 1;
}

.infoBlk .week {
    font-size: 11px;
    width: 11px;
    margin: 0 10px;
    line-height: 1;
}

.infoBlk .open_time {
    line-height: 1;
    font-size: 13px;
    font-weight: 700;
    /* width: 34px; */
    text-align: center;
}

.infoBlk .open_time a {
    color: var(--Grey-700);
}

.infoBlk .open_time a:hover {
    color: var(--BrandGreen-700);
}


.infoBlk .weatherBlk {
    display: flex;
    justify-content: center;
    font-size: 13px;
    color: var(--Grey-700);
    align-items: center;
}

.infoBlk .weather_img {
    margin-right: 0.25rem;
}

.infoBlk .weather_img img {
    width: 20px;
    height: 20px;
}

.infoBlk .air {
    line-height: 1.2;
    margin-left: 8px;
    display: flex;
    align-items: center;
}

.infoBlk .air::before {
    content: 'AQI ';
    margin-right: 0.5rem
}

.infoBlk .infoBlk_link {
    margin-top: 0.25rem;
}

@media (max-height:740px) {
    .infoBlk .infoBlk_link {
        margin-top: 0.5rem;
    }
}

.infoBlk .infoBlk_link a {
    width: 100%;
    line-height: 24px;
    font-size: 15px;
    color: var(--Grey-900);
    font-weight: 500;
    /* height: 42px; */
    padding: 0.5rem 15px;
}

.infoBlk .infoBlk_link .item a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* background-color: var(--Grey-50); */
    /* border-radius: 10px; */
    /* margin-bottom: 0.5rem; */
    transition: all 0.3s;
    padding: 0.5rem 0;
    border-bottom: var(--Grey-300) 1px solid;
}

.infoBlk .infoBlk_link .item a:hover {
    color: var(--BrandGreen-700);
}

.infoBlk .infoBlk_link .item a i {
    font-size: 1.25rem;
}

.infoBlk .infoBlk_link .ticket {
    margin-top: 0.75rem
}

.infoBlk .infoBlk_link .ticket a {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('../images/icon/ticketImg.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    transition: background-image 0.3s;
}

.infoBlk .infoBlk_link .ticket a:hover {
    background-image: url('../images/icon/ticketImg_hover.svg');
}

.infoBlk .infoBlk_link .ticket a img {
    margin-left: 0.25rem;
}


.historyBlk {
    /* position: absolute; */
    top: 300px;
    right: 0px;
    width: 240px;
    background-color: #e9e1ce;
    background-image: url('../images/history_bg.png');
    background-repeat: no-repeat;
    background-position: bottom center;
}

@media (max-height:740px) {
    .historyBlk {
        top: 272px;
    }
}

.historyBlk li {
    list-style: none;
}

.historyBlk .photo {
    width: 240px;
    height: 180px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.historyBlk .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.historyBlk .historyBlk_inner {
    padding: 1.5rem 1.5rem 2px 1.5rem;
    font-size: 1rem;
    color: var(--BrandGreen-700);
    font-weight: 500;
    line-height: 1.5;
}

@media (max-height:740px) {
    .historyBlk .historyBlk_inner {
        padding: 1rem 1rem 0 1rem;
    }
}

.historyBlk .historyBlk_inner .title, .historyBlk .historyBlk_inner .title a {
    font-size: 1.125rem;
    color: var(--Grey-900);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    /* overflow: hidden; */
    text-overflow: ellipsis;
}

@media (max-height:740px) {
    .historyBlk .historyBlk_inner .title, .historyBlk .historyBlk_inner .title a {
        font-size: 1rem;
    }
}

.historyBlk .historyBlk_inner .title a:hover {
    color: var(--BrandGreen-700);
}

.historyBlk .historyBlk_inner .date {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 0.125rem;
}

.historyBlk .historyBlk_inner .time {
    color: var(--Grey-700);
    font-size: 0.9rem;
    font-weight: 400;
}

.historyBlk .historyBlk_inner .time::before {
    font-family: 'nmnsIcon';
}

.historyBlk .customContainer {
    padding: 1rem 1.25rem 0 1.25rem;
    margin: 0;
}

@media (max-height:932px) {
    .historyBlk .customContainer {
        padding: 1rem;
        margin: 0;
    }
}

.historyBlk .customContainer button {
    margin: 0 5px;
}

.historyBlk .custom-dots.disabled {
    display: none;
}

.linkBlk {
    position: relative;
    margin-bottom: 3rem;
    margin-top: 42px;
}

/* .linkBlk::before {
    content: '';
    display: block;
    width: 100%;
    height: 1280px;
    background-image: url('../images/dot.png');
    position: absolute;
    left: calc(100% / 6 * -5);
    top: -200px;
    z-index: -1;
} */

.linkBlk .owl-carousel .owl-stage {
    margin: 0 auto;
}

.linkBlk ul, .linkBlk .owl-carousel {
    padding: 0 50px;
}

@media (max-width:768px) {
    .linkBlk ul, .linkBlk .owl-carousel {
        padding: 0;
        width: 95%;
        margin: 0 auto;
    }

    .linkBlk .owl-carousel .owl-stage-outer {
        overflow: initial;
    }
}

.linkBlk ul li, .linkBlk .item {
    list-style: none;
    text-align: center;
    padding: 0.5rem 0 2rem 0;
}

@media (max-width:480px) {
    .linkBlk ul li, .linkBlk .item {
        padding: 0;
    }
}

.linkBlk ul li a, .linkBlk .item a {
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
    width: 135px;
    height: 135px;
    margin: 0 auto;
    border-radius: 50%;
    box-shadow: 0px 5px 15px 0px var(--black-10);
    transition: all 0.3s;
    position: relative;
    background-color: var(--white-100);
}

@media (max-width:630px) {
    .linkBlk ul li a, .linkBlk .item a {
        width: 100px;
        height: 100px
    }
}

@media (max-width:480px) {
    .linkBlk ul li a, .linkBlk .item a {
        width: 90px;
        height: 90px
    }
}

.linkBlk ul li a::before, .linkBlk .item a::before {
    content: '';
    position: absolute;
    display: block;
    width: 135px;
    height: 135px;
    border-radius: 50%;
    top: 0px;
    left: 0px;
    border: 2px solid var(--BrandGreen-300);
    background: linear-gradient(146.72deg, var(--BrandGreen-100) 15.62%, var(--BrandBlue-200) 108.43%);
    z-index: -1;
    opacity: 0;
    transition: all 0.3s;
}

@media (max-width: 630px) {
    .linkBlk ul li a::before, .linkBlk .item a::before {
        width: 100px;
        height: 100px;
    }
}

@media (max-width: 480px) {
    .linkBlk ul li a::before, .linkBlk .item a::before {
        width: 90px;
        height: 90px;
    }
}

.linkBlk ul li a:hover, .linkBlk .item a:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    background-color: var(--white-0);
}

.linkBlk ul li a:hover::before, .linkBlk .item a:hover::before {
    opacity: 1;
}


.linkBlk ul li a .img, .linkBlk .item a .img {
    /* font-size: 4rem; */
    margin-bottom: 10px;
    max-width: 100%;
    align-self: flex-end;
}

@media (max-width:630px) {
    .linkBlk ul li a .img, .linkBlk .item a .img {
        /* font-size: 2.5rem; */
        margin-bottom: 8px;
        width: 50%;
    }
}

@media (max-width:480px) {
    .linkBlk ul li a .img, .linkBlk .item a .img {
        /* font-size: 2rem;
        margin-bottom: 3px; */
        width: 45%;
    }
}

.linkBlk ul li a:hover .img img, .linkBlk .item a:hover .img img {
    filter: brightness(0) opacity(0.9);
}

.linkBlk ul li a:hover .img i span::before, .linkBlk .item a:hover .img i span {
    color: var(--Grey-900);
}

.linkBlk ul li a .text, .linkBlk .item a .text {
    font-size: 1rem;
    line-height: 1;
    color: var(--Grey-500);
    font-weight: 500;
    margin-bottom: 10px;
    width: 100%;
}

@media (max-width:630px) {
    .linkBlk ul li a .text, .linkBlk .item a .text {
        font-size: 0.9rem;
    }
}

@media (max-width:480px) {
    .linkBlk ul li a .text, .linkBlk .item a .text {
        font-size: 0.8rem;
        margin-bottom: 5px;
    }
}

.linkBlk ul li a:hover .text, .linkBlk .item a:hover .text {
    font-size: 1rem;
    line-height: 1;
    color: var(--Grey-900);
    font-weight: 500;
}

@media (max-width:480px) {
    .linkBlk ul li a:hover .text, .linkBlk .item a:hover .text {
        font-size: 0.8rem;
    }
}

.linkBlk .owl-nav {
    position: absolute;
    width: calc(100% + 0px);
    top: 55px;
    left: 0px;
    z-index: -1;
    display: flex;
    justify-content: space-between;
}

.linkBlk .owl-nav button::before {
    color: var(--BrandGreen-600);
}

.linkBlk .owl-nav button:hover::before {
    color: var(--BrandGreen-300);
}

.latestBlk, .eventBlk, .exhibition {
    max-width: 1648px;
    padding: 0 1.5rem;
    margin: 0 auto 12rem auto;
    position: relative;
}

@media (max-width:1440px) {
    .latestBlk, .eventBlk, .exhibition {
        margin: 0 auto 10rem auto;
    }
}

@media (max-width:1024px) {
    .latestBlk, .eventBlk, .exhibition {
        margin: 0 auto 3rem auto;
    }
}

@media (max-width:768px) {
    .latestBlk, .eventBlk, .exhibition {
        padding: 0 2rem;
    }
}

@media (max-width:575px) {
    .latestBlk, .eventBlk, .exhibition {
        padding: 0 1.5rem;
    }
}

.nav-tab {
    position: absolute !important;
    top: 0px;
    right: 0px;
}

.nav-tab {
    display: flex !important;
    justify-content: flex-end;
}

.nav-tab .owl-stage {
    border-bottom: var(--Grey-200) 1px solid;
}

.nav-tab li {
    list-style: none;
    position: relative
}

.nav-tab li a {
    padding: 0.5rem 1.5rem;
    font-weight: 400;
    color: var(--Grey-500);
    min-width: 122px;
    display: block;
    text-align: center;
    cursor: pointer;
}

@media (max-width:1024px) {
    .nav-tab li a {
        font-size: 1rem;
        padding: 0.5rem 1rem;
    }
}

.nav-tab li a:hover {
    background: linear-gradient(146.72deg, #C8FADF 15.62%, #94D7F6 108.43%);
    border-bottom: 3px var(--BrandGreen-300) solid;
    color: var(--Grey-900);
}

.nav-tab li.active a {
    border-bottom: 3px transparent solid;
    font-weight: 500;
    color: var(--BrandGreen-700);
}

@media (max-width:991px) {
    .nav-tab li.active a {
        border-bottom: 3px var(--BrandGreen-700) solid;
    }
}


.latestBlk .nav-tab {
    z-index: 3;
}

@media (max-width:991px) {
    .latestBlk .nav-tab {
        margin-bottom: 3rem;
        position: initial !important;
        display: block !important;
    }
}

.latestBlk {
    text-align: center;
}

@media (max-width:991px) {
    .latestBlk .owl-carousel .owl-stage-outer {
        overflow: initial;
    }
}

.latestBlk .customContainer {
    margin-top: 1.5rem;
}

.latestBlk:has(.only-one) .customContainer {
    display: none;
}

.newsSwiper {
    position: relative;
    /* overflow: hidden; */
}

@media (max-width:850px) {
    .newsSwiper {
        width: 80%;
        margin: 4rem auto 0 auto;
    }
}

@media (max-width:480px) {
    .newsSwiper {
        margin: 2rem auto 0 auto;
    }
}

.newsSwiper .swiper-wrapper {
    align-items: flex-end;
    height: 320px;
    margin-left: -100px;
}

.newsSwiper.only-one .swiper-wrapper {
    margin-left: 0px;
}

@media (max-width:850px) {
    .newsSwiper .swiper-wrapper {
        height: initial;
        margin-left: initial;
    }
}

.newsSwiper .swiper-slide {
    width: 400px;
    height: 160px;
    overflow: hidden;
}

@media (max-width:850px) {
    .newsSwiper .swiper-slide {
        width: 100%;
        height: auto;
    }
}

.newsSwiper .swiper-slide a {
    pointer-events: none;
    display: block;
}

.newsSwiper .swiper-slide a:focus {
    border: orange 3px dotted;
}

.newsSwiper .swiper-slide .img {
    width: 100%;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center bottom;
    transition: all 0.6s ease;
    background-size: 400px 160px;
    aspect-ratio: 5 / 2;
    text-indent: -9999px;
}

@media (max-width:850px) {
    .newsSwiper .swiper-slide .img {
        background-size: cover;
    }
}

.newsSwiper .swiper-slide .img img {
    width: 100%;
}

.newsSwiper .swiper-slide-active {
    width: 800px !important;
    height: 320px;

}

@media (max-width:850px) {
    .newsSwiper .swiper-slide-active {
        width: 100% !important;
        height: auto;
        transform: scale(1.2);
        transform-origin: bottom;
    }
}

.newsSwiper .swiper-slide-active a {
    pointer-events: initial;
}

.newsSwiper .swiper-slide-active .img {
    background-size: 800px 320px;
    transition: all 0.6s ease;
}

@media (max-width:850px) {
    .newsSwiper .swiper-slide-active .img {
        background-size: cover;
    }
}

.newsSwiper .swiper-slide-next, .newsSwiper .swiper-slide-prev {
    width: 500px !important;
    height: 200px;
}

@media (max-width:850px) {
    .newsSwiper .swiper-slide-next, .newsSwiper .swiper-slide-prev {
        width: 100% !important;
        height: auto;
        transform: scale(0.75);
        transform-origin: bottom;
    }
}


.newsSwiper .swiper-slide-next .img, .newsSwiper .swiper-slide-prev .img {
    background-size: 500px 200px;
    transition: all 0.6s ease;
}

@media (max-width:850px) {
    .newsSwiper .swiper-slide-next .img, .newsSwiper .swiper-slide-prev .img {
        background-size: cover;
    }
}

.textSwiper {
    transition: opacity 0.6s ease;
    margin-bottom: 1rem;

}

.textSwiper .swiper-slide {
    min-height: 182px;
}

@media (max-width:850px) {
    .textSwiper .swiper-slide {
        min-height: initial;
        padding: 0 5px;
    }
}

.textSwiper .info {
    display: flex;
    color: var(--Grey-500);
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

.textSwiper .info .data {
    font-weight: 500;
    margin-right: 1.25rem;
}

.textSwiper .info .category {
    font-weight: 400;
}

.textSwiper .heading {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
    max-width: 900px;
    line-height: 1.2;
    text-align: left;
}

@media (max-width:850px) {
    .textSwiper .heading {
        font-size: 1.5rem;
    }
}

@media (max-width:575px) {
    .textSwiper .heading {
        font-size: 1.25rem;
        line-height: 1.5
    }
}

.textSwiper .heading a {
    color: var(--Grey-900);
}

.textSwiper .heading a:hover {
    color: var(--BrandGreen-700);
}

.autoplay-progress {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 10;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: var(--swiper-theme-color);
}

.autoplay-progress svg {
    --progress: 0;
    position: absolute;
    left: 0;
    top: 0px;
    z-index: 10;
    width: 100%;
    height: 100%;
    stroke-width: 4px;
    stroke: var(--swiper-theme-color);
    fill: none;
    stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
    stroke-dasharray: 125.6;
    transform: rotate(-90deg);
}

.goto {
    text-align: left;
}

.goto a {
    color: var(--BrandGreen-800);
    letter-spacing: 1px;
    position: relative;
}

.goto a::before {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0px;
    width: 0px;
    display: block;
    height: 3px;
    background-color: var(--BrandGreen-300);
    transition: width 0.3s ease;
}

.goto a:hover::before {
    width: calc(100% - 60px);
}

.goto a:hover {
    color: var(--Grey-900);
}

.goto a span {
    position: relative;
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    text-indent: -9999px;
    line-height: 1;
}

.goto a span::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transition: background-color 0.3s ease;
}

.goto a span::after {
    content: '';
    position: absolute;
    bottom: 4px;
    right: 0px;
    display: block;
    width: 10px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transform: rotate(45deg);
    transition: background-color 0.3s ease;
}

.goto a:hover span::before,
.goto a:hover span::after {
    background-color: var(--BrandGreen-300);
}

.eventBlk {
    display: flex;
    flex-wrap: wrap;
}

.eventBlk .amount {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
}

@media (max-width:991px) {
    .eventBlk .amount {
        margin-left: initial;
        width: 100%;
    }
}

.eventBlk .customContainer {
    margin-top: 4rem;
}

.eventBlk .carousel-wrapper {
    width: 100%;
}

#slider-event li {
    list-style: none;
    position: relative;
    text-align: left;
    border-bottom: var(--BrandGreen-700) 3px solid;
    border-radius: 20px;
    overflow: hidden;
}

#slider-event li h3 {
    padding: 10px 20px;
    line-height: 1;
    color: var(--white-100);
    background-color: var(--BrandGreen-700);
    position: absolute;
    bottom: 0px;
    left: 10px;
    font-weight: 400;
    font-size: 1.125rem;
    opacity: 1;
    transition: opacity 0.3s;
}

#slider-event li:hover h3, #slider-event .show li h3 {
    opacity: 0;
}

#slider-event .img {
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

#slider-event .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#slider-event .text {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    color: var(--white-100);
    z-index: 2;
    opacity: 0;
    transition: opacity 0.3s;
    /* padding: 0 3rem; */
}

@media (max-width:1024px) {
    #slider-event .text {
        padding: 0 1.5rem;
    }
}

#slider-event .text a {
    color: var(--white-100);
    display: block;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 3rem;
    border: transparent 3px dotted;
    border-radius: 20px;
}

#slider-event .text a:focus {
    border: orange 3px dotted;
}

#slider-event .text:hover, #slider-event .show .text {
    opacity: 1;
}

#slider-event .text::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    bottom: 0px;
    left: 0px;
    background-color: var(--BrandGreen-700);
    opacity: 0.9;
    z-index: -1;
    transition: transform 0.3s;
    transform: scaleY(0);
    transform-origin: bottom;
}

#slider-event .text:hover::before, #slider-event .show .text::before {
    transform: scaleY(1);
}

#slider-event .heading {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

@media (max-width:991px) {
    #slider-event .heading {
        margin-bottom: 0.5rem;
    }
}

@media (max-width:767px) {
    #slider-event .heading {
        margin-bottom: 1rem;
    }
}

#slider-event .descript {
    width: 230px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.8;
    margin-bottom: 1rem;
}

@media (max-width:1024px) {
    #slider-event .descript {
        width: 100%;
    }
}

@media (max-width:991px) {
    #slider-event .descript {
        margin-bottom: 0rem;
    }
}

@media (max-width:767px) {
    #slider-event .descript {
        width: 80%;
        margin-bottom: 1rem;
    }
}

#slider-event .goto a {
    color: var(--white-100);
}

#slider-event .goto a span::before, #slider-event .goto a span::after {
    background-color: var(--white-100);
}

#slider-event .goto a:hover span::before, #slider-event .goto a:hover span::after,
#slider-event .goto a:focus span::before, #slider-event .goto a:focus span::after {
    background-color: var(--BrandGreen-300);
}

#slider-event .owl-nav {
    padding: 7px 30px;
    max-width: 280px;
    margin: 2rem auto 0 auto;
}

#slider-event .owl-dots {
    max-width: 200px;
    margin: -35px auto 0 auto;
}

.exhibition {
    margin-bottom: 15rem;
}

@media (max-width:1140px) {
    .exhibition {
        margin-bottom: 10rem;
    }
}

@media (max-width:1024px) {
    .exhibition {
        margin-top: 5rem;
        margin-bottom: 8rem;
    }
}

@media (max-width:991px) {
    .exhibition {
        margin-bottom: 5rem;
    }
}

.exhibition::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -160px;
    width: 760px;
    height: 640px;
    display: block;
    z-index: -1;
    background: linear-gradient(146.72deg, #C8FADF 15.62%, #94D7F6 108.43%);
}

@media (max-width:1024px) {
    .exhibition::before {
        top: 191px;
    }
}

@media (max-width:575px) {
    .exhibition::before {
        top: 182px;
    }
}

.exhibition .nav-tab {
    top: -8px;
    right: 0px;
    z-index: 4;
    position: relative !important;
}

@media (max-width:1024px) {
    .exhibition .nav-tab {
        position: initial !important;
        margin-bottom: 5rem;
        display: block !important;
    }
}

.exhibition .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.index #slider-exhibition li {
    display: flex;
    flex-wrap: wrap;
}

.index #slider-exhibition li .text {
    width: 290px;
    margin-right: 4rem;
    flex-shrink: 0;
    opacity: 0;
    visibility: hidden;
}

@media (max-width:1280px) {
    .index #slider-exhibition li .text {
        width: 24%;
    }
}

@media (max-width:1024px) {
    .index #slider-exhibition li .text {
        width: 100%;
    }
}

.index #slider-exhibition li .heading {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 3rem;
}

@media (max-width:1024px) {
    .index #slider-exhibition li .heading {
        margin-bottom: 1.5rem;
    }
}

.index #slider-exhibition li .descript {
    margin-bottom: 3rem;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width:1024px) {
    .index #slider-exhibition li .descript {
        margin-bottom: 1rem;
        /* text-overflow: initial;
        display: block;
        overflow: initial; */
    }
}

.index #slider-exhibition .active li .text {
    opacity: 1;
    visibility: visible;
}

.index #slider-exhibition li .img {
    overflow: hidden;
    aspect-ratio: 3.72 / 2;
    width: 87.5%;
    position: absolute;
    right: -160px;
    top: -60px;
    flex-shrink: 0;
    transition: all 1.5s ease;
    opacity: 0;
    visibility: hidden;
}

@media (max-width:1024px) {
    .index #slider-exhibition li .img {
        width: calc(100% + 2rem);
        position: relative;
        top: 0px;
        right: 0px;
        margin-top: 1rem;
    }
}

@media (max-width:768px) {
    .index #slider-exhibition li .img {
        aspect-ratio: 3 / 4;
    }
}

@media (max-width:575px) {
    .index #slider-exhibition li .img {
        width: calc(100% + 1.5rem);
    }
}

.index #slider-exhibition .active li .img {
    opacity: 1;
    visibility: visible;
}

.index #slider-exhibition li .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.otherPark {
    padding: 17rem 1.5rem 8rem 1.5rem;
    max-width: 1648px;
    margin: 0 auto;
    position: relative;
}

@media (max-width:1440px) {
    .otherPark {
        padding: 10rem 1.5rem 8rem 1.5rem;
    }
}

@media (max-width:1280px) {
    .otherPark {
        padding: 5rem 1.5rem 8rem 1.5rem;
    }
}

@media (max-width:991px) {
    .otherPark {
        padding: 0rem 1.5rem 8rem 1.5rem;
    }
}

.otherPark .customContainer {
    margin-top: 2rem;
}

#slider-park {
    max-width: 1220px;
    margin-left: 359px;
}

@media (max-width:1023px) {
    #slider-park {
        margin-left: 0px;
    }
}

@media (max-width:991px) {
    #slider-park {
        width: 90%;
        margin: 0 auto;
    }
}

#slider-park .owl-stage-outer {
    overflow: initial;
}

#slider-park li {
    list-style: none;
    opacity: 0.5;
    transition: all 0.3s;
}

#slider-park .active li {
    opacity: 1;
}

#slider-park .owl-item:first-child li {
    opacity: 0;
}

#slider-park .active li, #slider-park .owl-item:first-child.active li {
    opacity: 1;
}

#slider-park .owl-item:nth-of-type(1) .photo-bg {
    border-radius: 48% 41% 31% 36%;
}

#slider-park .owl-item:nth-of-type(2) .photo-bg {
    border-radius: 50% 42% 35% 32%;
}

#slider-park .owl-item:nth-of-type(3) .photo-bg {
    border-radius: 40% 41% 40% 36%;
}

#slider-park .owl-item:nth-of-type(4) .photo-bg {
    border-radius: 48% 45% 33% 45%;
}

#slider-park .photo-bg {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

#slider-park .photo-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#slider-park li:hover .descript, #slider-park .show li .descript {
    opacity: 1;
}

#slider-park .descript {
    text-align: left;
    opacity: 0;
    color: var(--white-100);
    width: 100%;
    /* height: 360px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: opacity 0.3s;
    position: absolute;
    top: 0px;
    left: 0px;
    aspect-ratio: 1 / 1;
}

#slider-park .descript a {
    color: var(--white-100);
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 60px;
}

#slider-park .owl-item:nth-of-type(1) .descript {
    border-radius: 48% 41% 31% 36%;
    background-color: rgba(239, 93, 30, 1);
}

#slider-park .owl-item:nth-of-type(2) .descript {
    border-radius: 50% 42% 35% 32%;
    background-color: rgba(119, 161, 51, 1);
}

#slider-park .owl-item:nth-of-type(3) .descript {
    border-radius: 40% 41% 40% 36%;
    background-color: rgba(16, 67, 109, 1);
}

#slider-park .owl-item:nth-of-type(4) .descript {
    border-radius: 48% 45% 33% 45%;
    background-color: rgba(55, 57, 98, 1);
}

#slider-park .descript .goto {
    margin-top: 1rem;
}

#slider-park .descript .goto a {
    color: var(--white-100);
}

#slider-park .descript .goto a span::before,
#slider-park .descript .goto a span::after {
    background-color: var(--white-100);
}

#slider-park .goto a:hover span::before, #slider-park .goto a:hover span::after,
#slider-park .show .goto a span::before, #slider-park .show .goto a span::after {
    background-color: var(--BrandGreen-300);
}

#slider-park .mascot {
    display: flex;
    align-items: center;
}

#slider-park .photo {
    width: 100px;
    height: 100px;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

#slider-park .photo img {
    width: 100%;
    height: auto;
}

#slider-park .info {
    margin-top: 0.5rem;
}

#slider-park .heading {
    font-size: 1.375rem;
    font-weight: 500;
}

#slider-park .weatherBlk {
    display: flex;
    align-items: center;
    font-size: 0.813rem;
    color: var(--Grey-500);
}

#slider-park .weather_img {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 0.25rem;
}

#slider-park .open::before {
    content: '﹒開館中';
}

#slider-park .closed .open::before {
    content: '﹒休館中';
}

#slider-park .owl-nav {
    padding: 7px 30px;
    max-width: 280px;
    margin: 1rem auto 0 auto;
}

#slider-park .owl-dots {
    max-width: 200px;
    margin: -35px auto 0 auto;
}

footer {
    border-top: var(--BrandBlue-500) 5px solid;
}

.footerBlk {
    max-width: 1648px;
    margin: 0 auto;
    padding: 3rem 1.5rem;
}

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

@media (max-width:630px) {
    .footerBlk .Blk {
        flex-direction: column;
    }
}

.footerBlk .logo a {
    background-image: url('../images/logo.svg');
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    height: 44px;
    width: 334px;
}

@media (max-width:360px) {
    .footerBlk .logo a {
        width: 260px;
    }
}

.footerBlk .share {
    display: flex;
    align-items: center;
}

@media (max-width:630px) {
    .footerBlk .share {
        margin-top: 1.5rem;
    }
}

@media (max-width:360px) {
    .footerBlk .share {
        margin-top: 1rem;
    }
}

.footerBlk .share ul {
    display: flex;
    align-items: center;
}

@media (max-width:991px) {
    .footerBlk .share ul {
        padding: 0;
    }
}

.footerBlk .share ul li {
    list-style: none;
}

.footerBlk .share ul li a {
    color: var(--BrandGreen-700);
    margin: 0 10px;
    font-size: 1.875rem;
    display: block;
    width: 30px;
    height: 30px;
    overflow: hidden;
}

.footerBlk .share ul li a::before {
    font-family: 'nmnsIcon';
    color: var(--BrandGreen-700);
}

.footerBlk .share ul li a.fb::before {
    content: "\e911";
}

.footerBlk .share ul li a.ig::before {
    content: "\e918";
}

.footerBlk .share ul li a.yt::before {
    content: "\e938";
}

.footerBlk .share ul li a.rss::before {
    content: "\e928";
}

.footerBlk .share ul li a:hover::before {
    color: var(--BrandBlue-500);
}

.footerBlk .share .btn-collapse {
    background-color: var(--Grey-50);
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px -3px 0px 0px rgba(0, 0, 0, 0.15) inset;
    font-weight: 500;
    width: 175px;
    height: 50px;
    color: var(--black-100);
    margin-left: 0.875rem;
    transition: all 0.3s;
}

@media (max-width:991px) {
    .footerBlk .share .btn-collapse {
        display: none;
    }
}

.footerBlk .share .btn-collapse:hover {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.15) inset;
    transform: translateY(3px);
    color: var(--BrandGreen-700);
}

.footerBlk .share .btn-collapse::after {
    content: '\e924';
    font-family: 'nmnsIcon';
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    background-color: var(--Grey-900);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
}

.footerBlk .share .btn-collapse:hover::after {
    background-color: var(--BrandGreen-700);
}

.footerBlk .share .btn-collapse.checked::after {
    content: '\e91e';
}

.footerBlk .navBlk {
    /* display: none; */
    position: initial;
    box-shadow: none;
    max-height: initial;
    transition: initial;
    visibility: initial;
    overflow: initial;
    opacity: inherit;
    border-top: none;
}

@media (max-width:991px) {
    .footerBlk .navBlk {
        display: none;
    }
}

.footerBlk ul {
    max-width: 1648px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.footerBlk .navBlk>ul {
    padding: 54px 0 0 0;
}

.footerBlk .navBlk>ul>li {
    padding-top: 0;
    padding-left: 20px;
    position: relative;
}

.footerBlk .navBlk>ul>li::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    height: 100%;
    width: 1px;
    background-color: var(--Grey-200);
}

.footerBlk .navBlk>ul>li:last-child:after {
    content: '';
    position: absolute;
    top: 0px;
    right: 0px;
    display: block;
    height: 100%;
    width: 1px;
    background-color: var(--Grey-200);
}

.footerBlk .navBlk>ul>li>a {
    font-size: 1.25rem;
    color: var(--BrandGreen-700);
    padding: 0 0 0 0.85rem;
    text-align: left;
    background-color: initial;
}

.footerBlk .navBlk>ul>li>a:hover {
    color: var(--BrandBlue-500);
}

.footerBlk .navBlk>ul>li>ul {
    padding-left: 0px;
}

.footerBlk .navBlk>ul>li>ul::before {
    content: none;
}

.footerBlk .navBlk .submenu {
    padding: 0;
}

.footerBlk .navBlk .submenu-title .arrow {
    background-color: var(--Grey-50);
}

.footerBlk .navBlk .submenu-title .arrow:hover, .footerBlk .navBlk .submenu-title.active .arrow {
    background-color: var(--BrandGreen-700);
}

.footerBlk .navBlk .submenu-title .arrow::before {
    color: var(--Grey-500);
}

.footerBlk .navBlk .submenu-title .arrow:hover::before, .footerBlk .navBlk .submenu-title.active .arrow::before {
    color: var(--white-100);
}

.copyRightBlk {
    background-color: var(--BrandGreen-700);
    color: var(--white-100);
    font-size: 1rem;
    padding: 45px 0;
}

.copyRightBlk a {
    color: var(--white-100);
    font-size: 1rem;
}

.copyRightBlk a:hover {
    text-decoration: underline;
}

.copyRightBlk p {
    margin: 0 15px;
}

@media (max-width:1024px) {
    .copyRightBlk p {
        margin: 0 15px 10px 15px;
    }
}

.copyRight-inner {
    max-width: 1648px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-wrap: wrap;
}

.copyRightBlk .nmns-info {
    margin-left: -15px;
}

@media (max-width:630px) {
    .copyRightBlk .nmns-info {
        margin-left: 0px;
    }
}

.copyRightBlk ul {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width:1024px) {
    .copyRightBlk ul {
        margin-bottom: 10px;
    }
}

@media (max-width:630px) {
    .copyRightBlk ul {
        justify-content: center;
        margin-bottom: 30px;
    }
}

.copyRightBlk li {
    list-style: none;
    margin: 0 15px;
}

@media (max-width:630px) {
    .copyRightBlk li {
        line-height: 1.5;
        margin-bottom: 10px;
    }

    .copyRightBlk ul li.map-icon {
        width: 100%;
        text-align: center;
    }
}

.copyRightBlk li::before {
    content: none !important;
}

.copyRightBlk .privacy {
    display: flex;
    flex-wrap: wrap;
    line-height: 1;
    margin-top: 12px;
}

@media (max-width:630px) {
    .copyRightBlk .privacy {
        justify-content: center;
        margin-top: 0;
    }
}

.copyRightBlk .privacy ul {
    border-left: var(--white-100) 1px solid;

}

.copyRightBlk .privacy ul li {
    border-right: var(--white-100) 1px solid;
    padding-right: 15px;
    margin: 0 0 0 15px;
}

@media (max-width:630px) {
    .copyRightBlk .privacy ul {
        border-left: none;
        border-right: none;
        margin-bottom: 10px;
    }

    .copyRightBlk .privacy ul li {
        margin: 0 10px
    }

    .copyRightBlk .privacy ul li:last-of-type {
        border-right: none;
        padding-right: 0;
    }
}

@media (max-width:423px) {
    .copyRightBlk .privacy ul li {
        border-right: none;
        padding-right: 0;
    }
}

.copyRightBlk .govBlk {
    margin-left: auto;
}

@media (max-width:1140px) {
    .copyRightBlk .govBlk {
        margin-left: initial;
        margin-top: 1rem;
    }
}

@media (max-width:630px) {
    .copyRightBlk .govBlk {
        margin: 30px auto 0 auto;
    }
}

.copyRightBlk .govBlk a {
    display: inline-block;
}


.copyRightBlk .govBlk a {
    margin: 0 7.5px;
}


.stickBlk {
    position: fixed;
    right: 1rem;
    bottom: 2rem;
    z-index: 10;
    display: none;
}

.stickBlk .blk a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    background-color: var(--white-100);
    margin-top: 1rem;
    transition: box-shadow 0.3s ease;
    font-size: 1.75rem;
    color: var(--Grey-500);
}

.stickBlk .blk a i {
    font-weight: normal;
}

.stickBlk .blk a:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    color: var(--BrandGreen-700);
}

.stickBlk .blk a.upload-img::before {
    content: '';
    display: block;
    width: 28px !important;
    height: 28px !important;
    background-image: url('../images/icon/upload.png');
    background-size: contain;
    background-repeat: no-repeat;
    filter: grayscale(1) opacity(0.85);
}

.stickBlk .blk a.upload-img:hover::before {
    filter: grayscale(0) opacity(1);
}

.stickBlk .blk a span {
    position: absolute;
    bottom: -38px;
    background-color: #fff;
    font-size: 0.875rem;
    color: var(--black-100);
    padding: 10px 15px;
    white-space: nowrap;
    z-index: 3;
    border-radius: 5px;
    line-height: 1;
    font-size: 0.813rem;
    transition: all 0.3s ease;
    transform: translateY(10px);
    box-shadow: 0px 10px 30px 0px var(--black-20);
    min-width: 82px;
    text-align: center;
    visibility: hidden;
    opacity: 0;
}

.stickBlk .blk a span::before {
    content: '';
    display: block;
    position: absolute;
    top: -9px;
    left: calc(50% - 7.5px);
    border-style: solid;
    border-width: 0px 7.5px 9px 7.5px;
    border-color: transparent transparent #fff transparent;
}

/* .stickBlk .blk a:hover span {
    transition: all 0.3s ease;
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
} */

.stickBlk .dropdownBlk .dropdown-menu {
    padding: 0;
    min-width: initial;
    top: initial;
    bottom: 0px;
}

.stickBlk .dropdownBlk .dropdown-menu::before {
    top: initial;
    bottom: -9px;
    border-width: 9px 7.5px 0px 7.5px;
    border-color: #fff transparent transparent transparent;
}

@media (max-width:1680px) {
    .stickBlk .dropdownBlk .dropdown-menu::before {
        left: calc(50% - 7.5px);
    }
}

.stickBlk .dropdownBlk .dropdown-menu a {
    box-shadow: initial;
    margin: 0;
    position: relative;
    background-color: initial;
}

.stickBlk .dropdownBlk .dropdown-menu.active {
    top: initial;
    bottom: 58px;
    right: 0px;
}

.stickBlk .dropdownBlk .dropdown-item {
    padding: 0;
}

.stickBlk .dropdownBlk .dropdown-item::before {
    margin-right: 0;
}

.stickBlk li {
    list-style: none;
}

.stickBlk li.dropdownBlk {
    position: relative;
}

.cookie {
    position: fixed;
    left: 0px;
    bottom: 0px;
    padding: 0.5rem 1rem;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    text-align: center;
    z-index: 7;
    width: 100%;
    font-size: 1rem;
}

.cookie a {
    color: #fff;
    text-decoration: underline !important;
}

.cookie a:hover {
    color: #05D9B8;
}

.cookie button {
    background-color: #007C69;
    color: #fff;
    margin-left: 1rem;
    border: #007C69 solid 1px;
}

.grid-bg {
    width: 100%;
    height: 1214px;
    background-image: url('../images/bg-grid.png');
    position: absolute;
    bottom: 0px;
    z-index: -1;
}

#TaiwanMap {
    position: absolute;
    bottom: 0px;
    left: -188px;
    z-index: 2;
}

@media (max-width:1023px) {
    #TaiwanMap {
        display: none;
    }
}

#TaiwanMap .st0 {
    isolation: isolate;
    opacity: .3;
}

#TaiwanMap .st0, #TaiwanMap .st1 {
    fill: #4d5461;
    transform-origin: center;
    transform-box: fill-box;
    transition: transform 0.3s;
}

#TaiwanMap g.active circle.st0, #TaiwanMap g:hover circle.st0 {
    fill: #009d85;
    opacity: 0.3;
    transform: scale(1.5);
}

#TaiwanMap g.active circle.st1, #TaiwanMap g:hover circle.st1 {
    fill: #009d85;
    transform: scale(1.5);
}

#TaiwanMap g text {
    font-size: 0.8rem;
    fill: var(--Grey-500);
    display: none;
}

#TaiwanMap g.active text, #TaiwanMap g:hover text {
    display: block;
}

.circle-timer {
    position: absolute;
    right: 0px;
    width: 50px;
    height: 50px;
    z-index: -1;
}

.circle-timer svg {
    transform: rotate(-90deg);
}

.circle-timer circle {
    fill: none;
    stroke-width: 2px;
}

.circle-timer .bg {
    stroke: var(--BrandGreen-600);
    opacity: 0.2;
}

@media (max-width: 768px) {
    .circle-timer .bg {
        display: none;
    }
}

.circle-timer .progress {
    stroke: var(--BrandGreen-600);
    stroke-dasharray: 144.51;
    stroke-dashoffset: 144.51;
    transition: none;
}

@media (max-width: 768px) {
    .circle-timer .progress {
        display: none;
    }
}

.amount .item {
    display: flex;
    align-items: center;
    margin-bottom: 3.75rem;
    margin-left: 100px;
}

@media (max-width:991px) {
    .amount .item {
        margin-left: initial;
        margin-right: 40px;
    }
}

@media (max-width:768px) {
    .amount .item {
        margin-right: 0px;
        width: 100%;
    }
}

/* @media (max-width:768px) {
    .amount .item {
        margin-right: initial;
        flex: 1;
        flex-direction: column;
    }
} */

/* @media (max-width:480px) {
    .amount .item {
        flex: initial;
        width: 100%;
    }
} */

.amount .item::before {
    content: '';
    display: inline-block;
    width: 70px;
    height: 70px;
    background-repeat: no-repeat;
    margin-right: 20px;
    transition: background-image 1s ease;
    margin-bottom: 0.5rem;
}

/* @media (max-width:767px) {
    .amount .item::before {
        margin-bottom: 1rem;
        margin-right: 0px;
    }
} */

.amount .item:hover::before {
    transition: background-image 1s ease;
}

.amount .item:nth-of-type(1)::before {
    background-image: url('../images/icon/box.png');
}

.amount .item:hover:nth-of-type(1)::before {
    background-image: url('../images/icon/box_line.png');
}

.amount .item:nth-of-type(2)::before {
    background-image: url('../images/icon/people.png');
}

.amount .item:hover:nth-of-type(2)::before {
    background-image: url('../images/icon/people_line.png');
}

.amount .item .number {
    font-size: 3rem;
    position: relative;
}

@media (max-width:575px) {
    .amount .item .number {
        font-size: 2.5rem;
    }
}

@media (max-width:480px) {
    .amount .item .number {
        font-size: 2rem;
    }
}


.amount .item .number::before {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 0px;
    z-index: -1;
    width: 0%;
    height: 5px;
    background-color: var(--BrandGreen-300);
    transition: width 1s ease;
}

.amount .item:hover .number::before {
    width: 100%;
}

.amount .item .number span {
    margin-left: 0.25rem;
    font-size: 1.125rem;
}

.searchBar .modal-dialog, .mainBlk .modal-dialog {
    width: 80%;
    max-width: initial;
}

@media (max-width: 768px) {

    .searchBar .modal-dialog,
    .searchBar .modal-body .input-group,
    .mainBlk .modal-dialog {
        width: 90%;
        margin: 0 auto;
    }
}

.searchBar .modal-content {
    border-radius: 0;
}

.searchBar .modal-header {
    padding: 32px !important;
    border-bottom: none;
    text-align: center;
    display: initial;
    justify-content: initial;
}

.searchBar .modal-header .modal-title {
    font-size: 1.5rem;
    line-height: 32px;
    margin: 0;
    letter-spacing: 1px;
}

.searchBar .modal-header .modal-title::before {
    content: none;
}

.searchBar .modal-header .modal-title label {
    margin-bottom: 0;
}

.searchBar .modal-header button.close {
    position: absolute;
    top: 0px;
    right: 0px;
    margin: 0;
    background-color: initial;
    border: none;
    display: block;
    width: 50px;
    height: 50px;
    font-size: 1.75rem;
}

.searchBar .modal-header button.close:hover {
    color: var(--BrandGreen-500);
}

.searchBar .modal-body {
    padding-top: 0;
}

.searchBar .input-group {
    width: 80%;
    margin: 0 auto;
}

.searchBar .input-group input {
    border: var(--Grey-200) 1px solid;
    flex-grow: 1;
    border-radius: 0.5rem !important;
    line-height: 50px;
    padding: 0 1rem;
    margin-right: 1.5rem;
}

@media (max-width:575px) {
    .searchBar .input-group input {
        margin-right: 0;
    }
}

.searchBar .input-group button, #btnSubmit {
    background-color: var(--BrandGreen-700);
    position: relative;
    color: var(--white-100);
    border: none;
    height: 100%;
    border-radius: 0.5rem;
    overflow: hidden;
    z-index: 1;
    min-width: 150px;
    padding: 0 1.5rem 0 0;
}

@media (max-width:575px) {
    .searchBar .btnBlk {
        width: 100%;
        margin-top: 1rem;
        height: 52px
    }

    .searchBar .input-group button {
        width: 100%;
        justify-content: center;
    }
}

.searchBar .input-group button::before, #btnSubmit::before {
    content: '';
    width: 3px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
    transition: all 0.5s ease;
}

.searchBar .input-group button:hover::before, #btnSubmit:hover::before {
    width: 100%;
}

.searchBar .input-group button::after {
    font-family: 'nmnsIcon';
    content: "\e92a";
    border-left: var(--white-100) 1px solid;
    display: inline-block;
    width: 34px;
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 1px;
    top: 11px;
}

.searchBar .nmnsBlk {
    width: 80%;
    margin: 35px auto 16px auto;
    display: flex;
    justify-content: center;
    font-size: 15px;
    color: var(--BrandGreen-700);
}

@media (max-width:768px) {
    .searchBar .nmnsBlk {
        width: 90%;
    }
}

@media (max-width:575px) {
    .searchBar .nmnsBlk {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.searchBar .nmnsBlk p {
    white-space: nowrap;
    margin: 10px;
}

.searchBar .nmnsBlk ul {
    display: flex;
    flex-wrap: wrap;
}

.searchBar .nmnsBlk ul li {
    list-style: none;
    margin: 10px;
}

@media (max-width:575px) {
    .searchBar .nmnsBlk ul li {
        margin: 6px 10px;
    }
}

.searchBar .nmnsBlk ul li a {
    color: var(--BrandGreen-700);
    text-decoration: none;
    position: relative;
}

.searchBar .nmnsBlk ul li a::before {
    content: '';
    position: absolute;
    bottom: -8px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--Grey-200);
    transition: all 0.3s ease;
}

.searchBar .nmnsBlk ul li a:hover::before {
    height: 2px;
    background-color: var(--BrandGreen-300);
}

.searchBar .nmnsBlk ul li a:hover {
    color: var(--Grey-900);
}

.mainBlk>.content {
    max-width: 1648px;
    margin: 0 auto;
    border-top: var(--Grey-200) 1px solid;
    position: relative;
    padding: 0.75rem 1.5rem 7rem 1.5rem;
}

.breadcrumb {
    padding-left: 20px;
    line-height: 50px;
}

@media (max-width:767px) {
    .breadcrumb {
        margin-bottom: 0.25rem;
    }
}

@media (max-width:575px) {
    .breadcrumb {
        margin-top: 0.75rem;
    }
}

.breadcrumb .breadcrumb-item:first-child::before {
    content: '\e931';
    font-family: 'nmnsIcon';
    font-size: 18px;
    margin-right: 3px;
    position: absolute;
    left: -20px;
}

@media (max-width:575px) {
    .breadcrumb .breadcrumb-item:first-child::before {
        top: -4px;
    }
}

.breadcrumb .breadcrumb-item a, .breadcrumb .breadcrumb-item {
    font-size: 15px;
    color: var(--Grey-500);
    position: relative;
}

@media (max-width:575px) {
    .breadcrumb .breadcrumb-item a, .breadcrumb .breadcrumb-item {
        line-height: 1.8;

    }
}

.breadcrumb .breadcrumb-item a:hover {
    color: var(--Grey-900);
}

.breadcrumb .breadcrumb-item a::before {
    content: '';
    position: absolute;
    bottom: 6px;
    display: block;
    width: 100%;
    height: 2px;
    left: 0px;
    transition: all 0.3s ease;
    background-color: transparent;
}

.breadcrumb .breadcrumb-item a:hover::before {
    height: 2px;
    background-color: var(--BrandGreen-300);
}

.breadcrumb .breadcrumb-item.active {
    color: var(--BrandGreen-700);
}

.content .info:has(.share) {
    position: absolute;
    top: 0.75rem;
    right: 1.5rem;
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 500;
    color: var(--Grey-500);
    height: 50px;
}

@media (max-width:768px) {
    .content .info:has(.share) {
        position: initial;
        margin-bottom: 1rem;
        justify-content: flex-end;
    }
}

@media (max-width:575px) {
    .content .info:has(.share) {
        margin-top: 1rem;
    }
}

.content .info .view {
    display: flex;
    align-items: center;
    color: var(--Grey-700);
}

.content .info .view::before {
    content: '\e910';
    font-family: 'nmnsIcon';
    font-size: 24px;
    margin-right: 0.25rem;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content .info .like {
    background-color: var(--white-100);
    height: 50px;
    border-radius: 10px;
    padding: 0 0.65rem;
    margin: 0 0 0 10px;
    display: flex;
    align-items: center;
}

@media (max-width:767px) {
    .content .info .like {
        border: #ddd 1px solid
    }
}

.content .info .like a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    width: 24px;
    margin-right: 0.25rem;
    color: var(--Grey-500);
}

.content .info .like a::before {
    font-family: 'nmnsIcon';
    font-size: 21px;
    position: initial;
    height: initial;
    background-color: initial;
}

.content .info .like:hover a::before {
    content: '\e916' !important;
    color: var(--BrandGreen-700);
}

.content .info .like a.active::before {
    content: '\e916' !important;
    color: var(--danger-base);
}

.content .info li {
    list-style: none;
    position: relative;
}

.content .info .font, .content .info .share {
    margin: 0 0 0 10px;
}

.content .info .font ul, .content .info .share ul {
    padding: 0;
}

.content .info .font ul li:before, .content .info .share ul li:before {
    content: none;
}

.content .info .dropdownBlk .collapseBtn {
    background-color: var(--white-100);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    height: 50px;
    width: 50px;
    font-size: 24px;
    color: var(--Grey-500);
}

.content .info .dropdownBlk .collapseBtn:before {
    content: none;
}

@media (max-width:767px) {
    .content .info .dropdownBlk .collapseBtn {
        border: #ddd 1px solid
    }
}

.content .info .dropdownBlk .collapseBtn:hover {
    color: var(--BrandGreen-700);
}

.content .info .dropdownBlk .dropdown-menu {
    padding: 0;
    min-width: initial;
    z-index: 3;
}

@media (max-width:1680px) {
    .content .info .dropdownBlk .dropdown-menu {
        right: initial;
    }
}

.content .info .dropdownBlk .dropdown-menu.active {
    top: 58px;
}

.content .info .dropdownBlk .dropdown-menu:before {
    content: none;
}

.content .info .dropdownBlk .dropdown-item::before {
    margin-right: 0;

}

.content .info .dropdownBlk .dropdown-menu a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 10px;
    /* background-color: var(--white-100); */
    transition: box-shadow 0.3s ease;
    font-size: 1.5rem;
    color: var(--Grey-500);
    margin: 0;
    padding: 0;
}

.content .info .dropdownBlk .dropdown-menu a:hover {
    color: var(--BrandGreen-700);
    box-shadow: initial;
}

.content .info .dropdownBlk .dropdown-menu a span {
    display: none;
}

.content .info .dropdownBlk .dropdown-menu a::before {
    font-family: 'nmnsIcon';
    background-color: initial;
    position: initial;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.detail .info .print-img::before {
    background-image: url('../images/icon/Local-printshop.png');
    filter: grayscale(1);
}

.content .info .dropdownBlk .dropdown-menu a:hover.print-img::before {
    filter: grayscale(0);
}


.content .info>div {
    position: relative;
}

.content .info .popover-tag {
    width: 85px;
    position: absolute;
    top: 55px;
    left: -30%;
    background-color: #fff;
    color: var(--black-100);
    padding: 10px 15px;
    z-index: 3;
    border-radius: 5px;
    line-height: 1;
    font-size: 0.813rem;
    transition: all 0.3s ease;
    transform: translateY(10px);
    box-shadow: 0px 10px 30px 0px var(--black-20);
    text-align: center;
    visibility: hidden;
    opacity: 0;
}

@media (max-width:991px) {
    .content .info .popover-tag {
        display: none;
    }
}

.content .info .popover-tag::before {
    content: '';
    display: block;
    position: absolute;
    top: -9px;
    left: calc(50% - 7.5px);
    border-style: solid;
    border-width: 0px 7.5px 9px 7.5px;
    border-color: transparent transparent #fff transparent;
}

.content .info>div:hover .popover-tag {
    transition: all 0.3s ease;
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
}

.content .info>div:has(.active) .popover-tag {
    transition: all 0.3s ease;
    transform: translateY(10px);
    visibility: hidden;
    opacity: 0;
}

#contentContainer {
    max-width: 1280px;
    margin: 0 auto;
    clear: both;
}

.inside_title {
    overflow: hidden;
    margin-bottom: 5rem;
}

@media (max-width:991px) {
    .inside_title {
        display: flex;
        flex-direction: column-reverse;
        margin-bottom: 3rem;
    }
}

.inside_title h2 {
    font-size: 3rem;
    font-weight: 400;
    margin-right: 2.5rem;
    margin-top: 4.25rem;
    float: left;
    position: relative;
    letter-spacing: 2px;
    line-height: 120%;
    max-width: 100%;
}

.inside_title:has(.banner) h2 {
    max-width: 37%;
}

@media (max-width:991px) {
    .inside_title h2 {
        margin-right: 0rem;
        margin-top: 1.5rem;
        max-width: initial !important;
        font-size: 2rem;
    }
}

.inside_title h2 .bottom_line {
    display: block;
    width: 200px;
    height: 5px;
    background-color: var(--BrandGreen-500);
    margin-top: 5rem;
    position: relative;
}

@media (max-width:991px) {
    .inside_title h2 .bottom_line {
        margin-top: 1.5rem;
    }
}

.inside_title h2 .bottom_line::after {
    content: '';
    display: block;
    width: 30px;
    height: 5px;
    background-color: var(--BrandBlue-500);
    border-left: #fff 2px solid;
    position: absolute;
    right: 0px;
    top: 0px;
}

.inside_title .eng_title {
    font-size: 1.125rem;
    line-height: 1;
    margin-top: 22px;
    color: var(--BrandGreen-700);
    letter-spacing: initial;
    text-transform: uppercase;
}

.inside_title .banner {
    margin-left: auto;
    /* width: 960px; */
    /* height: 410px; */
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    background-position: center center;
    transition: width 0.3s;
    aspect-ratio: 5 / 2;
    max-width: 960px;
}


@media (max-width:991px) {
    .inside_title .banner {
        width: 100%;
    }
}

.inside_title+.nav {
    margin: 3rem 0;
}

@media (max-width:991px) {
    .inside_title+.nav {
        /* margin: 3rem 0 0 0 !important; */
    }
}

.inside_title+.nav ul .nav-link.active {
    font-weight: 500;
    color: var(--BrandGreen-700);
    padding: 0.5rem 1.5rem 11px 1.5rem;
}

.inside_title+.nav ul .nav-link.active::before {
    content: '';
    bottom: 0px;
    left: 0px;
    top: initial;
    width: 100%;
    height: 3px;
}

.detail img {
    width: 100%;
    height: auto;
}

.detail .h3, .detail h3 {
    font-size: 1.75rem;
    color: var(--BrandGreen-700);
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 2px;
    position: relative;
    /* text-indent: 25px; */
    margin-bottom: 1.75rem;
    margin-top: 3rem;
    display: flex;
    align-items: center;
    margin-left: 25px;
    flex-wrap: wrap;
}

@media (max-width:767px) {
    .detail .h3, .detail h3 {
        font-size: 1.5rem;
    }
}

.detail .h3::before, .detail h3::before {
    content: '';
    position: absolute;
    top: 10px;
    left: -25px;
    display: block;
    width: 13px;
    height: 13px;
    background-color: var(--BrandGreen-500);
}

.detail .h3::after, .detail h3::after {
    content: '';
    position: absolute;
    top: 27px;
    left: -12px;
    display: block;
    width: 5px;
    height: 5px;
    background-color: var(--BrandBlue-500);
}

.detail p+ol {
    padding: 0 2rem 1rem 2rem !important;
}

.detail .h3+div>ul:not(.owl-carousel) {
    padding: 0 0 0 2rem
}

.detail .template_color {
    display: inline-block;
    font-size: 13px;
    line-height: 22px;
    color: var(--BrandGreen-700);
    border: 1px solid var(--BrandGreen-700);
    border-radius: 5px;
    padding: 0px 6px;
}

.detail .sitemap {
    border-radius: 8px;
    /* overflow: hidden; */
}

.detail .sitemap>ul {
    padding: 0 !important;
    display: flex;
    flex-wrap: wrap;
    align-content: stretch;
    margin-bottom: 0;
}

.detail .sitemap ul li {
    list-style-type: none;
    margin-bottom: 0;
}

.detail .sitemap ul li::before {
    content: none;
}

.detail .sitemap>ul>li {
    width: calc(100% / 3 - 1.5rem);
    margin: 0.75rem;
    background-color: var(--white-100);
    box-shadow: 0px 0px 10px 0px var(--black-10);
}

@media (max-width:767px) {
    .detail .sitemap>ul>li {
        width: calc(100% / 2 - 1.5rem);
        border-right: 1px solid #e5e5e5 !important;
    }

    .detail .sitemap>ul>li:nth-of-type(2n) {
        border-right: none !important;
    }
}

@media (max-width:575px) {
    .detail .sitemap>ul>li {
        width: calc(100% / 1);
        border-right: none;
    }
}

.detail .sitemap>ul>li>a {
    color: var(--Grey-700);
    padding: .5rem .5rem .5rem .75rem;
    display: block;
    background: var(--BrandGreen-50);
    font-size: 1.25rem;
    font-weight: 500;
    border-top: var(--BrandGreen-500) 2px solid
}

.detail .sitemap ul li a:before {
    content: none;
}

.detail .sitemap ul li a:hover {
    color: var(--BrandGreen-700);
}

.detail .sitemap ul li ul {
    padding: 5px 0 10px 1.5rem;
}

.detail .sitemap ul li ul li {
    padding-bottom: 0.25rem;
}

.detail .sitemap ul li ul li:before {
    content: none;
}

.detail .sitemap ul li ul li a {
    color: var(--Grey-700);
}

.detail .sitemap ul li ul li a:hover {
    color: var(--BrandGreen-700);
}

.detail .update_info {
    text-align: right;
    max-width: 1280px;
    margin: 3rem auto 0 auto;
    padding: 0 0.5rem;
    color: var(--Grey-500);
}

.detail .nav {
    margin: 3rem auto;
    clear: both;
}

.detail .nav ul {
    /* display: flex; */
    /* width: 100%; */
    /* border-bottom: 1px var(--Grey-200) solid; */
    padding: 0;
}

.detail .inside_title+.nav {
    max-width: 1280px;
}

.detail .inside_title+.nav ul {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

@media (max-width:767px) {
    .detail .nav ul {
        flex-wrap: wrap;
        padding: 0;
    }
}

.detail .nav li {
    list-style: none;
    position: relative;
    flex: 1;
    padding: 0;
    border-bottom: var(--Grey-200) 1px solid;
    float: left;
    text-align: center;
    white-space: nowrap;
}

@media (max-width:767px) {
    .detail .nav li {
        flex: initial;
    }
}

.detail .nav .theater-btn {
    background-color: initial;
    border: none;
    border-bottom: transparent 3px solid;
    position: relative;
    width: calc(100% / 3);
    margin-bottom: 2rem;
    padding: 0.5rem 0rem;
    font-weight: 400;
    color: var(--Grey-500);
    display: block;
    text-align: center;
    cursor: pointer;
}

@media (max-width:1024px) {
    .detail .nav .theater-btn {
        font-size: 1rem;
    }
}

.detail .nav .theater-btn::before {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--Grey-200);
}

.detail .nav li a {
    padding: 0.5rem 1.5rem;
    font-weight: 400;
    color: var(--Grey-500);
    display: block;
    text-align: center;
    cursor: pointer;
    border-bottom: 3px transparent solid;
}

@media (max-width:1024px) {
    .detail .nav li a {
        font-size: 1rem;
        padding: 0.5rem 1rem;
    }
}

.detail .nav li a:before {
    content: none !important;
}

.detail .nav li a:hover, .detail .nav .theater-btn:hover {
    background: linear-gradient(146.72deg, #C8FADF 15.62%, #94D7F6 108.43%);
    border-bottom: 3px var(--BrandGreen-300) solid;
    color: var(--Grey-900);
}

.detail .nav li.active a, .detail .nav .theater-btn.active {
    border-bottom: 3px var(--BrandGreen-700) solid;
    font-weight: 500;
    color: var(--BrandGreen-700);
}

.detail .notice {
    background-color: var(--BrandBlue-50);
    border-left: var(--BrandBlue-500) 5px solid;
    margin: 2.25rem 0;
    display: flex;
    padding: 1.25rem 1.25rem;
}

.detail .notice::before {
    content: '';
    display: block;
    width: 35px;
    height: 35px;
    margin-right: 1rem;
    background-image: url('../images/icon/icon_announcementinfo.png');
    background-size: contain;
    background-repeat: no-repeat;
    /* align-self: flex-start; */
    flex-shrink: 0;
}

.detail .notice+.contact {
    margin-top: 4rem;
}

.detail .notice .notice_inner {
    display: flex;
    align-items: center;
    width: 100%;
}

@media (max-width: 768px) {
    .detail .notice .notice_inner {
        flex-direction: column;
        align-items: initial;
    }
}

.detail .notice .notice_inner .text {
    margin-bottom: 0;
    color: #464646;
    margin-right: 1rem;
    padding-left: 0;
    flex: 1;
}

.detail .notice .more {
    margin-left: auto;
}

.detail .more {
    text-align: left;
    margin-left: auto;
}

.detail .more a {
    color: var(--BrandGreen-700);
    font-size: 1.125rem;
    letter-spacing: 1px;
    position: relative;
    line-height: 1;
    text-indent: 0;
}

@media (max-width:480px) {
    .detail .more a {
        text-align: right;
    }
}

.detail .more a::before {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0px;
    width: 0px;
    display: block;
    height: 2px;
    background-color: var(--BrandGreen-300);
    transition: width 0.3s ease;
}

.detail .more a:hover::before {
    width: calc(100% - 60px);
}

.detail .more a:hover {
    color: var(--Grey-900);
}

.detail .more a span {
    position: relative;
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    text-indent: -9999px;
    line-height: 1;
}

.detail .more a span::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transition: background-color 0.3s ease;
}

.detail .more a span::after {
    content: '';
    position: absolute;
    bottom: 4px;
    right: 0px;
    display: block;
    width: 10px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transform: rotate(45deg);
    transition: background-color 0.3s ease;
}

.detail .more a:hover span::before,
.detail .more a:hover span::after {
    background-color: var(--BrandGreen-300);
}

.detail .more a i {
    display: none;
}

.detail .step {
    display: flex;
    /* margin: 4rem 0 5rem 0; */
    justify-content: center;
}

@media (max-width:767px) {
    .detail .step {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.detail .step .arrow {
    flex: initial;
    position: relative;
    border-bottom: var(--Grey-200) 2px solid;
    max-width: 265px;
    flex-grow: 1;
    display: block;
}

@media (max-width:767px) {
    .detail .step .arrow {
        max-width: initial;
    }
}

.detail .step .arrow:has(.active) {
    border-bottom: var(--BrandGreen-600) 2px solid;
}

.detail .step .arrow .step-item {
    padding: 0;
}

@media (max-width:767px) {
    .detail .step .arrow .step-item {
        display: flex;
        align-items: center;
        width: 100%;
    }
}

.detail .step+.text {
    margin-top: 4rem
}

.detail .step .line {
    margin: 0 20px;
    align-self: center;
    background-color: initial;
    height: initial;
}

@media (max-width:767px) {
    .detail .step .line {
        display: none;
    }

    .detail .ticket-price .step .line {
        display: block;
    }
}

.detail .step .line::before {
    content: '\e962';
    font-family: 'nmnsIcon';
    color: var(--BrandGreen-600);
    font-size: 1.5rem;
}

.detail .step .round {
    width: 50px !important;
    height: 50px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    font-style: italic;
    font-weight: 500;
    font-size: 1.75rem !important;
    flex-shrink: 0;
    color: var(--Grey-500) !important;
    margin: 0 !important;
    background-color: initial !important;
}

@media (max-width:767px) {
    .detail .step .round {
        margin: 0.5rem !important;
    }
}

.detail .step .active .round {
    background: var(--background-strong);
    background-clip: text;
    color: transparent !important;
}

.detail .step .round::before {
    content: '';
    width: 50px;
    height: 50px;
    border-radius: 50% 50% 50% 0;
    background: var(--Grey-50);
    position: absolute;
    z-index: -1;
}

.detail .step .active .round::before {
    background: var(--background-light);
}

.detail .step p {
    margin: 10px 0 !important;
    font-size: 15px !important;
    line-height: 1.5;
    color: var(--Grey-500);
}

.detail .step .active p {
    color: var(--Grey-900) !important;
}

.detail .h4, .detail h4 {
    margin-bottom: 1rem;
    font-size: 1.375rem;
    margin-top: 1rem;
}


.detail .h4:has(i) {
    margin-top: 2rem;
    display: flex;
    align-items: center;
}

.detail .h4:has(i):after {
    content: '';
    display: block;
    height: 1px;
    background-color: var(--Grey-200);
    flex: 1;
    margin-left: 10px;
}

.detail .h4 i {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25rem;
    width: 35px;
    height: 35px;
    font-weight: 400;
    border-radius: 50%;
    margin-right: 10px;
    color: var(--white-100);
    background: var(--background-strong);
}

.detail ol:not(.breadcrumb) {
    padding: 1rem 0 1rem 2rem;
}

.detail ol:not(.breadcrumb) ul,
.detail ol:not(.breadcrumb) ol {
    padding: 0.5rem 0 0.5rem 2rem;
}

.detail ol:not(.breadcrumb) li {
    counter-increment: num-counter;
    margin: 0.25rem 0;
    list-style: none;
    position: relative;
}

.detail ol:not(.breadcrumb) li::before {
    content: counter(num-counter);
    background: var(--BrandGreen-50);
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    display: inline-block;
    color: var(--BrandGreen-700);
    border-radius: 50%;
    font-size: 1rem;
    /* margin-right: 0.35rem; */
    /* flex-shrink: 0; */
    /* margin-left: -1.75rem; */
    position: absolute;
    left: -1.75rem;
    top: 6px;
}

.detail ol:not(.breadcrumb) li a {
    /* color: var(--Grey-700); */
    text-decoration: none;
}

.detail ol:not(.breadcrumb) li ul li, .detail ol:not(.breadcrumb) li ol li,
.detail ol:not(.breadcrumb) ul li, .detail ol:not(.breadcrumb) ol li {
    counter-increment: initial;
}

.detail ol:not(.breadcrumb) li ol li::before, .detail ol:not(.breadcrumb) ol li::before {
    content: '';
    background-color: initial;
}

.detail ol:not(.breadcrumb) li ul li::before, .detail ol:not(.breadcrumb) ul li::before {
    content: '';
    position: absolute;
    top: 14px;
    left: -18px;
    display: block;
    width: 10px;
    height: 5px;
    background-color: var(--BrandGreen-600);
    border-radius: 0;
}

.detail ol:not(.breadcrumb) ul {
    margin-bottom: 1rem
}

.detail .formBlk {
    max-width: 848px;
    margin: 4rem auto;
    padding: 0 1.5rem;
}

.modal .formBlk {
    padding: 0 1.5rem;
}

@media (max-width:575px) {
    .detail .formBlk {
        padding: 0 0.5rem;
    }
}


.detail .formBlk .select-group, .detail .formBlk .input-group, .detail .formBlk .radio-group {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
    align-items: center;
}

.modal .formBlk .select-group, .modal .formBlk .input-group, .modal .formBlk .radio-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 0.5rem;
}

.detail .formBlk .select-group label, .detail .formBlk .input-group label,
.detail .formBlk .radio-group label, .modal .formBlk .select-group label,
.modal .formBlk .input-group label, .modal .formBlk .radio-group label {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.detail .formBlk .select-group span:not(.required), .modal .formBlk .select-group span:not(.required) {
    margin: 0 5px;
}

.detail .formBlk .select-group select, .detail .select-group select, .detail select {
    height: 50px;
    flex-grow: 1;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    background-color: var(--white-100);
    color: var(--Grey-700);
    margin: 10px 5px;
    width: auto;
}

.modal .formBlk .select-group select {
    height: 38px;
    flex-grow: 1;
    line-height: 38px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    background-color: var(--white-100);
    color: var(--Grey-700);

}

.detail .formBlk .select-group select:focus, .detail .select-group select:focus, .modal .formBlk .select-group select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    box-shadow: none;
}

.detail .formBlk .select-group select option:checked, .detail .select-group select option:checked, .modal .formBlk .select-group select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

.detail .formBlk .input-group, .modal .formBlk .input-group {
    position: relative;
}

.detail .formBlk .input-group:has(#turnstileWidget), .modal .formBlk .input-group:has(#turnstileWidget) {
    justify-content: center;
}

.detail .formBlk .input-group .title, .modal .formBlk .input-group .title {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.detail .formBlk .input-group .row, .modal .formBlk .input-group .row {
    margin-bottom: 20px;
    /* margin-left: -25px !important; */
    /* margin-right: -25px; */
}

@media (max-width:991px) {
    .detail .formBlk .input-group .row, .modal .formBlk .input-group .row {
        margin-left: -10px !important;
        margin-right: -10px;
    }
}

.detail .formBlk .input-group .row [class*="col-"], .modal .formBlk .input-group .row [class*="col-"] {
    padding: 0 10px;
    margin: 0;
}

.detail .formBlk .input-group .row .input-group, .modal .formBlk .input-group .row .input-group {
    flex-wrap: initial;
    margin-bottom: 10px;
}

.detail .formBlk .input-group .row .input-group label, .modal .formBlk .input-group .row .input-group label {
    width: initial;
    flex-shrink: 0;
    margin-right: 10px
}

.detail .formBlk .input-group .form-control {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
}

.modal .formBlk .input-group .form-control {
    width: 100%;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
}

.detail .formBlk .input-group .form-control[type="file"] {
    line-height: 36px;
}

.detail .formBlk .input-group .form-control:disabled, .modal .formBlk .input-group .form-control:disabled {
    background-color: var(--Grey-50);
    border: var(--Grey-200) 1px solid;
    color: var(--black-40);
}

.detail .formBlk .input-group:has(#captchaCode) .form-control, .modal .formBlk .input-group:has(#captchaCode) .form-control {
    width: initial;
    border-radius: 8px 0 0 8px !important;
}

.detail .formBlk .input-group:has(#captchaCode) .form-control:focus, .modal .formBlk .input-group:has(#captchaCode) .form-control:focus {
    width: initial;
    border-radius: 0 !important;
}

@media (max-width:575px) {
    .detail .formBlk .input-group:has(#captchaCode) .form-control, .modal .formBlk .input-group:has(#captchaCode) .form-control {
        width: 100%;
        border-radius: 8px !important;
        margin-bottom: 10px;
    }
}

.detail .formBlk .input-group:has(#captchaCode) img, .modal .formBlk .input-group:has(#captchaCode) img {
    border: var(--Grey-200) 1px solid;
    height: 50px;
    width: initial;
}

.detail .formBlk .input-group:has(#captchaCode) button, .modal .formBlk .input-group:has(#captchaCode) button {
    border: var(--Grey-200) 1px solid;
}

.detail .formBlk .input-group:has(#captchaCode) button.refresh, .modal .formBlk .input-group:has(#captchaCode) button.refresh {
    border-radius: 0 !important;
}

.detail .formBlk .input-group:has(#captchaCode) button, .modal .formBlk .input-group:has(#captchaCode) button {
    border-radius: 0 8px 8px 0 !important;
    padding: 0 1rem;
    line-height: 48px
}

.detail .formBlk .input-group:has(#captchaCode) button:hover, .modal .formBlk .input-group:has(#captchaCode) button:hover {
    color: var(--BrandGreen-700);
}

.detail .formBlk .input-group:has(#captchaCode) button i::before, .modal .formBlk .input-group:has(#captchaCode) button i::before {
    font-family: "Font Awesome 5 Free";
}

.detail .formBlk .input-group .form-control:focus, .modal .formBlk .input-group .form-control:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0px !important;
}

.detail .formBlk .calendar-select, .modal .formBlk .calendar-select {
    margin-bottom: 30px;
}

.detail .formBlk .calendar-select .date, .modal .formBlk .calendar-select .date {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.detail .formBlk .calendar-select .date label, .modal .formBlk .calendar-select .date label {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.detail .formBlk .calendar-select .date input, .modal .formBlk .calendar-select .date input {
    height: 50px;
    flex-grow: 1;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    margin: 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.detail .formBlk .calendar-select .date input:focus, .modal .formBlk .calendar-select .date input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0px !important;
}

.detail .formBlk .calendar-select .date span, .modal .formBlk .calendar-select .date span {
    margin: 0 5px;
}

.detail .formBlk .radio-group .check-item, .modal .formBlk .radio-group .check-item {
    display: flex;
    flex-wrap: wrap;
    /* align-items: center; */
    margin-right: 50px;
}

.detail .formBlk .radio-group .check-item input, .modal .formBlk .radio-group .check-item input {
    width: 25px;
    height: 25px;
    margin: 0 0.5rem 0 -2rem;
}

.detail .formBlk .radio-group .check-item .form-check-input:disabled,
.modal .formBlk .radio-group .check-item .form-check-input:disabled {
    background: rgba(249, 249, 249, 1);
    border-color: var(--Grey-300);
}

.detail .formBlk .radio-group .check-item .form-check-input:checked,
.modal .formBlk .radio-group .check-item .form-check-input:checked {
    background-color: var(--BrandGreen-500);
    border-color: var(--white-100);
    border-width: 4px;
    background-image: initial;
    box-shadow: 0px 0px 1px 1px var(--Grey-300);
}

.detail .formBlk .radio-group .check-item .form-check-input:checked:disabled,
.modal .formBlk .radio-group .check-item .form-check-input:checked:disabled {
    background-color: var(--white-100);
    border-color: var(--Grey-300);
}

.detail .formBlk .radio-group .check-item label,
.modal .formBlk .radio-group .check-item label {
    width: initial;
    margin-bottom: 0;
    line-height: 1.6;
}

.detail .formBlk .check-group, .modal .formBlk .check-group {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.detail .formBlk .check-group [class*="col-"],
.detail .formBlk .radio-group [class*="col-"],
.modal .formBlk .check-group [class*="col-"],
.modal .formBlk .radio-group [class*="col-"] {
    margin: 0;
}

@media (max-width:991px) {

    .detail .formBlk .check-group [class*="col-"],
    .detail .formBlk .radio-group [class*="col-"],
    .modal .formBlk .check-group [class*="col-"],
    .modal .formBlk .radio-group [class*="col-"] {
        margin: 0 -0.75rem;
    }
}

.detail .formBlk .check-group .title,
.modal .formBlk .check-group .title {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.detail .formBlk .check-group .check-item,
.detail .formBlk .radio-group .check-item,
.modal .formBlk .check-group .check-item,
.modal .formBlk .radio-group .check-item {
    /* font-size: 1rem; */
    margin-right: 50px;
    width: initial;
    padding-left: 2rem;
}

.detail .formBlk .check-group .check-item:has(.options-caption),
.detail .formBlk .radio-group .check-item:has(.options-caption),
.modal .formBlk .check-group .check-item:has(.options-caption),
.modal .formBlk .radio-group .check-item:has(.options-caption) {
    width: 100%;
    flex-wrap: wrap;
    margin-right: 0;
}

.detail .formBlk .check-group .check-item:has(.options-img),
.detail .formBlk .radio-group .check-item:has(.options-img),
.modal .formBlk .check-group .check-item:has(.options-img),
.modal .formBlk .radio-group .check-item:has(.options-img) {
    flex-wrap: initial;
}

.options-info {
    margin: 0.5rem 0 0 0;
    font-weight: 500;
}

.options-caption {
    line-height: 1.6;
    font-size: 0.95rem;
    margin-top: 0.25rem;
    width: 100%;
}

.detail .formBlk .check-group .check-item:last-of-type,
.modal .formBlk .check-group .check-item:last-of-type {
    margin-right: 0px;
}

.detail .check-group input[type=checkbox] {
    width: 25px;
    height: 25px;
    margin: 0 0.5rem 0 -2rem;
}

.detail .check-group input[type=checkbox]:checked {
    background-color: var(--BrandGreen-700);
    border-color: var(--BrandGreen-700);
}

.detail .formBlk .radio-group .title,
.modal .formBlk .radio-group .title {
    position: relative;
    width: 100%;
    color: var(--Grey-900);
}

.detail .formBlk .input-group textarea+span,
.modal .formBlk .input-group textarea+span {
    color: var(--Grey-500);
    font-size: 0.85rem;
}

.required {
    color: var(--danger-base);
    margin-right: 0.25rem;
}

.detail .formBlk .required {
    position: absolute;
    top: 0px;
    margin-left: 0.5rem;
}

.send {
    flex-shrink: 0;
}

@media (max-width:575px) {
    .send {
        width: 100%;
        display: flex;
    }
}

.send button {
    position: relative;
    border: none;
    height: 50px;
    border-radius: 0.5rem;
    overflow: hidden;
    z-index: 1;
    margin: 10px 5px;
    min-width: 150px;
    transition: all 0.3s;
    color: var(--Grey-700);
    border: var(--Grey-500) 1px solid;
    background-color: var(--white-100);
}

.send button i {
    display: none;
}

@media (max-width:575px) {
    .send button {
        flex-grow: 1;
    }
}

.send button[type="submit"] {
    color: var(--white-100);
    font-size: 1.125rem;
    background-color: var(--BrandGreen-700);
    padding: 0 1.5rem 0 0;
}

.send button[type="reset"], .send .reset {
    color: var(--Grey-700);
    border: var(--Grey-500) 1px solid;
    background-color: var(--white-100);
    padding: 0 1.5rem 0 0;
}

.send button[type="reset"]:hover, .send button[type="submit"]:active,
.send .reset:hover, .send button:hover {
    color: var(--white-100);
}

.send button::before {
    content: '';
    width: 3px;
    height: 100%;
    transition: all 0.5s ease;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}

.send button:hover::before {
    width: 100%;
}

.send button[type="submit"]::before, .send button[type="submit"]:hover::before {
    background-color: var(--BrandGreen-800);
}

.send button[type="reset"]::before, .send .reset::before, .send button::before {
    background-color: var(--Grey-300);
}

.send button[type="reset"]:hover::before, .send .reset:hover::before, .send button:hover::before {
    background-color: var(--Grey-500);
}

.send button[type="reset"]:hover::after, .send .reset:hover::after, .send button:hover::after {
    background-color: var(--Grey-500);
}

.detail a {
    color: var(--BrandGreen-700);
    text-decoration: none;
    position: relative;
    display: inline-block;
    word-break: break-word;
}

.detail a:has(img)::before {
    content: none;
}

.detail a::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--Grey-200);
    transition: all 0.3s ease;
}

.detail a:hover::before {
    height: 2px;
    background-color: var(--BrandGreen-300);
}

.detail a:hover {
    color: var(--Grey-900);
}

.search-block {
    /* padding-top: 3rem; */
}

.search-form {
    display: flex;
    align-items: center;
    /* padding: 1.5rem 0; */
    /* margin-top: 3rem; */
}

@media (max-width:575px) {
    .search-form {
        flex-wrap: wrap;
        justify-content: center;
    }
}

.search-form .select-group,
.search-form .input-group,
.search-form .radio-group {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width:575px) {

    .search-form .select-group,
    .search-form .input-group,
    .search-form .radio-group {
        width: 100%;
        margin: 0.5rem 0;
    }
}

.search-form .select-group label,
.search-form .input-group label {
    position: relative;
    width: 100%;
    color: var(--Grey-900);
}

.search-form .radio-group label {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.search-form .select-group select {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

@media (max-width:575px) {
    .search-form .select-group select {
        margin: 0;
    }
}

.search-form .select-group select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.search-form .select-group select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

.search-form .input-group input {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
    padding: .375rem .75rem;
    background-color: var(--white-100);
    margin: 10px 5px;
}

@media (max-width:575px) {
    .search-form .input-group input {
        margin: 10px 0px;
    }
}

.search-form .input-group input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0px !important;
}

.search-form .radio-group .check-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-right: 30px;
}

.search-form .radio-group .check-item input {
    width: 25px;
    height: 25px;
    margin-top: 0;
}

.search-form .radio-group .check-item .form-check-input:disabled {
    background: rgba(249, 249, 249, 1);
    border-color: var(--Grey-300);
}

.search-form .radio-group .check-item .form-check-input:checked {
    background-color: var(--BrandGreen-500);
    border-color: var(--white-100);
    border-width: 4px;
    background-image: initial;
    box-shadow: 0px 0px 1px 1px var(--Grey-300);
}

.search-form .radio-group .check-item .form-check-input:checked:disabled {
    background-color: var(--white-100);
    border-color: var(--Grey-300);
}

.search-form .radio-group .check-item label {
    width: initial;
    margin-bottom: 0;
    margin-left: 10px;
}

.search-form .send button {
    background-color: var(--BrandGreen-700);
    color: var(--white-100);
    padding: 0 1.25rem 0 0;
    /* width: 100%; */
}

@media (max-width:575px) {
    .search-form .send button {
        padding: 0 1.25rem;
        width: 100%;
        margin: 10px 0
    }
}

.search-form .send button::before {
    content: '';
    width: 3px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    transition: all 0.5s ease;
}

.search-form .send button:hover::before {
    width: 100%;
}


.search-form .send button::after {
    font-family: 'nmnsIcon';
    content: "\e92a";
    margin-left: 1.25rem;
    border-left: var(--white-100) 1px solid;
    display: inline-block;
    width: 34px;
    height: 30px;
    background-color: initial;
    position: absolute;
    left: initial;
    top: 9px;
    right: 0px;
    line-height: 30px;
}


.exhibits-btn-tag {
    margin: 3rem 0;
}

.exhibits-btn-tag a {
    display: inline-block;
    background-color: var(--BrandGreen-50);
    border: 1px solid var(--BrandGreen-300);
    border-radius: 4px;
    padding: 8px 20px;
    margin: 0.25rem;
}

@media (max-width:575px) {
    .exhibits-btn-tag a {
        padding: 0px 10px;
        font-size: 1rem;
    }
}

.exhibits-btn-tag a:hover {
    color: var(--white-100);
    background-color: var(--BrandGreen-400);
}

.exhibits-btn-tag a.active {
    color: var(--white-100);
    background-color: var(--BrandGreen-600);
}

.exhibits-btn-tag a::before {
    content: none !important;
}

.search-result .search-title {
    display: flex;
    flex-wrap: wrap;
    color: var(--Grey-900);
    margin-bottom: 1rem;
}

@media (max-width: 560px) {
    .search-result .search-title {
        flex-direction: column;
    }
}


.search-result span.red {
    color: #C00;
}

.search-title .sort {
    margin-left: auto;
    display: flex;
}

@media (max-width: 767px) {
    .search-title>div, .search-title .sort {
        margin-top: 10px
    }
}

@media (max-width: 630px) {
    .search-title>div, .search-title .sort {
        width: 100%
    }
}

.search-title .sort ul {
    padding: 0;
}

.search-title .sort ul li {
    list-style: none;
    display: inline-block;
    text-indent: initial;
    margin: 0 0.5rem;
}

.search-title .sort ul li::before {
    content: none;
}

.search-title .sort ul li a.active {
    background-color: var(--BrandGreen-600);
    color: var(--white-100);
    padding: 0 0.5rem;
}

.result {
    margin: 3rem 0;
}

.result .result-item {
    padding: 1.25rem;
    border-bottom: var(--Grey-200) 1px solid;
    transition: all 0.3s;
}

.result .result-item:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    background-color: var(--white-100);
    border-bottom: var(--BrandGreen-300) 3px solid;
    transform: translateY(-1px);
}

.result .result-item a {
    color: var(--Grey-900) !important;
}

.result .result-item a::before {
    content: none !important;
}

.result .result-item a .title {
    font-size: 1.25rem;
    font-weight: 500;
}

.result .result-item a .link {
    font-size: 15px;
    color: var(--Grey-500);
    word-break: break-all;
    line-height: 1.5;
    margin-top: 0.25rem;
}

.detail .result .gallery-item a .photo {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.detail .result .gallery-item a img {
    width: initial;
    height: inherit;
    max-width: 100%;
}

.page {
    margin: 3rem 0 0.5rem 0;
}

.page ul {
    flex-wrap: wrap;
    padding: 0px !important;
    justify-content: center;
}

.page ul li {
    margin: 0 10px 10px 10px;
    line-height: 54px;
}

.page ul li::before {
    content: none !important;
}

.page ul li a {
    font-size: 1.25rem;
    color: var(--Grey-500);
}

.page ul li:has(i) {
    margin: 0 0 0 10px;
}

.page ul li:has(i) a {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--BrandGreen-600);
}

.page ul li:has(i):hover a {
    border: 2px solid var(--BrandGreen-300);
    background: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%);
    color: var(--BrandGreen-300);
}

.page ul li:has(a[title="第一頁"]),
.page ul li:has(a[title="到第一頁"]),
.page ul li:has(a[title="到最後一頁"]),
.page ul li:has(a[title="最後一頁"]) {
    margin: 0;
    position: relative;
}

.page ul li:has([title="第一頁"])::before,
.page ul li:has([title="到第一頁"])::before,
.page ul li:has([title="到最後一頁"])::before,
.page ul li:has([title="最後一頁"])::before {
    content: '' !important;
    position: absolute;
    z-index: 1;
    top: 19px;
    width: 2px;
    height: 13px;
    background-color: var(--BrandGreen-600);
}

.page ul li:has([title="第一頁"])::before,
.page ul li:has([title="到第一頁"])::before {
    left: 14px;
}

.page ul li:has([title="最後一頁"])::before,
.page ul li:has([title="到最後一頁"])::before {
    right: 14px;
    left: initial;
}

.page ul li:has([title="第一頁"]):hover::before,
.page ul li:has([title="到第一頁"]):hover::before,
.page ul li:has([title="到最後一頁"]):hover::before,
.page ul li:has([title="最後一頁"]):hover::before {
    background-color: var(--BrandGreen-300);
}


.page ul li a i {
    font-weight: 600;
}

.page ul li a i.fa-angle-left,
.page ul li a i.fa-step-backward {
    transform: rotate(180deg);
}

.page ul li a i.fa-angle-right:before,
.page ul li a i.fa-angle-left:before,
.page ul li a i.fa-step-forward:before,
.page ul li a i.fa-step-backward:before {
    content: '\e962';
}

.page ul li a.active {
    padding: 0 1rem;
    color: var(--Grey-900);
    font-weight: 700;
}

.page ul li a.active::before {
    background-color: var(--BrandGreen-600);
}

.detail .page ul li a::before {
    bottom: -4px;
    height: 5px;
}

.page ul li:has(i) a::before {
    content: none;
}

.page ul li a:hover::before {
    height: 5px;
}

.page-display {
    text-align: center;
    font-size: 1rem;
    color: var(--Grey-500);
    width: 100%;
}

.rating {
    text-align: center;
}

.rating .title {
    font-size: 1.25rem;
    font-weight: 500;
}

.rating p {
    font-size: 1rem;
    color: var(--Grey-500);
    margin-bottom: 1rem;
}

.rating .form-group {
    width: 80%;
    margin: 1rem auto;
}

@media (max-width:480px) {
    .rating .form-group {
        width: 100%;
    }
}

.rating input[type="radio"] {
    opacity: 0;
}

.rating label {
    cursor: pointer;
}

@media (max-width:480px) {
    .rating label {
        margin: 0 -0.5rem;
    }
}

.rating label i {
    font-size: 1.8rem;
    font-family: "Font Awesome 5 Free" !important;
}

.rating input[type="radio"]:checked~input+label {
    background: none;
    color: #aaa;
}

.rating input+label {
    color: orange;
    width: initial;
    margin-right: 1rem;
}

@media (max-width:480px) {
    .rating input+label {
        width: 40px;
    }
}

.rating input:focus+label {
    border: #FFBF47 3px solid;
}

.detail .nav-tabs {
    border-bottom: none;
    padding: 0;
}


.detail .nav-tabs li::before {
    content: none;
}

@media (max-width:991px) {
    .detail .nav-tabs li {
        flex: initial;
    }
}

.detail .nav-tabs li a {
    border-radius: 0;
    border: none;
    transition: none;
    box-shadow: none;
}

.detail .nav-tabs li.active a {
    border-bottom: 3px var(--BrandGreen-700) solid;
    background-color: initial;
}

.detail .nav-tabs .nav-link.active {
    border-bottom: 3px var(--BrandGreen-700) solid;
    color: var(--BrandGreen-700);
    font-weight: 500;
}

#contentContainer {
    /* padding-top: 3rem; */
    position: relative;
}

.news {
    margin: 3rem 0;
}

.news-select {
    display: flex;
}

@media (max-width:767px) {
    .news-select {
        flex-wrap: wrap;
    }
}

.news-select .select-group {
    display: flex;
    flex-wrap: wrap;
}

.news-select .select-group:has(#year) {
    flex-wrap: nowrap;
    align-items: center;
}

@media (max-width:575px) {
    .news-select .select-group {
        width: 100%;
    }
}

.news-select .select-group label {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.news-select .select-group .sr-only {
    display: none;
}

.news-select .select-group select {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.news-select .select-group select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.news-select .select-group select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

.news-select .select-group input {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    padding: .375rem .75rem;
}

.news-select .select-group input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0 !important;
}

.news-select .send {
    display: flex;
}

.news-select .send button[type="reset"] {
    width: initial;
    padding: 0 1.25rem 0 0;
}

.news-select .send button[type="submit"] {
    background-color: var(--BrandGreen-700);
    color: var(--white-100);
    padding: 0 1.25rem 0 0;
}

@media (max-width:575px) {
    .news-select .send button {
        margin: 10px 5px;
    }
}

.news-select .send button[type="submit"]::before {
    content: '';
    width: 3px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    transition: all 0.5s ease;
}

.news-select .send button[type="submit"]:hover::before {
    width: 100%;
}

.news-select .send button[type="submit"]::after {
    font-family: 'nmnsIcon';
    content: "\e92a";
    margin-left: 1.25rem;
    border-left: var(--white-100) 1px solid;
    width: 34px;
    height: 30px;
    background-color: initial;
    line-height: 30px;
    position: absolute;
    top: 9px;
    right: 0px;
    left: initial;
}

.news-content {
    margin: 2rem 0;
}

.news:has(.cutover) .news-content.photo-list {
    display: flex;
    flex-wrap: wrap;
}

.news-content .news-item {
    transition: all 0.3s;
    border-bottom: var(--Grey-200) 1px solid;
    padding: 10px 0;
}

.news:has(.cutover) .news-content.photo-list .news-item {
    padding: 0;
    width: calc(100% / 2 - 2rem);
    margin: 1rem;
    border-bottom: none;
    box-shadow: 0px 5px 10px 0px var(--black-10);
}

@media (max-width:767px) {
    .news:has(.cutover) .news-content.photo-list .news-item {
        width: 100%;
        margin: 1rem 0;
    }
}

.news:has(.cutover) .news-content.photo-list .news-item:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    overflow: hidden;
    border: none;
}

.news-content .news-item.top a {
    border-left: #FFB649 4px solid;
}

.news:has(.cutover) .news-content.photo-list .news-item.top a {
    border-left: none;
}

.news-content .news-item:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    border-bottom: var(--BrandGreen-300) 3px solid;
    transform: translateY(-1px);
}

.news-content .news-item.top:hover {
    border-bottom: transparent 3px solid;
}

.news-content .news-item a {
    display: block;
    padding: 10px 20px;
    color: var(--Grey-900);
    font-weight: 500;
    font-size: 1.25rem;
    transition: all 0.3s;
}

.news:has(.cutover) .news-content.photo-list .news-item a {
    padding: 0;
}

.news-content .news-item a:before {
    content: none;
}

.news-content .news-item:hover a {
    background-color: var(--white-100);
}

.news-content .news-item .content {
    line-height: 1.5;
}

.news:has(.cutover) .news-content.photo-list .news-item .content {
    padding: 0px 20px 16px 20px;
}

.news-content .news-item:hover .content {
    color: var(--BrandGreen-700);
}

.news-content .news-item a .photo {
    display: none;
}

.news:has(.cutover) .news-content.photo-list .news-item a .photo {
    aspect-ratio: 5 / 2;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    display: block;
}

.news:has(.cutover) .news-content.photo-list .news-item a .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-item-flex {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    color: var(--Grey-700);
    font-size: 14px;
    font-weight: 400;
    align-items: center;
    height: 26px;
    margin-bottom: 5px;
}

.news:has(.cutover) .news-content.photo-list .news-item-flex {
    padding: 16px 20px 0 20px;
    height: 42px;
}

.news-content .news-item.top .news-item-flex::after {
    content: '置頂';
    color: var(--Grey-900);
    background-color: var(--warning-light);
    line-height: 26px;
    display: inline-block;
    margin-right: 20px;
    font-weight: 500;
    padding: 0 5px;
}

.news-item-flex:has(.category) .date {
    position: relative;
    margin-left: 20px;
    padding-left: 20px;
    border-left: var(--Grey-200) 1px solid;
    line-height: 1;
}

.news-item-flex .date::before {
    /* content: ''; */
    position: absolute;
    top: 0px;
    left: 0px;
    width: 1px;
    height: 20px;
    background-color: var(--Grey-200);
}

.news-content .news-item .news-item-flex .category {
    line-height: 1
}

.news-content .news-item .news-item-flex .category::before {
    display: inline-block;
    margin-right: 12px;
    font-weight: 500;
    color: var(--Grey-900);
    line-height: 26px;
    padding: 0px 8px;
}

.news-content .news-item.fhk .news-item-flex .category::before {
    content: '鳳凰谷';
    background-color: rgba(119, 161, 51, 0.2);
}

.news-content .news-item.p921 .news-item-flex .category::before {
    content: '921';
    background-color: rgba(239, 93, 30, 0.2);
}

.news-content .news-item.cfpp .news-item-flex .category::before {
    content: '車籠埔';
    background-color: rgba(16, 67, 109, 0.2);
}

.news-content .news-item.kto .news-item-flex .category::before {
    content: '墾丁天文台';
    background-color: rgba(55, 57, 98, 0.2);
}

.detail .caption {
    color: var(--Grey-500);
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    margin-top: 3rem;
}

.detail .caption:has(.category) {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    color: var(--Grey-500);
}

.detail .caption:has(.category) .date {
    position: relative;
    margin-left: 20px;
    padding-left: 20px;
}

.detail .caption:has(.category) .date::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 0px;
    width: 1px;
    height: 20px;
    background-color: var(--Grey-200);
}

.detail .caption .ml-auto {
    margin-left: auto
}

.detail .caption i {
    font-size: 1.5rem;
    vertical-align: middle;
    margin-right: 5px;
}

.detail .caption i.fa-cloud-download-alt::before {
    content: '\e907' !important;
}

.detail .heading {
    line-height: 35px;
    font-size: 1.375rem;
    color: var(--Grey-900);
    margin: 1.25rem 0;
    font-weight: 500;
}

.detail .bg-F5F5F5~.heading {
    margin-bottom: 0.5rem;
    margin-top: 2rem;
}

.detail .heading+.description {
    margin-bottom: 2rem;
}

.detail .bg-F5F5F5 .heading {
    margin: 0 0 0.5rem 0;
}


.detail .heading:has(i) {
    margin-top: 2rem;
    display: flex;
    align-items: center;
}

.detail .heading:has(i):after {
    content: '';
    display: block;
    height: 1px;
    background-color: var(--Grey-200);
    flex: 1;
    margin-left: 10px;
}

.detail .heading i {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25rem;
    width: 35px;
    height: 35px;
    font-weight: 400;
    border-radius: 50%;
    margin-right: 10px;
    color: var(--white-100);
    background: var(--background-strong);
}

.detail .tag ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0px;
}

.detail .tag ul li {
    list-style: none;
    margin: 0 10px;
    display: flex;
    flex-wrap: wrap;
}

.detail .tag ul li:has(.moment) {
    margin: 0 5px;
}

.detail .tag ul li:has(.heading) {
    width: 100%;
    margin-left: 1.5rem;
}

.detail .tag ul li::before {
    content: '\e932';
    font-family: 'nmnsIcon';
    margin-right: 2px;
    color: var(--Grey-500);
    width: initial;
    height: initial;
    position: initial;
    background-color: initial;
}

.detail .tag ul li:has(.moment)::before,
.detail .tag ul li:has(.SDGSimg)::before {
    content: none;
}

.detail .tag ul li:has(.heading)::before {
    content: '';
    position: absolute;
    top: 14px;
    left: -18px;
    display: block;
    width: 10px;
    height: 5px;
    background-color: var(--BrandGreen-600);
}

.detail .tag ul li .heading {
    font-size: 1.125rem;
    margin-bottom: 0;
    margin-right: 0.5rem;
    font-weight: 400;
    color: var(--Grey-700);
    margin-top: 0px;
    line-height: 36px;
}

.detail .tag ul li .moment a {
    margin: 0 0.5rem
}

.detail .tag ul li .SDGSimg {
    display: flex;
    flex-wrap: wrap;
}

.detail .tag ul li .SDGSimg a::before {
    content: none;
}

.detail .tag ul li .SDGSimg img {
    width: 50px;
    height: auto;
    margin: 0.5rem;
}

.detail .tag ul li a {
    display: inline-block;
    line-height: 30px;
    font-size: 1rem;
}

.detail .tag ul li a::before {
    bottom: 0px
}

#contentContainer .containerBlk {
    margin-bottom: 3rem;
}

.newsBlk {
    overflow: hidden;
    padding: 1rem 1rem 0 1rem;
}

.newsBlk .owl-carousel {
    padding: 0px
}

.newsBlk .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.news-slider .owl-stage {
    display: flex;
}

.news-slider .owl-item {
    list-style: none;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    transition: all 0.3s;
    outline: transparent 3px solid
}

/* .news-slider .owl-item:before {
    content: '';
    position: absolute;
    top: initial !important;
    bottom: -2px !important;
    left: -2px !important;
    width: calc(100% + 4px) !important;
    height: 3px !important;
    background-color: var(--BrandGreen-600);
    transition: all 0.3s;
    opacity: 1;
} */

.news-slider .owl-item:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
}

.news-slider .owl-item:hover:before {
    opacity: 0;
}

.news-slider li::before {
    content: none !important;
}

.news-slider li a {
    padding: 25px;
    display: block;
}

@media (max-width:575px) {
    .news-slider li a {
        padding: 20px;
    }
}

.news-slider li a:before {
    content: none;
}

.news-slider li a .text {
    padding: 10px 10px 0px 10px;
    margin-top: 5px;
}

@media (max-width:768px) {
    .news-slider li a .text {
        padding: 0px;
    }
}

.news-slider li a .img {
    aspect-ratio: 5 / 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.news-slider li a .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-slider li a .category {
    background-color: var(--BrandGreen-100);
    font-size: 14px;
    color: var(--Grey-900);
    display: inline-block;
    padding: 5px 10px;
    line-height: 1.25;
    margin-bottom: 0.75rem;
    position: relative;
}

.news-slider li a .category:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    border-style: solid;
    border-width: 10px 10px 0 0;
    border-color: #fff transparent transparent transparent;
}

.news-slider li a .heading {
    font-size: 22px;
    margin: 0;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 1px;
    line-height: 1.5;
    color: var(--BrandGreen-700);
}

.newsBlk .customContainer {
    display: flex;
    justify-content: center;
}

.calendar-setting {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.calendar-setting .date {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-right: 1rem;
}

@media (max-width:480px) {
    .calendar-setting .date {
        margin-right: 0rem;
    }
}

.calendar-setting .date .text .h3 {
    text-indent: initial;
    margin: 0;
}

@media (max-width:480px) {
    .calendar-setting .date .text .h3 {
        font-size: 1.5rem
    }
}

.calendar-setting .date .text .h3::before {
    content: none;
}

.calendar-setting .date .text .h3::after {
    content: none;
}

.calendar-setting .date .prev {
    margin-right: 0.5rem;
    transform: rotate(180deg);
}

@media (max-width:480px) {
    .calendar-setting .date .prev {
        margin-right: 0.25rem;
    }
}

.calendar-setting .date .next {
    margin-left: 0.5rem;
}

@media (max-width:480px) {
    .calendar-setting .date .next {
        margin-left: 0.25rem;
    }
}

.calendar-setting .date .prev a:before,
.calendar-setting .date .next a:before {
    content: none;
}

.calendar-setting .date :not(.today-btn) a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: var(--BrandGreen-600);
    font-size: 1.5rem;
}

.calendar-setting .date a i {
    font-weight: 600;
}

.calendar-setting .date a i.fa-angle-right:before,
.calendar-setting .date a i.fa-angle-left:before {
    content: '\e962';
}

.calendar-setting .date :not(.today-btn) a:hover {
    color: var(--BrandGreen-300);
    border: 2px solid var(--BrandGreen-300);
    background: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%) !important;
}

.calendar-setting .date a.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: var(--BrandGreen-50);
    color: var(--BrandGreen-600);
    outline: none !important;
}

.filter {
    align-self: center;
    margin-left: auto;
    font-size: 0.9rem;
    text-align: center;
}

@media (min-width:415px) {
    .filter {
        display: none;
    }
}

.filter a {
    display: block;
    font-size: 1.5rem;
    line-height: 0;
}

.open-color {
    align-self: center;
    display: flex;
    flex-wrap: wrap;
    margin-right: 1rem;
}

@media (max-width:414px) {
    .open-color {
        margin: 0.5rem 0;
    }
}

.open-color span {
    margin-left: 0.5rem;
    display: flex;
    align-items: center;
    color: var(--Grey-900);
}

.open-color span::before {
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: block;
    margin-right: 0.25rem;
    background-color: var(--Grey-300);
}

.open-color span.yellow-dot::before {
    background-color: #ffe600;
}

.open-color span.pink-dot::before {
    background-color: #e92d6f;
}

.open-color span.green-dot::before {
    background-color: var(--BrandGreen-300);
}

.collection .open-color span.green-dot::before {
    background-color: var(--BrandGreen-600);
}

.open-color span.blue-dot::before {
    background-color: var(--BrandBlue-500);
}

.mode {
    display: flex;
    align-items: center;
    margin-left: auto;
}

@media (max-width:991px) {
    .mode {
        display: none;
    }
}

.mode a {
    margin: 0 0.5rem;
}

.mode a#calendarImageDownload {
    padding-left: 1.35rem;
}

.mode a#calendarImageDownload::after {
    content: '\e907';
    position: absolute;
    top: 0px;
    left: 0px;
    font-family: 'nmnsIcon';
}

.calendar .calendar-select {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.calendar .calendar-select i {
    font-size: 1.3rem;
    margin-right: 0.5rem;
    color: #666;
    align-self: center;
}

.calendar .calendar-select input,
.calendar .calendar-select .select-group button {
    width: 100%;
    height: 50px;
    border-radius: 8px;
    padding: 0 1rem;
    border: var(--Grey-200) 1px solid;
}

.calendar .calendar-select input {
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.calendar .calendar-select .date,
.calendar .calendar-select .select-group {
    flex: 1;
    margin: 10px 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

@media (max-width:409px) {

    .calendar .calendar-select .date,
    .calendar .calendar-select .select-group {
        flex: initial;
        margin: 10px 0;
        width: 100%;
    }
}

.calendar .calendar-select .date label {
    position: relative;
    width: 100%;
    margin-bottom: 0.25rem;
    color: var(--Grey-900);
}

.calendar .calendar-select .date span:not(.required) {
    margin: 0 10px;
}

.calendar .calendar-select .select-group button {
    background-color: var(--white-100);
    display: flex;
    align-items: center;
    color: var(--Grey-900);
}

.calendar .calendar-select .select-group button.dropdown-toggle::after {
    margin-left: auto;
}

.calendar .calendar-select .select-group button[aria-expanded="true"] {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.calendar .checkbox-group {
    background-color: var(--BrandGreen-50);
    color: var(--Grey-700);
}

.calendar .check-items-group {
    display: flex;
    flex-wrap: wrap;
    padding: 1em 1.5rem;
}

@media (max-width:694px) {
    .calendar .check-items-group {
        padding: 0.75em 0.5rem;
    }
}

.calendar .check-item.all {
    width: 100% !important;
}

.calendar .check-item {
    width: 20%;
    font-size: 1rem;
    padding: 0 0.5rem;
}

@media (max-width:694px) {
    .calendar .check-item {
        width: 33.3%;
    }
}

@media (max-width:510px) {
    .calendar .check-item {
        width: 50%;
        font-size: 0.9rem;
    }
}

.calendar .check-item input[type=checkbox],
.calendar .check-item input[type=radio] {
    width: 25px;
    height: 25px;
}

.calendar .check-item .form-check-input:checked {
    background-color: var(--BrandGreen-700);
    border-color: var(--BrandGreen-700);
}

.calendar .check-item .form-check-input {
    margin-right: 0.25rem;
    margin-top: 3px;
}

.calendar .check-item .form-check-label {
    cursor: pointer;
}

.calendar .day.closed {
    background-color: var(--Grey-100);
    color: #464646;
    border-bottom: var(--Grey-300) solid 3px !important;
}

.calendar .day.closed::after {
    content: '休館';
    opacity: 1;
    font-size: 1rem;
    position: absolute;
    right: 5px;
    bottom: 8px;
    line-height: initial;
    font-size: 0.95rem;
}

.selection {
    margin: 0.5rem 0 2rem 0;
}

.selection ul {
    padding: 0 !important;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
}

.selection .selection-item {
    list-style: none;
    text-indent: initial;
    margin: 0.25rem;
}

.selection .selection-item::before {
    content: none;
}

.selection .selection-item a {
    background-color: var(--BrandGreen-50);
    border-radius: 4px;
    display: block;
    border: 1px solid var(--BrandGreen-500);
    font-size: 1rem;
    padding: 0 0.75rem;
}

.selection .selection-item a:hover {
    color: #fff;
    background-color: var(--BrandGreen-500);
}

.selection .selection-item a::before {
    content: none;
}

.selection .selection-item a i::before {
    content: '\e930';
}


/*行事曆-週*/

.Weekly {
    width: 100%;
    margin-top: 1rem;
    overflow: hidden;
}

.Weekly .h4 {
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.Weekly .date .day {
    position: relative;
    width: calc(100%/7);
    float: left;
}

.Weekly .date .day {
    font-size: 1.75rem;
    padding: 0.5rem 0.75rem;
    font-weight: 400;
    border-bottom: var(--black-90) solid 3px;
    /* font-family: 'Roboto', 'Noto Sans TC'; */
}

@media (max-width:991px) {
    .Weekly .date .day {
        padding: 0.3rem 0.5rem;
    }
}

.Weekly .date .day.today {
    background-color: var(--BrandGreen-300);
}

.Weekly .date .day span {
    font-size: 0.95rem;
}

.Weekly .date .day span.open {
    position: absolute;
    bottom: 10px;
    right: 12px;
    line-height: 1.2;
    text-align: right;
    font-size: 0.875rem;
}

@media (max-width:991px) {
    .Weekly .date .day span.open {
        right: 5px;
        font-size: 0.75rem;
    }
}

.Weekly .date .day span.open::before {
    content: '\e906';
    font-family: 'nmnsIcon';
    margin-right: 2px;
}

.Weekly .event {
    /* margin-bottom: 5rem; */
}

.Weekly .event-item {
    display: block;
    width: calc(100%/7);
    padding: 0 0 1rem 0;
    min-height: 100%;
}

.Weekly .day-7 .event-item:nth-child(7n+1) {
    background-color: #fffbeb;
}

.Weekly.choose-day .day-7 .event-item:nth-child(7n+1) {
    background-color: initial
}

.Weekly .event-item.closed {
    background-color: var(--Grey-100);
    text-indent: -9999px;
}

.Weekly .event-item a {
    padding: 0.5rem 0.5rem 0.5rem 0.35rem;
    display: block;
    color: var(--Grey-900);
    transition: all 0.2s;
    text-decoration: none;
    border-left: var(--white-100) solid 5px;
}

.Weekly .event-item a::before {
    content: none;
}

.Weekly .event-item.bd-yellow a {
    border-left: #ffe600 solid 5px;
}

.Weekly .event-item a:hover,
.Weekly .event-item a:focus {
    border-left: var(--BrandGreen-300) solid 5px;
    background-color: var(--BrandGreen-50);
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3);
    transform: translateY(-5px);
    position: relative;
    z-index: 2;
}

.Weekly .event-item a:active {
    background-color: initial;
}

.Weekly .time {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

.Weekly .time-item {
    background-color: #e2e2e2;
    margin: 3px;
    font-size: 0.9rem;
    line-height: 1.5;
    width: calc(100% / 3 - 6px);
    text-align: center;
}

@media (max-width:991px) {
    .Weekly .time-item {
        width: calc(100% / 2 - 6px);
    }
}

.Weekly .main {
    font-size: 1rem;
    line-height: 1.5;
    color: var(--Grey-900);
    word-break: break-all;
}

.Weekly .location {
    font-size: 0.875rem;
    color: var(--Grey-500);
    line-height: 20px;
}

.renew {
    color: var(--Grey-700);
    font-size: 0.875rem;
    text-align: right;
}

/* 只有 1 天 */
.day-1 {
    width: calc(100% / 7 * 1);
}

.day-1 .event-item {
    width: 100% !important;
}

/* 只有 2 天 */
.day-2 {
    width: calc(100% / 7 * 2);
}

.day-2 .event-item {
    width: calc(100%/2) !important;
}

/* 只有 3 天 */
.day-3 {
    width: calc(100% / 7 * 3);
}

.day-3 .event-item {
    width: calc(100%/3) !important;
}

/* 4 天 */
.day-4 {
    width: calc(100% / 7 * 4);
}

.day-4 .event-item {
    width: calc(100%/4) !important;
}

/* 5 天 */
.day-5 {
    width: calc(100% / 7 * 5);
}

.day-5 .event-item {
    width: calc(100%/5) !important;
}

/* 6 天 */
.day-6 {
    width: calc(100% / 7 * 6);
}

.day-6 .event-item {
    width: calc(100%/6) !important;
}

/* 7 天 */
.day-7 {
    width: calc(100% / 7 * 7);
}

.day-7 .event-item {
    width: calc(100%/7) !important;
}

/*行事曆-日*/

.timeline {
    margin: 0.5rem auto 0 auto;
    max-width: 800px;
}

.timeline .day {
    background-color: #fff;
    color: #000;
    font-size: 2rem;
    padding: 0.5rem 1rem;
    font-family: 'Roboto', 'Noto Sans TC';
    font-weight: 400;
    display: flex;
    margin-bottom: 2rem;
    height: initial;
    flex-direction: initial;
    justify-content: left;
    border-bottom: #000 solid 3px;
    position: relative;
}

.timeline .day::after {
    padding: 0 0.5rem 0.25rem 0;
    color: #262626;
}

.calendar .timeline .day.closed::after {
    bottom: 8px;
    top: initial;
}

.timeline .day h4 {
    font-size: 2rem;
    color: #262626;
    margin-bottom: 0;
    margin-top: 0;
}

.timeline .day span {
    font-size: 1rem;
    align-self: flex-end;
    margin-left: 0.5rem;
    color: #757575;
    line-height: 20px;
}

.timeline .day.today {
    background-color: var(--BrandGreen-300);
}

.timeline .day.closed+.line {
    border-left: none;
    margin-left: 0.5rem;
    font-size: 1.5rem;
}

.timeline .day.today.closed {
    background-color: #F0F0F0;
}

.timeline .day.today .h4 {
    margin-bottom: 0;
    color: #262626;
    margin-top: 0;
}

.timeline .day.today span,
.timeline .day.closed span {
    color: #262626;
}

.timeline .line {
    border-left: 3px solid var(--BrandGreen-700);
    position: relative;
    list-style: none;
    margin-left: 80px;
}

@media (max-width:575px) {
    .timeline .line {
        margin-left: 3rem;
        margin-right: 2.5rem;
    }
}

.timeline .clock {
    display: flex;
}

.timeline .clock div {
    font-family: 'Roboto', 'Noto Sans TC';
    font-weight: 700;
    background-color: #007C69;
    color: #fff;
    font-size: 1.25rem;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    left: -27px;
    margin-bottom: 1rem;
    border: var(--BrandGreen-100) 5px solid;
    box-shadow: 0px 0px 0px 5px var(--white-100);
}

.timeline .clock span {
    align-self: center;
    margin-bottom: 1rem;
    display: none;
    font-size: initial;
    line-height: 1.75;
}

.timeline .clock span a {
    padding: 0 1.5rem 0 0.5rem;
    color: var(--BrandGreen-700);
    border-radius: 5px;
    margin-left: 0.5rem;
    position: relative;
    text-decoration: none;
    font-size: 0.875rem;
    border: var(--BrandGreen-700) 1px solid;
}

.timeline .clock span a:hover,
.timeline .clock span a.active {
    background-color: var(--BrandGreen-50);
    color: var(--Grey-700);
}

.timeline .clock span a:before {
    content: none;
}

.timeline .clock span a::after {
    content: '';
    border-style: solid;
    border-width: 5px 5px 0 5px;
    border-color: var(--BrandGreen-700) transparent transparent transparent;
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

.timeline .clock.end div {
    background-color: var(--Grey-50);
    border: var(--Grey-200) 1px solid;
    color: var(--black-40);
    font-weight: 400;
    box-shadow: none;
}

.timeline .clock.end span {
    display: block;
}

.timeline .event {
    padding: 0rem .5rem 1rem 1.5rem;
    position: relative;
}

.timeline .event .minute {
    position: absolute;
    left: -70px;
    color: var(--Grey-700);
    font-weight: 500;
    font-size: 1.1rem;
    line-height: 1.4;
}

@media (max-width:575px) {
    .timeline .event .minute {
        position: relative;
        left: 0px;
        margin-top: 1rem;
        margin-bottom: 0.5rem;
    }
}

.timeline .event .minute::after {
    position: absolute;
    top: 5px;
    right: -30px;
    display: inline-block;
    content: "";
    /* border-style: solid; */
    /* border-width: 7px 0 7px 10px; */
    /* border-color: transparent transparent transparent #b4b4b4; */
    width: 12px;
    height: 12px;
    background-color: var(--BrandGreen-700);
    border-radius: 50%;
}

@media (max-width:575px) {
    .timeline .event .minute::after {
        right: initial;
        left: -32px;
    }
}

.timeline .event .content {
    box-shadow: none;
    margin: initial;
    border-radius: 0;
    padding: initial;
    overflow: initial;
    background-color: initial;
}

.timeline .event .content a {
    display: block;
    padding: 0.5rem 1rem;
    transition: all 0.3s;
    text-decoration: none;
    border-left: transparent solid 5px;
}

.timeline .event .content a:before {
    content: none;
}

.timeline .event .content a:hover,
.timeline .event .content a:focus {
    background-color: #F2FCFA;
    transform: translateY(-5px);
    border-left: #05D9B8 solid 5px;
    box-shadow: 0px 10px 30px 0px var(--black-20);

}

.timeline .event .content .category {
    color: var(--Grey-500);
    font-size: 1rem;
}

@media (max-width:575px) {
    .timeline .event .content .category {
        line-height: 1.5;
    }
}

.timeline .event .content .main {
    font-size: 1.25rem;
    color: var(--Grey-700);
    font-weight: 500;
}

.timeline .event .content .location {
    color: var(--Grey-500);
    font-size: 1rem;
    position: absolute;
    top: 0.5rem;
    left: 96px;
}

@media (max-width:575px) {
    .timeline .event .content .location {
        position: initial;
        line-height: 1.5;
        margin-top: 0.25rem;
    }
}

.timeline .event .content .location:before {
    content: '';
    padding-left: 1rem;
    border-left: var(--Grey-300) 1px solid
}

@media (max-width:575px) {
    .timeline .event .content .location:before {
        content: none;
    }
}

/*歷史沿革*/

.history ul {
    border-left: 3px solid var(--BrandGreen-700);
    position: relative;
    text-align: left;
    margin-left: 270px;
    padding: 30px 0 60px 0 !important;
}

.history .news-content ul {
    margin-left: 220px;
}

@media (max-width: 768px) {
    .history .news-content ul {
        margin-left: 10px;
    }
}

.history ul::before {
    content: '';
    position: absolute;
    top: 0px;
    left: -3px;
    border-left: 3px dotted var(--white-100);
    height: 60px;
    width: 1px;
}

.history ul::after {
    content: '';
    position: absolute;
    bpttom: 0px;
    left: -3px;
    border-left: 3px dotted var(--white-100);
    height: 60px;
    width: 1px;
}

@media (max-width:768px) {
    .history ul {
        margin-left: 10px;
        display: block !important;
    }
}

.history.exhibit ul {
    margin-left: 105px;
}

@media (max-width: 768px) {
    .history.exhibit ul {
        margin-left: 10px;
    }
}

.history.exhibit ul li:before {
    left: -110px;
}

@media (max-width: 768px) {
    .history.exhibit ul li:before {
        left: 11px;
        text-align: left;
    }
}

.history.chronology ul {
    margin-left: 140px;
}

@media (max-width: 768px) {
    .history.chronology ul {
        margin-left: 10px;
    }
}

.history.chronology .news-content ul li:before, .history.chronology ul li:before {
    left: -140px !important;
}

@media (max-width: 768px) {
    .history.chronology .news-content ul li:before, .history.chronology ul li:before {
        left: 40px !important;
    }
}

.history ul li {
    border-bottom: var(--Grey-200) 1px solid;
    padding: 2rem 1rem 0 0;
    position: relative;
    display: block;
}

@media (max-width:768px) {
    .history ul li {
        padding-top: 6rem;
    }
}

.history ul li:before {
    position: absolute;
    left: -270px !important;
    top: 38px !important;
    content: attr(data-date) !important;
    font-weight: 100;
    font-style: italic;
    color: var(--Grey-700);
    font-size: 3rem;
    width: initial !important;
    height: initial !important;
    background-color: initial !important;
}

.history .news-content ul li:before {
    left: -220px !important;
}

@media (max-width:768px) {
    .history .news-content ul li:before {
        left: 36px !important;
    }
}

@media (max-width:768px) {
    .history ul li:before {
        left: 40px !important;
        text-align: left;
        top: 36px !important;
        font-size: 2.5rem;
    }
}

.history ul li::after {
    position: absolute;
    left: -270px;
    content: '';
    width: 270px;
    display: block;
    height: 1px;
    background-color: var(--Grey-200);
}

.history .news-content ul li::after {
    left: -220px;
    width: 220px;
}

.history.chronology .news-content ul li::after, .history.chronology ul li::after {
    left: -140px;
    width: 140px;
}

@media (max-width:768px) {
    .history ul li::after {
        content: none;
    }
}

.history-collapse ul li:nth-of-type(3)~li {
    display: none;
}

.history-collapse ul li.active {
    display: block !important;
}

.history-item {
    margin-bottom: 2rem;
    position: relative;
    padding-left: 2rem;
}

@media (max-width:575px) {
    .history-item {
        flex-wrap: wrap;
    }
}

.history-item:after {
    position: absolute;
    display: block;
    left: -12px;
    background: var(--BrandGreen-700);
    border-radius: 50%;
    height: 20px;
    width: 20px;
    content: "";
    top: 10px;
    border: var(--BrandGreen-100) 5px solid;
    box-shadow: 0px 0px 0px 5px var(--white-100);
}

/* @media (max-width:441px) {
    .history-item:after {
        left: -33px
    }
} */

.history-item span {
    font-size: 1.25rem;
    color: var(--Grey-700);
    display: inline-block;
    background-color: var(--Grey-100);
    padding: 10px 20px;
    line-height: 1;
    font-weight: 500;
    margin-right: 10px;
}

@media (max-width:575px) {
    .history-item span {
        margin-bottom: 0.25rem
    }
}

.history-item span::after {
    border-radius: 4px;
    font-size: 1rem;
    position: absolute;
    top: 0px;
    margin-left: 20px;
    line-height: 40px;
    background-color: var(--BrandGreen-100);
    border-radius: 0px;
    padding: 0 1rem;
}

.history-item.history-fhk span::after {
    content: '鳳凰谷';
}

.history-item.history-921 span::after {
    content: '921';
}

.history-item.history-cfpp span::after {
    content: '車籠埔';
}

.history-item.history-fhk span {
    margin-right: 90px;
}

.history-item .heading {
    font-size: 1.25rem;
    background-color: initial;
    padding: initial;
    font-weight: 500;
    color: var(--Grey-700);
    margin: 0;
}

.history-item .heading+.descript {
    margin-top: 0.25rem;
}

.history-item .heading a {
    font-size: 1.125rem;
    font-weight: 400;
}

.history-item a::before {
    content: none;
}

.history-item .descript {
    font-size: 1.125rem;
    background-color: initial;
    padding: initial;
    font-weight: 400;
    color: var(--Grey-700);
}

.history-item .descript p {
    margin-bottom: 0;
}

.history-item a:hover {
    color: var(--Grey-900);
}

.history-item .link-icon {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.history-item .link-icon::before {
    font-family: 'nmnsIcon';
    margin-right: 0.25rem;
}

.history-item .link-icon a {
    font-size: 16px
}

.history-item a.fhk::before {
    content: '鳳凰谷';
}

.history-item a.p921::before {
    content: '921';
}

.history-item a.cfpp::before {
    content: '車籠埔';
}

.history-item a span {
    margin-right: 0.5rem;
}

.album-video {
    overflow: hidden;
    padding: 1rem;
    /* margin: 0 0 3rem -1rem; */
}

.album-video ul {
    max-width: 95%;
    padding: 0px !important;
}

.album-video .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.album-video ul li::before {
    content: none !important;
}

.album-video ul li:hover {
    border-radius: 10px 10px 0 0;

}

.album-video ul li a {
    background-color: var(--white-100) !important;
    border: none !important;
}


.album-video ul li a:hover {
    border-radius: initial !important;
}

.album-video ul li a img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.album-video.album-video ul li a img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.album-video ul li a .text {
    padding: 24px 20px 26px 20px;
}

.album-video ul li a .time {
    font-size: 16px;
    color: var(--Grey-500);
    line-height: 1;
}

.album-video ul li a .heading {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0.5rem 0 0 0;
    line-height: 1.5;
    color: var(--Grey-900);
    /* min-height: 60px; */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
}

.album-video ul li:hover a .heading {
    color: var(--BrandGreen-700);
}

.album-video .icon {
    position: absolute;
    left: 12px;
    top: 12px;
}

.album-video .icon li {
    overflow: initial;
    background-color: initial;
}

.album-video .icon li:hover {
    border-radius: initial;
    transform: initial;
    outline: initial;
    box-shadow: none;
}

.album-video .icon li a {
    box-shadow: none;
    font-size: 1.5rem;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s;
}

.album-video .icon li a::before {
    content: none !important;
}

.album-video .icon li:hover a {
    color: var(--white-100);
    background-color: var(--BrandGreen-500) !important;
    border-radius: 50% !important;
}

.album-video .icon li a:focus {
    border: orange 2px dotted !important;
    background-color: var(--BrandGreen-500) !important;
    color: var(--white-100);
    transition: none;
}

.album-video .icon a:hover::before {
    content: none;
}

.album-video .icon i.fas {
    font-weight: 400;
}

.album-video .icon i.fa-cloud-download-alt::before {
    content: '\e961';
}

.album-video .icon li .download-text {
    display: none;
}

.album-video .icon li:hover .download-text,
.album-video .icon li:focus-within .download-text {
    display: block;
    position: absolute;
    left: 45px;
    bottom: 2px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    font-size: 0.875rem;
    white-space: nowrap;
    padding: 0 10px;
    background-color: var(--white-100);
    border-radius: 5px;
}

.album-video .customContainer {
    display: none;
}

.album {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -20px;
}

.album .album-item {
    width: calc(100% / 3 - 40px);
    margin: 20px;
    position: relative;
    overflow: hidden;
    box-shadow: 0px 5px 10px 0px var(--black-10);
    transition: all 0.3s;
    outline: transparent 3px solid;
}

@media (max-width:820px) {
    .album .album-item {
        width: calc(100% / 3 - 30px);
        margin: 16px 15px;
    }
}

@media (max-width:768px) {
    .album .album-item {
        width: calc(100% / 2 - 30px);
    }
}

@media (max-width:575px) {
    .album .album-item {
        width: calc(100% / 1 - 30px);
    }
}

.album .album-item:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 5px 10px 0px var(--black-20);
    transform: scale(1.01);
}

.album .album-item:focus-within {
    outline: orange 3px dotted;
    border-radius: 20px;
    box-shadow: 0px 5px 10px 0px var(--black-20);
    transform: scale(1.01);
}

.album .album-item a {
    display: block;
    background-color: var(--white-100);
    height: 100%;
}

.album .album-item a:before {
    content: none;
}

.album .album-item a img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
    width: 100%;
}

.album .album-item:has(.icon) a img {
    object-fit: cover;
    height: 290px;
    aspect-ratio: 4 / 3;
}

@media (max-width:991px) {
    .album .album-item:has(.icon) a img {
        height: 206px;
    }
}

@media (max-width:768px) {
    .album .album-item:has(.icon) a img {
        height: 255px;
    }
}

@media (max-width:575px) {
    .album .album-item:has(.icon) a img {
        height: initial;
        width: 100%;
    }
}

.album .album-item a .text {
    padding: 24px 20px 26px 20px;
}

.album .album-item a .time {
    font-size: 16px;
    color: var(--Grey-500);
    line-height: 1;
}

.album .album-item a .heading {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 10px 0 0 0;
    line-height: 1;
    color: var(--Grey-900);
    word-break: break-all;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.album .album-item:hover a .heading {
    color: var(--BrandGreen-700);
}

.album .icon {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: 0;
}

.album .icon li a {
    box-shadow: none;
    font-size: 1.5rem;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s;
}

.album .icon li a::before {
    content: none;
}

.album .icon li:hover a, .album .icon li:focus-within a {
    color: var(--white-100);
    background-color: var(--BrandGreen-500);
    border-radius: 50%;
}

.albumk .icon a:hover::before {
    content: none;
}

.album .icon i.fas {
    font-weight: 400;
}

.album .icon i.fa-cloud-download-alt::before {
    content: '\e961';
}

.album .icon li {
    list-style: none;
}

.album .icon li::before {
    content: none;
}

.album .icon li .download-text {
    display: none;
}

.album .icon li:hover .download-text,
.album .icon li:focus-within .download-text {
    display: block;
    position: absolute;
    left: 45px;
    bottom: 2px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    font-size: 0.875rem;
    white-space: nowrap;
    padding: 0 10px;
    background-color: var(--white-100);
    border-radius: 5px;
}

.youtube {
    width: 85%;
    margin: 3rem auto;
    overflow: hidden;
    background-color: var(--Grey-100);
}

@media (max-width: 480px) {
    .youtube {
        width: 95%;
    }
}

.youtube span {
    font-size: 1rem;
    padding: 16px 20px;
    display: block;
    color: var(--Grey-700);
    line-height: 1.6;
}

.youtube span strong {
    display: block;
    font-weight: 400;
    color: var(--Grey-900);
    line-height: 1;
    margin-top: 10px;
}

.row .youtube {
    width: 100%;
    margin: 0;
}

.video-container {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: 100%;
}

.video-container iframe,
.video-container object,
.video-container embed {
    width: 100%;
    height: 100%;
}

.fa-cloud-download-alt::before {
    content: '\e907' !important;
    font-weight: 400 !important;
}

.album-content {
    overflow: hidden;
    max-width: 790px;
    margin: 3rem auto;
}

.album-content img {
    width: 100%;
    height: auto;
}

.album-slide {
    clear: both;
    position: relative;
    margin-bottom: 5rem;
}

.album-control {
    position: absolute;
    top: 50%;
    /* left: calc(100% / 2 - 480px); */
    z-index: 2;
    width: 100%;
    max-width: 960px;
    height: 50px;
}

.album-previous, .album-next {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    text-decoration: none;
    cursor: pointer;
    margin: 0 0.5rem;
    color: var(--BrandGreen-600);
    font-size: 1.5rem
}

@media (max-width:480px) {

    .album-previous,
    .album-next {
        width: 25px;
        height: 25px;
        font-size: 1rem;
    }
}

.album-previous {
    position: absolute;
    left: 0px;
}

.album-next {
    position: absolute;
    right: 0px;
}

.album-previous:hover, .album-previous:focus-visible,
.album-next:hover, .album-next:focus-visible {
    border: 2px solid var(--BrandGreen-300) !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%) !important;
    color: var(--BrandGreen-300);
}

.album-previous.swiper-button-disabled,
.album-previous.swiper-button-disabled:hover,
.album-next.swiper-button-disabled,
.album-next.swiper-button-disabled:hover {
    cursor: not-allowed;
    background-color: var(--Grey-100);
    color: var(--Grey-400);
    opacity: 0.35;
}

.album-previous:focus,
.album-next:focus {
    outline: 2px dotted orange !important;
    box-sizing: border-box;
}

.album-pagination {
    position: absolute;
    z-index: 1;
    bottom: -40px !important;
    color: var(--Grey-7);
    font-size: 1rem;
    text-align: center;
}

.album-pagination span {
    color: var(--Grey-700);
    font-size: 1rem;
}

.album-thumbs {
    padding: 0.5rem;
}

.album-thumbs .swiper-slide {
    opacity: 0.5;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: all 0.3s
}

@media (max-width:767px) {
    .album-thumbs .swiper-slide {
        height: 200px;
    }
}

@media (max-width:575px) {
    .album-thumbs .swiper-slide {
        height: 150px;
    }
}

@media (max-width:480px) {
    .album-thumbs .swiper-slide {
        height: 120px;
    }
}

.album-thumbs .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.album-thumbs .swiper-slide-thumb-active,
.album-thumbs .swiper-slide:hover {
    opacity: 1;
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
}

.album-content .share {
    float: right;
    margin-top: 0.5rem;
}

.album-content .share ul {
    padding: 0;
    display: flex;
    margin: 0;
}

.album-content .share ul li {
    list-style: none;
    margin: 0 0.2rem;
}

.album-content .share ul li a {
    display: inline-block;
    border: none;
}

.album-content .share ul li span {
    color: var(--Grey-900);
    font-size: 0.8rem;
    opacity: 0;
}

.album-content .share ul li:hover span {
    opacity: 1;
}

.swiper-notification {
    display: none;
}

.exhibits_margin {
    position: relative;
}

@media (max-width:991px) {
    .exhibits_margin {
        width: 100%;
        padding: 0;
        margin-bottom: 2rem;
    }
}

.detail .list {
    margin-top: 1.75rem;
}

.detail .list .list-item, .detail .list-item .flex-ai-center {
    display: flex;
    /* flex-wrap: wrap; */
    align-items: center;
    border-bottom: var(--Grey-200) 1px solid;
}

.detail .list .list-item .img, .detail .list-item .flex-ai-center img {
    width: 100px;
    flex-shrink: 0;
    margin: 20px 30px 20px 20px;
}

@media (max-width:480px) {
    .detail .list .list-item .img, .detail .list-item .flex-ai-center img {
        margin: 20px 1rem 0 0;
        width: 60px;
    }
}

.detail .list-item .flex-ai-center .text {
    margin: 20px;
}

.detail .list-item .flex-ai-center .text ol {
    padding-right: 0;
}

.detail .list .list-item .img img {
    width: 100%;
    height: auto;
}

.detail .list .list-item .text {
    margin: 20px;
    /* flex-grow: 1; */
    width: 100%;
}

@media (max-width:480px) {
    .detail .list .list-item .text {
        width: 100%;
        margin: 20px 0;
    }
}

.detail .list .list-item .text .heading, .detail .list-item .flex-ai-center .text .heading {
    margin: 0;
    color: var(--Grey-900);
    font-size: 1.25rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

@media (max-width:560px) {

    .detail .list .list-item .text ol,
    .detail .list .list-item .text ul {
        padding-right: 0;
    }
}

.detail .list .list-item>a {
    display: block;
    color: var(--Grey-900);
    font-weight: 500;
    font-size: 1.25rem;
    transition: all 0.3s;
    width: 100%;
}

.detail .list .list-item>a:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    border-bottom: var(--BrandGreen-300) 2px solid;
    background-color: var(--white-100);
}

.detail .list .list-item>a::before {
    content: none;
}

.detail .list .list-item a .info {
    display: flex;
    color: var(--Grey-700);
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 4px;
    line-height: 26px;
}

.detail .list .list-item a .info:has(.category) {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    color: var(--Grey-700);
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 4px;
    line-height: 26px;
}

.detail .list .list-item a .info .date {}

.detail .list .list-item a .info:has(.category) .date {
    position: relative;
    margin-left: 20px;
    padding-left: 20px;
}

.detail .list .list-item a .info:has(.category) .date::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 0px;
    width: 1px;
    height: 20px;
    background-color: var(--Grey-200);
}

.detail .list .list-item .info .category {
    font-size: 14px;
}

.detail .list .list-item a .info .category::before {
    line-height: 26px;
    display: inline-block;
    margin-right: 20px;
    font-weight: 500;
    padding: 0 5px;
}

.detail .list .list-item.top a .info .category::before {
    content: '置頂';
    background-color: var(--warning-light);
    color: var(--Grey-900);
}

.detail .list .list-item.new a .info .category::before {
    content: 'NEW';
    background-color: var(--BrandBlue-100);
    color: var(--BrandBlue-800);
}

.detail .list .list-item.hot a .info .category::before {
    content: '熱門';
    background-color: var(--danger-light);
    color: var(--danger-dark);
}

.detail .list .list-item a .info .top {
    background-color: var(--warning-light);
    color: var(--Grey-900);
    margin: 0 20px 0 0;
    padding: 0 5px;
}

.detail .list .list-item a .tag {
    color: var(--BrandGreen-700);
    font-size: 14px;
    line-height: 1.5;
}

.detail .list .list-item a .tag::before {
    content: '\e932';
    font-family: 'nmnsIcon';
    margin-right: 0.25rem;
    font-size: 1.125rem;
    vertical-align: middle;
    color: var(--Grey-500);
}

.detail .list-item .link a {
    font-size: 1.125rem;
}

.detail .list-item .link a+a {
    margin-left: 2rem
}

@media (max-width:575px) {
    .detail .list-item .link a+a {
        margin-left: 0rem;
        width: 100%
    }
}

.detail .list-item .link a::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 0px;
    display: block;
    height: 2px;
    background-color: var(--BrandGreen-300);
    transition: width 0.3s ease;
}

.detail .list-item .link a:hover::before {
    width: calc(100% - 60px);
}

.detail .list-item .link a:hover {
    color: var(--Grey-900);
}

.detail .list-item .link a::after {
    content: none;
}

.detail .list-item .link a span {
    position: relative;
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    text-indent: -9999px;
    line-height: 1;
}

.detail .list-item .link a span::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transition: background-color 0.3s ease;
}

.detail .list-item .link a span::after {
    content: '';
    position: absolute;
    bottom: 4px;
    right: 0px;
    display: block;
    width: 10px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transform: rotate(45deg);
    transition: background-color 0.3s ease;
}

.detail .list-item .link a:hover span::before,
.detail .list-item .link a:hover span::after {
    background-color: var(--BrandGreen-300);
}


.detail .floor-round {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background-image: url(../images/qa-bg.png);
    background-size: 322px 230px;
    background-position: -145px -45px;
    background-repeat: no-repeat;
    color: var(--white-100);
    font-size: 1.875rem;
    font-weight: 700;
    letter-spacing: 1px;
}

@media (max-width:480px) {
    .detail .floor-round {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
}

.detail .floor-round i {
    font-size: 3rem;
}

@media (max-width:480px) {
    .detail .floor-round i {
        font-size: 2rem;
    }
}

.detail .card .link {
    margin: 0.25rem 0;
}

.detail .card .link a::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 0px;
    display: block;
    height: 3px;
    background-color: var(--BrandGreen-300);
    transition: width 0.3s ease;
}

.detail .card .link a {
    /* font-size: 0.9rem; */
}

.detail .card .link a:hover::before {
    width: calc(100% - 60px);
}

.detail .card .link a:hover {
    color: var(--Grey-900);
}

.detail .card .link a::after {
    content: none;
}

.detail .card .link a span {
    position: relative;
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    text-indent: -9999px;
    line-height: 1;
}

.detail .card .link a span::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transition: background-color 0.3s ease;
}

.detail .card .link a span::after {
    content: '';
    position: absolute;
    bottom: 4px;
    right: 0px;
    display: block;
    width: 10px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transform: rotate(45deg);
    transition: background-color 0.3s ease;
}

.detail .card .link a:hover span::before,
.detail .card .link a:hover span::after {
    background-color: var(--BrandGreen-300);
}

.future-time {
    overflow: hidden;
    padding: 1rem;
    margin-bottom: 3rem;
}

.future-time .owl-carousel {
    max-width: 95%;
}

.future-time .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.future-time .item {
    background-color: var(--white-100);
    box-shadow: 0px 5px 10px 0px var(--black-10);
}

.future-time .item .date {
    padding: 0.75rem 1rem;
    text-align: center;
    background-color: var(--BrandGreen-50);
    color: var(--BrandGreen-700);
    font-weight: 500;
}

.future-time .item.closed .date {
    background-color: var(--Grey-50);
    color: var(--Grey-700);
}

.future-time .weatherBlk {
    color: var(--Grey-600);
    display: block;
    margin-bottom: 1rem;
    text-align: center;
}

.future-time .weatherBlk .weather_img {
    width: 32px;
    height: 32px;
    display: inline-flex;
    vertical-align: middle;
}

.future-time .weatherBlk .weather,
.future-time .weatherBlk .air {
    display: inline;
}

.future-time .weatherBlk .air::before {
    margin: 0 0.2rem 0 0;
}

.future-time .open_time_top {
    display: flex;
    align-items: center;
    color: var(--Grey-600);
    justify-content: center;
}

.future-time .open_time_top::before {
    content: '' !important;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url('../images/icon/museum-open.png');
    margin-right: 0.5rem;
    background-size: cover;
}

.future-time .closed .open_time_top::before {
    background-image: url('../images/icon/museum-close.png');
}

.future-time .open_time_top p {
    margin-bottom: 0;
}

.today-btn {
    margin-left: 1rem;
}

.today-btn::before {
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: inline-block;
    border: var(--BrandGreen-300) 2px solid;
    background-color: var(--BrandGreen-100);

}

.today-btn a {
    cursor: pointer;
    border: none;
    border-radius: 2px !important;
    width: initial !important;
    height: initial !important;
    padding: 0 0.5rem;
}


.calendar-setting {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 2.25rem 0 1rem 0;
}

.calendar-setting .date .text h3 {
    margin: 0;
    font-family: 'Roboto', 'Noto Sans TC';
}

.calendar-setting .date a.disabled:hover {
    border: none;
}

.calendarBlk {
    margin: 2rem 0;


}

.detail .calendarBlk .table {
    min-width: initial;
    border-collapse: collapse;
    margin-bottom: 0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0px 0px 10px var(--black-10);
    border: transparent 1px solid;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table {
        box-shadow: 0px 0px 10px 0px var(--black-10);
        border-spacing: 0px !important;
        border-collapse: collapse !important;
    }
}

.detail .calendarBlk .table .thead {
    text-align: center;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .thead {
        display: none !important;
    }
}

.detail .calendarBlk .table .tr:nth-of-type(odd) {
    background-color: var(--Grey-100) !important;
}

.detail .calendarBlk .table .tr:hover {
    box-shadow: initial !important;
    /* background-color: var(--Grey-50) !important; */
}

.detail .calendarBlk .table .th {
    width: calc(100% / 7);
    font-weight: 500 !important;
    border: var(--BrandGreen-500) 1px solid;
}

.detail .calendarBlk .table .th:first-of-type,
.detail .calendarBlk .table .th:last-of-type {
    border-radius: 0 !important;
}


.detail .calendarBlk .table .td {
    padding: 12px !important;
    border: var(--Grey-300) 1px solid;
}

.detail .calendarBlk .table .td:hover {
    background-color: var(--BrandGreen-50);
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .td {
        width: 100%;
        display: block !important;
        height: initial;
        border: none;
        border-bottom: #E4E4E4 1px solid;
        padding: 0.5rem;
        border-radius: 0px !important;
        overflow: hidden;
    }

    .detail .calendarBlk .table .tr:last-child .td:last-child {
        border: none;
    }
}

.detail .calendarBlk .table .day {
    color: var(--Grey-700);
    font-style: italic;
    display: flex;
    justify-content: flex-end;
    line-height: 1;
    margin-bottom: 0.75rem;
}

.detail .calendarBlk .table .day span {
    display: none;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .day {
        justify-content: initial;
        float: left;
        margin-right: 0.5rem;
    }

    .detail .calendarBlk .table .closed .day {
        float: left !important;
    }

    .detail .calendarBlk .table .expired .day {
        float: initial;
    }

    .detail .calendarBlk .table .day span {
        display: block;
        margin-right: 0.25rem;
    }
}

.detail .calendarBlk .table .expired,
.detail .calendarBlk .table .closed {
    /* background-color: var(--Grey-100); */
    opacity: 0.5;
}

.detail .calendarBlk .table .today {
    background-color: var(--BrandGreen-50);
}

.detail .calendarBlk .table .td.today {
    border-top: var(--BrandGreen-300) solid 5px;
}

.detail .calendarBlk .table .reserve-event {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.detail .calendarBlk .table .reserve-event a {
    font-size: 1rem;
    max-width: 116px;
    margin-bottom: 0.5rem;
}

.detail .calendarBlk .table .reserve-event:has(span) {
    line-height: 1.5;
}

.detail .calendarBlk .table .expired.closed .reserve-event {
    font-size: 1rem;
    display: flex;
    align-items: center;
    color: #333;
}

.detail .calendarBlk .table .expired.closed .day+.reserve-event>.reserve-event::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('../images/icon/museum-close.png');
    background-size: cover;
    margin-right: 5px;
}

.detail .calendarBlk .table .reserve-event .btn {
    font-size: 0.9rem;
    width: 100%;
    margin-bottom: 0;
    padding: 0 0.5rem;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .reserve-event .btn {
        width: initial;
        padding: 0 1rem;
    }
}

.detail .calendarBlk .table .reserve-event a.disabled {
    background-color: #999;
    border: #999 solid 1px;
    cursor: not-allowed;
    pointer-events: initial;
}

.detail .calendarBlk .table .reserve-event .reserve-item {
    font-size: 0.85rem;
    line-height: 1.35;
    margin-bottom: 0.25rem;
    padding-left: 0.5rem;
    width: 100%;
    text-align: center;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .reserve-event .reserve-item {
        font-size: 1rem;
        color: var(--Grey-700);
    }
}

.detail .calendarBlk .table .reserve-event .reserve-item::before {
    content: '\f0da';
    font-weight: bold;
    font-family: "Font Awesome 5 Free";
    margin-right: 3px;
    margin-left: -0.5rem;
}


@media (max-width: 820px) {
    .detail .calendarBlk .table .reserve-event .reserve-event a {
        position: initial;
        max-width: initial;
        margin-bottom: 0;
    }
}

.detail .calendarBlk .table .reserve-event img {
    max-width: 40px;
    height: auto;
    margin: 0.25rem;
    mix-blend-mode: multiply;
    margin-top: -23px;
}

.detail .calendarBlk .table .reserve-event span {
    font-size: 1rem;
    color: var(--Grey-700);
    display: flex;
    /* flex-wrap: wrap; */
    margin-bottom: 0.5rem;
}

@media (max-width: 820px) {
    .detail .calendarBlk .table .reserve-event span {
        margin-bottom: 0;
        width: 100%;
        justify-content: center;
    }
}

.detail .calendarBlk .table .reserve-event span::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url(../images/icon/museum-open.png);
    background-size: cover;
    margin-right: 5px;
    flex-shrink: 0;
}


.table-responsive.closed .sticky-table .th:nth-of-type(1),
.table-responsive.closed .sticky-table .td:nth-of-type(1) {
    position: initial;
}

.detail .table {
    display: table;
    border-collapse: separate;
    border-spacing: 0 10px;
    margin-bottom: 1.5rem;
    padding: 2px;
    min-width: 820px;
}

.detail .table .thead {
    display: table-header-group;
}

.detail .table .tbody {
    display: table-row-group;
}

.detail .table .tr {
    display: table-row;
}

.detail .table .tr:has(.td) {
    display: table-row;
    background-color: var(--Grey-100);
    border-radius: 10px;
}

.detail .table .tr:has(.td):nth-of-type(odd) {
    background-color: var(--BrandGreen-50);
}

.detail .table .tr:has(.td):hover {
    box-shadow: 0px 0px 0px 2px var(--BrandGreen-300);
}

.detail .table .th,
.detail .table .td {
    display: table-cell;
}

.detail .table .th.w-60,
.detail .table .td.w-60 {
    width: 60%;
}

/*Zoe UI*/
/* .detail .table .th {
    padding: 10px 25px;
    line-height: 1.5;
    font-size: 1rem;
    font-weight: 400;
    color: var(--Grey-500);
    border-top: var(--Grey-200) 2px solid;
    border-radius: 0;
    white-space: nowrap;
    background-color: var(--white-100);
} */

.detail .table .th {
    padding: 10px 25px;
    line-height: 1.5;
    font-size: 1.125rem;
    font-weight: 400;
    color: var(--white-100);
    white-space: nowrap;
    background-color: var(--BrandGreen-600);
}

.detail .table .th:first-of-type {
    border-radius: 10px 0 0 10px
}

.detail .table .th:last-of-type {
    border-radius: 0 10px 10px 0
}

.detail .table .td {
    padding: 13px 20px;
    line-height: 1.6;
}

@media (max-width:575px) {
    .detail .table .td {
        font-size: 1rem;
    }
}

.detail .table .td a {
    background-color: initial;
    padding: 0;
}

.detail .table .td a::before {
    content: none;
}

.detail .table .td p {
    margin-top: 0.25rem;
}

.detail .table .td .link {
    display: block;
    font-size: 0.8rem;
    margin: 0;
}

.detail .table .caption {
    display: table-caption;
    padding: 0.5rem 1rem;
    color: #fff;
    background-color: #007C69;
    font-size: 1rem;
    margin-bottom: 0;
}

.detail .table .td:first-child, .detail .card .table .th:first-child {
    border-radius: 10px 0 0 10px;
}

.detail .table .td:last-child, .detail .card .table .th:last-child {
    border-radius: 0 10px 10px 0;
}

.detail .table.sticky-table .td:nth-of-type(1) {
    background-color: var(--BrandBlue-50);
    box-shadow: 5px 0px 5px 0px #0000000D;
}

.sticky-table .th:nth-of-type(1),
.sticky-table .td:nth-of-type(1) {
    position: sticky;
    left: 0px;
    z-index: 1
}

@media (max-width:767px) {

    .download-table {
        min-width: initial !important;
    }

    .download-table .tr {
        display: flex !important;
        flex-wrap: wrap;
        padding: 0.5rem;
        margin-bottom: 10px;
    }

    .download-table .tr:first-child {
        padding: 0;
        margin-bottom: 0;
    }

    .download-table .th {
        display: none !important;
    }

    .download-table .td:nth-of-type(1),
    .download-table .td:nth-of-type(2) {
        font-size: 1.125rem;
    }

    .download-table .td {
        display: initial !important;
        font-size: 0.875rem;
        padding: 0.5rem 0 0 0.5rem !important;
    }

    .download-table .td:nth-of-type(2)~.td {
        width: 100%;
        text-align: left !important;
        padding: 0.5rem !important;
    }

    .download-table .td:nth-of-type(4)::after {
        content: '更新';
    }
}

.detail .card {
    padding: 3rem;
    margin: 5rem 0;
    border-radius: 0px;
    border: none;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    border-left: var(--BrandGreen-600) 3px solid;
}

.detail .card.card-ticket {
    margin: 3rem 0;
}

.detail .card:has(.row) {
    padding: 3rem 3rem 0 3rem;
}

@media (max-width: 767px) {
    .detail .card .row {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .detail .card {
        padding: 26px !important;
    }

    .detail .card:has(.row) {
        padding: 26px 26px 0 26px !important;
        margin: 3rem 0
    }

    .detail .card .row {
        margin-bottom: 26px;
    }
}

.detail .card .photo {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: initial;
    flex-direction: column;
    aspect-ratio: 4/3;
}

.detail .card .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail .card .text h4, .detail .card .text .h4,
.detail .card .text .heading {
    font-size: 22px;
    color: var(--Grey-900);
    margin: 0 0 0.5rem 0;
    font-weight: 500;
    line-height: 1.6;
}

.detail .card .text .heading+span {
    display: block;
    font-size: 1rem;
    color: var(--Grey-500);
}

.detail .card .descript {
    color: var(--Grey-700);
}

.detail .card .descript p {
    margin-bottom: 0;
}

.detail .card .descript table {
    margin-bottom: 0;
}

.detail .card .descript+.h4 {
    margin-top: 1rem;
}

.detail .card .category {
    display: flex;
    flex-wrap: wrap;
    /* margin: 0.5rem 0; */
    align-items: center;
}

.detail .card .category::before {
    content: '\e932';
    font-family: 'nmnsIcon';
    color: var(--Grey-700);
}

.detail .card .category a, .detail .card .category div {
    margin: 0.5rem;
    font-size: 1rem;
    color: var(--Grey-500);
}

.detail .card .other {
    font-size: 1rem;
    margin: 0.25rem 0;
    color: var(--Grey-500);
}

.card-medium .imgBlk {
    max-width: 450px;
    margin-right: 70px;
    /* padding: 2rem; */
    /* background-color: #ebfaf7; */
    width: 40%;
    /* align-self: center; */
}

@media (max-width: 991px) {
    .card-medium .imgBlk {
        margin-right: 1rem;
    }
}

@media (max-width: 768px) {
    .card-medium .imgBlk {
        width: 100%;
        margin: 0 auto;
        padding: 0;
    }
}

.card-medium .text {
    flex: 1;
}

@media (max-width: 768px) {
    .card-medium .text {
        margin: 2rem auto 0rem auto;
        padding: 0;
        flex: initial;
    }
}

.card-ticket .descript table td[headers="fare"] {
    width: 120px;
}

.card-ticket .text .h4, .card-ticket .text .heading {
    font-size: 20px !important;
}

.detail .card .text .info {
    margin-bottom: 1rem;
}

.detail .card .info ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 1.25rem 0;
    position: relative;
    margin-bottom: 1.5rem
}

.detail .card .info ul:before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 120px;
    height: 4px;
    background-color: var(--BrandGreen-500);
}

.detail .card .info ul::after {
    content: '';
    display: block;
    width: 30px;
    height: 4px;
    background-color: var(--BrandBlue-500);
    border-left: #fff 2px solid;
    position: absolute;
    bottom: 0px;
    left: 90px;
}


.detail .card .info ul li {
    font-size: 0.95rem;
    color: var(--Grey-500);
    margin-bottom: 0;
    margin-right: 20px;
    word-break: break-all;
}



.detail .card .info ul li:before {
    color: var(--Grey-500);
    font-size: 1.125rem;
    margin-right: 0.25rem;
    position: initial;
    width: initial;
    height: initial;
    background-color: initial;
    display: inline-block;
    font-family: 'nmnsIcon';
    vertical-align: top;
}

.detail .card .descript ol li>* {
    display: initial;
}


.detail .table-responsive.has-scrollbar::before {
    content: '向右滑看更多 ➨';
    position: sticky;
    left: 0px;
}

.detail .table-responsive.has-scrollbar:has(.download-table)::before {
    content: none;
}

@media (max-width: 767px) {
    .detail .table-responsive table {
        min-width: max-content;
    }
}

.detail table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
    margin-bottom: 1.5rem;
    padding: 2px;
}

.detail table a::before {
    content: none;
}

.detail .card table {
    border-spacing: 0 5px;
}

.detail .card:has(.remark) table {
    margin-bottom: 0;
}

.detail table tbody tr {
    background-color: var(--Grey-100);
    border-radius: 10px;
}

.detail table tbody tr:nth-of-type(odd) {
    background-color: var(--BrandGreen-50)
}

.detail table tbody tr:hover {
    /* background-color: var(--BrandGreen-50); */
    box-shadow: 0px 0px 0px 2px var(--BrandGreen-300);
}

.detail table th {
    padding: 10px 25px;
    line-height: 1.5;
    font-size: 1.125rem;
    font-weight: 400;
    color: var(--white-100);
    white-space: nowrap;
    background-color: var(--BrandGreen-600);
}

.detail table th:first-of-type {
    border-radius: 10px 0 0 10px
}

.detail table th:last-of-type {
    border-radius: 0 10px 10px 0
}

.detail .card table th {
    background: linear-gradient(180deg, #C8FADF 0%, #94D7F6 100%);
    padding: 20px 25px;
    line-height: 1;
    background-attachment: local;
    font-size: 1.375rem;
    font-weight: 500;
    color: var(--Grey-900);
    border-top: none;
}

@media (max-width:575px) {
    .detail .card table th {
        font-size: 1.125rem;
    }
}

.detail table td {
    /* background-color: var(--Grey-50); */
    padding: 13px 25px;
    line-height: 1.5;
}

@media (max-width:575px) {
    .detail table td {
        padding: 10px 16px;
        font-size: 1rem;
    }
}

.detail table td:first-child, .detail .card table th:first-child {
    border-radius: 10px 0 0 10px;
}

.detail table td:last-child, .detail .card table th:last-child {
    border-radius: 0 10px 10px 0;
}

.detail .card table th[colspan="2"] {
    border-radius: 10px;
}

.detail .remark {
    margin-top: 0.5rem;
    font-size: 1rem;
}

.detail .remark:before {
    content: '\e921';
    font-family: 'nmnsIcon';
    color: var(--BrandGreen-700);
    font-size: 1.25rem;
    vertical-align: bottom;
    margin-right: 0.25rem;
}

/* .person-icon::before {
    content: '\e935' !important;
    font-family: 'nmnsIcon';
    display: inline-block !important;
    margin-right: 5px;
    font-size: 1.25rem;
    vertical-align: bottom;
    color: var(--BrandGreen-700);
    position: initial !important;
    width: initial !important;
    height: initial !important;
    background-color: initial !important;
} */

.bg-F5F5F5 {
    background-color: var(--Grey-100);
    padding: 1.5rem 2rem !important;
    margin-top: 2rem;
}

@media (max-width:991px) {
    .bg-F5F5F5 {
        padding: 1rem !important;
    }
}

.detail .bg-F5F5F5>ol, .detail .bg-F5F5F5>ul {
    padding: 0 0 0 2rem !important;
}

.detail .bg-F5F5F5>ol+p, .detail .bg-F5F5F5>ul+p {
    margin-top: 1rem;
}

.detail ul {
    padding: 1rem 2rem;
}

.detail ul ol:not(.breadcrumb) {
    padding: 0.5rem 0rem 0.5rem 2rem;
}

.detail .heading+ul {
    padding: 0rem 0rem 2rem 2rem;
}

.detail ul li {
    list-style: none;
    position: relative;
}

.detail ul li::before {
    content: '';
    position: absolute;
    top: 14px;
    left: -18px;
    display: block;
    width: 10px;
    height: 5px;
    background-color: var(--BrandGreen-600);
}

.detail ul li ol li::before, .detail ol li ol li::before {
    top: 4px;
    left: -4px;
}

.detail ul li.nav-link::before {
    content: none;
}

@media (max-width:1300px) {
    .traffic-parking::before {
        content: '向右滑看更多 ➨';
        position: absolute;
        top: 3rem;
        left: 0px;
    }
}

@media (max-width:410px) {
    .traffic-parking::before {
        top: 5rem;
    }
}

.traffic-parking .map-infomation {
    width: 100%;
    height: 840px;
    margin-bottom: 1.5rem;
    overflow-x: auto;
    position: relative;
    margin-top: 3rem;
}



.traffic-parking .map-infomation img {
    max-width: initial;
    width: 1280px;
    height: 840px;
}

.traffic-parking .text ul li {
    padding: 0;
    margin-bottom: 0;
}

.traffic-parking ul li::before {
    color: #464646;
}

.traffic-parking .list-item {
    align-items: flex-start;
}

@media (max-width: 560px) {
    .traffic-parking .list-item {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .traffic-parking .list-item img {
        margin-bottom: 0.5rem;
    }
}

.traffic-parking .list-item a:hover {
    transform: none;
}

.traffic-parking .list-item .text .heading {
    margin-bottom: 0.5rem;
}

.traffic-parking .text p {
    margin-bottom: 0;
}

.subcheck {
    display: flex;
    position: absolute;
    top: 1rem;
    left: 1rem;
    width: 700px;
}

.subcheck .subcheck-item {
    margin: 0.25rem 0;
}

.subcheck .subcheck-item img {
    width: 24px;
    height: 24px;
    margin-right: 0.25rem;
    margin-bottom: 0.25rem;
}

.subcheck .subcheck-item label {
    padding: 0.5rem 0 0.5rem 1rem;
    margin: 0;
    cursor: pointer;
    font-weight: normal;
}

.subcheck .subcheck-item input[type=radio] {
    opacity: 0 !important;
}

.subcheck .subcheck-item label span {
    background-color: #007C69;
    color: #fff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 0.8rem;
    display: inline-block;
    margin-right: 0.25rem;
    line-height: 20px;
    text-align: center;
    font-weight: normal;
}

.subcheck .subcheck-item:focus,
.subcheck .subcheck-item:focus-within {
    outline: #FFB649 2px dotted;
}

.subcheck .subcheck-item {
    color: var(--BrandGreen-700);
    user-select: none;
    font-size: 1.25rem;
    background-color: #EBFAF7;
    border-radius: 8px;
    border: var(--BrandGreen-300) 1px solid;
    margin-right: 1rem;
}

.areaBlk.subcheck .subcheck-item {
    padding: 0.1rem 0 0.25rem 0.75rem;
    text-align: center;
}

@media (max-width:575px) {

    .areaBlk.subcheck .subcheck-item,
    .floorBlk.subcheck .subcheck-item {
        padding: 0.1rem 0 0rem 0rem;
        font-size: 1rem;
        margin-right: 0.75rem;
    }
}

.subcheck .subcheck-item:hover {
    color: var(--white-100);
    background-color: var(--BrandGreen-300);
}

.traffic-parking .map-infomation .subcheck-item:hover img,
.traffic-parking .map-infomation .subcheck-item.active img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(200%) contrast(101%);
}

.map-infomation .subcheck .subcheck-item input[type=radio]:hover+span img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(200%) contrast(101%);
}

.subcheck .subcheck-item.active {
    color: var(--white-100);
    background-color: var(--BrandGreen-700)
}

.areaBlk.subcheck .subcheck-item label {
    padding: 0.25rem 0.75rem 0.25rem 1rem;
}

@media (max-width:575px) {

    .areaBlk.subcheck .subcheck-item label,
    .floorBlk.subcheck .subcheck-item label {
        padding: 0rem 0rem 0rem 1rem;
    }
}

.map-infomation .item,
.map-infomation .item button {
    position: absolute;
}

.map-infomation .item:hover,
.map-infomation .item button:focus {
    z-index: 2;
}

.map-infomation .item button {
    width: 60px;
    height: 66px;
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.2));
    background-color: initial;
    border: none;
    outline: none;
    cursor: pointer;
    background-size: cover;
}

.busBlk .item button {
    background-image: url('../images/traffic-parking/pin-bus.png');
}

.busBlk .item button:focus,
.busBlk .item button:hover {
    background-image: url('../images/traffic-parking/pin-bus_focus.png');
}

.bikeBlk .item button {
    background-image: url('../images/traffic-parking/pin-bike.png');
}

.bikeBlk .item button:focus,
.bikeBlk .item button:hover {
    background-image: url('../images/traffic-parking/pin-bike_focus.png');
}

.bikeBlk .item.no-parking button {
    background-image: url('../images/traffic-parking/pin-bike_none.png');
}

.bikeBlk .item.no-parking button:focus,
.bikeBlk .item.no-parking button:hover {
    background-image: url('../images/traffic-parking/pin-bike_none_focus.png');
}

.parkingBlk .item button {
    background-image: url('../images/traffic-parking/pin-parking.png');
}

.parkingBlk .item button:focus,
.parkingBlk .item button:hover {
    background-image: url('../images/traffic-parking/pin-parking_focus.png');
}

.parkingBlk .item.no-parking button {
    background-image: url('../images/traffic-parking/pin-parking_none.png');
}

.parkingBlk .item.no-parking button:focus,
.parkingBlk .item.no-parking button:hover,
.parkingBlk .item.active.no-parking button {
    background-image: url('../images/traffic-parking/pin-parking_none_focus.png');
}

.map-infomation .item .dropdown-menu {
    width: 345px;
    left: -140px !important;
    padding: 1rem 1.25rem;
    background-color: var(--white-100);
    border-radius: 8px;
    border: none;
    box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08);
}

@media (max-width:480px) {
    .map-infomation .item .dropdown-menu {
        left: -10px !important;
    }
}

@media (max-width:330px) {
    .map-infomation .item .dropdown-menu {
        left: 0px !important;
        width: 270px;
    }
}

.map-infomation .dropdown-menu .title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    margin-bottom: 0.5rem;
    font-size: 1.125rem;
    font-weight: 500;
}

.map-infomation .route {
    display: flex;
    margin-right: 0.25rem;
    margin-bottom: 0.5rem;
}

.map-infomation .route span {
    border: var(--BrandBlue-300) 1px solid;
    margin-right: 0.3rem;
    margin-bottom: 0.5rem;
    padding: 0 8px;
    display: inline-block;
    background-color: #F2FCFA;
    color: var(--BrandBlue-500);
    font-weight: 500;
    line-height: 1.5;
    border-radius: 4px;
}

.map-infomation .route img {
    width: 24px;
    height: 24px;
    margin-right: 0.5rem;
    filter: hue-rotate(40deg) brightness(130%);
    margin-top: 0.25rem;
}

.map-infomation .space {
    font-size: 1.75rem;
    font-weight: 500;
    color: var(--Grey-700);
}

.map-infomation .space span {
    border: none;
    background-color: initial;
    font-size: 0.9rem;
    color: var(--Grey-700);
    margin: 0;
}

.map-infomation .map-link a {
    color: var(--BrandBlue-500)
}

.map-infomation .map-link a:hover {
    color: var(--BrandGreen-700)
}

.bikeBlk .item .title::before,
.parkingBlk .item .title::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 0.5rem;
    margin-bottom: 0.2rem;
    background-color: #05D9B8;
}

.bikeBlk .item.no-parking .title::before,
.parkingBlk .item.no-parking .title::before {
    background-color: #F36538;
}

.bikeBlk .route .line {
    border: none;
    background-color: initial;
    padding: 0;
    color: var(--Grey-600);
    margin: 0 0.75rem 0 0.5rem;
    line-height: 32px;
}

.detail strong {
    position: relative;
    font-weight: 600;
    background-color: var(--BrandGreen-100);
}

/* .detail strong::before {
    content: '';
    width: 100%;
    height: 18px;
    background-color: var(--BrandGreen-100);
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: -1;
} */

.detail .accordion {
    margin: 1rem 0;
    transition: all 0.3s;
}

.detail .bg-F5F5F5 .accordion {
    margin: 0;
}

.detail .accordion .accordion-item {
    border: none;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    margin-bottom: 10px;
}

.detail .accordion .accordion-item:has(.collapsed) {
    box-shadow: 0px 0px 0px 0px var(--black-10);
}

.detail .accordion .accordion-item .accordion-link>a {
    display: flex;
    padding: 0.9375rem 1rem 0.9375rem 1.5rem;
    border-radius: 10px;
    color: var(--Grey-900);
    font-weight: 500;
    background-color: var(--Grey-100);
    transition: all 0.3s;
    align-items: center;
    line-height: 1.6;
}

.detail .accordion .accordion-item .accordion-link>a span {
    display: inline-flex;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-image: url('../images/qa-bg.png');
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    background-size: 147px 115px;
    background-position: -65px -28px;
    background-repeat: no-repeat;
    color: var(--white-100);
    flex-shrink: 0;
}

.detail .bg-F5F5F5 .accordion .accordion-item .accordion-link>a {
    background-color: var(--white-100);
}

.detail .accordion .accordion-item .accordion-link>a:hover {
    background-color: var(--BrandGreen-50) !important;
}

.detail .accordion .accordion-item .accordion-link>a:not(.collapsed) {
    background-color: var(--BrandGreen-50) !important;
    border-radius: 0px;
    border-top: var(--BrandGreen-500) 3px solid;
}

.detail .accordion .accordion-item .accordion-link>a::before {
    content: none;
}

.detail .accordion .accordion-item .accordion-link>a::after {
    content: '\e934';
    font-family: 'nmnsIcon';
    transition: all 0.3s;
    font-size: 1.5rem;
    margin-left: auto;
    padding-right: 0.25rem;
}

.detail .accordion .accordion-item .accordion-link.no-arrow>a::after {
    content: '\e962';
}

.detail .accordion .accordion-item .accordion-link>a.collapsed::after {
    transform: rotate(180deg);
}

.detail .accordion .accordion-item .accordion-link.no-arrow>a.collapsed::after {
    transform: initial;
}

.detail .accordion-content {
    padding: 20px 30px;
    color: var(--Grey-700);
    /* font-weight: 300; */
}

.detail .accordion-content:has(.check-group) {
    padding: 12px 10px 12px 50px;
}

.detail .accordion-content .row {
    margin-bottom: 0;
}

.detail .accordion-content p {
    margin-bottom: 0;
}

.detail .accordion-content ol, .detail .accordion-content ul {
    padding: 0 0 0 2rem;
    /* margin: 1rem 0; */
}

mark {
    line-height: 1;
    color: var(--BrandGreen-700);
    background-color: var(--BrandGreen-50);
    border-radius: 3px;
    padding: 3px 3px;
    display: inline-block;
    margin: 0 0.2rem;
}

.light-text mark, .bg-F5F5F5 mark {
    background-color: var(--white-100)
}

mark:hover, .light-text mark:hover, .bg-F5F5F5 mark:hover {
    color: #fff;
    background-color: var(--BrandGreen-500);
}

.flowBlk {
    background-image: url('../images/banner/helpdesk_banner.jpg');
    width: 100%;
    height: 400px;
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.flowBlk .info {
    float: initial;
    display: initial;
    position: absolute;
    margin-bottom: 0;
    bottom: 24px;
    left: 24px;
    padding: 20px 30px;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08);
}

.flowBlk .info .title {
    margin-bottom: 0.5rem;
}

.flowBlk.closed .info .route {
    margin-bottom: 0;
}

.flowBlk.closed .info .route::after {
    content: '休館中';
    align-self: center;
    font-size: 1.25rem;
    margin-left: 0.5rem;
}

.flowBlk.closed .info .route img {
    width: 40px;
    height: 40px;
}

.flowBlk.closed .info .title,
.flowBlk.closed .info .space,
.flowBlk.closed .info .d-flex {
    display: none !important;
}

.flowBlk .info .title::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 0.5rem;
    margin-bottom: 0.2rem;
}

.flowBlk .info .title.good::before {
    background-color: #05D9B8;
}

.flowBlk .info .title.ok::before {
    background-color: #FFAB2E;
}

.flowBlk .info .title.bad::before {
    background-color: #F36538;
}

.flowBlk .info .title::after {
    content: '';
    display: inline-block;
    font-size: 0.75rem;
    line-height: 20px;
    color: #007C69;
    background-color: #EBFAF7;
    border: 1px solid #70F2DE;
    border-radius: 4px;
    padding: 2px 8px;
    font-weight: 500;
    margin-left: 0.5rem;
    vertical-align: middle;
}

.flowBlk .info .title.good::after {
    content: '良好';
}

.flowBlk .info .title.ok::after {
    content: '一般';
}

.flowBlk .info .title.bad::after {
    content: '擁擠';
}

.flowBlk .route {
    display: flex;
    margin-bottom: 1rem;
    align-items: center;
}

.flowBlk .route span {
    font-size: 0.875rem;
    line-height: 24px;
    border-radius: 8px;
    border: #66B7FF 1px solid;
    margin-right: 0.3rem;
    margin-bottom: 0.5rem;
    padding: 2px 8px;
    display: inline-block;
    background-color: #F2FCFA;
    color: #026BC8;
    font-weight: 500;
}

.flowBlk .route img {
    width: 36px;
    height: 36px;
    margin-right: 10px;
}

.flowBlk .space {
    font-size: 1.75rem;
    font-weight: 700;
    color: #464646;
    line-height: 36px;
}

.flowBlk .space span {
    border: none;
    background-color: initial;
    /* font-size: 0.75rem; */
    /* line-height: 20px; */
    font-weight: 400;
    color: #464646;
    margin: 0;
}

.flowBlk .renew, .flowBlk .renew+span {
    font-size: 0.75rem;
    line-height: 20px;
    color: #757575;
}

.flowBlk .map-link a {
    color: #026BC8;
    font-size: 0.875rem;
    line-height: 24px;
}

.detail .light-text {
    padding: 35px 2rem;
    margin: 3rem 0;
    border-top: var(--BrandGreen-200) 1px solid;
    border-bottom: var(--BrandGreen-200) 1px solid;
    /* text-align: center; */
    position: relative;
}

@media (max-width:480px) {
    .detail .light-text {
        padding: 35px 1rem;
    }
}

.detail .light-text::before {
    content: '';
    background-image: url('../images/quotation-left.png');
    display: block;
    width: 100%;
    height: 35px;
    background-repeat: no-repeat;
    background-position: top left;
}

.detail .light-text::after {
    content: '';
    background-image: url('../images/quotation-right.png');
    display: block;
    width: 100%;
    height: 35px;
    background-repeat: no-repeat;
    background-position: bottom right;
}

.detail .light-text ol, .detail .light-text ul {
    text-align: left;
}

@media (max-width:991px) {
    .detail .light-text ol, .detail .light-text ul {
        padding-right: 0;
    }
}

.detail .light-text>p {
    margin-bottom: 0;
}

.detail .card-small .imgBlk {
    margin-right: 70px;
    width: 150px;
    margin-bottom: 0;
}

@media (min-width: 767px) {
    .detail .card-small .imgBlk {
        padding: 0;
    }
}

@media (max-width: 767px) {
    .detail .card-small .imgBlk {
        margin: 0 auto 2rem auto;
        padding: 0;
    }
}

.detail .card-small .photo {
    width: 150px;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    aspect-ratio: 1/1;
}

.detail .card-small .text {
    flex: 1;
    padding: 0;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .detail .card-small .text {
        /* padding: 1.25rem; */
        margin-left: 0;
    }
}

.text-right {
    text-align: right;
}

.detail .no-border-card .card {
    border: none;
    padding: 0 !important;
    box-shadow: none;
    margin-bottom: 30px;
}

.detail .no-border-card .card .row {
    align-items: flex-start;
    margin: 0.5rem 0;
}

@media (max-width: 767px) {
    .detail .no-border-card .card .row {
        align-items: center;
    }
}

@media (max-width: 767px) {
    .detail .no-border-card .card .text {
        width: 100%;
        margin: 0.5rem 0 0 0;
        padding: 0;
    }
}

.detail .no-border-card .card-small .imgBlk {
    /* margin-right: 30px; */
}

@media (max-width: 767px) {
    .detail .no-border-card .card-small .imgBlk {
        /* margin-right: 0px; */
    }
}

.collapseBlk .card:nth-of-type(3)~.card {
    display: none;
}

.collapseBlk .card.active {
    display: flex !important;
}

.read-more {
    clear: both;
    text-align: center;
    margin: 1rem auto;
    padding: 0.75rem 0;
    width: 100%;
}

.read-more button {
    background-color: initial;
    border: none;
    color: var(--BrandGreen-700);
    cursor: pointer;
    font-size: 1.125rem;
}

.videoBlk {
    position: relative;
    margin-bottom: 5rem;
}

@media (min-width:1700px) {
    .videoBlk {
        height: 100vh;
        overflow: hidden;
    }
}

@media (max-width:991px) {
    .videoBlk {
        height: initial;
        top: 0px;
    }
}

.videoBlk::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 250px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
    z-index: 1
}

@media (max-width:991px) {
    .videoBlk::before {
        content: none;
    }
}

.videoBlk .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

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

/* .videoBlk .video-container {
    width: 100vw;
    height: 100vh;
    padding-bottom: initial;
}

@media (max-width:991px) {
    .videoBlk .video-container {
        padding-bottom: 56.25%;
        height: 0;
    }
}

.videoBlk .video-container iframe {
    position: relative;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

@media (max-width:991px) {
    .videoBlk .video-container iframe {
        height: 100%;
        position: absolute;
        pointer-events: initial;
    }
}

@media (min-aspect-ratio: 16/9) {
    .videoBlk .video-container iframe {
        height: 56.25vw;
    }
}

@media (max-aspect-ratio: 16/9) {
    .videoBlk .video-container iframe {
        width: 177.78vh;
    }
} */

.btn-control {
    position: absolute;
    bottom: 100px;
    left: calc(50% - 195px);
    z-index: 2;
    display: flex;
    justify-content: center;
}

@media (max-width: 991px) {
    .btn-control {
        display: none;
    }
}

.btn-control .btn {
    width: 80px;
    height: 80px;
    border: var(--black-100) 1px solid;
    border-radius: 50%;
    margin: 0 25px;
    position: relative;
    padding: 0;
    text-indent: -9999px;
    background-repeat: no-repeat;
    background-position: center center;
    filter: invert(1);
}

.btn-control .btn:hover {
    border: var(--BrandGreen-300) 1px solid;
    filter: invert(70%) sepia(42%) saturate(3463%) hue-rotate(122deg) brightness(98%) contrast(96%);
}

.btn-control .btn:focus {
    filter: initial;
}


.btn-control .btn#pause-button {
    background-image: url('../images/pause-icon.svg');
    background-size: 18px;
}

.btn-control .btn#play-button {
    background-image: url('../images/play-icon.svg');
    background-size: 24px;
}

.btn-control .btn#mute {
    background-image: url('../images/volume-up-solid.svg');
    background-size: 35px;
}

.btn-control .btn.active#mute {
    background-image: url('../images/volume-mute-solid.svg');
    background-size: 35px;
}

.sliderBtn {
    position: absolute;
}

.detail .galleryBlk {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -20px;
}

@media (max-width:767px) {
    .detail .galleryBlk {
        margin: 0;
        display: block;
    }
}

.detail .galleryBlk.job .row {
    width: 100%;
    justify-content: initial;
}

.detail .galleryBlk ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0 !important;
}

.detail .galleryBlk ul li {
    padding: 20px;
    width: calc(100% / 3)
}

@media (max-width:820px) {
    .detail .galleryBlk ul li {
        padding: 10px;
    }
}

@media (max-width:767px) {
    .detail .galleryBlk ul li {
        width: 50%;
        padding: 0.5rem;
    }
}

@media (max-width:480px) {
    .detail .galleryBlk ul li {
        width: 100%;
        padding: 0.5rem 0;
    }
}

.detail .galleryBlk ul li::before {
    content: none;
}

.detail .galleryBlk ul li a {
    display: block;
    background-color: var(--Grey-100);
    overflow: hidden;
    transition: all 0.3s;
    outline: transparent 3px solid;
}

.detail .galleryBlk ul li a:hover {
    outline: var(--BrandGreen-300)3px solid;
    border-radius: 20px;
    box-shadow: 0px 10px 30px 0px var(--black-20);

}

.detail .galleryBlk ul li a::before {
    content: none;
}

.detail .galleryBlk ul li a .img {
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
}

.detail .galleryBlk ul li a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail .galleryBlk ul li a .text {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 12px 20px;
    display: block;
    font-size: 1rem;
    color: var(--Grey-900);
}


.detail .galleryBlk .row {
    margin: 0;
    width: 100%;
    justify-content: flex-start;
}

@media (max-width:820px) {
    .detail .galleryBlk .row {
        margin: 0 10px;
    }
}

@media (max-width:767px) {
    .detail .galleryBlk .row {
        margin: 0;
    }
}

.detail .galleryBlk .gallery-item.col-md-4, .detail .galleryBlk .item.col-md-4, .detail .galleryBlk .item.col-md-3 {
    padding: 20px;
}

@media (max-width:820px) {
    .detail .galleryBlk .gallery-item.col-md-4, .detail .galleryBlk .item.col-md-4, .detail .galleryBlk .item.col-md-3 {
        padding: 10px !important;
    }
}

@media (max-width:767px) {
    .detail .galleryBlk .gallery-item.col-md-4, .detail .galleryBlk .item.col-md-4, .detail .galleryBlk .item.col-md-3 {
        width: 50%;
    }
}

@media (max-width:575px) {
    .detail .galleryBlk .gallery-item.col-md-4, .detail .galleryBlk .item.col-md-4, .detail .galleryBlk .item.col-md-3 {
        width: 100%;
        padding: 1rem 0;
    }
}

@media (min-width:992px) {
    .detail .galleryBlk .gallery-item.col-md-4, .detail .galleryBlk .item.col-md-4 {
        width: 33.333333% !important;
    }
}

.detail .gallery-item a, .detail .galleryBlk .item a {
    display: block;
    background-color: var(--Grey-100);
    overflow: hidden;
    transition: all 0.3s;
    height: 100%;
    outline: transparent 3px solid;
}

.detail .gallery-item a:hover, .detail .galleryBlk .item a:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
}

.detail .gallery-item a::before, .detail .galleryBlk .item a::before {
    content: none;
}

.detail .gallery-item a .photo, .detail .galleryBlk .item a .photo {
    aspect-ratio: 4 / 3;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f2fcfa;
}

.detail .gallery-item a img, .detail .galleryBlk .item a img {
    /* max-width: 100%;
    width: initial; */
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail .gallery-item .imgBlk span {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 12px 20px;
    display: block;
    font-size: 1rem;
    color: var(--Grey-900);
}

.detail .gallery-item .imgBlk span .name {
    color: var(--Grey-900);
}

.detail .gallery-item .imgBlk span .price, .detail .gallery-item .imgBlk span .name+div {
    color: var(--Grey-600);
    line-height: 1.6;
}

.detail .gallery-item .imgBlk span .name,
.detail .gallery-item .imgBlk span .price {
    font-size: 1rem;
    line-height: 1.6;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.detail .gallery-item .imgBlk span .category {
    background-color: var(--BrandGreen-100);
    font-size: 14px;
    color: var(--Grey-900);
    display: inline-block;
    padding: 5px 10px;
    line-height: 1.25;
    margin-bottom: 0.5rem;
    position: relative;
}

.detail .gallery-item .imgBlk span .category:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    border-style: solid;
    border-width: 10px 10px 0 0;
    border-color: #f3f4f6 transparent transparent transparent;
}

.detail .gallery-item.video .photo, .detail .galleryBlk.video .item .photo {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 16 / 9;
}

.detail .gallery-item.video .photo img,
.detail .galleryBlk.video .item .photo img {
    filter: brightness(0.75);
}

.detail .gallery-item.video a:hover .photo img,
.detail .galleryBlk.video .item a:hover .photo img {
    filter: brightness(1);
}

.detail .gallery-item.video .photo::before,
.detail .galleryBlk.video .item .photo::before {
    content: '\e920';
    font-family: 'nmnsIcon';
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3.75rem;
    color: var(--BrandGreen-200);
    z-index: 1;
    transition: all 0.3s;
    opacity: 1;
}

.detail .gallery-item.video a:hover .photo::before,
.detail .galleryBlk.video .item a:hover .photo::before {
    opacity: 0;
}

.detail .more-comtent .gallery-item:nth-of-type(6)~.gallery-item,
.detail .more-images_12 .gallery-item:nth-of-type(12)~.gallery-item,
.detail .more-images .item:nth-of-type(6)~.item,
.detail .more-images_12 .item:nth-of-type(12)~.item,
.detail .more-images_12 ul li:nth-of-type(12)~li {
    display: none;
}

.detail .more-comtent .gallery-item.active,
.detail .more-images_12 .gallery-item.active,
.detail .more-images .item.active,
.detail .more-images_12 .item.active,
.detail .more-images_12 ul li.active {
    display: block !important;
}

.slideBlk {
    padding: 1rem;
    overflow: hidden;
    text-align: center;
    margin: 0 -1rem;
}

.slideBlk ul {
    padding: 0;
}

.slideBlk ul .owl-stage-outer {
    overflow: initial;
}

.slideBlk ul .owl-stage {
    display: flex;
}

.slideBlk ul .owl-item {
    box-shadow: 0px 5px 10px 0px var(--black-20);
    transition: all 0.3s;
    outline: transparent 3px solid;
    overflow: hidden;
}

.slideBlk ul .owl-item:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    transform: scale(1.01);
}

.slideBlk ul .owl-item:focus-within {
    outline: orange 3px dotted;
    border-radius: 20px;
    transform: scale(1.01);
}

.slideBlk ul .owl-item:focus-within a {
    outline: initial !important;
}

/* .slideBlk ul li {
    background-color: var(--Grey-100);
    transition: all 0.3s;
    overflow: hidden;
    outline: transparent 3px solid;
} */

.slideBlk ul li::before {
    content: none;
}

.slideBlk ul li a {
    display: block;
    overflow: hidden;
}

.slideBlk ul li a:focus {
    outline: none !important;
}


.slideBlk ul li a::before {
    content: none;
}

/* .slideBlk ul li:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 5px 10px 0px var(--black-20);
    transform: scale(1.01);
} */

.slideBlk ul li a .img {
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.slideBlk.video ul li a .img {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 16 / 9;
}

.slideBlk.video ul li a:hover .img {
    filter: brightness(1);
}

.slideBlk.video ul li a .img::before {
    content: '\e920';
    font-family: 'nmnsIcon';
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3.75rem;
    color: var(--BrandGreen-200);
    z-index: 1;
    transition: all 0.3s;
    opacity: 1;
}

.slideBlk.video ul li a:hover .img::before {
    opacity: 0;
}

.slideBlk ul li a .img img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.slideBlk.video ul li a .img img {
    filter: brightness(0.75);
}

.slideBlk ul li a .text {
    padding: 16px 20px;
    display: block;
    font-size: 1rem;
    color: var(--Grey-600);
    text-align: left;
    line-height: 1.6;
}

.slideBlk ul li a .text .name {
    color: var(--Grey-900);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.single-img-slider {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    padding: 1rem;
    min-height: 700px;
}

@media (max-width:768px) {
    .single-img-slider {
        min-height: initial;
    }
}

.single-img-slider .owl-carousel .owl-stage-outer {
    overflow: initial;
}

.single-img-slider a {
    background-color: var(--Grey-50);
    display: block;
    overflow: hidden;
    transition: all 0.3s;
    /* border: transparent 2px solid; */
}

.single-img-slider a:hover {
    /* border: var(--BrandGreen-300) 2px solid; */
    border-radius: 20px;
    box-shadow: 0px 5px 10px 0px var(--black-20);
}

.single-img-slider a::before {
    content: none;
}

.single-img-slider a span {
    /* text-overflow: ellipsis; */
    /* overflow: hidden; */
    /* white-space: nowrap; */
    text-align: left;
}

.single-img-slider a span .name {
    font-weight: 500;
    font-size: 1.125rem;
}

.single-img-slider a .photo {
    display: flex;
    justify-content: center;
    height: 675px;
    align-items: center;
}

@media (max-width:991px) {
    .single-img-slider a .photo {
        aspect-ratio: 4 / 3;
        height: initial;
    }
}

.single-img-slider a .photo img {
    max-width: 900px;
    max-height: 675px;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media (max-width:991px) {
    .single-img-slider a .photo img {}
}

.single-img-slider .customContainer {
    margin-bottom: 0
}

.scienceimages {
    margin-bottom: 3rem;
    text-align: center;
    margin-top: 7rem;
    padding: 0;
}

.scienceimages::before {
    content: none;
}

.scienceimages .owl-carousel .owl-stage-outer {
    overflow: hidden;
}

.scienceimages ul {
    border-left: var(--BrandGreen-600) 3px solid;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    padding: 0;
}

.scienceimages li {
    text-align: left;
    display: flex;
}

@media (max-width:991px) {
    .scienceimages li {
        flex-direction: column-reverse;
    }
}

.scienceimages li::before {
    content: none !important;
}

.scienceimages li .text {
    padding: 50px 70px;
    margin-right: 0;
}

@media (max-width:1200px) {
    .scienceimages li .text {
        padding: 2rem 3rem;
    }
}

@media (max-width:575px) {
    .scienceimages li .text {
        padding: 1.5rem 2rem;
    }
}

.scienceimages li .text .heading {
    font-size: 22px;
    color: var(--Grey-900);
    font-weight: 500;
    margin-bottom: 10px;
    margin-top: 0;
}

.scienceimages li .text .category {
    display: flex;
    flex-wrap: wrap;
    color: var(--Grey-500);
    font-size: 1rem;
    margin-bottom: 1rem;
}

.scienceimages li .text .category div {
    margin: 0 1rem 0 0;
}

.scienceimages li .text .category div::before {
    font-family: 'nmnsIcon';
    margin-right: 0.25rem;
}

.icon-ui-user::before, .rank::before {
    content: '\e966';
}

.scienceimages li .text .descript {
    margin-bottom: 0.5rem;
    position: relative;
    padding-top: 2.25rem;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.scienceimages li .text .descript:before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    width: 120px;
    height: 4px;
    background-color: var(--BrandGreen-500);
}

.scienceimages li .text .descript::after {
    content: '';
    display: block;
    width: 30px;
    height: 4px;
    background-color: var(--BrandBlue-500);
    border-left: #fff 2px solid;
    position: absolute;
    top: 0px;
    left: 90px;
}

.scienceimages li .img {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    height: 460px;
    flex-shrink: 0;
}

@media (max-width:1200px) {
    .scienceimages li .img {
        height: 424px;
    }
}

@media (max-width:1060px) {
    .scienceimages li .img {
        height: 460px;
    }
}

@media (max-width:991px) {
    .scienceimages li .img {
        height: auto;
    }
}

.scienceimages li .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.owl-carousel .text .link a::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 0px;
    display: block;
    height: 3px;
    background-color: var(--BrandGreen-300);
    transition: width 0.3s ease;
}

.owl-carousel .text .link a {
    font-size: 1rem;
}

.owl-carousel .text .link a:hover::before {
    width: calc(100% - 60px);
}

.owl-carousel .text .link a:hover {
    color: var(--Grey-900);
}

.owl-carousel .text .link a::after {
    content: none;
}

.owl-carousel .text .link a span {
    position: relative;
    display: inline-block;
    width: 50px;
    margin-left: 10px;
    text-indent: -9999px;
    line-height: 1;
}

.owl-carousel .text .link a span::before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transition: background-color 0.3s ease;
}

.owl-carousel .text .link a span::after {
    content: '';
    position: absolute;
    bottom: 4px;
    right: 0px;
    display: block;
    width: 10px;
    height: 1px;
    background-color: var(--BrandGreen-700);
    transform: rotate(45deg);
    transition: background-color 0.3s ease;
}

.owl-carousel .text .link a:hover span::before,
.owl-carousel .text .link a:hover span::after {
    background-color: var(--BrandGreen-300);
}

.modal .modal-header {
    padding-right: 2.75rem;
    padding: 0.75rem 2.75rem 0.75rem 1rem;
    min-height: 55px;
}

.modal .modal-header h4, .modal .modal-header .h4 {
    margin-bottom: 0;
    font-size: 1.25rem;
}

.modal .modal-header button.close {
    position: absolute;
    top: 0px;
    right: 0px;
    margin: 0;
    background-color: initial;
    border: none;
    display: block;
    width: 50px;
    height: 50px;
    font-size: 1.75rem;
    color: var(--Grey-700);
}

.modal .modal-header button.close:hover {
    color: var(--BrandGreen-500);
}

.modal .modal-content {
    border-radius: 0;
}

.modal .modal-body .img {
    text-align: center;
    margin: 1rem;
}

.modal .modal-body .img img {
    height: 60vh;
    width: auto;
    max-width: 100%;
    max-height: min-content;
}

@media (max-width:767px) {
    .modal .modal-body .img img {
        height: initial;
        width: 80%;
    }
}

@media (max-width:575px) {
    .modal .modal-body .img img {
        width: 100%;
    }
}

.modal .modal-body p {
    margin-bottom: 0;
    margin-top: 0.5rem;
}

.modal .modal-body .video-container {
    width: auto;

}

@media screen and (orientation: portrait) {
    .modal .modal-body .video-container {
        height: initial;
    }
}

@media screen and (orientation: landscape) {
    .modal .modal-body .video-container {
        height: 50vh;
        margin: 1rem auto;
    }
}

.exhibits .row {
    padding: 50px;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    border-left: var(--BrandGreen-600) 3px solid;
}

@media (max-width:575px) {
    .exhibits .row {
        padding: 26px;
    }
}

.exhibits .row .exhibits_margin:has(img) img {
    transition: all 0.3s
}

.exhibits .row:hover .exhibits_margin:has(img) img {
    transform: scale(1.01);
}

.detail .exhibits .card:has(.row) {
    padding: 0 !important;
    border-left: none;
    box-shadow: none;
    margin: 0;
}

.exhibits img {
    width: 100%;
    height: auto;
}

.exhibits p {
    color: var(--Grey-700);
    margin: 0.5rem 0;
}

.exhibits .exhibits_margin:has(.exhibits_text) {
    padding-left: 60px;
}

@media (max-width:991px) {
    .exhibits .exhibits_margin:has(.exhibits_text) {
        padding-left: 0px;
        margin-bottom: 0;
    }
}

.exhibits .exhibits_margin h4,
.exhibits .exhibits_margin .h4 {
    font-size: 1.375rem;
    color: var(--Grey-900);
}

.exhibits .exhibits_margin h4 a,
.exhibits .exhibits_margin .h4 a {
    font-size: 1.375rem;
}

.exhibits .exhibits_margin h4 a::before,
.exhibits .exhibits_margin .h4 a::before {
    content: none;
}

.exhibits .exhibits_margin:has(img) {
    aspect-ratio: 5 / 2;
    overflow: hidden;
    position: relative;
}

.exhibits .exhibits_margin:has(img) .open {
    position: absolute;
    top: 12px;
    right: 12px;
    background-color: var(--black-40);
    color: var(--white-100);
    z-index: 2;
    padding: 0px 12px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 500;
}

.exhibits_text {
    position: relative;
    padding: 1.5rem 0 0 0 !important;
}

.exhibits_text:before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    width: 120px;
    height: 4px;
    background-color: var(--BrandGreen-500);
}

.exhibits_text::after {
    content: '';
    display: block;
    width: 30px;
    height: 4px;
    background-color: var(--BrandBlue-500);
    border-left: #fff 2px solid;
    position: absolute;
    top: 0px;
    left: 90px;
}

.exhibits_text li {
    font-size: 1rem;
    color: var(--Grey-500);
    word-break: break-all;
}

.exhibits_text li.clock-icon {
    word-break: initial;
}

.exhibits_text li::before {
    color: var(--Grey-500);
    font-size: 1.125rem;
    margin-right: 0.25rem;
    position: initial !important;
    width: initial !important;
    height: initial !important;
    background-color: initial !important;
    display: inline-block !important;
    font-family: 'nmnsIcon';
    vertical-align: top;
}

.exhibits_text li.tag-icon a {
    margin: 0 5px;
}

@media (max-width:768px) {
    .detail .form-group {
        flex-wrap: wrap;
    }
}

.detail .form-inline {
    display: flex;
    align-items: center;
}

@media (max-width:575px) {
    .detail .form-inline {
        flex-wrap: wrap;
    }
}

.detail .form-inline>* {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width:575px) {
    .detail .form-inline>* {
        width: 100%;
        flex: initial;
    }
}

.detail .form-inline select {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.detail .form-inline select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.detail .form-inline select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

.detail .form-inline input {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    padding: .375rem .75rem;
}

.detail .form-inline input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0 !important;
}

.detail .form-group .date input {
    height: 50px;
    flex-grow: 1;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 1rem;
    border: var(--Grey-200) 1px solid;
    margin: 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.detail .form-group .date input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0px !important;
}

.detail .single-img {
    width: 85%;
    margin: 3rem auto;
    /* overflow: hidden; */
}

@media (max-width: 480px) {
    .detail .single-img {
        width: 95%;
    }
}

.detail .imgBlk span {
    font-size: 1rem;
    padding: 16px 20px;
    display: block;
    color: var(--Grey-700);
    line-height: 1.6;
    background-color: var(--Grey-100);
}

.detail .imgBlk span strong {
    display: block;
    font-weight: 400;
    color: var(--Grey-900);
    background-color: initial;
}

.detail .imgBlk a {
    transition: all 0.3s;
    overflow: hidden;
    display: block;
    background-color: var(--Grey-50);
    outline: transparent 3px solid;
}

.detail .imgBlk a::before {
    content: none;
}

.detail .imgBlk a:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 5px 10px 0px var(--black-20);
}

.detail .row {
    margin-bottom: 3rem;
    margin-left: 0;
    margin-right: 0;
    justify-content: space-between;
    width: 100%;
}

.detail .row.more-comtent {
    justify-content: initial;
}

@media (min-width:992px) {
    .detail .row>* {
        padding: 0;
        /* margin-bottom: 1rem; */
    }

    .detail .row .col-md-6 {
        margin: 1rem;
        width: calc(50% - 35px);
    }

    .detail .row .col-md-8 {
        width: calc(66.66666667% - 45px);
    }

    .detail .row .col-md-9 {
        width: calc(75% - 45px);
    }

    .detail .row .col-md-10 {
        width: calc(83.33333% - 45px);
    }

    .detail .row .col-md-4:not(.gallery-item) {
        width: calc(33.333333% - 25px);
    }
}

@media (max-width:991px) {
    .detail .row .col-md-4, .detail .row .col-md-6, .detail .row .col-md-8 {
        margin: 1rem 0
    }
}

.detail .card.vertical {
    width: 28%;
    padding: 1.5rem;
    margin: 0.5rem 0;
    display: inline-block;
    vertical-align: text-top;
    border-top: var(--BrandGreen-600) 3px solid;
    border-left: none;
}

.detail .card.vertical:nth-of-type(3n+2) {
    margin: 0.5rem 7.3%;
}

@media (max-width:991px) {
    .detail .card.vertical {
        width: 30%;
    }

    .detail .card.vertical:nth-of-type(3n+2) {
        margin: 0.5rem 4%;
    }
}

@media (max-width:820px) {
    .detail .card.vertical {
        width: 100%;
    }

    .detail .card.vertical:nth-of-type(3n+2) {
        margin: 1.5rem 0;
    }
}

.detail .card.vertical .photo {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: initial;
    flex-direction: column;
    aspect-ratio: 1 / 1;
}

.detail .card.vertical .text {
    margin-top: 0.5rem
}

.detail .card.vertical .text h4, .detail .card.vertical .text .h4 {
    color: var(--BrandGreen-700);
    padding: 5px 15px;
    margin-bottom: 0.25rem;
}

.detail .card.vertical .text ul {
    padding: 0
}

.detail .card.vertical .text ul li::before {
    content: none;
}

.detail .card.vertical .text ul li a {
    color: var(--Grey-700);
    background-color: var(--Grey-100);
    display: block;
    border-radius: 10px;
    margin-bottom: 5px;
    padding: 5px 15px;
    transition: all 0.3s
}

.detail .card.vertical .text ul li a:hover {
    border-radius: 0px;
    color: var(--BrandGreen-700);
}

.detail .card.vertical .text ul li a::after {
    content: '\e962';
    font-family: 'nmnsIcon';
    float: right;
}

.detail .card.vertical .text ul li a::before {
    height: 0px;
    background-color: transparent;
}

.detail .card.vertical .text ul li a:hover::before {
    height: 2px;
    background-color: var(--BrandGreen-300);
}

.parking {
    background-color: var(--Grey-50);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 48px;
}

@media (max-width:991px) {
    .parking {
        padding: 48px 20px;
    }
}

@media (max-width:767px) {
    .parking {
        padding: 48px;
    }
}

.parking-inner {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.parking .parking-inner+span {
    display: flex;
    width: 100%;
    font-size: 1rem;
    margin-top: 40px;
    align-items: center;
    justify-content: center;
}

@media (max-width:767px) {
    .parking .parking-inner+span {
        margin-top: 1rem;
    }
}

.parking .parking-inner+span::before {
    content: '';
    display: block;
    width: 20%;
    height: 1px;
    background-color: var(--Grey-200);
    margin-right: 10px;
}

@media (max-width:767px) {
    .parking .parking-inner+span::before {
        width: initial;
        flex: 1
    }
}

.parking .parking-inner+span::after {
    content: '';
    display: block;
    width: 20%;
    height: 1px;
    background-color: var(--Grey-200);
    margin-left: 10px;
}

@media (max-width:767px) {
    .parking .parking-inner+span::after {
        width: initial;
        flex: 1
    }
}

.parking .parking-inner .parking-item {
    width: 30%;
    display: flex;
    flex-direction: column-reverse;
    position: relative;
    padding-left: 90px;
}

@media (max-width:991px) {
    .parking .parking-inner .parking-item {
        padding-left: 70px;
    }
}

@media (max-width:767px) {
    .parking .parking-inner .parking-item {
        width: 100%;
        padding-left: 90px;
        margin-bottom: 3rem;
    }
}


.parking .parking-inner .parking-item::before {
    content: 'P';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: var(--BrandGreen-300);
    font-size: 30px;
    font-weight: 700;
    color: var(--BrandGreen-800);
    border: var(--white-100) 5px solid;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    position: absolute;
    top: 0px;
    left: 0px;
}

@media (max-width:991px) {
    .parking .parking-inner .parking-item::before {
        width: 60px;
        height: 60px;
    }
}

@media (max-width:767px) {
    .parking .parking-inner .parking-item::before {
        width: 70px;
        height: 70px;
    }
}

.parking .parking-inner .parking-item.none::before {
    background-color: var(--danger-base);
    color: var(--white-100);
}


.parking .parking-inner .parking-item .renew {
    position: absolute;
    bottom: -26px;
    color: var(--Grey-500);
}

.parking .parking-inner .parking-item .remain {
    color: var(--Grey-900);
    font-size: 3rem;
}

@media (max-width:991px) {
    .parking .parking-inner .parking-item .remain {
        font-size: 2rem;
    }
}

.parking .parking-inner .parking-item .remain::after {
    content: '空位';
    font-size: 1.125rem;
    margin-left: 4px;
}

.detail .link .link-item {
    margin-bottom: 10px;
}

.detail .link .link-item a {
    display: block;
    background-color: var(--Grey-50);
    border-radius: 10px;
    padding: 8px 15px;
    font-size: 1rem;
    color: var(--Grey-900);
    font-weight: 500;
    transition: all 0.3s;
}

.detail .link .link-item a:hover {
    border-radius: 0;
}

.detail .link .link-item a::before {
    height: 0;
}

.detail .link .link-item a:hover::before {
    height: 2px;
    background-color: var(--BrandGreen-300);
}

.detail .link .link-item a::after {
    content: "\e962";
    font-family: 'nmnsIcon';
    float: right;
    font-weight: 600;
    font-size: 1.125rem;
}

.detail .activity-info {
    margin: 0 0 3rem 0;
}

.detail .activity-info ul {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}

.detail .activity-info ul li {
    font-size: 1rem;
    color: var(--Grey-500);
    border-left: var(--BrandGreen-300) 2px solid;
    padding-left: 40px;
    padding: 4px 4px 4px 40px;
    width: 100%;
}

.detail .activity-info ul li::before {
    font-family: 'nmnsIcon';
    width: initial;
    height: initial;
    background-color: initial;
    top: 4px;
    left: 20px;
}

.detail .activity-info ul li.calendar-icon .date {
    display: flex;
    align-items: center;
}

.detail .activity-info ul li.calendar-icon .date .add a {
    font-size: 14px;
    border: var(--BrandGreen-700) 1px solid;
    color: var(--BrandGreen-700);
    line-height: 1.5;
    padding: 0 5px 0 22px;
    margin-left: 1rem;
    border-radius: 5px;
}

.detail .activity-info ul li.calendar-icon .date .add a:hover {
    background-color: var(--BrandGreen-50);
    border: var(--BrandGreen-300) 1px solid;
}

.detail .activity-info ul li.calendar-icon .date .add a::before {
    content: '\e924';
    font-family: 'nmnsIcon';
    height: auto;
    background-color: initial;
    top: 0px;
    left: 5px;
}

.detail .activity-info ul li.calendar-icon .time a {
    margin: 0 0.5rem;
}

.detail .activity-info ul li a::before {
    bottom: 4px;
}

.detail .download ul, .detail .link-item ul {
    padding: 0 1.5rem;
}

.detail .download ul li, .detail .link-item ul li {
    line-height: 35px;
    margin-bottom: 0.25rem;
}

.detail a[class*="icon-file"] {
    margin: 3px;
    font-size: 0.75rem;
    background-image: var(--background-strong);
    color: var(--white-100);
    line-height: 25px;
    border-radius: 3px;
    padding: 0 8px 0 10px !important;
    position: relative;
}

.detail a[class*="icon-file"]::before {
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    border-radius: 2px;
    border-style: solid;
    border-width: 0 0 9px 9px;
    border-color: transparent transparent var(--white-30) transparent;
}

.detail .table a[class*="icon-file"]::before {
    content: '';
    border-color: transparent transparent var(--white-100) transparent;
}

.detail a[class*="icon-file"]:hover::before {
    content: none;
}

.detail a[class*="icon-file"]::after {
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    border-style: solid;
    border-width: 9px 9px 0 0;
    border-color: var(--white-100) transparent transparent transparent;
}

.detail .table .tr:nth-of-type(even) .td a[class*="icon-file"]::after {
    border-color: var(--Grey-100) transparent transparent transparent;
}

.detail .table .tr:nth-of-type(odd) .td a[class*="icon-file"]::after {
    border-color: var(--BrandGreen-50) transparent transparent transparent;
}

.detail a[class*="icon-file"]:hover::after {
    content: none;
}

.detail a[class*="icon-file"]:first-of-type {
    margin-left: 20px;
    padding: 0 10px;
}

.detail .table a[class*="icon-file"]:first-of-type,
.detail table a[class*="icon-file"]:first-of-type {
    margin-left: 5px
}

.detail a[class*="icon-file"] i {
    font-weight: 400;
    font-size: 0.95rem;
    vertical-align: middle;
}

.detail .link-item ul li {
    padding-left: 0.25rem
}

.detail .link-item ul li::before {
    content: '\e92f';
    font-family: 'nmnsIcon';
    width: initial;
    height: initial;
    background-color: initial;
    top: 0px;
}

.detail .link-item ul li a {
    font-size: 1rem
}

.detail .gallery-item {
    float: left;
    padding: 20px
}

@media (max-width:991px) {
    .detail .gallery-item {
        padding: 10px
    }
}

@media (max-width:767px) {
    .detail .gallery-item {
        width: 50%
    }
}

@media (max-width:575px) {
    .detail .gallery-item {
        width: 100%;
        /* padding: 0; */
    }
}

.clear {
    clear: both;
}

.lost-select {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 1rem;
}

.lost-select>* {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width:575px) {
    .lost-select>* {
        width: 100%;
    }
}

.lost-select select {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
}

.lost-select select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.lost-select select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

.lost-select input {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    padding: .375rem .75rem;
}

.lost-select input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0 !important;
}

.detail .ticket-price .step {
    display: block;
}

.detail .ticket-price .step .state {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem;
}

.detail .ticket-price .step .item .round {
    margin: 0 auto;
}

.detail .ticket-price .step .item span {
    color: var(--Grey-700);
    font-size: 0.9rem;
}

.fareBlk {
    background-color: var(--white-100);
    box-shadow: 0px 0px 10px 0px var(--black-10);
}

@media (max-width:767px) {
    .fareBlk:has(.card-header) {
        margin: 2rem 1rem 0.5rem 1rem;
    }
}

@media (max-width:575px) {
    .fareBlk:has(.card-header) {
        margin: 2rem 0rem 0.5rem 0rem;
    }
}

.fareBlk:has(.select-group) {
    padding: 30px 40px 24px 40px;
    border-left: var(--BrandGreen-600) 3px solid;
    margin: 0 1rem;
}

@media (max-width:575px) {
    .fareBlk:has(.select-group) {
        padding: 20px 20px 10px 20px;
        margin: 0 0 1rem 0;
    }
}

.fareBlk:has(.select-group) .select-group {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.fareBlk:has(.select-group) .select-group::before {
    font-family: 'nmnsIcon';
    font-size: 1.25rem;
    margin-right: 0.5rem;
}

.fareBlk:has(.select-group) .select-group span {
    display: block;
    flex-grow: 1;
    padding: 0 0.5rem !important;
}

.fareBlk:has(.select-group) .select-group select {
    height: 50px;
    flex-grow: 1;
    line-height: 50px;
    border-radius: 8px;
    padding: 0 0.5rem;
    border: var(--Grey-200) 1px solid;
    margin: 5px;
    background-color: var(--white-100);
    color: var(--Grey-700);
    width: 100%;
}

.fareBlk:has(.select-group) .select-group select:focus {
    border-radius: 0px;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.fareBlk:has(.select-group) .select-group select option:checked {
    background-color: var(--BrandGreen-500);
    color: var(--white-100);
}

@media (max-width:575px) {
    .ticket-price .card-body {
        padding: 0 !important;
    }
}

.fare-item {
    transition: all 0.3s;
    border-bottom: var(--Grey-200) 1px solid;
    padding: 20px;
    display: flex;
}

@media (max-width:575px) {
    .fare-item {
        flex-wrap: wrap;
        padding: 10px;
    }
}

.fare-item:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    border-bottom: var(--BrandGreen-300) 2px solid;
    transform: translateY(-1px);
}

.fare-item img {
    width: 84px;
    height: auto;
    margin-right: 1rem;
    background-color: #ebfaf7;
    border-radius: 8px;
}

@media (max-width:575px) {
    .fare-item img {
        margin-bottom: 1rem
    }
}

.fare-item>div {
    display: flex;
    align-items: center;
}

@media (max-width:767px) {
    .fare-item>div.col-md-6 {
        width: 50% !important;
    }
}

@media (max-width:575px) {
    .fare-item>div.col-md-6 {
        width: 100% !important;
    }
}

.fare-item>div.col-md-6:nth-child(2) {
    justify-content: flex-end;
}

.fare-item .h4 {
    font-size: 1.25rem;
    margin-bottom: 0;
}

.fare-item .h4+span {
    font-size: 1rem;
    color: var(--Grey-500);
    line-height: 1.25;
    margin-top: 0.35rem;
    display: block;
}

.fare-item .price {
    line-height: 28px;
    font-weight: 500;
    color: var(--Grey-900);
    padding: 0 .75em 0 0;
}


@media (max-width: 767px) {
    .fare-item .price {
        margin-right: auto;
    }
}

.fare-item input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

.fare-item input[type=number]::-webkit-inner-spin-button,
.fare-item input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.fare-item .number-input {
    border: 0;
    display: inline-flex;
}

.fare-item .number-input button {
    outline: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    cursor: pointer;
    margin: 0;
    position: relative;
    border: var(--Grey-300) 1px solid;
    border-radius: 50%;
}

.fare-item .number-input button:hover,
.fare-item .number-input button:hover:before,
.fare-item .number-input button:hover:after {
    border: var(--BrandGreen-300) 1px solid;
}

.fare-item .number-input button:before,
.fare-item .number-input button:after {
    display: inline-block;
    position: absolute;
    content: '';
    width: 14px;
    height: 2px;
    background-color: var(--Grey-700);
    transform: translate(-50%, -50%);
}

.fare-item .number-input button.plus:after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.fare-item .number-input input[type=number] {
    width: 50px;
    border: none;
    font-size: 1.5rem;
    line-height: 32px;
    font-weight: 500;
    text-align: center;
    color: var(--Grey-700);
}

.ticket-price .text-center button, .ticket-price .text-center button:active {
    background-color: var(--BrandGreen-700);
    color: var(--white-100);
    height: 50px;
    border-radius: 0.5rem;
    font-size: 1.125rem;
    position: relative;
    overflow: hidden;
    z-index: 1;
    width: 100%;
    border: none;
    padding: 0 1.25rem 0 0;
}

.ticket-price .text-center button::before {
    content: '';
    width: 3px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    transition: all 0.5s ease;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}

.ticket-price .text-center button:hover::before {
    width: 100%;
}

.ticket-price .text-center button.next:after {
    font-family: 'nmnsIcon';
    content: "\e924";
    border-left: var(--white-100) 1px solid;
    width: 34px;
    height: 30px;
    font-size: 1.25rem;
    display: block;
    position: absolute;
    top: 9px;
    right: 0px;
}

.ticket-price .card-header {
    padding: 10px 20px;
    font-size: 1.25rem;
    font-weight: 500;
    background-color: var(--BrandGreen-100);
}

.ticket-price .total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}


.ticket-price .total button:after {
    font-family: 'nmnsIcon';
    content: "\e937";
    border-left: var(--white-100) 1px solid;
    width: 34px;
    height: 30px;
    font-size: 1.25rem;
    display: block;
    position: absolute;
    top: 9px;
    right: 0px;
}

@media (max-width:767px) {
    .ticket-price .total button {
        margin: 0 1rem
    }
}

@media (max-width:575px) {
    .ticket-price .total button {
        margin: 0;
    }
}

.ticket-price .total .sheets {
    padding: 20px;
}

.ticket-price .total .price {
    padding: 20px;
    font-size: 1.5rem;
    font-weight: 700;
}

.fare-item .delete {
    border: none;
    background-color: initial;
    cursor: pointer;
    font-size: 1.5rem;
}

.fare-item .delete:hover {
    color: var(--BrandGreen-700);
}

.fare-group .fare-item.title {
    background-color: var(--BrandGreen-50);
    padding: 20px;
}

.fare-group .fare-item {
    transition: none;
    border-bottom: none;
    padding: 10px 20px;

}

.fare-group .fare-item:hover {
    box-shadow: none;
    transform: initial;
}

.fare-group .fare-item .col-2 {
    justify-content: flex-end;
}

.gift {
    margin-top: 5rem;
}

.gift .col-md-8 {
    overflow: hidden;
}

@media (max-width:991px) {
    .gift .col-md-8 {
        padding-right: 50px
    }
}

@media (max-width:767px) {
    .gift .col-md-8 {
        padding-right: 0px;
        margin-bottom: 2rem;
    }
}

.gift .album-slide {
    margin-bottom: 2rem
}

.gift .album-content {
    margin: 0rem auto;
}

.gift .album-thumbs {
    margin: 0 0.5rem;
}

@media (max-width:991px) {
    .gift .album-thumbs {
        margin: initial;
        overflow: hidden;
    }
}

.gift .album-control {
    left: initial;
}

.exhibits-nav {
    margin-bottom: 3rem;
    margin-top: 3rem;
}

.exhibits-nav.season {
    margin: 2rem 0;
}

@media (max-width:991px) {
    .exhibits-nav.season {
        margin: 1rem 0;
    }
}

.exhibits-btn {
    display: flex;
    margin-bottom: 3rem;
    flex-wrap: wrap;
}

.exhibits-nav.season .exhibits-btn {
    flex-wrap: wrap;
    margin-bottom: 0;
    width: 100%;
}

.exhibits-btn a {
    padding: 0.75rem 1.5rem;
    color: var(--Grey-500);
    display: block;
    text-align: center;
    cursor: pointer;
    flex: 1;
    border-bottom: 1px var(--Grey-50) solid;
    letter-spacing: 1px
}

@media (max-width:480px) {
    .exhibits-btn a {
        /* flex: initial;
        width: 100% */
        font-size: 1.125rem;
    }
}

.exhibits-nav.season a {
    flex: initial;
    width: calc(100% / 6);
    padding: 0.75rem 0;
    text-align: left;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: center;
    border-bottom: transparent 3px solid;
}

.exhibits-nav.season a::before {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--Grey-200);
}

.exhibits-btn .add-btn, .exhibits-btn .new-btn {
    display: flex;
    width: calc(100% / 6);
}

@media (max-width:1024px) {
    .exhibits-nav.season a, .exhibits-btn .add-btn, .exhibits-btn .new-btn {
        width: calc(100% / 3);
    }
}

@media (max-width:767px) {
    .exhibits-nav.season a, .exhibits-btn .add-btn, .exhibits-btn .new-btn {
        width: calc(100% / 2);
    }
}

@media (max-width:480px) {
    .exhibits-nav.season a, .exhibits-btn .add-btn, .exhibits-btn .new-btn {
        /* padding-top: 50px; */
        flex-direction: column-reverse;
    }
}

.exhibits-btn .new-btn a, .exhibits-btn .add-btn a {
    width: 100%
}

@media (max-width:480px) {
    .exhibits-btn .add-btn a::after, .exhibits-btn .new-btn a::after {
        top: -38px !important;
    }
}

.exhibits-btn a.active {
    border-bottom: 3px var(--BrandGreen-700) solid;
    color: var(--BrandGreen-700);
    font-weight: 500;
}

.exhibits-btn a:hover {
    background: linear-gradient(146.72deg, #C8FADF 15.62%, #94D7F6 108.43%);
    border-bottom: 3px var(--BrandGreen-300) solid;
    color: var(--Grey-900);
}

.exhibits-btn a:hover::before {
    content: none;
}

.exhibits-btn a i {
    font-family: "Font Awesome 5 Free" !important;
    font-size: 1.5rem;
    margin-right: 0.5rem;
    vertical-align: middle;
}

@media (max-width:480px) {
    .exhibits-btn a i {
        font-size: 1.125rem;
        vertical-align: baseline;
    }
}

.exhibits-nav.season .exhibits-btn a::after {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    background-size: 100% auto;
    margin-right: 0.75rem;
    background-repeat: no-repeat;
}

@media (max-width:480px) {
    .exhibits-nav.season .exhibits-btn a::after {
        top: 10px;
        left: 41%;
        margin-right: 0;
    }
}

.exhibits-nav.season .new-btn a::after {
    background-image: url('../images/flower/new.png');
}

.exhibits-nav.season .exhibits-btn a[href*="season=1"]::after {
    background-image: url('../images/flower/f01.png');
}

.exhibits-nav.season .exhibits-btn a[href*="season=2"]::after {
    background-image: url('../images/flower/f02.png');
}

.exhibits-nav.season .exhibits-btn a[href*="season=3"]::after {
    background-image: url('../images/flower/f03.png');
}

.exhibits-nav.season .exhibits-btn a[href*="season=4"]::after {
    background-image: url('../images/flower/f04.png');
}

.exhibits-nav.season .add-btn a::after {
    background-image: url('../images/flower/contribute.png');
}

.exhibits-btn-tag.more-tag a:nth-of-type(6)~a {
    display: none;
}

.exhibits-btn-tag.more-tag a.show {
    display: inline-block !important;
}

.exhibits-btn-tag.more-tag .read-more {
    width: initial;
    display: inline-block;
    margin: 1rem;
}

@media(max-width:575px) {
    .exhibits-btn-tag.more-tag .read-more {
        display: block;
        margin: 0.5rem;
    }
}

.slideBlk.no-slide {
    padding: 0;
}

.slideBlk.no-slide ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0 !important;
}

@media (max-width: 767px) {
    .slideBlk.no-slide ul {
        padding: 1rem !important;
    }
}

.slideBlk.no-slide ul li {
    width: calc(100% / 3 - 40px);
    margin: 20px;
    background-color: var(--Grey-100);
    overflow: hidden;
    transition: all 0.3s;
    outline: transparent 3px solid;
}

@media (max-width: 767px) {
    .slideBlk.no-slide ul li {
        width: calc(100% / 2 - 20px);
        margin: 10px;
    }
}

@media (max-width: 575px) {
    .slideBlk.no-slide ul li {
        width: calc(100% / 1 - 0px);
        margin: 10px 0;
    }
}

.slideBlk.no-slide ul li:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
}

.slideBlk.no-slide ul li:focus-within {
    outline: orange 3px dotted;
    border-radius: 20px;
}

.slideBlk .floor {
    position: absolute;
    top: 12px;
    left: 12px;
    background-color: var(--black-40);
    color: var(--white-100);
    z-index: 2;
    padding: 0px 12px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 500;
}

.slideBlk .open, .detail .galleryBlk .open {
    position: absolute;
    top: 12px;
    right: 12px;
    background-color: var(--black-40);
    color: var(--white-100);
    z-index: 2;
    padding: 0px 12px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 500;
}

.form-group .select-group {
    display: flex;
    align-items: center;
    flex-grow: 1;
}

@media (max-width:575px) {
    .form-group .select-group {
        margin-right: 0rem;
    }
}

.form-group .select-group label {
    white-space: nowrap
}

.form-group .select-group input {
    width: 100%;
    height: 50px;
    border-radius: 8px !important;
    border: var(--Grey-200) 1px solid;
    margin: 10px 5px;
    padding: .375rem .75rem;
}

.form-group .select-group input:focus {
    box-shadow: initial;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
    border-radius: 0 !important;
}

#centercontainer:has(.news-page)>.inside_title h2 {
    font-size: 2.25rem;
    line-height: 1.4;
    letter-spacing: 1px;
}

@media (max-width:767px) {
    #centercontainer:has(.news-page)>.inside_title h2 {
        font-size: 2rem;
    }
}

.areaBlk.subcheck,
.floorBlk.subcheck {
    position: initial;
    width: initial;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.floor_plan {
    position: relative;
    margin: 4rem 0 2rem 0;
}

@media (max-width:1300px) {
    .areaBlk.subcheck::before {
        content: '向右滑看更多 ➨';
        width: 100%;
        margin-bottom: 0.5rem;
    }
}

.floor_plan svg {
    width: 1280px;
    height: auto;
    margin: 1rem 0;
}

@media (max-width:767px) {
    .floor_plan svg {
        width: 760px;
    }
}

.floor_plan .floor-block {
    opacity: 0;
}

.floor_plan text tspan {
    font-size: 2rem;
    /* font-weight: 500; */
    fill: #464646;
}

.floor_plan svg g a:hover .floor-block,
.floor_plan svg g a:focus .floor-block {
    opacity: 1 !important;
}

.floor_plan svg g a:focus {
    outline-width: 8px !important;
}

/* 特展室當期展覽 */
.current-exhibition {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.current-exhibition .exhibitionBlk {
    position: absolute;
    transition: all .5s;
    opacity: 0;
    display: none;
    width: 120px;
}

.current-exhibition .exhibitionBlk.hovering {
    display: block;
    opacity: 1;
    animation: fadeIn .5s;
}

.current-exhibition .exhibitionBlk.hovering-checked {
    display: block !important;
    opacity: 1 !important;
    animation: fadeIn .5s;
}

.current-exhibition .exhibitionBlk .photo {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #f1f1f1;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, .3);
    border: 1px solid #ccc;
    position: relative;
}

.current-exhibition .exhibitionBlk .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.current-exhibition .exhibitionBlk .exhibition-line {
    display: block;
    width: 1px;
    height: 50px;
    background-color: #333;
    position: absolute;
    bottom: -50px;
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.imgMaxWidth {
    max-width: 100%;
    height: auto;
}

.imgMaxHeight {
    max-height: 100%;
    width: auto;
}

.gardenBlk {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 3rem;
}

.gardenBlk .item {
    width: calc(100% / 5);
    margin: 0.5rem 0;
    counter-increment: item-num;
}

@media (max-width: 1037px) {
    .gardenBlk .item {
        width: calc(100% / 3);
    }
}

@media (max-width: 767px) {
    .gardenBlk .item {
        width: calc(100% / 2);
    }
}

@media (max-width: 540px) {
    .gardenBlk .item {
        width: calc(100% / 1);
    }
}

.gardenBlk .item::before {
    content: counter(item-num);
    background-color: var(--Grey-300);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-block;
    line-height: 28px;
    text-align: center;
    margin-right: 0.5rem;
    font-size: 1rem;
    font-weight: 500;
}

.detail .likeBlk .gallery-item {
    position: relative;
    margin-bottom: 0;
}

@media (max-width:991px) {
    .detail .likeBlk .gallery-item {
        padding: 10px;
    }
}

@media (max-width:767px) {
    .detail .likeBlk .gallery-item {
        width: 50%
    }
}

@media (max-width:575px) {
    .detail .likeBlk .gallery-item {
        padding: 10px 0;
        width: 100%
    }
}

.detail .likeBlk .gallery-item .photo a {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 3;
    /* margin: -3px; */
    background-color: initial;
}

.detail .likeBlk .gallery-item .photo a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail .contributeLikeIcon {
    position: absolute;
    right: 1.75rem;
    top: 1.75rem;
    z-index: 1;
    border: none;
    background-color: initial;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    line-height: 1.75;
}

@media (max-width:991px) {
    .detail .contributeLikeIcon {
        right: 1rem;
        top: 1rem;
    }
}

@media (max-width:575px) {
    .detail .contributeLikeIcon {
        top: 1.75rem;
    }
}

.detail .contributeLikeIcon::before {
    font-family: 'nmnsIcon';
    box-shadow: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    transition: all 0.3s;
    background-color: var(--white-100);
    color: var(--BrandGreen-700);
}

.detail .contributeLikeIcon:hover::before {
    content: '\e916' !important;
    background-color: var(--BrandGreen-500);
    color: var(--white-100)
}

.detail .contributeLikeIcon.active::before {
    content: '\e916' !important;
    color: var(--danger-base);
}

.detail .contributeLikeIcon.active:hover::before {
    background-color: var(--white-100);
}

.detail .likeBlk .gallery-item .imgBlk span .name {
    overflow: initial;
}

.detail .likeBlk .gallery-item .imgBlk span .name a {
    font-size: 1.125rem;
    border: none;
    border-radius: initial;
    outline: none;
}

.detail .likeBlk .gallery-item .imgBlk span .name a:hover {
    border: initial;
    box-shadow: none;
    outline: initial;
}

.detail .likeBlk .gallery-item .imgBlk span .name+div {
    color: var(--Grey-500);
    line-height: 1.6;
}

.search-form .input-group i {
    display: none;
}

.like_num {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    font-size: 0.875rem;
    white-space: nowrap;
    padding: 0 8px;
    background-color: var(--black-70);
    border-radius: 5px;
    margin-right: 0.35rem;
    color: var(--white-100);
}

.contributeBlk {
    margin: 0 0 1rem 0;
}

.contributeBlk .contributeLikeIcon {
    right: 3rem;
    top: 3rem;
}

.contributeBlk .activity-info {
    margin: 1rem;
    line-height: 1.6;
}

.contributeBlk .activity-info ul li {
    list-style: none;
    display: flex;
    margin-bottom: 0.5rem;
}

.contributeBlk .activity-info ul li::before {
    font-family: 'nmnsIcon';
    margin-right: 0.5rem;
}

.collection {
    /* margin: 2rem 0; */
}

@media (max-width:575px) {
    .collection {
        /* margin: 0; */
    }
}

#btnSubmit {
    margin-left: 1rem;
    padding: 0.375rem 1.25rem 0.375rem 0;
    height: 50px;
    font-size: 1.125rem;
}

@media (max-width:575px) {
    #btnSubmit {
        width: 100%;
        margin: 1rem 0 0 0;
        padding: 0.5rem 1.25rem;
        justify-content: center;
    }
}

#btnSubmit::after {
    font-family: 'nmnsIcon';
    content: "\e92a";
    margin-left: 1.25rem;
    border-left: var(--white-100) 1px solid;
    display: inline-block;
    width: 34px;
    height: 26px;
    line-height: 26px;
    position: absolute;
    right: 0px;
}

.chart {
    /* margin: 8rem 0 0 0; */
}

.chart-block {
    margin: 3rem 0;
}

.collection .collection-info {
    display: flex;
    flex-wrap: wrap;
    padding: 0.5rem 0 1.5rem 0;
    justify-content: center;
    line-height: 1.7;
    max-width: 960px;
    margin: 0 auto;
}

.collection .collection-info>div {
    background-color: var(--BrandGreen-50);
    margin: 0 0.5rem;
    padding: 1.5rem 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    flex: 1;
    text-align: center;
    border-radius: 4px;
}

@media (max-width:767px) {
    .collection .collection-info>div {
        width: 100%;
        flex: initial;
        margin: 0.5rem 0;
        padding: 0.5rem 0;
    }
}

.collection .collection-info img {
    max-width: 100%;
    width: initial;
}

.collection .collection-info .number {
    font-size: 2.6rem;
    font-weight: bold;
    color: var(--BrandGreen-700);
    line-height: 1.5;
}

.collection .collection-info .number span,
.collection .collection-info .add .number span {
    font-size: 1rem;
    font-weight: 400;
    color: var(--Grey-700);
    margin-left: 0.25rem;
}

.en .collection .collection-info .number span {
    margin-left: 2px;
}

.collection .collection-info .last_year {
    font-size: 1rem;
}

.collection .collection-info .last_year span,
.collection .collection-info .this_year span {
    font-size: 2.6rem;
    font-weight: bold;
    color: var(--BrandGreen-700);
    margin-left: 0.25rem;
}

.en .collection .collection-info .this_year span {
    line-height: 2.6rem;
    margin-right: 2px;
}

.collection .collection-info .numBlk {
    display: flex;
    flex-wrap: wrap;
}

.collection .collection-item {
    display: flex;
    flex-wrap: wrap;
    max-width: 960px;
    margin: 0 auto;
}

@media (max-width:767px) {
    .collection .collection-item {
        margin: 0 -0.5rem;
    }
}

.collection .collection-item .item {
    display: flex;
    background-color: var(--Grey-100);
    padding: 20px 0;
    margin: 0.5rem;
    flex-wrap: wrap;
    width: calc(100% / 4 - 1rem);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.5;
    border-radius: 4px;
}

@media (max-width:767px) {
    .collection .collection-item .item {
        width: calc(100% / 3 - 1rem);
    }
}

@media (max-width:575px) {
    .collection .collection-item .item {
        width: calc(100% / 2 - 1rem);
    }
}

.collection .collection-item .item img {
    mix-blend-mode: multiply;
    margin-bottom: 0.5rem;
    max-width: 100%;
    width: initial;
}

.collection .collection-item .item .numBlk {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.collection .collection-info .total .iconfont,
.collection .collection-item .item .iconfont {
    display: block;
    margin: 0.25rem 0 0.5rem 0;
    font-size: 2.5rem;
    color: var(--BrandGreen-700);
}

.green-num {
    font-size: 1.25rem;
    font-weight: 600;
    margin-right: 0.25rem;
    color: var(--BrandGreen-600)
}

.green-num span {
    font-size: 0.9rem;
    color: var(--Grey-700);
    font-weight: 400;
}

.blue-num {
    font-size: 1.25rem;
    font-weight: 600;
    margin-right: 0.25rem;
    color: var(--BrandBlue-500)
}

.collection .collection-item .item .add,
.collection .collection-item .item .add2 {
    font-size: 0.95rem;
    margin-left: 0.25rem;
}

@media (max-width:575px) {

    .collection .collection-item .item .add,
    .collection .collection-item .item .add2 {
        font-size: 0.9rem;
    }
}

.collection .collection-item .item .number {
    font-size: 1.5rem;
    font-weight: 600;
}

@media (max-width:575px) {
    .collection .collection-item .item .number {
        font-size: 1.25rem;
        font-weight: 500;
    }
}

.collection .collection-item .item .number span {
    font-weight: 400;
    font-size: 1rem;
    margin-left: 0.25rem
}

.collection .collection-item .item .category {
    margin-top: 0.25rem;
}

@media (max-width:575px) {
    .collection .collection-item .item .category {
        font-size: 1rem;
    }
}

.collection .collection-item .item i {
    font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands" !important;
    color: var(--BrandGreen-600);
    font-size: 2rem;
    margin: 0.5rem 0;
}

.collection .sc-img {
    max-width: initial;
    margin: 1rem 0;
}

.collection .sc-img .item {
    background-color: initial;
    width: initial;
    padding: 0;
    margin: 0;
    display: flex;
    background-color: var(--BrandGreen-50);
    border-radius: 4px;
    padding: 8px 20px;
    margin: 0.25rem;
    flex-direction: row;
}

@media (max-width:575px) {
    .collection .sc-img .item {
        padding: 5px 10px;
        font-size: 1rem;
    }
}


.collection .sc-img .item:has(a) {
    border: 1px solid var(--BrandGreen-300);
    padding: 0;
}

.collection .sc-img .item:has(a) a {
    display: flex;
    padding: 8px 20px;
}

@media (max-width:575px) {
    .collection .sc-img .item:has(a) a {
        padding: 5px 10px;
        font-size: 1rem;
    }
}


.collection .sc-img .item a::before {
    content: none;
}

.collection .sc-img .item a:hover {
    color: var(--white-100);
    background-color: var(--BrandGreen-400);
}

.collection .sc-img .item.active a {
    background-color: var(--BrandGreen-600);
    color: var(--white-100);
}

.collection .rank {
    margin: 0 auto 3rem auto;
}

.collection .rank::before {
    content: none;
}

.collection .rank .item {
    display: flex;
    background-color: var(--BrandGreen-50);
    width: calc(100% / 2 - 1rem);
    flex-direction: row;
    justify-content: flex-start;
    padding: 20px;
    flex-wrap: initial;
}

@media (max-width:767px) {
    .collection .rank .item {
        width: 100%;
    }
}

.collection .rank .item img {
    mix-blend-mode: initial;
}

.collection .rank .item .round {
    display: inline-flex;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-image: url('../images/qa-bg.png');
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    background-size: 147px 115px;
    background-position: -65px -28px;
    background-repeat: no-repeat;
    color: var(--white-100);
    flex-shrink: 0;
    font-size: 1.5rem;
    font-weight: 500
}

.collection .rank .item .text {
    flex-grow: 1;
    margin: 0 0.5rem;
}

.collection .rank .item .visit {
    font-weight: 700;
    color: var(--BrandGreen-600);
    font-size: 1.5rem;
}

.collection .rank .item .growing {
    font-size: 1rem;
    margin-left: 0.5rem;
    color: var(--BrandBlue-600)
}

.collection .category .item {
    background-color: var(--BrandGreen-50);
    width: calc(100% / 5 - 1rem);
}

@media (max-width:767px) {
    .collection .category .item {
        width: calc(100% / 3 - 1rem);
    }
}

@media (max-width:575px) {
    .collection .category .item {
        width: calc(100% / 2 - 1rem);
    }
}

.collection .category .item img {
    mix-blend-mode: initial;
}

.theme-search {
    margin-top: 3rem;
}

.theme-search .theme-item {
    margin-bottom: 2rem;
    margin-top: 0;
}

.theme-search .theme-item a::before {
    content: none;
}

.theme-search .search-title {
    margin-bottom: 2rem;
}

@media (max-width:991px) {
    .theme-search .col-md-3, .theme-search .col-md-9 {
        width: 100%;
        margin-bottom: 2rem;
    }
}

.detail .check-group {
    display: flex;
    flex-wrap: wrap;
}

.detail .check-group .check-item, .detail .radio-group .check-item {
    margin: 0.5rem 0;
    display: flex;
    width: 100%
}

@media (max-width:991px) {
    .detail .check-group .check-item {
        width: calc(100% / 3)
    }
}

@media (max-width:820px) {
    .detail .check-group .check-item {
        width: calc(100% / 2)
    }
}

@media (max-width:767px) {
    .detail .check-group .check-item {
        width: calc(100% / 1)
    }
}

.detail .check-group .check-item label {
    line-height: 1.6;
    color: var(--Grey-900);
}

.contact {
    margin-top: 2rem;
}

@media (max-width:767px) {
    .contact+.contact {
        margin-top: 0rem;
    }
}

.contact+p {
    margin-top: 2rem;
}

.card-large .imgBlk {
    width: 66%;
    margin-right: 20px;
}

.detail .card-large .photo {
    aspect-ratio: initial;
}

.card-large .text {
    width: calc(34% - 20px);
}

.card-large .text .info ul li {
    font-size: 1rem;
    margin-bottom: 0.25rem;
    color: #464646;
}

.detail .card-large .text .info ul li::before {
    width: 20px;
    height: 20px;
    opacity: 1;
}

@media (max-width: 767px) {
    .card-large .imgBlk {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .card-large .text {
        width: 100%;
    }
}

.detail .galleryBlk.job:has([title="SoundOn"]) {
    margin-bottom: 4rem
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row {
    max-width: 960px;
    margin: 0 auto;
}

.detail .galleryBlk.job .row .item {
    width: calc(100% / 4);
    padding: 20px
}

@media (max-width:991px) {
    .detail .galleryBlk.job .row .item {
        padding: 10px
    }
}

@media (max-width:767px) {
    .detail .galleryBlk.job .row .item {
        width: calc(100% / 2);
    }
}

@media (max-width:575px) {
    .detail .galleryBlk.job .row .item {
        width: calc(100% / 1);
        padding: 1rem 0
    }
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row .item {
    margin: 1rem;
    width: calc(100% / 4 - 2rem);
}

@media (max-width:767px) {
    .detail .galleryBlk.job:has([title="SoundOn"]) .row .item {
        margin: 0rem 2rem;
        width: calc(100% / 2 - 4rem)
    }
}

@media (max-width:480px) {
    .detail .galleryBlk.job:has([title="SoundOn"]) .row .item {
        margin: 0rem 0.5rem;
        width: calc(100% / 2 - 1rem);
    }
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row .item .imgBlk span {
    background-color: initial;
    text-align: center;
}

.detail .galleryBlk.job .row .item .imgBlk {
    outline: transparent 3px solid;
    overflow: hidden;
    transition: all 0.3s
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row .item .imgBlk {
    outline: initial;
    transition: initial
}

.detail .galleryBlk.job .row .item:hover .imgBlk {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row .item:hover .imgBlk {
    outline: initial;
    box-shadow: initial;
}

.detail .galleryBlk.job .row .item .imgBlk span {
    line-height: 1.6;
}

.detail .galleryBlk.job .row .item .imgBlk span p {
    margin-bottom: 0.25rem;
}

.detail .galleryBlk.job .row .item .imgBlk span p span {
    padding: 0;
}

.detail .galleryBlk.job .row .item .imgBlk span .text {
    line-height: 1.5;
}

.detail .galleryBlk.job .row .item .imgBlk span .text p {
    margin-bottom: 0;
}

.detail .galleryBlk.job .row .item .photo {
    aspect-ratio: 4 / 3;
}

.detail .galleryBlk.job:has([title="SoundOn"]) .row .item .photo {
    aspect-ratio: initial;
}

.detail .galleryBlk.job .row .item .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail .galleryBlk.job .row .item .name {
    font-size: 1.125rem;
    font-weight: 500;
}

.detail .galleryBlk.job .row .item .text a {
    display: inline-block;
    background-color: initial;
    transition: initial;
}

.detail .galleryBlk.job .row .item .text a:hover {
    box-shadow: none;
    outline: none;
    border-radius: initial;
}

#chart-year {
    margin: 5rem 0;
}

.detail .research {
    width: 100%;
    display: block;
}

.detail .research .row {
    justify-content: initial;
}

@media (max-width:991px) {
    .detail .research .row {
        margin: 0 10px;
    }
}

@media (max-width:767px) {
    .detail .research .row {
        margin: 10px -10px;
    }
}


.detail .research .row .item {
    width: calc(100% / 4);
    padding: 20px;
    line-height: 1.5;
}

@media (max-width:991px) {
    .detail .research .row .item {
        padding: 20px 10px;
    }
}

@media (max-width:767px) {
    .detail .research .row .item {
        width: calc(100% / 2);
    }
}


.detail .research .row .item .name, .detail .symbols .row .item .name {
    color: var(--Grey-900);
    font-weight: 500;
}

.detail .research .row .item .discipline {
    color: var(--Grey-600);
}

.detail .h3+.h4 {
    margin-bottom: 0;
}

.detail .research+.h4 {
    margin-top: 2rem;
    margin-bottom: 0
}

@media (max-width:767px) {
    .detail .card.research .text {
        margin-top: 2rem;
    }
}

.detail .research p {
    margin-bottom: 0;
}

@media (max-width:991px) {
    .detail .symbols {
        display: inherit;
        margin: 0 -10px;
    }
}

@media (max-width:575px) {
    .detail .symbols {
        margin: 0;
    }
}

.detail .symbols .row {
    justify-content: initial;
}

@media (max-width:991px) {
    .detail .symbols .row {
        margin: 0;
    }
}

.detail .symbols .row .item {
    width: calc(100% / 4 - 40px);
    line-height: 1.5;
    background-color: var(--BrandGreen-50);
    margin: 20px;
    padding: 0;
    outline: transparent 3px solid;
    transition: all 0.3s;
}

@media (max-width:991px) {
    .detail .symbols .row .item {
        margin: 10px;
        width: calc(100% / 4 - 20px);
    }
}

@media (max-width:767px) {
    .detail .symbols .row .item {
        width: calc(100% / 2 - 20px);
    }
}

@media (max-width:575px) {
    .detail .symbols .row .item {
        width: calc(100% / 1);
        margin: 1rem 0;
    }
}

.detail .symbols .row .item:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 20px;
    box-shadow: 0px 10px 30px 0px var(--black-20);
}

.detail .symbols .row .item .photo {
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2rem 1rem 0.5rem 1rem;
}

.detail .symbols .row .item .photo img {
    height: 100%;
    width: auto;
    object-fit: initial;
}

.detail .symbols .imgBlk span {
    background-color: initial;
}

.detail .symbols .row .item p {
    margin-bottom: 0
}

.detail .symbols .row .item a {
    background-color: initial;
    outline: none;
}

.detail .symbols .row .item a:hover {
    outline: none;
    box-shadow: none
}

section>.h4 {
    margin-top: 3rem;
}

.detail .galleryBlk.video {
    display: block;
}

#slider-link, #iconList {
    margin: 0;
}

.d-flex:has(#btnSubmit) {
    flex-wrap: wrap;
    padding: 0;
    margin: 0 0 3rem 0 !important;
}

@media (max-width:480px) {
    .d-flex div:has(select) {
        display: flex;
        flex-grow: 1;
    }
}

.d-flex:has(#btnSubmit)>div:not(.send) {
    flex-grow: 1;
}

.d-flex:has(#btnSubmit) select {
    margin: 0;
    height: 50px;
    width: 100%;

}

.d-flex:has(#btnSubmit) select:focus {
    box-shadow: none;
    border-radius: 0;
    border: none;
    border-bottom: var(--BrandGreen-500) 2px solid;
}

.d-flex:has(#btnSubmit) .send button::after {
    /* position: initial; */
    background-color: initial;
    left: initial;
    top: 12px;
}

.popular-info {
    margin-top: 3rem;
}

.popular-info .title {
    display: flex;
    align-items: center;
    font-size: 2rem;
    margin: 2rem 0;
}

.popular-info .title:after {
    content: '';
    display: block;
    height: 1px;
    background-color: var(--Grey-200);
    flex: 1;
    margin-left: 1rem;
}

.popular-info .title .round {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    flex-shrink: 0;
    border-radius: 50%;
    margin-right: 10px;
    color: var(--white-100);
    background: var(--background-strong);
}

.popular-info .title i {
    font-family: "Font Awesome 5 Free" !important;
    font-size: 1rem;
}

.detail .popular-info .no-border-card .card {
    margin: 0;
    background-color: initial;
    transition: all 0.3s;
    border-bottom: transparent 2px solid;
}

.detail .popular-info .no-border-card .card::after {
    content: '';
    width: 100%;
    height: 1px;
    background-color: var(--Grey-200);

}

.detail .popular-info .no-border-card .card:hover {
    box-shadow: 0px 10px 30px 0px var(--black-20);
    border-bottom: var(--BrandGreen-300) 2px solid;
    background-color: var(--white-100);
}

.detail .popular-info .no-border-card .card .row {
    align-items: center;
    margin: 0;
    padding: 20px;
}

.detail .popular-info .card .info ul:before, .detail .popular-info .card .info ul::after {
    display: none;
}

.detail .popular-info .card .text .info {
    margin-bottom: 0;
}

.detail .popular-info .card .info ul {
    margin-bottom: 0;
    padding-bottom: 0;
    line-height: 1.5;
}

.detail .popular-info .card .info ul li {
    margin-right: 0;
}

.detail .popular-info .no-border-card .card-small .imgBlk {
    width: 120px;
    margin-right: 0;
}

@media (max-width:767px) {
    .detail .popular-info .no-border-card .card-small .imgBlk {
        margin: 0 auto 1rem auto;
    }
}

.detail .popular-info .card .photo {
    overflow: initial;
    width: 120px;
    height: 120px;
}

.detail .popular-info .card .photo a {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    aspect-ratio: 1/1;
}

.popular-info .card .rank {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    background-image: url('../images/qa-bg.png');
    margin-right: 2rem;
    background-size: 147px 115px;
    background-position: -65px -28px;
    background-repeat: no-repeat;
    color: var(--white-100);
    flex-shrink: 0;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 50px;
    text-align: center;
    margin-left: 6px;
}

@media (max-width:767px) {
    .popular-info .card .rank {
        margin-right: 0;
        margin-bottom: 1rem
    }
}

.popular-info .card .rank::before {
    content: none;
}

.popular-info .card:nth-child(1) .rank,
.popular-info .card:nth-child(2) .rank,
.popular-info .card:nth-child(3) .rank {
    background-color: initial;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 0;
    background-position: top center;
    color: var(--Grey-900);
    line-height: 70px;
    text-align: center;
    width: 60px;
    height: 60px;
    margin-left: 0;
}

.popular-info .card:nth-child(1) .rank {
    background-image: url('../images/icon/crown-1.png');
}

.popular-info .card:nth-child(2) .rank {
    background-image: url('../images/icon/crown-2.png');
}

.popular-info .card:nth-child(3) .rank {
    background-image: url('../images/icon/crown-3.png');
}

.detail .popular-info .tag {
    /* max-width: initial; */
}

.detail .popular-info .tag ul li {
    width: calc(100% / 2);
    margin: 0;
}

@media (max-width:767px) {
    .detail .popular-info .tag ul li {
        width: calc(100% / 1);
    }
}

.detail .popular-info .tag ul li::before {
    content: none;
}

.detail .popular-info .tag ul li a {
    width: 100%;
    margin: 0.5rem;
    transition: all 0.3s;
    outline: transparent 3px solid;
}

.detail .popular-info .tag ul li a:hover {
    outline: var(--BrandGreen-300) 3px solid;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px var(--black-10);
}

.detail .popular-info .tag ul li a::before {
    content: none;
}

.popular-info .tag ul li a .rank {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    background-image: url('../images/qa-bg.png');
    margin-right: 1.5rem;
    background-size: 147px 115px;
    background-position: -65px -28px;
    background-repeat: no-repeat;
    color: var(--white-100);
    flex-shrink: 0;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 50px;
    text-align: center;
    margin-left: 6px;
    margin-bottom: 0;
}

.popular-info .tag ul li:nth-child(1) a .rank,
.popular-info .tag ul li:nth-child(2) a .rank,
.popular-info .tag ul li:nth-child(3) a .rank {
    background-color: initial;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: initial;
    border-radius: 0;
    width: 60px;
    margin-right: 1rem;
    margin-bottom: 0;
    font-size: 1.25rem;
    color: var(--Grey-900);
    line-height: 61px;
    height: 46px;
    padding-right: 6px;
}

.popular-info .tag ul li:nth-child(1) a .rank {
    background-image: url('../images/icon/crown-1.png');
}

.popular-info .tag ul li:nth-child(2) a .rank {
    background-image: url('../images/icon/crown-2.png');
}

.popular-info .tag ul li:nth-child(3) a .rank {
    background-image: url('../images/icon/crown-3.png');
}

.popular-info .tag ul li a .text {
    font-size: 1.125rem;
    color: var(--Grey-700);
    font-weight: 500;
}

.popular-info .tag .item .visit span {
    font-size: 1rem;
    font-weight: 400;
    margin-left: 0.25rem;
    color: var(--Grey-700);
}

.detail .galleryBlk.ranking>.row {
    width: 100%;
    margin: 2rem 0 0 0 !important;
}

.detail .galleryBlk.ranking .item {
    position: relative;
    margin: 0;
    padding: 20px;
}

@media (max-width:575px) {
    .detail .galleryBlk.ranking .item {
        padding: 1rem 0;
    }
}

.detail .galleryBlk.ranking .item a {
    height: initial;
    line-height: 1.6
}

.detail .galleryBlk.ranking .item .order,
.detail .galleryBlk.ranking .item .like {
    position: absolute;
    box-shadow: 0px 10px 30px 0px var(--black-20);
    font-size: 1rem;
    white-space: nowrap;
    padding: 0 8px;
    background-color: var(--black-70);
    border-radius: 5px;
    color: var(--white-100);
    top: 2rem;
    z-index: 1;
    letter-spacing: 1px;
}

.detail .galleryBlk.ranking .item .order {
    left: 2rem;
}

@media (max-width:820px) {
    .detail .galleryBlk.ranking .item .order {
        left: 1rem;
        top: 1rem;
    }
}

.detail .galleryBlk.ranking .row:first-child .item .order {
    background-image: url('../images/icon/crown-1.png');
    background-color: initial;
    background-repeat: no-repeat;
    background-size: contain;
    color: var(--Grey-900);
    width: 50px;
    height: 43px;
    box-shadow: none;
    left: 2.75rem;
    text-align: center;
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 56px;
    top: 2.25rem;
}

@media (max-width:820px) {
    .detail .galleryBlk.ranking .row:first-child .item .order {
        left: 1rem;
        top: 1.75rem;
    }
}

@media (max-width:575) {
    .detail .galleryBlk.ranking .row:first-child .item .order {
        left: 1.5rem;
        top: 1.75rem;
    }
}

.detail .galleryBlk.ranking .item .like {
    right: 2rem;
}

@media (max-width:820px) {
    .detail .galleryBlk.ranking .item .like {
        right: 1rem;
        top: 1rem
    }

    .detail .galleryBlk.ranking .row:first-child .item .like {
        right: 2rem;
        top: 2rem
    }
}

@media (max-width:575px) {
    .detail .galleryBlk.ranking .row:first-child .item .like {
        right: 1rem;
    }
}

.detail .galleryBlk.ranking .item .like::before {
    font-family: 'nmnsIcon';
    margin-right: 3px;
    font-size: 1.125rem;
    vertical-align: bottom;
    color: var(--danger-base);
}

.detail .galleryBlk.ranking .item a .name {
    font-weight: 500;
    font-size: 1.125rem;
}

pre {
    display: block;
    font-size: 0.875rem;
    word-break: break-all;
    word-wrap: break-word;
    color: var(--Grey-900);
    background-color: var(--Grey-100);
    border: 1px solid var(--Grey-300);
    padding: 0.25rem 1rem;
    overflow: auto;
    max-height: 500px;
    line-height: 1.8;
}

.detail a.btn[title="申請驗證碼"] {
    height: 50px;
    font-size: 1.125rem;
    background-color: var(--BrandGreen-700);
    position: relative;
    color: var(--white-100);
    border: none;
    border-radius: 0.5rem;
    padding: 0 1.25rem 0 0;
    overflow: hidden;
    z-index: 1;
    max-width: 250px;
    margin: 1.5rem auto 0 auto;
    line-height: 50px;
    display: block;
}

.detail a.btn[title="申請驗證碼"]:hover::before {
    width: 100%;
}

.detail a.btn[title="申請驗證碼"]::before {
    content: '';
    width: 5px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
    transition: all 0.5s ease;
}

@media (max-width:575px) {
    .detail a.btn[title="申請驗證碼"]::before {
        width: 1.5%;
    }
}

.detail a.btn[title="申請驗證碼"]::after {
    font-family: 'nmnsIcon';
    content: "\e91d";
    border-left: var(--white-100) 1px solid;
    width: 34px;
    height: 26px;
    line-height: 26px;
    position: absolute;
    top: 11px;
    right: 0px;
}

.subscribe .formBlk {
    width: 100%;
    max-width: initial;
    padding: 2.5rem 3rem 1.5rem 3rem;
    margin-bottom: 2rem;
    margin-top: 1rem;
    border-radius: 0px;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    border-left: var(--BrandGreen-600) 3px solid;
    background-color: var(--white-100);
}

@media (max-width:991px) {
    .subscribe .formBlk {
        padding: 2rem 2rem 1rem 2.5rem;
    }
}

@media (max-width:767px) {
    .subscribe .formBlk {
        padding: 1.5rem 1rem 0.25rem 2rem;
    }
}

.detail .subscribe .formBlk .check-group .title {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
    font-weight: 500;
}

.subscribe .formBlk .row {
    justify-content: flex-start;
}

.subscribe .formBlk .check-group .check-item {
    width: calc(100% / 6);
    margin: 0;
    padding: 5px;
    margin-left: 1.75rem;
}

@media (max-width:991px) {
    .subscribe .formBlk .check-group .check-item {
        width: calc(100% / 3 - 1.75rem);
    }
}

@media (max-width:767px) {
    .subscribe .formBlk .check-group .check-item {
        width: calc(100% / 2 - 1.75rem);
    }
}

@media (max-width:479px) {
    .subscribe .formBlk .check-group .check-item {
        width: calc(100% / 1 - 1.75rem);
    }
}


.cutover {
    margin-left: 1rem;
    display: flex;
    align-items: center;
}

@media (max-width:767px) {
    .cutover {
        margin-top: 0.5rem;
        margin-left: 0.5rem;
    }
}

.cutover .item {
    margin: 10px 5px;
    background-color: var(--white-100);
    border: none;
    font-size: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    color: var(--Grey-700);
    transition: all 0.3s;
    border-radius: 8px;
    box-shadow: 0px 0px 10px 0px var(--black-10);
    position: relative;
}

.cutover .item span {
    width: 85px;
    position: absolute;
    top: 45px;
    left: -53%;
    background-color: #fff;
    color: var(--black-100);
    padding: 10px 15px;
    z-index: 3;
    border-radius: 5px;
    line-height: 1;
    font-size: 0.813rem;
    transition: all 0.3s ease;
    transform: translateY(10px);
    box-shadow: 0px 10px 30px 0px var(--black-20);
    text-align: center;
    visibility: hidden;
    opacity: 0;
}

.cutover .item span::before {
    content: '';
    display: block;
    position: absolute;
    top: -9px;
    left: calc(50% - 7.5px);
    border-style: solid;
    border-width: 0px 7.5px 9px 7.5px;
    border-color: transparent transparent #fff transparent;
}

.cutover .item:hover span {
    transition: all 0.3s ease;
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
}

.cutover .item:has(.active) span {
    transition: all 0.3s ease;
    transform: translateY(10px);
    visibility: hidden;
    opacity: 0;
}

.cutover .item.active, .cutover .item:hover {
    background-color: var(--BrandGreen-700);
}

.cutover .item.active i, .cutover .item:hover i {
    color: var(--white-100);
}

.eng_title::after {
    content: '';
    color: var(--Grey-500);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    margin-left: 0.5rem;
    font-size: 0.8rem;
}

.eng_title.coming::after {
    content: '即將展出';
    border: var(--Grey-500) 1px solid;
}

.eng_title.end::after {
    content: '展期結束';
    border: var(--Grey-500) 1px solid;
}

.scienceimages+form .d-flex {
    display: flex;
    flex-wrap: wrap;
}

.select-group {
    display: flex;
    align-items: center;
    flex-grow: 1;
}

@media (max-width:575px) {
    .select-group {
        width: 100%
    }
}

.select-group label {
    white-space: nowrap;
}

.clearBtn {
    position: absolute;
    top: 40px;
    right: 0px;
    border: none;
    background-color: initial;
    width: 50px;
    height: 50px;
    overflow: hidden;
    z-index: 5;
}

.clearBtn:hover {
    color: var(--BrandGreen-700);
}

.clearBtn::before {
    display: flex;
    justify-content: center;
    align-items: center;
    content: '\e930';
    font-family: 'nmnsIcon';
    width: 50px;
    height: 50px;
    font-size: 1.25rem;
}

#familyCategoryForm {
    margin-top: 5rem;
}

.send button::after {
    font-family: 'nmnsIcon';
    margin-left: 1.25rem;
    border-left: var(--white-100) 1px solid;
    display: inline-block;
    width: 34px;
    height: 30px;
    background-color: initial;
    position: absolute;
    left: initial;
    top: 9px;
    right: 0px;
    line-height: 30px;
}

.send button[type="submit"]::after {
    content: "\e92a";
    background-color: transparent
}

.send button[title="確認送出"]::after {
    content: "\e91d";
    background-color: transparent
}

.send button[type="reset"]::after, .send .reset::after {
    content: "\e930";
    border-left: var(--Grey-500) 1px solid;
}

.send button[type="reset"]:hover::after, .send .reset:hover::after {
    border-left: var(--white-100) 1px solid;
    background-color: initial;
}

.nav-tab-wrapper {
    position: relative;
    top: -80px;
}

@media (max-width:1024px) {
    .nav-tab-wrapper {
        top: 0px;
    }
}

.nav-underline {
    position: absolute;
    top: 44px;
    height: 3px;
    background-color: var(--BrandGreen-700);
    transition: all 0.3s ease;
    pointer-events: none;
    z-index: 4;
}

@media (max-width:1024px) {
    .nav-underline {
        display: none;
    }
}

.exhibition .owl-carousel {
    margin-top: -1.75rem;
}

@media (max-width:480px) {
    .detail .list-item .flex-ai-center {
        justify-content: center;
    }
}

.header {
    margin-top: 3rem;
    font-size: 1.25rem;
    font-weight: 500;
}

section:has(.slideBlk) .h3 {
    margin-bottom: 0;
}

.table .delete:hover img {
    filter: invert(68%) sepia(69%) saturate(1669%) hue-rotate(119deg) brightness(94%) contrast(96%);
}

.theater_title a {
    background-color: var(--BrandGreen-600);
    color: var(--white-100);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.125rem;
    margin-left: 0.5rem;
}

.theater_title a::before {
    content: none;
}

.theater_title a:hover {
    color: var(--BrandGreen-300);
    border: 2px solid var(--BrandGreen-300) !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #EBFFF4 100%) !important;
}

.news-content .news-item.expired .news-item-flex .category::before,
.news-content .news-item.over .news-item-flex .category::before {
    content: '已過期';
    font-size: 0.75rem;
    border: var(--Grey-500) 1px solid;
    padding: 0 0.5rem;
    margin-right: 1.25rem;
    line-height: 18px;
}

.detail .caption.expired .date::after {
    content: '已過期';
    border: var(--Grey-500) 1px solid;
    padding: 0.25rem 0.5rem;
    margin-left: 0.75rem;
    font-size: 0.75rem;
}

/* edit 狀態時 */
.oc-edit-buttons-visible .parkBg {
    top: calc(116px + 50px);
    /*50px上方編輯欄高度*/
}

.oc-edit-buttons-visible #header.sticky {
    top: 50px;
}

.open_time_top {
    display: flex;
    align-items: center;
    line-height: 1.5;
    justify-content: center;
}

.open_time_top::before {
    font-family: 'nmnsIcon';
    margin-right: 0.25rem
}

.open_time_top p {
    font-size: 0.9rem;
    margin-bottom: 0;
}

.en .open_time_top p {
    font-size: 0.825rem;
}

.editBtn {
    display: flex;
    flex-wrap: wrap;
}


.editBtn .item {
    border: #ddd 1px solid;
    margin: 0.25rem 0.5rem;
    line-height: 36px;
    font-size: 1.125rem;
    padding: 0 0.5rem;
    border-radius: 10px;
    text-decoration: none;
    display: block;
    color: #444;
}

body:has(.videoBlk) .editBtn .item {
    color: #fff;
}

.editBtn .item:hover {
    background-color: #ddd;
}

body:has(.videoBlk) .editBtn .item:hover {
    color: #444;
}

.editBtn .item i {
    font-family: "Font Awesome 5 Free" !important;
}

@media (max-width: 991px) {
    .oc-edit-buttons-visible header .toggleBlk {
        top: 1.75rem;
    }

    .oc-edit-buttons-visible header.sticky .toggleBlk {
        top: 1rem;
    }
}

@media (max-width: 768px) {
    .oc-edit-buttons-visible header .toggleBlk {
        top: 5.75rem;
    }

}

@media (max-width: 575px) {
    .oc-edit-buttons-visible header.sticky .toggleBlk {
        top: 0.75rem;
    }

}

.title-mark {
    padding: 0px 20px 12px 20px !important;
    color: var(--BrandGreen-700) !important;
    font-size: 0.875rem !important;
}

.title-mark::before {
    content: '\e932';
    font-family: 'nmnsIcon';
    margin-right: 0.25rem;
    font-size: 1.125rem;
    vertical-align: middle;
    color: var(--Grey-500);
}

.floor_plan svg image.all:not(.popular) {
    display: none;
}

.detail .galleryBlk .row .oc-editable,
.detail .galleryBlk .row .oc-editable-end {
    width: initial;
}

.collection.flowers .collection-item .item {
    width: calc(100% / 7 - 1rem);
}

@media (max-width:768px) {
    .collection.flowers .collection-item .item {
        width: calc(100% / 5 - 1rem);
    }
}

@media (max-width:520px) {
    .collection.flowers .collection-item .item {
        width: calc(100% / 4 - 1rem);
    }
}

@media (max-width:430px) {
    .collection.flowers .collection-item .item {
        width: calc(100% / 3 - 1rem);
    }
}

.Weekly.choose-day .date .day {
    font-size: 1.5rem;
    padding: 0.5rem;
}

@media (max-width:1200px) {
    .Weekly.choose-day .date .day {
        padding: 1.5rem 0.5rem 0.5rem 0.5rem;
    }

    .Weekly.choose-day .date .day span.open {
        right: 6px;
        bottom: initial;
        top: 4px;
    }

    .calendar .day.closed::after {
        bottom: initial;
        top: 4px;
        font-size: 0.85rem;
    }
}

.div_u a {
    color: transparent;
}

.div_u a:hover, .div_u a:focus {
    color: var(--Grey-500);
}

body:has(.videoBlk) .div_u a:hover, body:has(.videoBlk) .div_u a:focus {
    color: var(--white-100);
}

.license {
    line-height: 1.5;
    font-size: 0.9rem;
    color: #464646;
    text-align: justify;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: flex-start;
}

.license .required {
    align-self: flex-start;
}

.license input[type="checkbox"] {
    width: 20px;
    height: 20px;
    position: initial;
    margin: 0 8px 0 0;
    vertical-align: text-top;
}

.confirmBlk {
    display: none;
}

#contributeStep1 .formBlk .input-group:first-child {
    flex-wrap: initial;
    margin-bottom: 0;
}

#contributeStep1 .formBlk .input-group:first-child>label {
    margin-bottom: 0;
    width: initial;
    margin-right: 1rem;
}

#contributeStep1 .text-right {
    font-size: 0.9rem;
    margin: 0 0.5rem !important;
}

#contributeFormModal .formBlk {
    font-size: 1rem;
}

#contributeNext {
    color: var(--white-100);
    font-size: 1.125rem;
    background-color: var(--BrandGreen-700);
    padding: 0 1.5rem 0 0;
}

#contributeNext::before {
    background-color: var(--BrandGreen-800);
}

#contributeNext::after {
    content: '\e962';
    background-color: transparent;
}

.modal .notice_inner {
    margin: 0 1rem;
    color: var(--BrandGreen-600);
    font-weight: 500;
}

.tab-content .header {
    font-size: 1.75rem;
    margin-bottom: 1.75rem;
    color: var(--BrandGreen-700);
    line-height: 1.6;
    letter-spacing: 2px;
}

.detail .row [class*="col-"]+[class*="col-"] {
    margin: 1rem 0;
}

.detail .row .gallery-item+.gallery-item,
.detail .row .item+.item,
.detail .row .exhibits_margin+.exhibits_margin {
    margin: 0
}

#canRegister a.btn {
    height: 50px;
    font-size: 1.125rem;
    background-color: var(--BrandGreen-700);
    position: relative;
    color: var(--white-100);
    border: none;
    border-radius: 0.5rem;
    padding: 0 1.25rem 0 0;
    overflow: hidden;
    z-index: 1;
    max-width: 250px;
    margin: 1.5rem auto 0 auto;
    line-height: 50px;
    display: block;
    width: 100%;
}

#canRegister a.btn i {
    display: none;
}

#canRegister a.btn:hover::before {
    width: 100%;
}

#canRegister a.btn::before {
    content: '';
    width: 5px;
    height: 100%;
    background-color: var(--BrandGreen-800);
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
    transition: all 0.5s ease;
}

@media (max-width:575px) {
    #canRegister a.btn::before {
        width: 1.5%;
    }
}

#canRegister a.btn::after {
    font-family: 'nmnsIcon';
    content: "\e903";
    border-left: var(--white-100) 1px solid;
    width: 34px;
    height: 26px;
    line-height: 26px;
    position: absolute;
    top: 11px;
    right: 0px;
}

.send button[title="確認送出"] {
    color: var(--white-100);
    font-size: 1.125rem;
    background-color: var(--BrandGreen-700);
    padding: 0 1.5rem 0 0;
}

.send button[title="確認送出"]::before {
    background-color: var(--BrandGreen-800);
}


.send button[title="前往登入"] {
    color: var(--Grey-700);
    border: var(--Grey-500) 1px solid;
    background-color: var(--white-100);
    font-size: 1.125rem;
    padding: 0 1.5rem 0 0;
}

.send button[title="前往登入"]:hover {
    color: var(--white-100);
}

.send button[title="前往登入"]::before {
    background-color: var(--Grey-300);
}

.send button[title="前往登入"]:hover::before {
    background-color: var(--Grey-500);
}


.send button[title="前往登入"]::after {
    content: "\e927";
    border-left: var(--Grey-500) 1px solid;
}

.send button[title="前往登入"]:hover::after {
    border-left: var(--white-100) 1px solid;
    background-color: initial;
}

@media (max-width:575px) {
    .send {
        width: 100%;
        display: flex;
    }

    .send:has(button[title="前往登入"]) {
        flex-wrap: wrap;
    }
}

.doodleBlk .row {
    justify-content: space-between !important;
    padding: 0 1rem;
}

@media (max-width:767px) {
    .doodleBlk .row {
        padding: 0;
    }
}

.doodleBlk .item {
    margin: 1rem 0 !important;
}

.doodleBlk .item a .photo {
    aspect-ratio: 10 / 2 !important;
}

.doodleBlk .item a .photo img {
    width: 80%;
    height: initial;
    object-fit: contain;
}

#contributeDiv_photo img {
    height: 45vh;

}

.collection .collection-item .item .text a::before {
    content: none;
}