[v-cloak] {
    display: none;
}

* {
    font-size: 1rem;
    font-family: custom-sans-serif !important;
    font-weight: 300;
    position: relative;
}

@font-face {
    font-family: custom-sans-serif;
    src: url("https://fonts.gstatic.com/s/shipporimincho/v16/VdGGAZweH5EbgHY6YExcZfDoj0BA3peS7qtgjp7PoXk4LwzLxlAlXE-_3UM.117.woff2") format("woff2");
    unicode-range: U+4e, U+a0, U+3000, U+300c-300d, U+4e00, U+4e0a, U+4e2d, U+4e8b, U+4eba, U+4f1a, U+5165, U+5168, U+5185, U+51fa, U+5206, U+5229, U+524d, U+52d5, U+5408, U+554f, U+5831, U+5834, U+5927, U+5b9a, U+5e74, U+5f0f, U+60c5, U+65b0, U+65b9, U+6642, U+6700, U+672c, U+682a, U+6b63, U+6c17, U+7121, U+751f, U+7528, U+753b, U+76ee, U+793e, U+884c, U+898b, U+8a18, U+9593, U+95a2, U+ff01, U+ff08-ff09; 
}

@font-face {
    font-family: custom-sans-serif;
    src: url("https://fonts.gstatic.com/s/shipporimincho/v16/VdGGAZweH5EbgHY6YExcZfDoj0BA3peS7qtgjp7PoXk4LwzLxlAlXE-_3UM.119.woff2") format("woff2");
    unicode-range: U+3040-30FF,U+3028-303f, U+3094-3096, U+309f-30a0, U+30ee, U+30f7-30fa, U+30ff, U+3105-312f, U+3131-3163, U+3165-318e, U+3190-31bb, U+31c0-31c7;
    /* 日文平假名、片假名、片段漢字 */
}


@font-face {
    font-family: custom-sans-serif;
    src:url(https://fonts.gstatic.com/s/shipporimincho/v16/VdGGAZweH5EbgHY6YExcZfDoj0Bw3PWD.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: custom-sans-serif;
    src: url(https://fonts.gstatic.com/s/chirongoroundtc/v2/tss3AopDbiwZ4xauFDX3yQ3Ywoaj6llfmcgiJGwdhXbD0DDGckRPxUXxvfrnfmZAtsig93tBcEdw.119.woff2) format('woff2');
    unicode-range: U+4E00-9FFF
}

@font-face {
    font-family: custom-sans-serif;
    src: url(https://fonts.gstatic.com/s/notosanstc/v37/-nF7OG829Oofr2wohFbTp9iFOkMQAewlpbGXhhyYs0QF3kPVyLylzU95vTq1Ltj5xQez1g.118.woff2) format('woff2');
    unicode-range: U+d, U+2b, U+7c, U+a0, U+a9, U+300c-300d, U+4e09, U+4e3b, U+4e4b, U+4e5f, U+4e86, U+4e8b-4e8c, U+4eab, U+4ed6, U+4ee3-4ee4, U+4ef6, U+4f1a, U+4f4d, U+4f60, U+4f7f, U+4f86, U+4fdd, U+4fe1, U+5011, U+50b3, U+5149, U+5167, U+5176, U+518d, U+5229, U+524d, U+529b, U+52a0, U+52d9, U+5316-5317, U+5340, U+539f, U+53ca-53cb, U+5408, U+540c-540d, U+544a, U+548c, U+54c1, U+54e1, U+5546, U+554f, U+55ae, U+56de, U+5716, U+5831, U+5834, U+5916, U+5929, U+5973, U+597d, U+5982, U+5b57, U+5b78, U+5b89, U+5b8c, U+5b9a, U+5ba2, U+5bb9, U+5be6, U+5c07-5c08, U+5c0d, U+5c31, U+5de5, U+5df2, U+5e02, U+5e38, U+5e73-5e74, U+5ea6, U+5f0f, U+5f71, U+5f8c, U+5f97, U+5feb, U+6027, U+60c5, U+60f3, U+610f, U+611b, U+611f, U+61c9, U+6210, U+6216, U+6240, U+624b, U+63a8, U+63d0, U+641c, U+6536, U+6578, U+6599, U+65b9, U+660e, U+661f, U+662d, U+66f4, U+670d, U+671f, U+6771, U+679c, U+682a, U+683c, U+689d, U+696d, U+6a02, U+6a5f, U+6b0a, U+6b21, U+6b3e, U+6b64, U+6c23, U+6c34, U+6c92, U+6cbb, U+6cd5, U+6d3b, U+7063, U+7121, U+71b1, U+7247-7248, U+7269, U+7279, U+73fe, U+7406, U+7522, U+7576, U+767b, U+76ee, U+76f8, U+770b, U+771f, U+77e5, U+793e, U+7a0b, U+7acb, U+7ad9, U+7b2c, U+7b49, U+7cbe, U+7d50, U+7d61, U+7d93, U+7dda, U+7f8e, U+8005, U+806f, U+80fd, U+81ea, U+8207, U+8272, U+865f, U+8868, U+8981, U+898b, U+8996, U+8a00, U+8a08, U+8a0a, U+8a18, U+8a2d, U+8a71, U+8aaa, U+8acb, U+8cbb, U+8cc7, U+8d77, U+8d85, U+8def, U+8eab, U+8eca, U+8f49, U+9019-901a, U+9023, U+9032, U+904a-904b, U+904e, U+9053, U+9078, U+9084, U+90e8, U+90fd, U+91cd, U+91d1, U+9577, U+9580, U+9593, U+9762, U+982d, U+984c, U+985e, U+9996, U+9ad4, U+9ad8, U+9ede, U+ff01, U+ff08-ff09, U+ff1f;
}

body {
    background: none !important;
}

:root {
    --angle: 45deg;
    --opacity: 0.5;
}

a:hover {
    text-decoration: none !important;
}

.header {
    border-bottom: solid 2px #DBB165;
  
}
@media screen and (min-width:992px){
    #header {
        position: sticky;
        top: 0;
        z-index: 1000;
        height: 96px;
        background-color: #fff;
        
    }

    #home-navbar.active,#navbar {
        position: sticky;
        top: 96px;
        z-index: 999;
    }
    #navbar{
        background-color:#fff;
    }
}

button:focus, a:focus {
    outline: 4px #FF0004 dotted !important;
    outline-offset: -4px !important;
}
/* 一開始全部隱藏 */
.nav-none,
.lang_zh,
.lang_en,
.lang_jp {
    display: none;
}

/* 一開始全部隱藏 */
.lang_zh,
.lang_en,
.lang_jp {
    display: none;
}

.dropdown-item {
    text-wrap: inherit;
}
/* 顯示上方當前語言的大按鈕 */
body.lang-zh .lang_zh:not(.dropdown-item),
body.lang-en .lang_en:not(.dropdown-item),
body.lang-jp .lang_jp:not(.dropdown-item) {
    display: block; /* 或 inline-block，視你的排版 */
}

/* 顯示下拉選單中，非當前語言的選項 */
body.lang-zh .dropdown-item.lang_en,
body.lang-zh .dropdown-item.lang_jp,
body.lang-en .dropdown-item.lang_zh,
body.lang-en .dropdown-item.lang_jp,
body.lang-jp .dropdown-item.lang_zh,
body.lang-jp .dropdown-item.lang_en {
    display: block; /* 視你 dropdown 的樣式結構 */
}




.banner-redesign, .home-nav {
    z-index: 5
}

#main {
    background: none !important;
}

.icon_frame_header {
    width: 20px;
    height: 20px;
}

    .icon_frame_header img {
        height: 100%;
        width: 100%;
        object-fit: contain;
    }

.header_icon.dropdown:hover .icon_frame_header img, .header_icon.dropdown:hover .icon_frame_header_text, .header_icon.siteMap:hover .icon_frame_header, .header_icon.siteMap:hover .icon_frame_header_text {
    filter: invert(50%) sepia(58%) saturate(334%) hue-rotate(0deg) brightness(91%) contrast(95%);
}

.bg1 {
    width: 100% !important;
    background: none !important;
    background-color: #fcfcfc !important;
    border-radius: 12px;
    overflow: hidden;
}

.icon_frame_header_text {
    font-size: 0.75rem;
    color: #333
}

.header_icon {
    padding: 2px 10px;
}

.header_icon-border:first-child {
    border-right: solid 1px #4d4d4d;
}

.header_icon {
    text-decoration: none;
}

.taiwan.header_icon:last-child {
    border-left: 0px;
}

.font-xs {
    font-size: 0.75rem
}

.font-sm {
    font-size: 0.875rem;
}

.font-xl {
    font-size: 1.125rem
}

.font-2xl {
    font-size: 1.25rem;
}

a.goCenter {
    display: block;
    opacity: 0;
    position: absolute;
    left: 0;
    z-index: 991;
    top: 30px;
    translate: 0 -110%;
    padding: 0 .6em;
    margin-left: 2em;
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    font-size: .95rem;
    height: 1.9em;
    line-height: 2;
    background-color: #9F8047;
    color: #fff;
    text-decoration: none;
    outline: none;
    cursor: pointer;
    -webkit-transition: translate .3s;
    transition: translate .3s;
}

    a.goCenter:focus {
        opacity: 1;
        color: #fff;
    }

.por {
    position: relative;
}

.banner-redesign, .banner-redesign img {
    width: 100%;
}

.nav-link h2 {
    font-size: 1.125rem
}

.nav-link h3 {
    font-size: 0.75rem
}

.navbar {
    padding: 0;
}

.home-nav {
    background: transparent linear-gradient(180deg, #404040 0%, #0D0D0D 100%) 0% 0% no-repeat padding-box;
}

nav a:hover {
    text-decoration: none;
}

nav .nav-link {
    text-align: center
}

nav .nav-link {
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
}

nav .nav-item .nav-link-center {
    display: flex;
    flex-direction: column;
}

.other-nav .nav-link h2, .other-nav .nav-link h3 {
    color: #4D4D4D;
    letter-spacing: 1px;
}

.home-nav .nav-link h2, .home-nav .nav-link h3 {
    color: white !important;
    letter-spacing: 2px;
    font-weight:400;
}

.other-nav .nav-link h2, .home-nav .nav-link h2 {
    margin-bottom: 4px;
}

.other-nav .nav-link h3, .home-nav .nav-link h3 {
    margin: 0;
}

.home-nav .nav-item {
    padding: 8px;
    padding-bottom: 8px;
}

    .home-nav .nav-item a {
        border-radius: 24px;
        transition: background-color 0.5s ease-out
    }

        .home-nav .nav-item a:hover {
            background-color: #fff4e7;
            font-weight: 400;
        }

.other-nav .nav-item {
    padding: 8px;
}

    .other-nav .nav-item .nav-link {
        border-radius: 24px;
    }

        .other-nav .nav-item .nav-link:hover {
            background-color: #E9E9E9;
        }
/*.home-nav .nav-item::after, .other-nav .nav-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 3px;
    background-color: #FFDC46;
    transition: width 0.5s ease-out
}
.other-nav .nav-item::after {
    background-color: #C9092A;
}
.home-nav .nav-item:hover::after, .other-nav .nav-item:hover::after {
    width: 100%;
}*/
/*.home-nav .nav-item::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0%;
    background-color: #DBB165;
    transition: height 0.5s ease-out
}
.home-nav .nav-item:hover::before {
    height: 100%;
}*/
.home-nav .nav-item:hover .nav-link * {
    color: #585123 !important;
}

.home-nav .nav-item:hover .nav-link {
    background-color: #FFF5DF;
}

.dropdown-toggle::after {
    display: none;
}
/*.dropdown-test::after {
    content:'';
    position:relative;
    display:inline-block;
    left:8px;
    top:3px;
    margin-left: 0;
    vertical-align: 0;
    border: 0;
    width: 20px;
    height: 20px;
    background-image: url(../images/redesignImg/icon_arrowDown.svg);

}*/
.icon_arrowDown {
    position: absolute;
    right: 10px;
    top: 8px;
    width: 30px;
    height: 30px;
    display: inline-block;
    padding: 0;
    border: solid 1px #555;
    border-radius: 99em;
}

@media screen and (min-width:992px) {
    .icon_arrowDown {
        top: 50%;
        transform: translateY(-50%);
    }
}

.icon_arrowDown_lang {
    width: 24px;
    height: 24px;
    display: inline-block;
    padding: 0;
}

.icon_arrowDown img {
    width: 100%;
    height: 100%
}

.icon_arrowDown.lang_drop {
    right: 8px;
}

.dropdown-menu {
    width: 100%;
    opacity: 0;
    transform: translateY(15px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    display: block; /* 重要！讓 Bootstrap 能控制 */
    visibility: hidden; /* 讓未展開時完全不可互動 */
    pointer-events: none;
}

    .dropdown-menu.show {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
        pointer-events: auto;
    }

    .dropdown-menu.dropdown-hiding {
        opacity: 0;
        transform: translateY(15px);
        visibility: visible; /* 還在場上播放動畫 */
        pointer-events: none;
    }

.home-nav .dropdown-menu {
    background-color: #DBB165;
}

    .home-nav .dropdown-menu li a {
        color: #200b02;
        font-weight: 400;
    }

        .home-nav .dropdown-menu li a:hover {
            background-color: #fff;
            color: #585123;
        }

.home-intro {
    padding-top: 32px;
    padding-bottom: 32px;
}

.home-block1 {
    height: auto;
}

@media screen and (min-width:992px) {
    .home-intro {
        padding-top: 100px;
        padding-bottom: 80px;
    }

    .home-block1 {
        height: 350px;
    }
}

.home-bg {
    background-size: cover;
    background-repeat: repeat;
    background-color: #333;
}

.home-bg2 {
    background-image: url(../taiwan/images/redesignImg/taiwan_intro.png)
}


.home-intro-bg {
    position: absolute;
    width: 100%;
    object-fit: cover;
    z-index: 0;
}

@media screen and (min-width:1500px) {


    .home-intro-bg {
        top: -100px;
    }
}

.re-title {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 400;
    letter-spacing: 2px;
}

.re-subtitle {
    font-size: 1.2rem;
    color: #DBB165;
    letter-spacing: 2px;
}

.re-subtitle-left::before {
    content: "";
    position: absolute;
    width: 4px;
    height: 60px;
    background-color: #DBB165;
    left: 0;
}

.re-subheading, .re-subheading2 {
    font-size: 1.2rem;
    color: white;
    font-weight: 400;
}

.re-subheading2 {
    font-size: 1.3rem;
}

.text-yellow {
    color: #DBB165;
}

.redesign-hr {
    color: #fff;
    background-color: #fff;
}

.home-bg1-thing {
    position: absolute;
    top: -100px;
    left: 10px;
    width: 250px;
    object-fit: contain;
}

.redesign-p, .redesign-p ol li {
    line-height: 1.7;
    letter-spacing: 0.08em;
    font-weight: 300;
    color: #fff;
}

    .redesign-p div {
        font-weight: 300;
    }

.news-date {
    font-size: 0.875rem;
    padding-top: 15px;
    padding-bottom: 15px;
    font-weight: 300;
    color: #DBB165;
}

.news-text {
    line-height: 24px;
    padding-top: 15px;
    padding-bottom: 15px;
    font-weight: 300;
    color: #fff;
    text-decoration: none;
}

.news-ul li a {
    text-decoration: none !important;
}

.news-ul li:hover .news-text {
    text-decoration: underline;
}

.news-ul {
    padding-left: 0;
}

    .news-ul li {
        margin-left: 4px;
        margin-right: 4px;
        margin-top: 4px;
        border-radius: 0px;
        border-bottom: solid 2px rgba(255,255,255,0.5);
        transition: border 0.5s ease-out,transform 0.5s ease-out;
    }

        .news-ul li:hover {
            transform: translateY(-3px);
            background-color: rgba(255,255,255,0.2);
            border-radius: 8px;
        }

.btn-redesign {
    background-color: #9F8047;
    color: #fff;
    border-radius: 99em;
    padding-left: 18px;
    padding-right: 18px;
    font-size: 14px;
}

    .btn-redesign .icon-hover,
    .swiper-button-prev .icon-hover,
    .swiper-button-prev2 .icon-hover,
    .swiper-button-next .icon-hover,
    .swiper-button-next2 .icon-hover {
        display: none;
    }

    .btn-redesign:hover .icon-default,
    .swiper-button-prev:hover .icon-default,
    .swiper-button-prev2:hover .icon-default,
    .swiper-button-next:hover .icon-default,
    .swiper-button-next2:hover .icon-default {
        display: none;
    }

    .btn-redesign:hover .icon-hover,
    .swiper-button-prev:hover .icon-hover,
    .swiper-button-prev2:hover .icon-hover,
    .swiper-button-next:hover .icon-hover,
    .swiper-button-next2:hover .icon-hover{
        display: inline;
    }

.re-title.yellow {
    color: #DBB165;
}



.map-obj2 {
    width: 100%;
    display: flex;
    border-radius: 12px;
    overflow: hidden;
    transition: background-color 0.5s ease-out,transform 0.5s ease-out;
    
    text-decoration: none;
    padding: 4px;
    background-color: transparent;
    border: solid 2px transparent;
}
    .map-obj2 .map-obj2-img, map-obj2 .map-text {
        box-shadow: 3px 2px 2px 2px rgba(0, 0, 0, 0.2);
    }

.map-obj2 h4 {
    margin-top: 8px;
    margin-bottom: 2px;
    font-size: 1rem;
    height: 50px;
    color: #200b02;
}


.map-obj2-img {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    overflow: hidden;
    aspect-ratio: 3 / 2;
    width: 100%;
    padding: 0;
}

    .map-obj2-img img {
        width: 100%;
        height: 100%;
        object-fit: cover
    }

.map-obj2:hover .map-text {
    background-color: #DBB165;
}

.map-obj2:hover {
    border: solid 2px #DBB165;
    transform: scale(1.05)
}

.map-text {
    background-color: #E6E6E6;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    transition: background-color 0.8s linear;
}

.gx-lg-5rem,.gx-cust-gallery {
    --bs-gutter-x: 5rem;
}

.map-obj {
    width: 100%;
    display: flex;
    border-radius: 12px;
    padding: 8px;
    overflow: hidden;
    background-color: #E6E6E6;
    transition: background-color 0.5s ease-out,transform 0.5s ease-out;
    box-shadow: 3px 2px 2px 2px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

.map-obj.active {
    background-color: #DBB165;
}

    .map-obj:hover {
        background-color: #DBB165;
        transform: scale(1.1)
    }

        .map-obj:hover div, .map-obj:hover h4 {
            color: #333;
            font-weight: 400;
        }

    .map-obj .img {
        width: 150px;
        height: 100px;
        border-radius: 2px;
        overflow: hidden
    }

        .map-obj .img img {
            width: 150px;
            height: 100%;
            object-fit: cover;
        }


    .map-obj h4 {
        margin-bottom: 2px;
        font-size: 1rem;
        color: #200b02;
        font-weight: 400
    }

    .map-obj div {
        font-size: 0.875rem;
        color: #200b02;
        line-height: 13px;
    }
.map-objIntro img {
   width:100%;
   height:100%;
   object-fit:cover;
   margin:0px;
}
.map-objIntro .col-auto {
    width: 150px;
    height: 100px;
    object-fit: cover;
    padding:0px;
    border:solid 1px #eee
}
.map-objIntro p {
    font-size: 0.875rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.home-world {
    position: relative;
    border-bottom: solid 2px rgba(255,255,255,0.5);
    /*border-radius: 8px;*/
    border-radius: 0px;
    padding: 16px;
    margin-top: 20px;
    margin-bottom: 20px;
    transition: border 0.5s ease-out,transform 0.5s ease-out;
}

    .home-world:hover {
        transform: translateY(-10px);
        background-color: rgba(255,255,255,0.2);
        border-radius: 8px;
    }

    .home-world a {
        text-decoration: none !important;
    }

    .home-world * {
        color: white;
    }

    .home-world .text-p, .home-world .area-name {
        font-weight: 300;
        font-size: 15px;
        padding-top: 8px;
    }

    .home-world .text-p {
        padding-bottom: 8px;
    }

    .home-world .col-auto {
        max-width: 45%;
    }

    .home-world .area-name {
        border-radius: 4px;
        background-color: #9F8047;
        color: #fff;
        display: inline-block;
        padding: 4px 8px;
        font-size: 0.875rem;
    }

.btn-redesign.transparent {
    background-color: transparent;
    color: #fff;
}

    .btn-redesign.transparent:hover {
        color: #333;
        background-color: #fff;
    }

.btn-redesign.black {
    background-color: transparent;
    color: #4D4D4D;
    border: solid 1px #4D4D4D;
}

@media screen and (min-width:1200px) {
    
    .modal-dialog.w-cust {
        max-width: 800px;
    }
}
/*.modal-header ,.modal-footer{
    background-color: #333;
    color:#fff;
}}*/

.modal-content {
    background-color: #61594a;
    border-radius: 1.25rem; /* 更大的圓角 */
    padding: 1.25rem 2rem; /* 增加內邊距 */
    color: white;
}

.modal-head {
    background-color: #DBB165;
    padding: 1.5rem;
    border-radius: 0.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.btn-close {
    filter: invert(100%);
    opacity: 0.7
}

.home-taiwanMap {
    padding-top: 100px;
    padding-bottom: 80px;
}

.home-taiwanMap-bg {
    background-color: #222;
    min-height: 1170px;
}

.home-worldMap {
    padding-top: 50px;
    padding-bottom: 50px;
}

.homeMapBg {
    opacity: 0.5;
    z-index: 0;
    position: absolute;
    height: 100%;
    width: 100%;
}

.homeMapBg2, .homeMapBg2 svg {
    z-index: 0;
    position: absolute;
    min-height: 1170px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
}

    .homeMapBg2 svg {
        width: 100%;
        height: 100%;
    }

        .homeMapBg2 svg path {
            vector-effect: non-scaling-stroke;
            stroke-width: 1;
            fill: none;
        }


.swiper {
    width: 100%;
    height: 100%;
}

.swiper_body {
    position: relative;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #333;
    margin: 0;
    padding: 0;

}


.fullSwiper {
    height: 100vh;
    width: 100%
}

.mySwiper .swiper-slide {
    transition: transform 0.3s ease-out;
    padding-top: 20px;
}

    .mySwiper .swiper-slide:hover {
        transform: scale(1.1);
    }

.mySwiper2 .swiper-slide {
    transition: background-color 0.8s ease-out;
}

    .mySwiper2 .swiper-slide:hover {
        background-color: rgba(255,255,255,0.8)
    }

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background-color: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .swiper-slide .videos, .swiper-slide .videos iframe {
        width: 100%;
        height: 100%;
        aspect-ratio: 16 / 10
    }

.home-video-bg {
    background-color: #333;
}

.home-video-bgImg {
    position: absolute;
    width: 100%;
    height: 100%;
}

.home-video {
    padding-top: 100px;
    padding-bottom: 100px;
}

    .home-video .videos {
        border-radius: 8px;
        overflow: hidden;
    }

.swiper-button-prev:hover, 
.swiper-button-prev2:hover, 
.swiper-button-next:hover, 
.swiper-button-next2:hover {
    background-color: #DBB165;
}

.swiper-btn .swiper-button-next,
.swiper-btn .swiper-button-next2,
.swiper-btn .swiper-button-prev,
.swiper-btn .swiper-button-prev2 {
    position: relative;
    left: 0;
    right: 0;
    display: inline-block;
    padding: 0
}

.swiper-button-next,
.swiper-button-next2,
.swiper-button-prev,
.swiper-button-prev2 {
    background-color: white;
    width: 42px;
    height: 42px;
    margin-right:6px;
    margin-left: 6px;
    border-radius: 99em;
    border: 0;
}

    .swiper-button-next::after,
    .swiper-button-next2::after,
    .swiper-button-prev::after,
    .swiper-button-prev2::after{
        display: none;
    }

.swiper-btn .swiper-pagination,
.swiper-btn .swiper-pagination2 {
    bottom: -20px !important;
}

.mySwiper3 .swiper-slide, .mySwiper5 .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #444;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.mySwiper5 .swiper-slide {
    border: solid 1px #fff;
}
    @media screen and (min-width:992px) {
        .mySwiper3 .swiper-slide, .mySwiper5 .swiper-slide {
        height: auto;
    }
        .taiwanNon-banner.mySwiper3 .swiper-slide{
            height:auto;
        }
}

.mySwiper3 .swiper-button-next img, .mySwiper3 .swiper-button-prev img, .mySwiper5 .swiper-button-next img, .mySwiper5 .swiper-button-prev img, {
    width: 35px;
    height: 35px;
}

.mySwiper3 a, .mySwiper5 a {
    width: 100%;
}

.mySwiper3 .swiper-slide img, .mySwiper5 .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-card {
    width: 310px;
    padding: 16px;
    display: inline-block;
    transition: transform 0.3s ease-out;
}

    .home-card:hover {
        transform: scale(1.05)
    }

.card-text, .card-img {
    display: inline-block
}

.card-img {
    width: 235px;
    height: 320px;
    overflow: hidden;
}

    .card-img img {
        width: 100%;
        height: 100%;
/*        object-fit: cover;*/
    }

.card-text {
    width: 100%;
    background-color: #555;
    padding: 20px;
    height: 130px;
}

    .card-text h4 {
        font-size: 1.125rem;
        color: #DBB165;
        font-weight:400;
    }

    .card-text div {
        font-size: 0.9375rem;
        font-weight: 300;
        color: white;
    }

.mySwiper2 .swiper-slide {
    border: solid 2px rgba(255,255,255,0.3);
    padding-top: 16px;
    padding-bottom: 16px;
    margin-bottom: 5px;
}

.mySwiper2 a div {
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .mySwiper2 a div img {
        height: 80%;
        width: 60%;
        object-fit: contain;
    }

footer.footer {
    padding-top: 32px;
    padding-bottom: 32px;
    background-color: #333;
    border-top: solid 3px #DBB165;
}

    footer.footer .col-8 {
        color: #fff;
        font-size: 14px;
        font-weight: 300;
        line-height: 26px;
    }

.home-intro.lang-other {
    padding-top: 50px;
    padding-bottom: 50px;
}

    .home-intro.lang-other .bg1 {
        border-radius: 16px;
    }

.lang-dropdown:hover {
    background-color: #fff;
    color: #9F8047
}

.lang-dropdown::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #FFDC46;
    transition: width 0.5s ease-out
}

.lang-dropdown {
    border-bottom: solid 2px #eee;
}

    .lang-dropdown:hover::after {
        width: 100%;
    }

.dropdown-menu.drop_lang {
    text-align: center;
    min-width: 6rem;
}

.card-num {
    position: absolute;
    font-size: 24px;
    z-index: 9;
    left: -16px;
    color: #DBB165;
    top: 38%;
    transform: translateY(-50%);
}


.card-border {
    padding: 20px;
    margin: auto;
    display: grid;
    place-content: center;
    text-align: center;
    font-size: 1.5em;
    --border-size: 1px;
    border: var(--border-size) solid transparent;
    /* Paint an image in the border */
    border-image: conic-gradient( from var(--angle), #fff 0deg 270deg, transparent 270deg 300deg, #fff 300deg 360deg ) 1 stretch;
}

@property --opacity {
    syntax: "<number>";
    initial-value: 0.5;
    inherits: false;
}

@property --angle {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}

@keyframes opacityChange {
    to {
        --opacity: 1;
    }
}

@keyframes rotate {
    to {
        --angle: 360deg;
    }
}

.block-padding {
    padding-top: 100px;
    padding-bottom: 90px;
}

.page-padding {
    padding-top: 50px;
    padding-bottom: 50px;
}

.acesskey-pos {
    position: absolute;
    height: auto;
    width: auto;
    left: -28px;
    padding: 4px 8px;
}

.card-text h4 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.card-text div {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.zh_tw, .en_us, .ja_jp {
    display: none;
}

.page-content-bg {
    background-image: url(../images/redesignImg/home-bg2.png);
    background-size: cover;
    background-repeat: repeat;
    background-color: #333;
}

.btn-theme {
    border-radius: 99em;
    background-color: #DBB165;
    color: #211e09;
    padding-top: 8px;
    padding-bottom: 8px;
}

    .btn-theme:focus, .btn-theme:hover {
        border-radius: 99em;
        background-color: #fff;
        color: #C9092A;
    }

.breadCrumbs {
    color: #DBB165;
    font-size: 0.75rem;
}

.form-control.form-redsign, .form-select.form-redsign {
    border-radius: 99em;
}

.btn-search {
    position: absolute;
    bottom: 0;
    right: 16px;
}

.search-frame {
    border: solid 2px rgba(255,255,255,0.2);
    border-radius: 8px;
    padding: 48px 32px 32px;
}

.collapse-arrow {
    border-radius: 99em;
    margin-top: 2px;
    margin-right: 4px;
    width: 18px;
    height: 18px;
    background-color: #DBB165;
    display: flex;
    justify-content: center;
    align-items: center;
}

.accordion-button.collapsed .collapse-arrow img {
    width: 12px;
    height: 12px;
    transform: rotate(0);
    transition: transform 0.3s ease-out;
}

.accordion-button .collapse-arrow img {
    width: 12px;
    height: 12px;
    transform: rotate(90deg)
}

.accordion-body {
    background-color: #595959;
    color: #fff;
    border-radius: 12px;
}

.text-keywords {
    color: #00B0F0;
    margin-bottom: 2px;
    margin-top: 2px;
    font-weight: 300;
}

.col-auto.col-20 {
    width: 20%;
}

.accordion-item {
    background-color: transparent !important;
    border: none !important;
}

.accordion-button,
.accordion-button:not(.collapsed),
.accordion-button:focus {
    background-color: transparent !important;
    box-shadow: none !important;
    color: #fff;
    padding-right: 0;
    padding-left: 0
}

    .accordion-button:after {
        display: none;
    }

.w-80 {
    width: 80%
}

.pagination {
    display: inline-flex;
    border-radius: 99em;
    overflow: hidden;
    background-color: rgba(255,255,255,0.3);
    padding: 4px 8px;
    border: solid 1px rgba(255,255,255,0.7);
}

.page-link {
    border: 0px;
    color: #fff;
    background-color: transparent;
    border-radius: 99em !important;
    width: 36px;
    height: 36px;
    margin-left: 2px !important;
    margin-right: 2px;
    box-sizing: border-box;
}

.aspNetDisabled.page-link.num {
    background-color: #9F8047;
}

    .aspNetDisabled.page-link.num:hover {
        color: white !important;
    }

.page-link:hover:not(.disabled,.aspNetDisabled.page-link.num) {
    background-color: #FFE6AC !important;
    color: #111;
}

.page-link.prev, .page-link.next {
    color: #DBB165;
}

    .page-link.prev.disabled span, .page-link.next.disabled span {
        color: rgba(255,255,255,0.3)
    }

    .page-link.prev.disabled:hover, .page-link.next.disabled:hover {
        background-color: transparent;
    }

.text-center {
    text-align: center
}

.memory_intro {
    padding: 12px;
    background-color: #8d8d8d4a;
    padding: 48px 32px 32px;
    border-radius: 12px;
    color: white;
    font-weight: 400;
}

.memory-img {
    display: block;
    text-align: right;
    top: 24px;
    z-index: 2
}

    .memory-img img {
        width: 100%;
        border-radius: 12px;
    }

.wm-nation-bg {
    background-color: #8d8d8d4a;
    padding: 60px 70px;
    border-radius: 12px;
    width: 80%;
    margin-top: 90px;
    
    overflow:auto;
}

.nation-img {
    position: absolute;
    right: 20px;
    top: calc(50% + 45px);
    transform:translateY(calc(-50%));
    width: 350px !important;
    height:500px;
    object-fit: contain;
}
    .nation-img img{
        object-fit:contain;
    }
    .notion-text {
        overflow: auto;
        height: 400px;
        padding-right: 16px;
    }

.wm-nation-bg img {
    width: 100%;
}

.national-content {
    width: 90%;
}

.world-swuper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 5
}

.word-swiper-book img {
    width: 250px;
    object-fit: contain;
    bottom: 80px;
    left: 50px;
}

.mySwiper4.wm-nation .swiper-slide {
    width: 80% !important
}

@media screen and (min-width: 1500px) {
    .word-swiper-book img {
        transform: scale(1.2);
        left: 90px;
    }

    .mySwiper4.wm-nation .swiper-slide {
        width: 70% !important
    }
}

.dropdown-menu.nav-none {
    display: none;
}

    .dropdown-menu.nav-none.show {
        display: block
    }

.mobile-nav .nav-link, .mobile-nav .dropdown-item {
    color: #9F8047 !important;
    justify-content: flex-start;
}

.mobile-nav .navbar-nav {
    background-color: #F1F1F1;
    padding: 16px;
}

.mobile-nav .nav-item {
    border-bottom: solid 1px #C9C9C9;
}

.mobile-nav .navbar-collapse .navbar-nav {
    padding-left: 16px;
    padding-right: 16px;
}

.mobile-nav .nav-link {
    padding-top: 12px;
    padding-bottom: 12px;
}

.nav-md-siteMap {
    border: solid 1px #C9C9C9;
}

    .nav-md-siteMap .col-6:first-child {
        border-right: solid 1px #C9C9C9;
    }

    .nav-md-siteMap img {
        filter: invert(55%) sepia(14%) saturate(1487%) hue-rotate(0deg) brightness(91%) contrast(81%);
    }

    .nav-md-siteMap .col {
        padding-left: 4px;
        color: #9F8047;
    }

    .nav-md-siteMap a {
        text-decoration: none;
    }

.card-width {
    width: 100% !important;
}

@media screen and (min-width:576px) {
    .card-width {
        width: 50% !important;
    }
}

@media screen and (min-width:992px) {
   
    .container.container-swiper {
        max-width: 100%;
        padding: 0;
    }

    .card-width {
        width: 33.33333% !important;
    }
}

.siteMap-btn a {
    border-radius: 4px;
    background-color: #867c6c;
    padding: 8px;
    display: block;
    
    color: #fff;
}

.siteMap-btn {
    padding: 4px;
}

.homeMap-btn {
    border-radius: 99em;
    background-color: #fff;
    padding: 2px 18px;
    display: inline-block;
}

    .homeMap-btn.active {
        background-color: #DBB165;
    }

.flex-warp {
    flex-wrap: wrap;
}

.animate-me {
    perspective: 500px;
}

.opa0 {
    opacity: 0;
}

.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #fff6cc;
    position: absolute;
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    box-shadow: 0 0 8px 4px rgba(255, 246, 204, 0.8); /* 外光暈效果 */
}

/*.related_bg {
    background-color: #222;
    background-image: url(../taiwan/images/redesignImg/Related_bg.png);
    background-size: cover;
    background-repeat: repeat;
}*/
.related_bg {
    background-color: #222;
    background-image: url(../taiwan/images/redesignImg/Related_bg.png);
    background-size: cover;
}
.video-bg {
    position: absolute;
    bottom: 0;
    width: 100%;
    height:100%;
}
.video-cover {
    /* background: linear-gradient( to top, rgba(34,34,34,0.3) 0%, rgba(34,34,34,0.2) 17%,rgba(34,34,34,0.9) 37%, rgba(34,34,34,0.9) 66%, rgba(34,34,34,0) 83%,rgba(34,34,34,0.24) 91%, rgba(34,34,34,0.9) 100% );*/
    background: linear-gradient(to top, rgba(34, 34, 34, 0.3) 0%, rgba(34, 34, 34, 0.2) 17%, rgba(34, 34, 34, 0.9) 37%, rgba(34, 34, 34, 0.9) 66%, rgb(57 79 93 / 60%) 83%, rgb(5 77 114 / 87%) 91%, rgb(54 54 54 / 96%) 100% 100%);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.video {
    position:sticky;
    height: 100vh;
    object-fit: cover;
    width: 100%;
    max-width: 100%;
    top:0;
    z-index: 0;
}
.links_bg {
    background-color: #333;
    width: 100%;
    overflow: hidden;
}

.link-bg1 {
    position: absolute;
    top: 0;
    left: 0;
}

.link-bg2 {
    position: absolute;
    bottom: 0;
    right: 0;
    transform: rotate(-180deg)
}

.mobile-nav li.nav-item {
    padding: 0px;
}

    .mobile-nav li.nav-item a {
        font-weight: 500;
    }

    .mobile-nav li.nav-item:hover {
        background-color: inherit
    }

.pos-num {
    font-size: 3rem;
    font-weight: 900;
    letter-spacing:4px;
    color: #DBB165;
}

.pos-name {
    font-size: 1.25rem;
    color: white;
    letter-spacing: 0.08em;
}

.world-card {
    border-radius: 24px;
    background-color: #555;
    margin-top: 12px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
    padding: 8px;
    height: 140px;
}

.pos-name.non-material-text {
    top: 0%
}

.w-90px {
    width: 100px;
}

.nav-world-tabs {
    padding-left: 0;
    background-color: #eed387;
}

    .nav-world-tabs li {
        list-style-type: none;
        padding: 0;
    }

        .nav-world-tabs li a, .nav-world-tabs li div.active {
            border-bottom: solid 4px #C8C8C8;
            height: 100%;
            display: flex;
            justify-content: center;
            flex-flow: column
        }

            .nav-world-tabs li a div, .nav-world-tabs li a.active div {
                letter-spacing: 2px;
                color: #5e4920;
                font-weight: 400;
            }

            .nav-world-tabs li a.active div, .nav-world-tabs li div.active div {
                color: #942346;
            }

            .nav-world-tabs li a.active, .nav-world-tabs li div.active {
                border-bottom: solid 5px #962929;
            }

        .nav-world-tabs li a, .nav-world-tabs li div.active {
            color: #FFFFFF;
            text-align: center;
        }

            .nav-world-tabs li a.active, .nav-world-tabs li div.active {
                color: #962929
            }

            .nav-world-tabs li a:hover,.nav-world-tabs li div:hover {
                color: #FFE6AC;
            }

.nav-content {
    background-color: #fff;
    border-radius: 16px;
    margin-left: 32px;
    height: 100%;
    overflow: hidden;
}

.map-frame {
    margin-top: 12px;
    border-radius: 12px;
    overflow: hidden;
}

.search-list {
    display: flex;
    align-items: center;
    border-bottom: solid 1px #C8C8C8;
    padding: 0;
    padding-top: 16px;
    padding-bottom: 16px;
    margin-left: -12px;
    margin-right: -12px;
}

    .search-list .col-auto.w-90px {
        letter-spacing: 2px;
    }

    .search-list:last-child {
        border: 0px;
    }

.btn-white {
    border-radius: 99em;
    background-color: white;
    letter-spacing: 2px;
}

.search-list .btn.btn-white.selected {
    background-color: #DBB165;
}

.mx-nationalSwiper-cust {
    max-width: 1500px;
}

.btn-anim {
    padding: 4px 6px 4px 16px;
}

.btn-frame {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-direction: row-reverse;
}

.btn-svg {
    display: inline-block;
    background-color: #fff;
    border: solid 1px #fff;
    border-radius: 99em;
    padding: 8px;
    z-index: 0;
    transition: padding-left 0.5s ease-out,margin-left 0.5s ease-out;
}

.btn-redesign:hover .btn-svg {
    padding-left: 92px;
    margin-left: -92px;
    background-color: #fff;
}

.btn-anim.search.btn-redesign:hover .btn-svg {
    padding-left: 86px;
    margin-left: -86px;
}

.btn-frame {
    padding: 0px;
    z-index: 0;
}

.btn-anim-text {
    color: white;
    font-weight: 400;
    min-width: 64px;
    letter-spacing: 1px;
}

.btn-anim.search .btn-anim-text {
    letter-spacing: 4px;
}

.btn-redesign:hover .btn-anim-text {
    color: #333;
}

.news-pageList {
    padding-left: 0;
}

    .news-pageList li a {
        align-items: center;
        display: flex;
        padding-top: 8px;
        padding-bottom: 8px;
        border-radius: 0px;
        border-bottom: solid 2px rgba(255,255,255,0.5);
        transition: border 0.5s ease-out,transform 0.5s ease-out;
        text-decoration: none;
    }

    .news-pageList .news-pageDate {
        color: white;
        background-color: #9F8047;
        padding: 4px 12px;
        border-radius: 6px;
    }

    .news-pageList li a:hover {
        transform: translateY(-3px);
        background-color: rgba(255,255,255,0.2);
        border-radius: 8px;
    }

.page-newsDeatil {
    padding: 2rem;
    border-radius: 24px;
    background-color: #61594a;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.page-newsTitle {
    font-size: 1.45rem;
    color: white;
}

.btn-pagebtn {
    color: white;
    border-radius: 99em;
    padding: 6px 18px;
    border: solid 1px #fff;
    display: flex;
    gap: 16px;
    transition: background-color 0.5s ease-out;
}

    .btn-pagebtn:hover {
        background-color: #9F8047;
        color: #fff;
    }

    .btn-pagebtn.bg-darken {
        background-color: #9F8047;
        color: white;
        border-radius: 99em;
        padding: 6px 18px;
        border: solid 1px #fff;
        display: flex;
        gap: 16px;
        transition: background-color 0.5s ease-out;
    }

        .btn-pagebtn.bg-darken:hover {
            background-color: white;
            color: #9F8047;
            border: solid 1px #9F8047;
        }

.videos-list {
    margin-top: 12px;
    margin-bottom: 16px;
    background-color: #fff;
    padding: 12px;
}

    .videos-list iframe {
        width: 100%;
        aspect-ratio: 16 / 9;
    }

.publications-card {
}

    .publications-card .public-img {
        aspect-ratio: 37 /39;
        border: solid 2px rgba(255,255,255,0.5);
        display: flex;
        justify-content: center
    }

        .publications-card .public-img img {
            width: 100%;
            height: 100%;
            object-fit: contain
        }

.videos-row {
    margin-left: -20px;
    margin-right: -20px;
}

    .videos-row .col-lg-4 {
        padding-left: 20px;
        padding-right: 20px;
    }

.links {
    border: solid 1px rgba(255,255,255,0.5);
    margin-left: -1px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .links a img {
        width: 100%;
        height: 80px;
        object-fit: contain
    }

.nav-link-title {
    font-size: 1.125rem;
}

.area-name {
    display: inline-block;
    color: white;
    letter-spacing: 2px;
    font-weight: 400;
}

.northAmerica-pos {
    position: absolute;
    top: -80px;
}

.latinAmerica-pos {
    position: absolute;
    top: -80px;
    left: -60px
}

.area-card svg {
    pointer-events: none;
}

.area-national {
    position: absolute;
    display: inline-block;
    background-color: #fff;
    left: 152px;
    top: -8px;
    width: 208px;
    padding: 12px 16px;
    height: auto;
    transition: border-radius 0.8s,padding 0.3s,top 0.5s ease;
    text-decoration: none;
    color: #61594a;
    border-radius: 4px;
    box-shadow: 0px 0px 0px 5px rgba(0,0,0,0.2);
    overflow: hidden;
}

    .area-national:hover {
        color: #61594a;
        z-index:99;
    }

.national-title {
    font-weight: 400;
    letter-spacing: 2px;
}

.area-national:hover .national-title {
    font-weight: 400;
}

.latinAmerica-pos .area-national {
    left: -190px;
    top: 25px;
}

    .latinAmerica-pos .area-national:hover {
        left: -190px;
        top: -40px;
    }

.africa-pos .area-national {
    left: -80px;
    top: 50px;
}

    .africa-pos .area-national:hover {
        left: -80px;
        top: 50px;
    }

.arab-pos .area-national {
    position: absolute;
    top: 20px;
}

    .arab-pos .area-national:hover {
        position: absolute;
        top: 20px;
    }

.area-national .col {
    font-weight: 400;
}

.area-national:hover {
    top: -70px;
    border-radius: 8px;
    padding-top: 24px;
    padding-bottom: 16px;
    /*border: solid 2px #e4a020;*/
    box-shadow: 0px 0px 5px rgba(0,0,0,0.5)
}

.area-national::before {
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    height: 4px;
    background-color: #D6001D;
    transition: width 0.5s ease;
}

.area-national::after {
    content: "";
    width: 0%;
    position: absolute;
    left: 12px;
    top: 14px;
    height: 5px;
    background-color: #D6001D;
    border-radius: 99em;
    transition: width 0.5s ease;
}

.latinAmerica-pos .area-national::before {
    background-color: #2E6BA4;
}

.latinAmerica-pos .area-national::after {
    background-color: #2E6BA4;
}

.africa-pos .area-national::before {
    background-color: #BFA65B;
}

.africa-pos .area-national::after {
    background-color: #BFA65B;
}

.arab-pos .area-national::before {
    background-color: #159190;
}

.arab-pos .area-national::after {
    background-color: #159190;
}

.europe-dot .area-national::before {
    background-color: #eaba1f;
}

.europe-dot .area-national::after {
    background-color: #eaba1f;
}

.asia-dot .area-national::before {
    background-color: #433a9f;
}

.asia-dot .area-national::after {
    background-color: #433a9f;
}

.area-national:hover::before {
    width: 0%;
}

.africa-pos .area-national::after {
    background-color: #BFA65B;
}

.area-national:hover::before {
    width: 0%;
}
/* 頁面預設狀態（未 hover）時有延遲 */
.area-national:not(:hover)::after {
    transition-delay: 0;
}

/* hover 時，立刻執行動畫 */
.area-national:hover::after {
    width: 28px;
    transition-delay: 0.8s;
}

.area-national:hover .national-content-card {
    max-height: 200px;
}

.national-content-card {
    max-height: 0;
    overflow: hidden;
    transition: max-height 1.2s ease;
}

    .national-content-card hr, .area-mobile-national hr {
        margin-top: 4px;
        margin-bottom: 8px;
    }

    .national-content-card * {
        font-size: 0.875rem;
    }

    .national-content-card .col-auto {
        width: 85px;
        padding-top: 4px;
        padding-bottom: 4px;
    }

        .national-content-card .col-auto svg {
            margin-right: 4px;
        }

    .national-content-card .col-auto, .national-content-card .col {
        padding: 4px 0px;
    }

.north-America-dot {
    position: absolute;
    left: 18%;
    top: 30%;
}

.europe-dot {
    position: absolute;
    left: 50%;
    top: 30%;
}

.asia-dot {
    position: absolute;
    left: 68%;
    top: 42%;
}

.arab-dot {
    position: absolute;
    left: 56%;
    top: 45%;
}

.africa-dot {
    position: absolute;
    left: 53%;
    top: 55%;
}

.latinAmerica-dot {
    position: absolute;
    left: 25%;
    top: 70%;
}

.re-world-title {
    padding-left: 16px;
}

    .re-world-title::before {
        position: absolute;
        left: 0;
        content: "";
        width: 4px;
        height: 100%;
        background-color: #DBB165;
    }

.re-world-map iframe {
    height: 300px;
    border-radius: 8px;
    overflow: hidden;
}
.re-world-maptext, .re-taiwan-maptext {
    margin-top: 12px;
}
    .re-world-maptext .col-auto, .re-taiwan-maptext .col-auto {
        width: 120px;
        color: #a6dbff;
        letter-spacing: 2px;
        display: flex;
        justify-content: space-between;
    }
        .re-taiwan-maptext .col-auto.ja_jp, .re-taiwan-maptext .col-auto.en_us, .re-taiwan-maptext .col-auto.zh_tw{
            display:none;
        }
        .re-taiwan-maptext .col-auto {
            width: 150px;
        }
    .re-world-maptext .col, .re-taiwan-maptext .col {
        color: #fff;
        letter-spacing: 2px;
    }

#Criteria .row {
    margin-top: 8px;
    margin-bottom: 8px;
}

#Criteria .col-auto {
    width: 110px;
    display: flex;
    justify-content: space-between;
}

.tab-content #Overview, .tab-content #Symbol, .tab-content #Criteria {
    max-height: 500px;
    overflow: auto;
}

.poa {
    position: absolute;
}

.bg-transparent {
    background-color: transparent !important;
}

.nav-world-tabs.bg-transparent li a div {
    color: white;
}

.nav-world-tabs.bg-transparent li .active div {
    color: #DBB165;
}

.taiwan-nationl-img {
    width: 100px;
    height: 100px;
    border: solid 1px #DBB165;
    padding: 2px;
}

    .taiwan-nationl-img img {
        object-fit: contain;
        width: 100%;
        height: 100%;
    }

.wm-fb {
    text-align: right;
}

    .wm-fb span {
        display: inline-block;
    }

.world-img-book {
    max-height: 340px;
}

    .world-img-book img {
        width: 100%;
        height: 100%;
    }

h1 {
    margin-top: 8px;
    margin-bottom: 0px
}



.navbar-toggler {
    margin-right: 8px;
}
.ad-gallery{
    width:100%!important;
}
.mySwiper .swiper-slide {
    margin-bottom: 20px
}
.ad-gallery .ad-nav .ad-thumbs{
    width:calc(100% - 32px)!important;
}


.swiper-container {


    width: 100%;
    height: 300px;
    margin: 20px auto;
}

.swiper-slide-container {
    text-align: center;
    font-size: 18px;
    background: #fff;
    height: 100%;
    max-width: 600px;
    margin: auto;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.gallery-top {
    margin-left: 0px;
    margin-right: 0px;
    width: 50%;
    z-index:3;
    display:inline-block;
}

.gallery-thumbs {
   position:absolute;
   height:auto;
   bottom:0;
   right:0;
    box-sizing: border-box;
    
    width:72.2%;
}

    .gallery-thumbs .swiper-slide {
        width: 20%;
        height: 100%;
        opacity: 0.8;
    }

    .gallery-thumbs .swiper-slide {
        transition: opacity 0.5s ease-out;
    }

    .gallery-thumbs .swiper-slide-active{
       opacity:0;
    }
    .gallery-thumbs{
        opacity:1;
    }
    .videos-card {
        border-radius: 8px;
        overflow: hidden;
        background-color: rgba(255,255,255,0.3);
        width: 100%;
        padding: 12px;
    }
.text-red {
    color: #fff
}
.video-content{
    height:40px;
}
.videos-card .videos{
    border-radius:0px;
}
.videos-line{
    height:1px;
    background-color:rgba(255,255,255,0.3);
    width:100%
}
#swiper-button-prev, #swiper-button-next {
    top:0%;
}
.text-yellow2 {
    color: #ffb633;
}
.w-150p{
    width:150px;
}
.mySwiper6 {
    aspect-ratio: 3 / 2;
    width:100%;
    border:solid 5px rgba(255 ,255 ,255,0.5);
    border-radius:8px;
}
.mySwiper6 a{
    height:100%;
}
    .mySwiper6 .swiper-slide img{
        object-fit:cover;

    }
.mySwiper5 {
    margin-top:12px;
    aspect-ratio: 5 / 1;
    border: solid 5px rgba(255,255,255,0.5);
    border-radius: 8px;
}
.title-rwd {
    text-align: left;
}
.search-frame .w-cust{
    width:80%;
}

/* 整個 scrollbar */
.tab-content::-webkit-scrollbar {
    width: 8px; /* 捲動條寬度 */
}

/* 滑塊軌道 (背景透明) */
.tab-content::-webkit-scrollbar-track {
    background: transparent;
}

/* 滑塊本體 */
.tab-content::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.5); /* 半透明灰色 */
    border-radius: 3px; /* 圓角 */
}

    /* 滑塊 hover 效果 */
    .tab-content::-webkit-scrollbar-thumb:hover {
        background-color: rgba(255, 255, 255, 0.7);
    }
.privacy-href {
    color: white;
    text-decoration: none;
}

    .privacy-href:hover {
        color: #0098FF;
    }

.arrowUp {
    display: inline-block;
    position: fixed;
    z-index: 999;
    bottom: -50px;
    right: 16px;
    border-radius: 99em;
    box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
    width: 40px;
    height: 40px;
    transition: bottom 0.8s ease-in
}
    .arrowUp.active{
    
    bottom: 24px;
    }
    .arrowUp img {
        width: 100%;
        height: 100%;
    }
.bg-summary {
    background-color: #fff;
    border-radius: 16px;
    overflow: hidden;
  
}
.map-summaryTitle {
    background-color: #eed387;
    padding: 12px 16px;
    border-bottom: solid 4px #C8C8C8;
    color: #5e4920;
    letter-spacing: 2px;
    font-size: 1.2rem;
    font-weight: 400;
    text-align: center;
}
.map-summarySubTitle {
    font-size: 1.12rem;
    letter-spacing: 2px;
    font-weight: 400;
    color: #942346
}
.map-summaryP{
    color:#333;
}
.h-introMap{
    height:300px;
    overflow:hidden;
}
.btn-more {
    color: #5e4920;
}
@media screen and (max-width:768px) {
    .gx-cust-gallery {
        --bs-gutter-x: 2rem
    }
    .map-summaryTitle {
        font-size: 1rem;
    }
    .privacy-href {
        font-size: 0.875rem;
    }
    .videos-row .col-lg-4{
        padding-left:6px;
        padding-right:6px;
    }
        .videos-row .col-lg-4 .re-subheading{
            font-size:1rem
        }
    .videos-list {
        padding: 6px;
        min-height:160px; 
    }
    .nav-content-mb .card-header {
        background-color: #eed387;
        color: #5e4920;
        font-weight: 400;
        text-decoration: none;
    }
        .nav-content-mb .card-header:focus {
            color: #942346;
        }
        .wm-nation-bg {
            width: 100%;
            padding: 28px;
        }
        .wm-nation-bg .national-content{
            width:100%
        }
        .pos-name.non-material-text {
            min-width: 120px;
        }
    .search-list {
        margin-left: 0;
        margin-right: 0;
    }
    .re-subtitle {
        font-size: 0.875rem;
    }

    h1 img {
        height: 50px;
        margin-left: 8px;
    }

    .banner-redesign {
        height: auto;
        /* border:solid 1px #fff;*/
    }

        .banner-redesign .mySwiper3 a {
            height: 100%;
        }

    .home-intro {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .home-taiwanMap {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .home-taiwanMap-bg {
        height: auto;
    }

    .gap-3 {
        gap: 0.5rem !important;
    }
    
    .image-sites {
        --bs-gutter-x: 1rem;
        margin-left: 0;
        margin-right: 0;
        height: 450px;
        overflow: hidden;
        /* 建立透明漸層遮罩 */
        -webkit-mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-repeat: no-repeat;
        mask-size: cover;
    }
    .map-obj{
        display:block;
    }
    .image-grid-mb:not(.active) {
        display: none;
    }
        .map-obj .img {
            width: 100%;
            aspect-ratio: 3 / 2;
        }
        .map-obj h4 {
            margin-top:4px;
            font-size:15px;
            height: 40px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        .gallery-top, .gallery-thumbs {
            width: 100%;
        }
    .home-video{
        padding-top:50px;
        padding-bottom:50px;
    }
    .title-rwd{
        text-align:center;
    }
    .gallery-thumbs{
        opacity:0;
    }
    .world-card {
        width: calc(100% / 3 - 6px );
        height: 120px
    }
    .world-card .pos-num{
        font-size:2.5rem;
    }
    .world-card .pos-name {
        font-size:1.1rem
    }
        .world-card .pos-name.non-material-text {
            font-size: 0.875rem
        }
    .search-frame {
        padding: 16px;
    }
        .search-frame .w-cust{
            width:100%;
        }
    .text-footer{
        font-size:14px;
    }
    .map-obj2 h4 {
        height: 60px;
    }
    .news-date {
        padding-bottom: 0rem;
        padding-left: 0px;
        padding-right: 0px;
    }
    .news-text {
        padding-top: 0rem;
        padding-bottom: 0.5rem;
        padding-left:0px;
        padding-right:0px;
    }
    .modal-content{
        padding:1rem;
    }
    .page-newsDeatil{
        padding:1.3rem
    }
    .nav-content{
        margin-left:0px;
    }
    .videos-row{
        margin-left:0;
        margin-right:0;
    }
    .fb{
        justify-content:flex-start!important;
    }
    .area-mobile-cards{
        background-color:#fff;
        padding:16px;
        border-radius:8px;
        overflow:hidden;
    }
        .area-mobile-cards:before {
            content: "";
            position: absolute;
            width: 100%;
            height: 5px;
            background-color: #D6001D;
            top:0;
            left:0;
        }
        .area-mobile-cards.latinAmerica:before {
            background-color: #2E6BA4;
        }
        .area-mobile-cards.europe:before {
            background-color: #eaba1f;
        }
        .area-mobile-cards.asia:before {
            background-color: #433a9f;
        }
        .area-mobile-cards.arab:before {
            background-color: #159190;
        }
        .area-mobile-cards.africa:before {
            background-color: #BFA65B;
        }
    .area-mobile-cards .col-auto {
        width: 120px;
    }
    .area-name{
        font-size:1.125rem
    }
    .area-mobile-cards .national-title {
        font-size: 1rem
    }
    .area-mobile-cards .col, .area-mobile-cards .col-auto {
        font-size: 0.875rem
    }
    .area-mobile-national{
        text-decoration:none;
        color:inherit
    }
    .news-pageList .news-pageDate{
        font-size:0.875rem;
        padding:2px 8px;
    }
    .home-world{
        padding: 16px 0px;
    }
    .related-mb {
        background-color: rgba(255,255,255,0.7);
        border-radius: 8px;
        padding: 12px 16px 4px;
    }
        .related-mb .card-img{
            width:100%;
            height:190px;
           
            margin-bottom:4px;
            
        }

    
    .mySwiper7 h4 {
        font-size: 0.875rem;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .videos-card .re-subheading2{
        font-size: 1.1rem;
    }
    .btn.btn-pagebtn.mb{
        font-size:0.75rem;
        padding:6px 12px;
    }
    .image-sites.h-autos-cust,
        .image-sites.h-auto{
        height: auto;
        /* 建立透明漸層遮罩 */
        -webkit-mask-image: linear-gradient(black, black);
        mask-image: linear-gradient(black, black);
    }
    .home-taiwanMap-bg {
        min-height: 600px;
    }
    .form-select.form-select-cust{
        border-radius:99em
    }
    .mySwiper4.wm-nation .swiper-slide {
        width: 90% !important;
    }
    .tablist-mb {
        background-color: rgba(255,255,255,0.2);
        color: #fff;
        margin-left: 8px;
        margin-right: 8px;
        width: calc(100% - 16px);
        margin-bottom: 16px;
        padding: 12px 16px;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");

    }
    .tablist-mb option{
        color:#333;
    }
}


@media screen and (min-width:992px){
    .ms-lg-12p{
        margin-left:12px; 
    }
}

.fixed-black {
    background-color: #333;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0%;
    width:100%;
    height:100%;
    z-index:2222;
}