@charset "UTF-8";

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
}

main {
    display: block;
}

h1 {
    font-size: 2em;
    margin: 0.67em;
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}

pre {
    font-family: monospace, monospace;
    font-size: 1em;
}

a {
    background-color: transparent;
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
}

b, strong {
    font-weight: bolder;
}

code, kbd, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

small {
    font-size: 80% f;
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

img {
    border-style: none;
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}

button, input {
    overflow: visible;
}

button, select {
    text-transform: none;
}

button, [type=button], [type=reset], [type=submit] {
    -webkit-appearance: button;
}

    button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
        border-style: none;
        padding: 0;
    }

    button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring {
        outline: 1px dotted ButtonText;
    }

fieldset {
    padding: 0.35em 0.75em 0.625em;
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}

progress {
    vertical-align: baseline;
}

textarea {
    overflow: auto;
}

[type=checkbox], [type=radio] {
    box-sizing: border-box;
    padding: 0;
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto;
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

    [type=search]::-webkit-search-decoration {
        -webkit-appearance: none;
    }

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

details {
    display: block;
}

summary {
    display: list-item;
}

template, [hidden] {
    display: none;
}

* {
    font-family: Noto Sans TC, cwTeXKai, cwTeXYen, cwTeXFangSong, cwTeXMing, Arial;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

body header .nav-bar {
    width: 98%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 0 0 25px 25px;
    background-color: #1F272E;
    padding: 12px 35px;
    z-index: 100;
}

    body header .nav-bar .logo {
        width: 140px;
    }

        body header .nav-bar .logo img {
            width: 100%;
        }

    body header .nav-bar #check {
        display: none;
    }

    body header .nav-bar .menu {
        display: flex;
    }

        body header .nav-bar .menu li {
            padding-left: 10px;
        }

            body header .nav-bar .menu li a {
                display: inline-block;
                text-decoration: none;
                color: #fff;
                text-align: center;
                transition: 0.15s ease-in-out;
                position: relative;
                padding: 10px 20px;
                border-radius: 5px;
                background-color: transparent;
            }

                body header .nav-bar .menu li a::after {
                    content: "";
                    position: absolute;
                    bottom: -4px;
                    left: 0;
                    width: 0%;
                    height: 1px;
                    background-color: #fff;
                    transition: 0.15s ease-in-out;
                }

                body header .nav-bar .menu li a:hover:after {
                    border: 1px solid white;
                    width: 72%;
                    position: absolute;
                    left: 50%;
                    transform: translateX(-50%);
                }

            body header .nav-bar .menu li.yellowBtn a:hover:after {
                display: none;
            }

        body header .nav-bar .menu .yellowBtn {
            background-color: #F6B45D;
            border-radius: 0px 50px 50px 50px;
            padding-left: 0px;
            margin-left: 30px;
            border: 1px solid transparent;
        }

            body header .nav-bar .menu .yellowBtn a {
                color: #1F272E;
                font-weight: bold;
            }

                body header .nav-bar .menu .yellowBtn a:hover {
                    background-color: transparent;
                    color: #fff;
                    font-weight: initial;
                }

            body header .nav-bar .menu .yellowBtn:hover {
                border: 1px solid #fff;
                border-radius: 0px 50px 50px 50px;
                background-color: transparent;
            }

    body header .nav-bar .open-menu, body header .nav-bar .close-menu {
        position: absolute;
        color: #fff;
        cursor: pointer;
        font-size: 1.5rem;
        display: none;
    }

    body header .nav-bar .open-menu {
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
    }

    body header .nav-bar .close-menu {
        top: 20px;
        right: 20px;
    }

body .theme {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.01);
    color: white;
    min-height: 100vh;
    width: 100%;
    margin: auto;
    position: relative;
    overflow: hidden;
}

    body .theme .logo {
        margin-bottom: 45px;
    }

    body .theme .MainTitle {
        font-family: Heiti TC;
        font-size: 50px;
        font-weight: bold;
        margin-bottom: 30px;
    }

    body .theme .subTitle {
        font-family: Heiti TC;
        font-size: 38px;
        font-weight: 500;
        line-height: 37px;
    }

    body .theme .video-bg {
        position: absolute;
        z-index: -1;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 100%;
        min-height: 100%;
    }

    body .theme .themeBox {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -30%);
    }

@media (max-width: 1440px) {
    body .theme .MainTitle {
        font-size: 48px;
    }

    body .theme .subTitle {
        font-size: 34px;
    }
}

@media (max-width: 1200px) {
    body .theme .logo img {
        width: 85%;
    }

    body .theme .MainTitle {
        font-size: 46px;
    }

    body .theme .subTitle {
        font-size: 32px;
    }
}

@media (max-width: 991px) {
    body header {
        height: 100vh;
    }

        body header .nav-bar {
            width: 100%;
        }

            body header .nav-bar .menu {
                flex-direction: column;
                align-items: center;
                justify-content: center;
                width: 80%;
                height: 100vh;
                position: fixed;
                top: 0;
                right: -100%;
                z-index: 100;
                background-color: #1F272E;
                transition: all 0.2s ease-in-out;
                z-index: 200;
            }

                body header .nav-bar .menu li {
                    margin-top: 40px;
                }

                    body header .nav-bar .menu li a {
                        padding: 10px;
                    }

                body header .nav-bar .menu .yellowBtn {
                    margin-left: 0px;
                    padding: 0 20px;
                }

            body header .nav-bar .close-menu {
                display: block;
            }

            body header .nav-bar .open-menu {
                display: block;
            }

            body header .nav-bar #check:checked ~ .menu {
                right: 0;
            }

        body header .theme {
            width: 100%;
            height: 100vh;
            position: absolute;
            top: 0;
            border-radius: 0;
            z-index: -1;
        }

            body header .theme .box .phone-coverBg {
                width: 100%;
                height: 100vh;
                position: absolute;
                top: 0;
                left: 0;
                background-color: rgba(0, 0, 0, 0.01);
            }

            body header .theme .box .themeBox {
                position: absolute;
                top: 53%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 100%;
                padding: 0 20px;
            }

    body .theme .logo {
        margin-bottom: 28px;
    }

        body .theme .logo img {
            width: 45%;
        }

    body .theme .MainTitle {
        font-size: 42px;
    }

    body .theme .subTitle {
        font-size: 31px;
    }
}

@media (max-width: 820px) {
    body .theme .logo img {
        width: 53%;
    }

    body .theme .MainTitle {
        font-size: 33px;
        margin-bottom: 17px;
    }

    body .theme .subTitle {
        font-size: 26px;
    }
}

@media (max-width: 787px) {
    body .theme .MainTitle {
        font-size: 38px;
    }

    body .theme .subTitle {
        font-size: 30px;
    }
}

@media (max-width: 575px) {
    body .theme .box .themeBox {
        padding: 0 20px;
    }

        body .theme .box .themeBox .logo img {
            width: 76%;
        }
}

@media (max-width: 430px) {
    body .theme .box .themeBox .title .MainTitle {
        font-size: 34px;
    }

    body .theme .box .themeBox .title .subTitle {
        font-size: 24px;
    }
}

@media (max-width: 375px) {
    body .theme .box .themeBox .logo img {
        width: 85%;
    }
}

@media (max-width: 360px) {
    body .theme .box .themeBox .title .MainTitle {
        font-size: 30px;
        margin-bottom: 9px;
    }

    body .theme .box .themeBox .title .subTitle {
        font-size: 22px;
    }
}

section.section_promotionalArea .container {
    position: relative;
    width: 100%;
    margin: 0px auto;
}

    section.section_promotionalArea .container .row {
        display: flex;
    }

        section.section_promotionalArea .container .row .leftBox {
            flex-basis: 55%;
            min-width: 250px;
            position: relative;
            overflow: hidden;
        }

section.section_promotionalArea .container .row .leftBox .ClickLine {
    position: absolute;
    right: 30px;
    bottom: 30px;
    width: 230px;
    height: 38px;
}

section.section_promotionalArea .container .row .leftBox .ClickLine a {
    text-decoration: none;
}

    section.section_promotionalArea .container .row .leftBox .ClickLine a .cityName {
        position: absolute;
        bottom: -2px;
        left: 10px;
        font-size: 20px;
        color: white;
        background-color: #2D3C52;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
        border-radius: 50px 0 80px 50px;
        padding: 10px 48px 10px 20px;
        margin-left: 10px;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
        cursor: pointer;
        transition: 0.2s;
    }

        section.section_promotionalArea .container .row .leftBox .ClickLine a .cityName:hover {
            background-color: rgba(45, 60, 82, 0.8);
            color: rgba(255, 255, 255, 0.5);
        }

        section.section_promotionalArea .container .row .leftBox .ClickLine a .cityName span {
            animation: arrow 1s infinite ease-in-out alternate;
            position: absolute;
            top: 50%;
            right: 20px;
            transform: translateY(-50%);
        }

@keyframes arrow {
    0% {
        right: 20px;
    }

    100% {
        right: 25px;
    }
}

section.section_promotionalArea .container .row .leftBox .videoPlayer {
    display: block;
}

    section.section_promotionalArea .container .row .leftBox .videoPlayer .video {
        overflow: hidden;
        height: 600px;
        width: 100%;
    }

        section.section_promotionalArea .container .row .leftBox .videoPlayer .video video {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover;
            outline: none;
            border: none;
            cursor: pointer;
        }

section.section_promotionalArea .container .row .leftBox .playIcon {
    border: 2px solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(31, 39, 46, 0.8);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    transition: 0.2s;
    cursor: pointer;
}

    section.section_promotionalArea .container .row .leftBox .playIcon i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-40%, -50%);
        cursor: pointer;
        font-size: 40px;
        color: #fff;
        border-radius: 50%;
    }

    section.section_promotionalArea .container .row .leftBox .playIcon:hover {
        width: 90px;
        height: 90px;
        border: 3px solid #fff;
        background-color: #1F272E;
    }

section.section_promotionalArea .container .row .leftBox .popup-video {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: rgba(0, 0, 0, 0.8);
    height: 100%;
    width: 100%;
    display: none;
}

    section.section_promotionalArea .container .row .leftBox .popup-video span {
        position: absolute;
        top: 20px;
        right: 50px;
        font-size: 50px;
        color: #fff;
        font-weight: bolder;
        z-index: 100;
        cursor: pointer;
    }

    section.section_promotionalArea .container .row .leftBox .popup-video video {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 70%;
        border-radius: 5px;
        border: 5px solid black;
        -o-object-fit: cover;
        object-fit: cover;
    }

section.section_promotionalArea .container .row .leftBox .imgBox {
    width: 100%;
    display: none;
}

    section.section_promotionalArea .container .row .leftBox .imgBox img {
        display: block;
        height: 600px;
        width: 100%;
    }

section.section_promotionalArea .container .row .rightBox {
    flex-basis: 45%;
    background-color: #D9D9D9;
}

    section.section_promotionalArea .container .row .rightBox .introBox {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        padding: 35px;
        height: 100%;
    }

        section.section_promotionalArea .container .row .rightBox .introBox .p4tText {
            color: #818181;
            font-weight: 550;
            font-size: 48px;
            text-align: right;
        }

            section.section_promotionalArea .container .row .rightBox .introBox .p4tText span {
                color: #E57063;
            }

        section.section_promotionalArea .container .row .rightBox .introBox .title {
            font-size: 35px;
            font-weight: bolder;
            color: #2D3C52;
        }

        section.section_promotionalArea .container .row .rightBox .introBox .contentText {
            color: #585858;
            font-size: 18px;
            line-height: 32px;
            margin-bottom: 30px;
        }

        section.section_promotionalArea .container .row .rightBox .introBox .donateBtn {
            text-align: center;
            margin-bottom: 25px;
        }

            section.section_promotionalArea .container .row .rightBox .introBox .donateBtn a {
                color: #fff;
                background-color: #E57063;
                border: 1.5px solid transparent;
                font-size: 20px;
                text-decoration: none;
                padding: 10px 40px;
                border-radius: 5px;
                transition: 0.2s;
                cursor: pointer;
            }

                section.section_promotionalArea .container .row .rightBox .introBox .donateBtn a:hover {
                    border: 1.5px solid #E57063;
                    color: #E57063;
                    background-color: rgba(229, 112, 99, 0.25);
                }

@media (max-width: 1440px) {
    section.section_promotionalArea .container .row .leftBox {
        flex-basis: 60%;
    }
}

@media (max-width: 1280px) {
    section.section_promotionalArea .container .row .leftBox {
        flex-basis: 70%;
    }

    section.section_promotionalArea .container .row .rightBox .introBox .contentText {
        line-height: 28px;
        font-size: 16px;
    }

    section.section_promotionalArea .container .row .rightBox .introBox .p4tText {
        font-size: 39px;
    }
}

@media (max-width: 1200px) {
    section.section_promotionalArea .container .row .rightBox .introBox .title {
        font-size: 30px;
    }

    section.section_promotionalArea .container .row .rightBox .introBox .contentText {
        line-height: 30px;
        font-size: 16px;
        margin-bottom: 30px;
    }

    section.section_promotionalArea .container .row .rightBox .introBox .donateBtn {
        margin-bottom: 25px;
    }
}

@media (max-width: 991px) {
    section.section_promotionalArea .container {
        width: 100%;
        margin-top: 0;
    }

        section.section_promotionalArea .container .row {
            flex-wrap: wrap;
        }

            section.section_promotionalArea .container .row .leftBox {
                flex: 100%;
            }

                section.section_promotionalArea .container .row .leftBox .videoPlayer .video {
                    border-radius: 0;
                }

                section.section_promotionalArea .container .row .leftBox .popup-video video {
                    width: 95%;
                }

            section.section_promotionalArea .container .row .rightBox {
                flex: 100%;
                border-radius: 0;
                margin-left: 0;
            }

                section.section_promotionalArea .container .row .rightBox .introBox {
                    width: 80%;
                    margin: auto;
                    padding-left: 0;
                    padding-right: 0;
                }

                    section.section_promotionalArea .container .row .rightBox .introBox .title {
                        margin-top: 33px;
                        margin-bottom: 33px;
                    }

                    section.section_promotionalArea .container .row .rightBox .introBox .p4tText, section.section_promotionalArea .container .row .rightBox .introBox .donateBtn {
                        margin-top: 33px;
                        margin-bottom: 33px;
                    }
}

@media (max-width: 535px) {
    section.section_promotionalArea .container .row .rightBox .introBox {
        padding-top: 0;
    }
}

section.section_TaiwanMap .container {
    padding: 150px 0;
}

    section.section_TaiwanMap .container .row {
        position: relative;
    }

        section.section_TaiwanMap .container .row .Taiwan {
            position: relative;
            width: 60%;
            margin: auto;
        }

            section.section_TaiwanMap .container .row .Taiwan svg {
                position: relative;
            }

                section.section_TaiwanMap .container .row .Taiwan svg .isl {
                    stroke: #2D3C52;
                    stroke-width: 1.5;
                    fill: #2D3C52;
                    transition: 0.5s;
                    cursor: pointer;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .isl:hover {
                        stroke: rgba(45, 60, 82, 0.8);
                        fill: rgba(45, 60, 82, 0.8);
                        filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.6));
                    }

                section.section_TaiwanMap .container .row .Taiwan svg a {
                    position: relative;
                }

                section.section_TaiwanMap .container .row .Taiwan svg .kinmenBox {
                    fill: #F6B45D;
                    /*                    stroke: #F6B45D;
*/
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .kinmenBox:hover {
                        /*                        stroke: #F6B45D;
*/ fill: #F6B45D;
                        filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.6));
                    }

                /*                section.section_TaiwanMap .container .row .Taiwan svg .greenIsland:hover {
                    stroke: #F28275;
                    fill: #F28275;
                    filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.6));
                }

                section.section_TaiwanMap .container .row .Taiwan svg .orchidIsland {
                    stroke: #F28275;
                    fill: #F28275;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .orchidIsland:hover {
                        stroke: rgba(242, 130, 117, 0.8);
                        fill: rgba(242, 130, 117, 0.8);
                        filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.6));
                    }
*/
                section.section_TaiwanMap .container .row .Taiwan svg .st0 {
                    stroke: #fff;
                    stroke-width: 1.3;
                    fill: rgba(45, 60, 82, 0.8);
                    transition: 0.5s;
                    cursor: pointer;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .st0:hover {
                        stroke: rgba(255, 255, 255, 0.5);
                        fill: rgba(45, 60, 82, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

                section.section_TaiwanMap .container .row .Taiwan svg #chart {
                    position: absolute;
                    background-color: white;
                    border: 1px solid black;
                    padding: 10px;
                    border-radius: 5px;
                    box-shadow: 0px;
                }

                section.section_TaiwanMap .container .row .Taiwan svg .hualien {
                    fill: #F28275;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .hualien:hover {
                        fill: rgba(242, 130, 117, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

                    section.section_TaiwanMap .container .row .Taiwan svg .hualien .circle {
                        width: 100px;
                        height: 100px;
                        border: 1px solid black;
                    }

                section.section_TaiwanMap .container .row .Taiwan svg .miaoli {
                    fill: #953340;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .miaoli:hover {
                        fill: rgba(149, 51, 64, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

                section.section_TaiwanMap .container .row .Taiwan svg .taipeiCity, section.section_TaiwanMap .container .row .Taiwan svg .changhua {
                    fill: #FF9060;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .taipeiCity:hover, section.section_TaiwanMap .container .row .Taiwan svg .changhua:hover {
                        fill: rgba(255, 144, 96, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

                section.section_TaiwanMap .container .row .Taiwan svg .kaohsiung {
                    fill: #F6B45D;
                }

                    section.section_TaiwanMap .container .row .Taiwan svg .kaohsiung:hover {
                        fill: rgba(246, 180, 93, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

            section.section_TaiwanMap .container .row .Taiwan .info {
                pointer-events: none;
                position: absolute;
                font-size: 18px;
                background: #E75E48;
                z-index: 5;
                margin: 0 auto;
                border-radius: 10px;
                box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
                display: none;
                color: #fff;
                max-width: 25vw;
                padding: 1vw 2vw;
                text-align: center;
                line-height: 28px;
            }

                section.section_TaiwanMap .container .row .Taiwan .info.active {
                    display: block;
                }

            section.section_TaiwanMap .container .row .Taiwan .circularBox {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                background-color: transparent;
                border-radius: 8px;
                width: 95px;
                row-gap: 30px;
                position: absolute;
                transform: translate(-50%, -50%);
            }

                section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress {
                    border: 1px solid rgba(0, 0, 0, 0.2);
                    border-radius: 50%;
                    position: relative;
                    height: 80px;
                    width: 80px;
                    background-color: #F6B45D;
                    background: conic-gradient(#F6B45D 3.6deg, rgba(100, 127, 163, 0.1) 0deg);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }

                    section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress .progressValue {
                        position: relative;
                        font-size: 12px;
                        color: black;
                    }

                    section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress::before {
                        content: "";
                        position: absolute;
                        height: 30px;
                        width: 30px;
                        border-radius: 50%;
                        border: 1px solid black;
                        background-color: #D9D9D9;
                    }

                    section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress:after {
                        content: "";
                        width: 0;
                        height: 0;
                        border-style: solid;
                        border-width: 6.533px 0 6.533px 6.533px;
                        border-color: transparent transparent transparent #c6c6c6;
                        position: absolute;
                        right: -9px;
                        top: 50%;
                        transform: translateY(-50%);
                    }

                section.section_TaiwanMap .container .row .Taiwan .circularBox .downArrow:after {
                    content: "";
                    width: 0;
                    height: 0;
                    border-style: solid;
                    border-width: 6.533px 0 6.533px 6.533px;
                    border-color: transparent transparent transparent #c6c6c6;
                    position: absolute;
                    left: 50%;
                    top: 110%;
                    transform: translate(-50%, -50%) rotate(90deg);
                }

                section.section_TaiwanMap .container .row .Taiwan .circularBox .deg45:after {
                    content: "";
                    width: 0;
                    height: 0;
                    border-style: solid;
                    border-width: 6.533px 0 6.533px 6.533px;
                    border-color: transparent transparent transparent #c6c6c6;
                    position: absolute;
                    left: 95%;
                    top: 91%;
                    transform: translate(-50%, -50%) rotate(45deg);
                }

                section.section_TaiwanMap .container .row .Taiwan .circularBox .leftArrow:after {
                    content: "";
                    width: 0;
                    height: 0;
                    border-style: solid;
                    border-width: 6.533px 0 6.533px 6.533px;
                    border-color: transparent transparent transparent #c6c6c6;
                    position: absolute;
                    left: -9px;
                    top: 50%;
                    transform: translateY(-50%) rotate(180deg);
                }

            section.section_TaiwanMap .container .row .Taiwan .smallBox {
                width: 66px;
            }

                section.section_TaiwanMap .container .row .Taiwan .smallBox .small {
                    height: 60px;
                    width: 60px;
                }

                section.section_TaiwanMap .container .row .Taiwan .smallBox .smallText {
                    font-size: 11px;
                    width: 72px;
                }

                section.section_TaiwanMap .container .row .Taiwan .smallBox .downArrow:after {
                    border-width: 4.533px 0 4.533px 4.533px;
                }

                section.section_TaiwanMap .container .row .Taiwan .smallBox .leftArrow:after {
                    content: "";
                    width: 0;
                    height: 0;
                    border-style: solid;
                    border-width: 6.533px 0 6.533px 6.533px;
                    border-color: transparent transparent transparent #D9D9D9;
                    position: absolute;
                    left: -9px;
                    top: 50%;
                    transform: translateY(-50%) rotate(180deg);
                }

            section.section_TaiwanMap .container .row .Taiwan .smallArrowBox_LA {
                width: 90px;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_taoyuan {
                top: 8.5%;
                left: 61.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_hsinchuCity {
                top: 17.5%;
                left: 56%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_hsinchu {
                top: 16%;
                left: 69%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_miaoli {
                top: 23%;
                left: 48%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_taichung {
                top: 30%;
                left: 42%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_changhua {
                top: 38%;
                left: 36%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_yunlin {
                top: 46%;
                left: 29%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_nantou {
                top: 39%;
                left: 63%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_chiayi {
                top: 55%;
                left: 28%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_chiayiCity {
                top: 49.5%;
                left: 43.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_tainan {
                top: 62%;
                left: 24.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_kaohsiung {
                top: 74%;
                left: 30.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_pingtung {
                top: 91%;
                left: 46.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_newtaipeicity {
                top: 5.8%;
                left: 72.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_taipeiCity {
                top: 5%;
                left: 82.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_keelung {
                top: 4.3%;
                left: 90.3%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_yilan {
                top: 20%;
                left: 98.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_hualien {
                top: 42%;
                left: 90.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_taitung {
                top: 76%;
                left: 71.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_mazua {
                top: 10%;
                left: 30.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_kinmen {
                top: 27%;
                left: 3.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_penghu {
                top: 50%;
                left: 2.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_ryukyu {
                top: 83.7%;
                left: 35.8%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_greenIsland {
                top: 75.5%;
                left: 86.5%;
            }

            section.section_TaiwanMap .container .row .Taiwan .pie_orchidIsland {
                top: 92%;
                left: 89%;
            }

        section.section_TaiwanMap .container .row .pieCircleDire {
            position: absolute;
            top: -100px;
            right: 55px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding-bottom: 24px;
            padding-top: 24px;
            padding-left: 25px;
            padding-right: 25px;
            border-radius: 15px;
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
        }

            section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                background-color: transparent;
                border-radius: 10px;
                width: 95px;
                row-gap: 30px;
            }

                section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .circular {
                    border: 1px solid rgba(0, 0, 0, 0.2);
                    border-radius: 50%;
                    position: relative;
                    height: 60px;
                    width: 60px;
                    background-color: #F6B45D;
                    background: conic-gradient(#F6B45D 200deg, rgba(100, 127, 163, 0.5) 200deg);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }

                    section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .circular::before {
                        content: "";
                        position: absolute;
                        height: 30px;
                        width: 30px;
                        border-radius: 50%;
                        border: 1px solid black;
                        background-color: #D9D9D9;
                    }

                section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .Value {
                    position: relative;
                    font-size: 12px;
                    color: black;
                }

            section.section_TaiwanMap .container .row .pieCircleDire .direText {
                text-align: center;
                font-size: 14px;
                margin-top: 13px;
                line-height: 19px;
                color: #585858;
            }

        section.section_TaiwanMap .container .row .SelectAreaBox {
            width: 25%;
            position: absolute;
            top: -100px;
            left: 0;
            background-color: #fff;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            position: absolute;
            padding: 40px 60px;
            border-radius: 0 35px 35px 0;
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
        }

            section.section_TaiwanMap .container .row .SelectAreaBox .Caption {
                font-size: 20px;
                color: #585858;
                font-weight: 500;
                margin-bottom: 25px;
            }

            section.section_TaiwanMap .container .row .SelectAreaBox .CountyCityBtn {
                margin-bottom: 25px;
            }

            section.section_TaiwanMap .container .row .SelectAreaBox .AreaBtn {
                margin-bottom: 35px;
            }

            section.section_TaiwanMap .container .row .SelectAreaBox .SearchBtn a {
                border: 1.5px solid transparent;
                text-decoration: none;
                width: 200px;
                background-color: #3A3A3A;
                padding: 7px 25px;
                border-radius: 5px;
                color: #fff;
                font-size: 18px;
                font-weight: 500;
                transition: 0.2s;
            }

                section.section_TaiwanMap .container .row .SelectAreaBox .SearchBtn a:hover {
                    border: 1.5px solid #3A3A3A;
                    background-color: rgba(58, 58, 58, 0.2);
                    color: #3A3A3A;
                }

            section.section_TaiwanMap .container .row .SelectAreaBox select {
                font-size: 18px;
                font-weight: 500;
                width: 180px;
                background-color: #fff;
                color: #585858;
                padding: 8px 20px;
                border-radius: 5px;
                -webkit-appearance: none;
                -moz-appearance: none;
                appearance: none;
                background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                background-repeat: no-repeat;
                background-position: right 1rem center;
                background-size: 2em;
                outline: none;
            }

        section.section_TaiwanMap .container .row .SelectAreaBoxPhone, section.section_TaiwanMap .container .row .bottomBanner {
            display: none;
        }

.sec-1 .animate {
    transform: translateX(-20%);
    transition: 1s;
    transition-delay: calc(0.2s * var(--i));
}

.sec-1.show-animate .animate {
    transform: translateX(0);
}

.sec-1 .animate-1 {
    transform: translateX(-20%);
    transition: 1s;
    transition-delay: calc(0.2s * var(--i));
}

.sec-1.show-animate .animate-1 {
    transform: translateX(-3%);
}

.sec-1 .animate-2 {
    transform: scale(0.9);
    transition: 1s;
}

.sec-1.show-animate .animate-2 {
    transform: scale(1);
}

@media (max-width: 1440px) {
    section.section_TaiwanMap .container {
        padding: 120px 0;
    }

        section.section_TaiwanMap .container .row .Taiwan {
            width: 65%;
        }

            section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress {
                width: 60px;
                height: 60px;
            }

            section.section_TaiwanMap .container .row .Taiwan .circularBox .small {
                width: 50px;
                height: 50px;
            }

        section.section_TaiwanMap .container .row .pieCircleDire {
            right: 50px;
            padding-top: 18px;
            padding-bottom: 18px;
            padding-left: 20px;
            padding-right: 20px;
        }

        section.section_TaiwanMap .container .row .SelectAreaBox {
            width: 25%;
            padding: 40px 24px;
            border-radius: 0 25px 25px 0;
        }

            section.section_TaiwanMap .container .row .SelectAreaBox .Caption {
                font-size: 18px;
            }

            section.section_TaiwanMap .container .row .SelectAreaBox .CountyCityBtn {
                margin-bottom: 18px;
            }

                section.section_TaiwanMap .container .row .SelectAreaBox .CountyCityBtn select, section.section_TaiwanMap .container .row .SelectAreaBox .AreaBtn select {
                    width: 158px;
                    padding: 8px 13px;
                }
}

@media (max-width: 1200px) {
    section.section_TaiwanMap .container .row .Taiwan {
        width: 75%;
    }

        section.section_TaiwanMap .container .row .Taiwan .circularBox .circularProgress {
            width: 55px;
            height: 55px;
        }

        section.section_TaiwanMap .container .row .Taiwan .circularBox .small {
            width: 45px;
            height: 45px;
        }

    section.section_TaiwanMap .container .row .pieCircleDire {
        right: 28px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

        section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox {
            width: 72px;
        }

            section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .circular {
                width: 50px;
                height: 50px;
            }

                section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .circular::before {
                    width: 25px;
                    height: 25px;
                }

        section.section_TaiwanMap .container .row .pieCircleDire .direText {
            font-size: 12px;
            line-height: 16px;
        }

    section.section_TaiwanMap .container .row .SelectAreaBox {
        padding: 28px;
    }

        section.section_TaiwanMap .container .row .SelectAreaBox .SearchBtn a {
            padding: 5px 18px;
        }
}

@media (max-width: 1024px) {
    section.section_TaiwanMap .container .row .Taiwan {
        width: 80%;
    }

    section.section_TaiwanMap .container .row .pieCircleDire .direBox .circleBox .circular {
        width: 45px;
        height: 45px;
    }

    section.section_TaiwanMap .container .row .SelectAreaBox {
        padding: 20px;
        width: 23%;
    }

        section.section_TaiwanMap .container .row .SelectAreaBox .Caption {
            font-size: 16px;
            margin-bottom: 18px;
        }

        section.section_TaiwanMap .container .row .SelectAreaBox .CountyCityBtn select, section.section_TaiwanMap .container .row .SelectAreaBox .AreaBtn select {
            width: 145px;
            font-size: 16px;
        }

        section.section_TaiwanMap .container .row .SelectAreaBox .AreaBtn {
            margin-bottom: 29px;
        }

        section.section_TaiwanMap .container .row .SelectAreaBox .SearchBtn a {
            font-size: 16px;
        }

        section.section_TaiwanMap .container .row .SelectAreaBox .pie_taoyuan {
            top: 7.5%;
            left: 61.5%;
        }
}

@media (max-width: 991px) {
    section.section_TaiwanMap .container {
        padding: 50px 0 60px 0;
    }

        section.section_TaiwanMap .container .row .Taiwan, section.section_TaiwanMap .container .row .SelectAreaBox {
            display: none;
        }

        section.section_TaiwanMap .container .row .pieCircleDire {
            display: none;
        }

        section.section_TaiwanMap .container .row .SelectAreaBoxPhone {
            display: block;
            width: 100%;
            background-color: #fff;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 40px 60px;
        }

            section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }

                section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox .Caption {
                    font-size: 18px;
                    color: #585858;
                    font-weight: 500;
                    margin-bottom: 25px;
                }

                section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox .CountyCityBtn {
                    margin-bottom: 25px;
                }

                section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox .AreaBtn {
                    margin-bottom: 37px;
                }

                section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox .SearchBtn a {
                    border: 1.5px solid transparent;
                    text-decoration: none;
                    width: 200px;
                    background-color: #3A3A3A;
                    padding: 7px 71px;
                    border-radius: 5px;
                    color: #fff;
                    font-size: 16px;
                    transition: 0.2s;
                }

                    section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox .SearchBtn a:hover {
                        border: 1.5px solid #3A3A3A;
                        background-color: rgba(58, 58, 58, 0.2);
                        color: #3A3A3A;
                    }

                section.section_TaiwanMap .container .row .SelectAreaBoxPhone .selecInsideBox select {
                    font-size: 16px;
                    width: 180px;
                    background-color: #2D3C52;
                    color: #fff;
                    padding: 8px 20px;
                    border-radius: 5px;
                    -webkit-appearance: none;
                    -moz-appearance: none;
                    appearance: none;
                    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                    background-repeat: no-repeat;
                    background-position: right 1rem center;
                    background-size: 2em;
                    outline: none;
                }
}

section.section_bottomBanner {
    display: none;
}

    section.section_bottomBanner .container .row .bottomBanner {
        border: 0px solid transparent;
        width: 100%;
    }

        section.section_bottomBanner .container .row .bottomBanner img {
            width: 100%;
            display: block;
        }

@media (max-width: 991px) {
    section.section_bottomBanner {
        display: block;
    }
}

@media (max-width: 430px) {
    section.section_bottomBanner .container .row .bottomBanner img {
        width: 100%;
        background-position: -10px 0;
    }
}

section.section_Footer {
    background-color: #1F272E;
}

    section.section_Footer .container {
        padding: 100px 0;
        max-width: 90vw;
        margin: auto;
    }

        section.section_Footer .container .row {
            display: flex;
        }

            section.section_Footer .container .row .leftBox {
                flex: 50%;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
            }

                section.section_Footer .container .row .leftBox .p4tIconBox {
                    margin-bottom: 220px;
                    width: 150px;
                }

                    section.section_Footer .container .row .leftBox .p4tIconBox img {
                        width: 100%;
                    }

                section.section_Footer .container .row .leftBox .contactInforBox {
                    color: #fff;
                    line-height: 30px;
                }

                    section.section_Footer .container .row .leftBox .contactInforBox .cceaLogo {
                        width: 80px;
                        margin-bottom: 20px;
                    }

                        section.section_Footer .container .row .leftBox .contactInforBox .cceaLogo img {
                            width: 100%;
                        }

            section.section_Footer .container .row .rightBox {
                flex: 50%;
                color: #fff;
            }

                section.section_Footer .container .row .rightBox ul.itemBox li {
                    display: flex;
                    align-items: center;
                    margin-bottom: 40px;
                    padding: 5px 0;
                }

                    section.section_Footer .container .row .rightBox ul.itemBox li .Icon {
                        flex: 15%;
                        text-align: center;
                    }

                        section.section_Footer .container .row .rightBox ul.itemBox li .Icon img {
                            width: 50%;
                        }

                    section.section_Footer .container .row .rightBox ul.itemBox li .textBox {
                        flex: 85%;
                        padding: 0px 15px;
                    }

                        section.section_Footer .container .row .rightBox ul.itemBox li .textBox .title {
                            margin-bottom: 10px;
                            color: #E57063;
                            font-weight: bolder;
                        }

                        section.section_Footer .container .row .rightBox ul.itemBox li .textBox .content {
                            line-height: 30px;
                        }

                    section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg {
                        width: 60%;
                    }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg g.hand {
                            fill: #fbe2a8;
                            stroke-width: 0px;
                        }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg g.sleeve {
                            fill: #da6d60;
                            stroke-width: 0px;
                        }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg .cls {
                            fill: none;
                            stroke: #da6d60;
                            stroke-miterlimit: 10;
                            stroke-width: 4px;
                        }

                    section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg {
                        width: 60%;
                    }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg .heart {
                            fill: #da6d60;
                            stroke-width: 0px;
                            animation: bounceHeart 1s infinite ease-in-out alternate;
                        }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg g.hand {
                            fill: #fbe2a8;
                            stroke-width: 0px;
                        }

                        section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg .cls {
                            fill: none;
                            stroke: #da6d60;
                            stroke-miterlimit: 10;
                            stroke-width: 4px;
                        }

@keyframes bounceHeart {
    from {
        transform: translateY(0px);
    }

    to {
        transform: translateY(-10px);
    }
}

section.section_Footer .container .row .rightBox ul.itemBox li.item3 a {
    text-decoration: none;
}

section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg {
    width: 60%;
}

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-1 {
        fill: #da6d60;
        stroke: #da6d60;
        stroke-miterlimit: 10;
        stroke-width: 4px;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-5 {
        fill: none;
        stroke: #da6d60;
        stroke-miterlimit: 10;
        stroke-width: 2px;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-2 {
        fill: #1f272e;
        stroke: #231815;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 0.5px;
        animation: bounce 1s infinite ease-in-out alternate;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-3 {
        fill: #da6d60;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-3, section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-4 {
        stroke-width: 0px;
        fill: #1f272e;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg .cls-4 {
        fill: #fbe2a8;
        animation: bounce 1s infinite ease-in-out alternate;
    }

@keyframes bounce {
    from {
        transform: translateY(0px);
    }

    to {
        transform: translateY(-20px);
    }
}

section.section_Footer .container .row .rightBox ul.itemBox li.item3 .textBox a {
    text-decoration: none;
}

    section.section_Footer .container .row .rightBox ul.itemBox li.item3 .textBox a .title {
        border-bottom: 1px solid #da6d60;
        display: inline-block;
        transition: 0.2s;
    }

        section.section_Footer .container .row .rightBox ul.itemBox li.item3 .textBox a .title:hover {
            color: #f39f96;
            border-bottom: 1px solid #f39f96;
        }

@media (max-width: 1440px) {
    section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg, section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg, section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg {
        width: 70%;
    }
}

@media (max-width: 1280px) {
    section.section_Footer .container .row .rightBox ul.itemBox li .Icon {
        flex: 20%;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li .textBox {
        flex: 80%;
    }

        section.section_Footer .container .row .rightBox ul.itemBox li .textBox .content {
            line-height: 28px;
        }
}

@media (max-width: 1024px) {
    section.section_Footer .container .row .leftBox .contactInforBox {
        font-size: 14px;
    }

    section.section_Footer .container .row .rightBox ul.itemBox li {
        margin-bottom: 40px;
    }

        section.section_Footer .container .row .rightBox ul.itemBox li .Icon {
            flex: 20%;
        }

        section.section_Footer .container .row .rightBox ul.itemBox li .textBox {
            flex: 80%;
        }

            section.section_Footer .container .row .rightBox ul.itemBox li .textBox .content {
                font-size: 14px;
                line-height: 25px;
            }
}

@media (max-width: 991px) {
    section.section_Footer .container .row {
        flex-direction: column-reverse;
        align-items: center;
        justify-content: center;
    }

        section.section_Footer .container .row .leftBox .p4tIconBox {
            margin: auto;
        }

        section.section_Footer .container .row .leftBox .contactInforBox {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: auto;
            text-align: center;
            flex-wrap: nowrap;
        }

            section.section_Footer .container .row .leftBox .contactInforBox .cceaLogo {
                margin-bottom: 30px;
                margin-top: 115px;
            }

        section.section_Footer .container .row .rightBox ul.itemBox {
            text-align: center;
        }

            section.section_Footer .container .row .rightBox ul.itemBox li {
                margin-bottom: 60px;
                flex-direction: column;
            }

                section.section_Footer .container .row .rightBox ul.itemBox li .Icon {
                    margin-bottom: 20px;
                }

                section.section_Footer .container .row .rightBox ul.itemBox li.item1 .Icon svg, section.section_Footer .container .row .rightBox ul.itemBox li.item2 .Icon svg, section.section_Footer .container .row .rightBox ul.itemBox li.item3 .Icon svg {
                    width: 90%;
                }

                section.section_Footer .container .row .rightBox ul.itemBox li.item3 {
                    margin-bottom: 115px;
                }
}

body.district header nav ul.nav-bar {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
}

body.district section.section_districtMap .container {
    padding: 150px 0 70px 0;
}

    body.district section.section_districtMap .container .row.prayText {
        position: relative;
    }

        body.district section.section_districtMap .container .row.prayText .prayForTaiText {
            margin: auto;
            position: absolute;
            bottom: -6px;
            right: 120px;
            font-size: 30px;
            font-weight: bolder;
            color: #7f7f7f;
        }

            body.district section.section_districtMap .container .row.prayText .prayForTaiText span.tai {
                color: #E57063;
            }

    body.district section.section_districtMap .container .row .MapBox {
        width: 90%;
        margin: auto;
        display: flex;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
        border-radius: 25px;
    }

        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData {
            border-radius: 25px 0 0 25px;
            text-align: center;
            flex: 50%;
            background-color: #2D3C52;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-around;
        }

            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect {
                padding: 70px 0 0 0;
            }

                body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .districtName {
                    font-size: 35px;
                    font-weight: bolder;
                    color: #fff;
                }

                    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .districtName span.EnName {
                        color: #E57063;
                    }

                body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox {
                    padding: 45px 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox {
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;
                    }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox .CountyCityBtn {
                            margin-bottom: 20px;
                        }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox .AreaBtn {
                            margin-bottom: 33px;
                        }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox .SearchBtn a {
                            border: 1.5px solid #fff;
                            text-decoration: none;
                            width: 200px;
                            background-color: #3A3A3A;
                            padding: 7px 35px;
                            border-radius: 5px;
                            color: #fff;
                            font-size: 18px;
                            transition: 0.2s;
                        }

                            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox .SearchBtn a:hover {
                                border: 1.5px solid #fff;
                                background-color: rgba(255, 255, 255, 0.1);
                                color: #fff;
                            }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox select {
                            font-size: 18px;
                            font-weight: 500;
                            width: 180px;
                            background-color: #D9D9D9;
                            color: #3A3A3A;
                            padding: 8px 20px;
                            border-radius: 5px;
                            -webkit-appearance: none;
                            -moz-appearance: none;
                            appearance: none;
                            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                            background-repeat: no-repeat;
                            background-position: right 1rem center;
                            background-size: 2em;
                            outline: none;
                        }

            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData {
                width: 80%;
                margin-bottom: 60px;
            }

                body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    border-radius: 0 0 25px 25px;
                    padding: 35px 0;
                    background-color: rgba(255, 255, 255, 0.15);
                    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
                }

                    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .locaionName {
                        font-size: 24px;
                        border-radius: 50px;
                        display: inline-block;
                        width: 60%;
                        padding: 6px 0;
                        background-color: #2D3C52;
                        color: #fff;
                    }

                    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn {
                        margin: 25px 0;
                    }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate {
                            font-weight: 500;
                            color: #fff;
                            font-size: 20px;
                            margin: 25px;
                            line-height: 30px;
                        }

                            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate span {
                                color: #ff9387;
                                font-weight: 500;
                                font-size: 20px;
                                margin: 25px 0;
                            }

                    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox {
                        display: flex;
                        flex-direction: column;
                        font-size: 18px;
                    }

                        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a {
                            text-decoration: none;
                        }

                            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .videoBtn, body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .donateBtn {
                                border-radius: 5px;
                                display: inline-block;
                                width: 180px;
                                padding: 10px 0;
                                font-size: 18pxs;
                            }

                            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .videoBtn {
                                border: 1.5px solid transparent;
                                margin-bottom: 30px;
                                background-color: #F6B45D;
                                color: #3A3A3A;
                                font-weight: 500;
                                cursor: pointer;
                            }

                                body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .videoBtn:hover {
                                    border: 1.5px solid #F6B45D;
                                    color: #F6B45D;
                                    background-color: rgba(246, 180, 93, 0.25);
                                }

                            body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .donateBtn {
                                border: 1.5px solid transparent;
                                background-color: #E57063;
                                color: #fff;
                                transition: 0.2s;
                                cursor: pointer;
                            }

                                body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .btnBox a .donateBtn:hover {
                                    border: 1.5px solid #E57063;
                                    color: #dc4434;
                                    background-color: rgba(229, 112, 99, 0.25);
                                }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap {
            flex: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap {
                width: 70%;
                padding: 50px 0;
            }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap svg .st0 {
                    fill: #2D3C52;
                    stroke: #fff;
                    stroke-linecap: round;
                    stroke-linejoin: round;
                    stroke-width: 2px;
                    transition: 0.2s;
                    cursor: pointer;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap svg .st0:hover {
                        stroke: rgba(255, 255, 255, 0.5);
                        fill: rgba(45, 60, 82, 0.8);
                        transform: translate(-5px, -5px);
                        filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.6));
                    }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap svg .st0:active {
                        fill: #E57063;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap svg .st1 {
                    fill: #2D3C52;
                    stroke: #fff;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap svg .selected {
                    fill: #E57063;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap .info {
                    pointer-events: none;
                    position: absolute;
                    font-size: 18px;
                    background: #647FA3;
                    z-index: 5;
                    margin: 0 auto;
                    border-radius: 10px;
                    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
                    display: none;
                    color: #fff;
                    max-width: 25vw;
                    padding: 1vw 2vw;
                    text-align: center;
                    line-height: 28px;
                    font-size: 16px;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap .info.active {
                        display: block;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TiapeiCity {
                    width: 65%;
                    padding: 36px 0;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.newtaipeiCity {
                    width: 90%;
                    padding: 15px 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.newtaipeiCity svg .st0 {
                        stroke-width: 1.5px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.yilanCounty {
                    padding: 30px 0;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HualienCounty {
                    width: 58%;
                    padding: 28px 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HualienCounty svg .st0 {
                        stroke-width: 2.5px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaitouCounty {
                    width: 50%;
                    padding: 28px 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaitouCounty svg .st0 {
                        stroke-width: 4px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PingtungCounty {
                    width: 55%;
                    padding: 20px 0;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TainanCity {
                    width: 88%;
                    padding: 10px 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TainanCity svg .st0 {
                        stroke-width: 1px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.YunlinCounty {
                    width: 100%;
                    padding: 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.YunlinCounty .st0 {
                        stroke-width: 0.2px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChiayiCounty {
                    width: 100%;
                    padding: 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChiayiCounty .st0 {
                        stroke-width: 0.2px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChiayiCity {
                    width: 90%;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChiayiCity svg .st0 {
                        stroke-width: 1px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.NantouCounty {
                    width: 85%;
                    padding: 12px 0;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChanghuaCounty {
                    width: 90%;
                    padding: 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChanghuaCounty svg .st0 {
                        stroke-width: 1px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaichungCounty {
                    width: 100%;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaichungCounty svg .st0 {
                        stroke-width: 1.8px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.MiaoliCounty {
                    width: 98%;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HsinchuCounty {
                    width: 90%;
                    padding: 0;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HsinchuCity {
                    width: 85%;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PenghuCounty {
                    width: 66%;
                    padding: 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PenghuCounty svg .st0 {
                        stroke-width: 1px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KinmenCounty {
                    width: 95%;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KinmenCounty svg .st0 {
                        stroke-width: 1.3px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.LienchiangCounty {
                    width: 88%;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.LienchiangCounty svg .st0 {
                        stroke-width: 1.3px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KaohsiungCity {
                    width: 80%;
                    padding: 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KaohsiungCity svg .st0 {
                        stroke-width: 1.3px;
                    }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.keelung {
                    width: 85%;
                }

                body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.taoyuan {
                    width: 90%;
                    padding: 0 0;
                }

                    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.taoyuan svg .st0 {
                        stroke-width: 0.5px;
                    }

    body.district section.section_districtMap .container .row .districtNamePhone, body.district section.section_districtMap .container .row .SelectAreaBoxPhone {
        display: none;
    }

@media (max-width: 1440px) {
    body.district section.section_districtMap .container .row.prayText .prayForTaiText {
        right: 87px;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap {
        width: 79%;
    }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TiapeiCity {
            width: 74%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.newtaipeiCity, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TainanCity, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChanghuaCounty, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HsinchuCounty {
            width: 100%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.ChiayiCity, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HsinchuCity, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.LienchiangCounty, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.taoyuan {
            width: 95%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PenghuCounty {
            width: 78%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaitouCounty {
            width: 57%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PingtungCounty {
            width: 62%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KaohsiungCity {
            width: 89%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.NantouCounty {
            width: 100%;
        }
}

@media (max-width: 1280px) {
    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect {
        padding: 43px 0 0 0;
    }

        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox {
            padding: 33px 0 50px 0;
        }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn {
        margin: 4px 0;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TiapeiCity {
        width: 74%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PingtungCounty {
        width: 65%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KaohsiungCity {
        width: 94%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PenghuCounty {
        width: 85%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.yilanCounty {
        width: 82%;
    }
}

@media (max-width: 1200px) {
    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap {
        width: 82%;
    }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HualienCounty {
            width: 63%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PingtungCounty {
            width: 69%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PenghuCounty {
            width: 93%;
        }

        body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.keelung {
            width: 91%;
        }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox select {
        width: 158px;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect .SelectAreaBox .selecInsideBox .SearchBtn a {
        padding: 7px 24px;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate {
        font-size: 18px;
    }

        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate span {
            font-size: 18px;
        }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn {
        margin: 0;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .locaionName {
        width: 75%;
    }
}

@media (max-width: 1024px) {
    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TiapeiCity {
        width: 86%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.TaitouCounty {
        width: 67%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.HualienCounty {
        width: 69%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.PingtungCounty {
        width: 76%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KaohsiungCity, body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.taoyuan {
        width: 100%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.yilanCounty {
        width: 88%;
    }

    body.district section.section_districtMap .container .row .MapBox .rightBoxMap .districtMap.KinmenCounty {
        width: 98%;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .topSelect {
        padding: 44px 0 0 0;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .locaionName {
        font-size: 20px;
    }

    body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate {
        font-size: 16px;
    }

        body.district section.section_districtMap .container .row .MapBox .leftBoxSelectData .bottomData .dataBox .dataBtn .progressRate span {
            font-size: 16px;
        }
}

@media (max-width: 991px) {
    body.district header {
        height: initial;
    }

    body.district section.section_districtMap .container .row.prayText {
        display: none;
    }

    body.district section.section_districtMap .container .row .MapBox {
        display: none;
    }

    body.district section.section_districtMap .container .row .districtNamePhone {
        display: block;
        font-size: 35px;
        text-align: center;
        font-weight: bolder;
        color: #2D3C52;
        margin-top: 8px;
    }

        body.district section.section_districtMap .container .row .districtNamePhone span.EnName {
            color: #E57063;
        }

    body.district section.section_districtMap .container .row .SelectAreaBoxPhone {
        display: block;
        width: 100%;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 40px 60px;
    }

        body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

            body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .Caption {
                font-size: 18px;
                color: #585858;
                font-weight: 500;
                margin-bottom: 25px;
            }

            body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .CountyCityBtn {
                margin-bottom: 25px;
            }

            body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .AreaBtn {
                margin-bottom: 35px;
            }

            body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .SearchBtn a {
                border: 1.5px solid transparent;
                text-decoration: none;
                width: 200px;
                background-color: #3A3A3A;
                padding: 7px 35px;
                border-radius: 5px;
                color: #fff;
                font-size: 16px;
                transition: 0.2s;
            }

                body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .SearchBtn a:hover {
                    border: 1.5px solid #3A3A3A;
                    background-color: rgba(58, 58, 58, 0.2);
                    color: #3A3A3A;
                }


            body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox select {
                font-size: 16px;
                width: 180px;
                background-color: #2D3C52;
                color: #fff;
                padding: 11px 20px;
                border-radius: 5px;
                -webkit-appearance: none;
                -moz-appearance: none;
                appearance: none;
                background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                background-repeat: no-repeat;
                background-position: right 1rem center;
                background-size: 2em;
                outline: none;
            }
}

@media (max-width: 575px) {
    body.district section.section_districtMap .container {
        padding: 143px 0 45px 0;
    }
}

body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .PrayBtn {
    margin-bottom: 45px;
}

    body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .PrayBtn a {
        border: 1.5px solid transparent;
        text-decoration: none;
        width: 200px;
        background-color: #ff4545;
        padding: 7px 20px;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        transition: 0.2s;
    }

        body.district section.section_districtMap .container .row .SelectAreaBoxPhone .selecInsideBox .PrayBtn a:hover {
            border: 1.5px solid #3A3A3A;
            background-color: rgba(255, 69, 69, 0.5);
            color: #3A3A3A;
        }

body.district section.section_tableData .container {
    padding: 20px 0 80px 0;
}

    body.district section.section_tableData .container .row {
        width: 80%;
        margin: auto;
    }

        body.district section.section_tableData .container .row .cityName {
            font-size: 30px;
            font-weight: bold;
            color: #2D3C52;
            text-align: right;
            padding: 30px 0 45px 0;
        }

            body.district section.section_tableData .container .row .cityName span.tai {
                color: #E57063;
            }

        body.district section.section_tableData .container .row .tableBox {
            display: flex;
            flex-direction: column;
        }

            body.district section.section_tableData .container .row .tableBox ul.bghover {
                border-radius: 5px;
                height: 90px;
                padding: 10px 0;
                transition: 0.5s;
                cursor: pointer;
            }

                body.district section.section_tableData .container .row .tableBox ul.bghover:hover {
                    background-color: #e8e8e8;
                }

            body.district section.section_tableData .container .row .tableBox .item.selected {
                background-color: #e8e8e8;
            }

            body.district section.section_tableData .container .row .tableBox ul.item {
                list-style: none;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 25px;
            }

                body.district section.section_tableData .container .row .tableBox ul.item li {
                    font-size: 18px;
                    color: #3A3A3A;
                }

                    body.district section.section_tableData .container .row .tableBox ul.item li.disName {
                        color: #2D3C52;
                        font-size: 20px;
                        font-weight: 500;
                    }

                body.district section.section_tableData .container .row .tableBox ul.item .disName.selected {
                    color: #E57063;
                }

                body.district section.section_tableData .container .row .tableBox ul.item li {
                    flex: 20%;
                    text-align: center;
                }

                    body.district section.section_tableData .container .row .tableBox ul.item li.finishColor {
                        color: #E57063;
                    }

                    body.district section.section_tableData .container .row .tableBox ul.item li.intoVideo a .playIcon {
                        border: 2px solid #fff;
                        position: relative;
                        left: 50%;
                        transform: translateX(-50%);
                        background-color: rgba(31, 39, 46, 0.8);
                        width: 60px;
                        height: 60px;
                        border-radius: 50%;
                        transition: 0.2s;
                        cursor: pointer;
                    }

                        body.district section.section_tableData .container .row .tableBox ul.item li.intoVideo a .playIcon i {
                            position: absolute;
                            top: 50%;
                            left: 50%;
                            transform: translate(-40%, -50%);
                            cursor: pointer;
                            font-size: 20px;
                            color: #fff;
                            border-radius: 50%;
                        }

                        body.district section.section_tableData .container .row .tableBox ul.item li.intoVideo a .playIcon:hover {
                            width: 70px;
                            height: 70px;
                            border: 3px solid #F6B45D;
                            background-color: #1F272E;
                        }

                    body.district section.section_tableData .container .row .tableBox ul.item li.funProgress {
                        position: relative;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                    }

                        body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card {
                            position: relative;
                            width: 140px;
                            height: 140px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                        }

                            body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent {
                                position: relative;
                                width: 100px;
                                height: 100px;
                            }

                                body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .dot {
                                    position: absolute;
                                    inset: 5px;
                                    z-index: 10;
                                    transform: rotate(calc(3.6deg * var(--num)));
                                }

                                    body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .dot.active {
                                        animation: animateDot 1s linear forwards;
                                    }

@keyframes animateDot {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(calc(3.6deg * var(--num)));
    }
}

body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .dot::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--clr);
    box-shadow: 0 0 10px var(--clr), 0 0 30px var(--clr);
}

body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent svg {
    position: relative;
    width: 100px;
    height: 100px;
    transform: rotate(270deg);
}

    body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent svg circle {
        width: 100%;
        height: 100%;
        fill: transparent;
        stroke-width: 6;
        stroke: rgba(45, 60, 82, 0.8);
    }

        body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent svg circle:nth-child(2) {
            stroke: var(--clr);
            stroke-dasharray: 283;
            stroke-dashoffset: calc(283 - 283 * var(--num) / 100);
            opacity: 0;
        }

            body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent svg circle:nth-child(2).active {
                animation: lineShow 1s linear forwards;
                animation-delay: 1s;
            }

@keyframes lineShow {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .number {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0;
    color: #ee8484;
    animation-delay: 1s;
}

    body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .number h3 {
        display: flex;
        justify-content: center;
        font-weight: 700;
    }

        body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .number h3 span {
            font-weight: 300;
        }

    body.district section.section_tableData .container .row .tableBox ul.item li.funProgress .card .percent .number.active {
        animation: lineShow 1s linear forwards;
    }

body.district section.section_tableData .container .row .tableBox ul.item li.donation a {
    text-decoration: none;
}

    body.district section.section_tableData .container .row .tableBox ul.item li.donation a .donateBtn {
        border: 1.5px solid transparent;
        border-radius: 5px;
        display: inline-block;
        padding: 10px 40px;
        color: white;
        background-color: #E57063;
        transition: 0.2s;
        cursor: pointer;
    }

        body.district section.section_tableData .container .row .tableBox ul.item li.donation a .donateBtn:hover {
            border: 1.5px solid #E57063;
            color: #dc4434;
            background-color: rgba(229, 112, 99, 0.25);
        }

body.district section.section_tableData .container .row.Phone {
    display: none;
}

@media (max-width: 1440px) {
    body.district section.section_tableData .container {
        padding: 30px 0;
    }
}

@media (max-width: 1280px) {
    body.district section.section_tableData .container .row {
        width: 90%;
    }
}

@media (max-width: 991px) {
    body.district section.section_tableData .container .row .cityName {
        display: none;
    }

    body.district section.section_tableData .container .row .tableBox ul.item {
        margin: 10px 0;
    }

        body.district section.section_tableData .container .row .tableBox ul.item li {
            font-size: 16px;
        }

            body.district section.section_tableData .container .row .tableBox ul.item li.disName {
                font-size: 18px;
            }

            body.district section.section_tableData .container .row .tableBox ul.item li.donation a .donateBtn {
                padding: 10px 22px;
            }

    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funProgress span {
        color: #E57063;
        font-weight: 700;
    }
}

@media (max-width: 575px) {
    body.district section.section_tableData {
        background-color: #2D3C52;
    }

        body.district section.section_tableData .container {
            padding: 30px 0 55px 0;
        }

            body.district section.section_tableData .container .row.Desktop {
                display: none;
            }

            body.district section.section_tableData .container .row.Phone {
                display: block;
            }

                body.district section.section_tableData .container .row.Phone .dropdownBox ul {
                    list-style: none;
                }

                    body.district section.section_tableData .container .row.Phone .dropdownBox ul a {
                        text-decoration: none;
                    }

                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion {
                    width: 100%;
                    max-width: 360px;
                    margin: 30px auto 20px;
                    background: #2D3C52;
                    border-radius: 4px;
                }

                    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li {
                        background-color: #2D3C52;
                    }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .link {
                            border-radius: 50px;
                            cursor: pointer;
                            display: block;
                            padding: 15px 15px 15px 42px;
                            color: #4D4D4D;
                            background-color: #ececec;
                            font-weight: 700;
                            border-bottom: 1px solid #CCC;
                            position: relative;
                            transition: all 0.4s ease;
                            margin-bottom: 5px;
                        }

                            body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .link.district {
                                font-size: 18px;
                            }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .circle {
                            border-radius: 50%;
                            width: 30px;
                            height: 30px;
                            position: absolute;
                            top: 26px;
                            right: 2px;
                            transform: translate(-50%, -50%);
                            background-color: #E57063;
                        }

                            body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .circle i {
                                position: absolute;
                                transform: translate(-50%, -50%);
                                top: 15.5px;
                                right: 1px;
                                font-size: 18px;
                                color: #fff;
                                transition: all 0.4s ease;
                                z-index: 100;
                            }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu {
                            display: none;
                            font-size: 14px;
                        }

                            body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li {
                                position: relative;
                                margin-bottom: 5px;
                            }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li a, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funTarget, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funProgress {
                                    text-align: center;
                                    border-radius: 50px;
                                    display: block;
                                    text-decoration: none;
                                    color: #3A3A3A;
                                    background-color: #D9D9D9;
                                    padding: 12px;
                                    transition: all 0.25s ease;
                                }

                                    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li a:hover, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funTarget:hover, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funProgress:hover {
                                        color: #3A3A3A;
                                    }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .txtSite {
                                    margin-left: 136px;
                                    border-radius: 0 50px 50px 0;
                                }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .finished {
                                    color: #E57063;
                                    font-weight: bolder;
                                }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funProgress, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funTarget {
                                    text-align: left;
                                }

                                    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funProgress::before {
                                        content: "募款進度：";
                                        border-radius: 50px 0 0 50px;
                                        padding: 12px 20px 12px 42px;
                                        color: #fff;
                                        background-color: #3A3A3A;
                                        position: absolute;
                                        top: 50%;
                                        left: 0;
                                        transform: translateY(-50%);
                                    }

                                    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .funTarget::before {
                                        content: "募款目標：";
                                        border-radius: 50px 0 0 50px;
                                        padding: 12px 20px 12px 42px;
                                        color: #fff;
                                        background-color: #3A3A3A;
                                        position: absolute;
                                        top: 50%;
                                        left: 0;
                                        transform: translateY(-50%);
                                    }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .intoVideoBtn, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .donateBtn {
                                    border-radius: 5px;
                                    display: inline-block;
                                    padding: 10px 20px;
                                    width: 150px;
                                }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .intoVideoBtn {
                                    background-color: #F6B45D;
                                    color: #3A3A3A;
                                }

                                body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .submenu li .donateBtn {
                                    background-color: #E57063;
                                    color: #fff;
                                }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li i.fa-solid.fa-plus, body.district section.section_tableData .container .row.Phone .dropdownBox .accordion li .fa-solid.fa-minus {
                            right: 1px;
                            left: auto;
                            font-size: 16px;
                        }

                    body.district section.section_tableData .container .row.Phone .dropdownBox .accordion .open {
                        border-radius: 50px;
                    }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion .open .link {
                            color: #b63b4d;
                        }

                        body.district section.section_tableData .container .row.Phone .dropdownBox .accordion .open i {
                            color: #b63b4d;
                        }
}

body.district section.section_Banner .container .row .Banner {
    border: 0px solid transparent;
    width: 100%;
}

    body.district section.section_Banner .container .row .Banner img {
        width: 100%;
        display: block;
    }

@media (max-width: 575px) {
    body.district section.section_Banner .container .row {
        overflow: hidden;
    }

        body.district section.section_Banner .container .row .Banner {
            width: 200%;
        }
}

@media (max-width: 375px) {
    body.district section.section_Banner .container .row {
        overflow: hidden;
    }

        body.district section.section_Banner .container .row .Banner {
            width: 250%;
        }
}

body.district_Film header {
    background-color: #2D3C52;
    position: relative;
}

    body.district_Film header nav ul.nav-bar {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }

body.district_Film section.section_districtSelect {
    background-color: #2D3C52;
    position: relative;
}

    body.district_Film section.section_districtSelect .container-fluid {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        overflow: hidden;
    }

        body.district_Film section.section_districtSelect .container-fluid img {
            position: absolute;
            width: 100%;
            opacity: 0.4;
        }

        body.district_Film section.section_districtSelect .container-fluid .transparentGradient {
            position: relative;
            z-index: 2;
            background-image: linear-gradient(to top, #2D3C52 0%, transparent 60%);
            width: 100%;
            height: 100%;
        }

    body.district_Film section.section_districtSelect .container {
        position: relative;
        z-index: 2;
        padding: 180px 0 45px 0;
        max-width: 75vw;
        margin: auto;
    }

        body.district_Film section.section_districtSelect .container .row .townIntro {
            color: white;
        }

        body.district_Film section.section_districtSelect .container .row .SelectBox {
            /* display: flex; */
            border-radius: 25px;
        }

            body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData {
                flex: 50%;
            }

                body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName {
                    font-size: 35px;
                    font-weight: bolder;
                    color: #fff;
                    margin-bottom: 45px;
                }

                    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName span.districtName {
                        color: #F6B45D;
                        margin-left: 15px;
                    }

                body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                }

                    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn {
                        padding-right: 20px;
                        margin-bottom: 45px;
                    }

                    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .AreaBtn {
                        padding-right: 20px;
                        margin-bottom: 45px;
                    }

                    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn {
                        margin-bottom: 45px;
                    }

                        body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn a {
                            border: 1.5px solid #fff;
                            text-decoration: none;
                            width: 200px;
                            background-color: #3A3A3A;
                            padding: 7px 35px;
                            border-radius: 5px;
                            color: #fff;
                            font-size: 18px;
                            transition: 0.2s;
                        }

                            body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn a:hover {
                                border: 1.5px solid #fff;
                                background-color: rgba(255, 255, 255, 0.1);
                                color: #fff;
                            }

                    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox select {
                        font-size: 18px;
                        font-weight: 500;
                        width: 180px;
                        background-color: #D9D9D9;
                        color: #3A3A3A;
                        padding: 8px 20px;
                        border-radius: 5px;
                        -webkit-appearance: none;
                        -moz-appearance: none;
                        appearance: none;
                        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                        background-repeat: no-repeat;
                        background-position: right 1rem center;
                        background-size: 2em;
                        outline: none;
                    }

            body.district_Film section.section_districtSelect .container .row .SelectBox .rightInforBox {
                flex: 50%;
                color: white;
                font-size: 18px;
                line-height: 35px;
                display: flex;
                align-items: bottom;
                width: 65%;
                margin-top: 60px;
            }

@media (max-width: 1200px) {
    body.district_Film section.section_districtSelect .container {
        padding: 150px 0 15px 0;
    }
}

@media (max-width: 1024px) {
    body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox select {
        width: 170px;
    }
}

@media (max-width: 991px) {
    body.district_Film header {
        height: initial;
    }

    body.district_Film section.section_districtSelect .container-fluid img {
        opacity: 0.2;
    }

    body.district_Film section.section_districtSelect .container {
        padding: 180px 0 45px 0;
    }

        body.district_Film section.section_districtSelect .container .row .SelectBox {
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

            body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName {
                margin-bottom: 45px;
            }

            body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox {
                flex-direction: column;
            }

                body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn, body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .AreaBtn {
                    padding-right: 0;
                }

                body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn {
                    margin-bottom: 25px;
                }

            body.district_Film section.section_districtSelect .container .row .SelectBox .rightInforBox {
                width: 100%;
                margin-top: 40px;
            }

                body.district_Film section.section_districtSelect .container .row .SelectBox .rightInforBox .infor {
                    text-align: left;
                }

            body.district_Film section.section_districtSelect .container .row .SelectBox .content {
                width: 100% !important;
            }
}

@media (max-width: 787px) {
    body.district_Film section.section_districtSelect .container {
        max-width: 80vw;
    }
}

@media (max-width: 768px) {
    body.district_Film section.section_districtSelect .container-fluid .transparentGradient {
        background-image: linear-gradient(to top, #2D3C52 0%, transparent 100%);
    }
}

@media (max-width: 414px) {
    body.district_Film section.section_districtSelect .container {
        padding: 70px 0 22px 0;
    }

        body.district_Film section.section_districtSelect .container .row .SelectBox .leftBoxSelectData {
            margin-top: 65px;
        }
}

@media (max-width: 375px) {
    body.district_Film section.section_districtSelect .container {
        max-width: 83vw;
    }
}

body.district_Film section.section_Film {
    background-color: #2D3C52;
}

    body.district_Film section.section_Film .container {
        padding: 30px 0;
        max-width: 75vw;
        margin: auto;
    }

        body.district_Film section.section_Film .container .row {
            position: relative;
        }

            body.district_Film section.section_Film .container .row .video {
                width: 100%;
                border-radius: 25px;
                overflow: hidden;
            }

                body.district_Film section.section_Film .container .row .video a {
                    cursor: pointer;
                }

                    body.district_Film section.section_Film .container .row .video a img {
                        cursor: pointer;
                        width: 100%;
                    }

                    body.district_Film section.section_Film .container .row .video a .playIcon {
                        border: 2px solid #fff;
                        position: absolute;
                        top: 50%;
                        left: 50%;
                        transform: translate(-50%, -50%);
                        background-color: rgba(31, 39, 46, 0.8);
                        width: 100px;
                        height: 100px;
                        border-radius: 50%;
                        transition: 0.2s;
                        cursor: pointer;
                    }

                        body.district_Film section.section_Film .container .row .video a .playIcon i {
                            position: absolute;
                            top: 50%;
                            left: 50%;
                            transform: translate(-40%, -50%);
                            cursor: pointer;
                            font-size: 28px;
                            color: #fff;
                            border-radius: 50%;
                        }

                    body.district_Film section.section_Film .container .row .video a:hover .playIcon {
                        width: 90px;
                        height: 90px;
                        border: 3px solid #F6B45D;
                        background-color: #1F272E;
                    }

                body.district_Film section.section_Film .container .row .video .prayForTaiText {
                    font-size: 32px;
                    font-weight: 550;
                    color: #fff;
                    position: absolute;
                    bottom: -10;
                    right: 0;
                    transform: translate(-20px, -10px);
                }

                    body.district_Film section.section_Film .container .row .video .prayForTaiText span.tai {
                        color: #E57063;
                    }

@media (max-width: 991px) {
    body.district_Film section.section_Film .container .row .video {
        border-radius: 10px;
    }
}

@media (max-width: 787px) {
    body.district_Film section.section_Film .container {
        max-width: 80vw;
    }
}

@media (max-width: 575px) {
    /* body.district_Film section.section_Film .container {
        max-width: 95vw;
    } */

    body.district_Film section.section_Film .container .row .video a .playIcon {
        width: 80px;
        height: 80px;
    }

    body.district_Film section.section_Film .container .row .video a:hover {
        width: 70px;
        height: 70px;
    }
}

@media (max-width: 414px) {
    body.district_Film section.section_Film .container .row .video .prayForTaiText {
        font-size: 22px;
    }
}

body.district_Film {
    position: relative;
}

    body.district_Film section.section_PrayerArticles {
        position: relative;
        z-index: 1;
        background-color: #2D3C52;
        border-radius: 0 0 25px 25px;
    }

        body.district_Film section.section_PrayerArticles .container {
            padding: 100px 0;
            max-width: 75vw;
            margin: auto;
        }

            body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox {
                line-height: 40px;
            }

                body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox .titlBox {
                    color: #fff;
                    margin-bottom: 45px;
                }

                    body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox .titlBox .colorBlock {
                        width: 130px;
                        height: 45px;
                        background-color: #E57063;
                        border-radius: 50px 0px 80px 50px;
                        position: relative;
                        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
                    }

                        body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox .titlBox .colorBlock .title {
                            font-size: 22px;
                            font-weight: 450;
                            position: absolute;
                            bottom: -9px;
                            left: 14px;
                            transform: translate(1px, 1px);
                        }

                body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox .content {
                    color: #fff;
                    font-size: 18px;
                    font-weight: 300;
                }

@media (max-width: 991px) {
    body.district_Film section.section_PrayerArticles .container {
        padding: 70px 0;
    }

        body.district_Film section.section_PrayerArticles .container .row .prayerArtiBox .titlBox .title {
            font-size: 22px;
            transform: translate(1px, 3px);
        }
}

@media (max-width: 787px) {
    body.district_Film section.section_PrayerArticles .container {
        max-width: 80vw;
    }
}

@media (max-width: 414px) {
    body.district_Film section.section_PrayerArticles .container {
        padding: 32px 0;
    }
}

@media (max-width: 375px) {
    body.district_Film section.section_PrayerArticles .container {
        max-width: 83vw;
    }
}

body.district_Film {
    position: relative;
}

    body.district_Film section.section_Pic {
        position: relative;
        top: -20px;
    }

        body.district_Film section.section_Pic .container .row .picBox {
            width: 100%;
        }

            body.district_Film section.section_Pic .container .row .picBox img {
                width: 100%;
            }

    body.district_Film section.section_PrayerDocument .container {
        padding: 45px 0 100px 0;
        max-width: 75vw;
        margin: auto;
    }

        body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox {
            line-height: 40px;
        }

            body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox {
                color: #fff;
                margin-bottom: 45px;
            }

                body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox .colorBlock {
                    width: 140px;
                    height: 45px;
                    background-color: #FFCF28;
                    border-radius: 50px 0px 80px 50px;
                    position: relative;
                    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
                }

                    body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox .colorBlock.txtBlue {
                        width: 180px;
                        background-color: #2D3C52;
                        margin-top: 60px;
                    }

                        body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox .colorBlock.txtBlue .title.txtWhite {
                            color: white;
                        }

                body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox .title {
                    color: #3A3A3A;
                    font-size: 20px;
                    font-weight: 450;
                    position: absolute;
                    bottom: -6px;
                    left: 10px;
                    transform: translate(4px, 4px);
                }

            body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .content {
                color: #585858;
                font-size: 18px;
                font-weight: 305;
            }

@media (max-width: 991px) {
    body.district_Film section.section_PrayerDocument .container {
        padding: 70px 0;
    }
}

@media (max-width: 787px) {
    body.district_Film section.section_PrayerDocument .container {
        max-width: 80vw;
    }

        body.district_Film section.section_PrayerDocument .container .row .prayerDocuBox .titlBox .colorBlock.txtBlue {
            margin-top: 45px;
        }
}

@media (max-width: 414px) {
    body.district_Film section.section_PrayerDocument .container {
        padding: 45px 0;
    }
}

@media (max-width: 375px) {
    body.district_Film section.section_PrayerDocument .container {
        max-width: 83vw;
    }
}

@media (max-width: 768px) {
    body.district_Film section.section_Pic .container .row {
        overflow: hidden;
    }

        body.district_Film section.section_Pic .container .row .picBox {
            width: 150%;
        }
}

@media (max-width: 575px) {
    body.district_Film section.section_Pic .container .row .picBox {
        width: 210%;
    }
}

@media (max-width: 375px) {
    body.district_Film section.section_Pic .container .row .picBox {
        width: 250%;
    }
}

body.district_In_Rroduction header {
    background-color: #2D3C52;
    position: relative;
}

    body.district_In_Rroduction header nav ul.nav-bar {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }

body.district_In_Rroduction section.section_districtSelect {
    background-color: #2D3C52;
    position: relative;
}

    body.district_In_Rroduction section.section_districtSelect .container-fluid {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        overflow: hidden;
    }

        body.district_In_Rroduction section.section_districtSelect .container-fluid img {
            position: absolute;
            width: 100%;
            opacity: 0.4;
        }

        body.district_In_Rroduction section.section_districtSelect .container-fluid .transparentGradient {
            position: relative;
            z-index: 2;
            background-image: linear-gradient(to top, #2D3C52 0%, transparent 60%);
            width: 100%;
            height: 100%;
        }

    body.district_In_Rroduction section.section_districtSelect .container {
        position: relative;
        z-index: 2;
        padding: 180px 0 45px 0;
        max-width: 85vw;
        margin: auto;
    }

        body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox {
            display: flex;
            border-radius: 25px;
        }

            body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData {
                flex: 50%;
            }

                body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName {
                    font-size: 35px;
                    font-weight: bolder;
                    color: #fff;
                    margin-bottom: 45px;
                }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName span.districtName {
                        color: #F6B45D;
                    }

                body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn {
                        padding-right: 20px;
                        margin-bottom: 45px;
                    }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .AreaBtn {
                        padding-right: 20px;
                        margin-bottom: 45px;
                    }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn {
                        margin-bottom: 45px;
                    }

                        body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn a {
                            border: 1.5px solid #fff;
                            text-decoration: none;
                            width: 200px;
                            background-color: #3A3A3A;
                            padding: 7px 45px;
                            border-radius: 5px;
                            color: #fff;
                            font-size: 18px;
                            transition: 0.2s;
                        }

                            body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .SearchBtn a:hover {
                                border: 1.5px solid #fff;
                                background-color: rgba(255, 255, 255, 0.1);
                                color: #fff;
                            }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox select {
                        font-size: 18px;
                        font-weight: 500;
                        width: 180px;
                        background-color: #D9D9D9;
                        color: #3A3A3A;
                        padding: 8px 20px;
                        border-radius: 5px;
                        -webkit-appearance: none;
                        -moz-appearance: none;
                        appearance: none;
                        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                        background-repeat: no-repeat;
                        background-position: right 1rem center;
                        background-size: 2em;
                        outline: none;
                    }

            body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .rightInforBox {
                flex: 50%;
                color: white;
                font-size: 18px;
                line-height: 35px;
                display: flex;
                align-items: bottom;
                justify-content: center;
                margin-top: 60px;
                width: 65%;
            }

body.district_Film section.section_districtSelect .container .row .SelectBox .titleBox {
    color: #fff;
    margin-bottom: 45px;
    margin-top: 60px;
}

    body.district_Film section.section_districtSelect .container .row .SelectBox .titleBox .colorBlock {
        width: 130px;
        height: 45px;
        background-color: #E57063;
        border-radius: 50px 0px 80px 50px;
        position: relative;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
    }

        body.district_Film section.section_districtSelect .container .row .SelectBox .titleBox .colorBlock .title {
            font-size: 22px;
            font-weight: 450;
            position: absolute;
            bottom: -1px;
            left: 14px;
            transform: translate(1px, 1px);
        }

body.district_Film section.section_districtSelect .container .row .SelectBox .content {
    color: #fff;
    font-size: 19px;
    font-weight: 450;
    line-height: 40px;
    width: 65%;
    text-align: left;
}

@media (max-width: 1200px) {
    body.district_In_Rroduction section.section_districtSelect .container {
        padding: 150px 0 15px 0;
    }
}

@media (max-width: 1024px) {
    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox select {
        width: 170px;
    }
}

@media (max-width: 991px) {
    body.district_In_Rroduction header {
        height: initial;
    }

    body.district_In_Rroduction section.section_districtSelect .container-fluid img {
        opacity: 0.2;
    }

    body.district_In_Rroduction section.section_districtSelect .container {
        padding: 180px 0 45px 0;
    }

        body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox {
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

            body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .districtName {
                margin-bottom: 0;
            }

            body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox {
                padding: 40px 60px;
            }

                body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox {
                    flex-direction: column;
                }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn, body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .AreaBtn {
                        padding-right: 0;
                    }

                    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .leftBoxSelectData .SelectAreaBox .selecInsideBox .CountyCityBtn {
                        margin-bottom: 25px;
                    }

    body.district_Film section.section_districtSelect .container .row .SelectBox .rightInforBox {
        width: 100%;
        margin-top: 40px;
    }

    body.district_In_Rroduction section.section_districtSelect .container .row .SelectBox .rightInforBox .infor {
        text-align: left;
    }
}

@media (max-width: 768px) {
    body.district_In_Rroduction section.section_districtSelect .container-fluid .transparentGradient {
        background-image: linear-gradient(to top, #2D3C52 0%, transparent 100%);
    }
}

@media (max-width: 414px) {
    body.district_In_Rroduction section.section_districtSelect .container {
        /*        padding: 70px 0 22px 0;
*/
    }
}

body.district_In_Rroduction section.section_inProduction {
    background-color: #2D3C52;
}

    body.district_In_Rroduction section.section_inProduction .container {
        padding: 110px 0 200px 0;
        max-width: 75vw;
        margin: auto;
    }

        body.district_In_Rroduction section.section_inProduction .container .row {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
        }

            body.district_In_Rroduction section.section_inProduction .container .row .textBox {
                color: #fff;
                text-align: center;
                margin-bottom: 80px;
            }

                body.district_In_Rroduction section.section_inProduction .container .row .textBox h3 {
                    position: relative;
                    color: rgba(0, 0, 0, 0.3);
                    font-weight: 400;
                }

                    body.district_In_Rroduction section.section_inProduction .container .row .textBox h3.inProdution:before {
                        content: attr(data-text);
                        position: absolute;
                        overflow: hidden;
                        max-width: 7em;
                        white-space: nowrap;
                        color: #fff;
                        animation: loading 3s linear infinite;
                    }

                    body.district_In_Rroduction section.section_inProduction .container .row .textBox h3.fundraising:before {
                        content: attr(data-text);
                        position: absolute;
                        overflow: hidden;
                        max-width: 12em;
                        white-space: nowrap;
                        color: #fff;
                        animation: loading 3s linear infinite;
                    }

@keyframes loading {
    0% {
        max-width: 0;
    }
}

body.district_In_Rroduction section.section_inProduction .container .row a {
    text-decoration: none;
}

    body.district_In_Rroduction section.section_inProduction .container .row a .donateBtn {
        border: 1.5px solid transparent;
        border-radius: 5px;
        display: inline-block;
        padding: 10px 50px;
        color: white;
        background-color: #E57063;
        transition: 0.2s;
        font-size: 20px;
        cursor: pointer;
    }

        body.district_In_Rroduction section.section_inProduction .container .row a .donateBtn:hover {
            border: 1.5px solid #E57063;
            color: #dc4434;
            background-color: rgba(229, 112, 99, 0.25);
        }

    body.district_In_Rroduction section.section_inProduction .container .row a .p4tIcon {
        position: relative;
        width: 50px;
        display: flex;
    }

        body.district_In_Rroduction section.section_inProduction .container .row a .p4tIcon .P {
            flex: 40%;
            width: 75%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(155%, -201%);
            animation: jumpP 0.4s infinite ease-in alternate;
        }

        body.district_In_Rroduction section.section_inProduction .container .row a .p4tIcon .FourT {
            flex: 60%;
            width: 100%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(185%, -212%);
            animation: jump4T 0.4s infinite ease-in alternate;
            animation-delay: 0.2s;
        }

@keyframes jumpP {
    0% {
        transform: translate(155%, -201%);
    }

    100% {
        transform: translate(155%, -218%);
    }
}

@keyframes jump4T {
    0% {
        transform: translate(185%, -212%);
    }

    100% {
        transform: translate(185%, -230%);
    }
}

@media (max-width:991px) {
    body.district_In_Rroduction section.section_inProduction .container {
        padding: 0 0 200px 0;
    }
}

body.introduction header {
    position: relative;
}

    body.introduction header nav ul.nav-bar {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }

body.introduction section.section_Banner {
    position: relative;
}

    body.introduction section.section_Banner .container .row .picBox {
        width: 100%;
    }

        body.introduction section.section_Banner .container .row .picBox img {
            width: 100%;
        }

        body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
            margin: auto;
            position: absolute;
            bottom: -7px;
            right: 120px;
            transform: translate(0%, -10%);
            font-size: 36px;
            font-weight: 550;
            color: #fff;
        }

            body.introduction section.section_Banner .container .row .picBox .prayForTaiText span.tai {
                color: #E57063;
            }

@media (max-width: 1440px) {
    body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
        font-size: 32px;
        transform: translate(0%, -10%);
    }
}

@media (max-width: 991px) {
    body.introduction header {
        height: initial;
    }

    body.introduction section.section_Banner {
        top: -65px;
    }

        body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
            transform: translate(18%, -10%);
        }
}

@media (max-width: 768px) {
    body.introduction section.section_Banner {
        top: -27px;
    }

        body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
            font-size: 26px;
            bottom: -5px;
        }
}

@media (max-width: 575px) {
    body.introduction section.section_Banner .container .row .picBox {
        overflow: hidden;
    }

        body.introduction section.section_Banner .container .row .picBox img {
            width: 150%;
        }

        body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
            transform: translate(32%, -10%);
        }
}

@media (max-width: 414px) {
    body.introduction section.section_Banner .container .row .picBox .prayForTaiText {
        font-size: 18px;
        bottom: -2px;
        transform: translate(47%, -10%);
    }
}

@media (max-width: 375px) {
    body.introduction section.section_Banner .container .row .picBox img {
        width: 180%;
    }
}

body.introduction section.section_introArticles {
    border-radius: 0 0 25px 25px;
}

    body.introduction section.section_introArticles .container {
        padding: 80px 0;
        max-width: 75vw;
        margin: auto;
    }

        body.introduction section.section_introArticles .container .row .introArtiBox {
            line-height: 40px;
        }

            body.introduction section.section_introArticles .container .row .introArtiBox .titlBox {
                color: #fff;
                margin-bottom: 45px;
            }

                body.introduction section.section_introArticles .container .row .introArtiBox .titlBox .colorBlock {
                    width: 200px;
                    height: 45px;
                    background-color: #E57063;
                    border-radius: 50px 0px 80px 50px;
                    position: relative;
                    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
                }

                    body.introduction section.section_introArticles .container .row .introArtiBox .titlBox .colorBlock .title {
                        font-size: 20px;
                        font-weight: 450;
                        position: absolute;
                        bottom: -9px;
                        left: 10px;
                        transform: translate(1px, 1px);
                    }

                    body.introduction section.section_introArticles .container .row .introArtiBox .titlBox .colorBlock.lenght {
                        width: 150px;
                    }

                body.introduction section.section_introArticles .container .row .introArtiBox .titlBox .onlytitle {
                    color: #3A3A3A;
                    font-size: 20px;
                    font-weight: bolder;
                }

            body.introduction section.section_introArticles .container .row .introArtiBox .content {
                color: #585858;
                font-size: 18px;
                font-weight: 305;
            }

                body.introduction section.section_introArticles .container .row .introArtiBox .content span.markred {
                    color: #E57063;
                }

            body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down {
                font-size: 26px;
                color: #E57063;
                animation: scale 0.5s infinite ease-in alternate;
            }

                body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down.scale01 {
                    animation: scale 0.4s infinite ease-in alternate;
                    animation-delay: 0.7s;
                }

                body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down.scale02 {
                    animation: scale 0.4s infinite ease-in alternate;
                    animation-delay: 0.1s;
                }

                body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down.scale03 {
                    animation: scale 0.4s infinite ease-in alternate;
                    animation-delay: 0.13s;
                }

                body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down.scale04 {
                    animation: scale 0.4s infinite ease-in alternate;
                    animation-delay: 0.16s;
                }

                body.introduction section.section_introArticles .container .row .introArtiBox i.fa-solid.fa-caret-down.scale05 {
                    animation: scale 0.4s infinite ease-in alternate;
                    animation-delay: 0.19s;
                }

@keyframes scale {
    0% {
        scale: 1;
    }

    100% {
        scale: 1.5;
    }
}

@media (max-width: 991px) {
    body.introduction section.section_introArticles .container {
        padding: 0;
    }

        body.introduction section.section_introArticles .container .row .introArtiBox .titlBox .title {
            font-size: 22px;
            transform: translate(1px, 3px);
        }
}

@media (max-width: 768px) {
    body.introduction section.section_introArticles .container {
        max-width: 80vw;
        padding: 60px 0;
    }
}

@media (max-width: 575px) {
    body.introduction section.section_introArticles .container {
        padding: 30px 0;
    }
}

@media (max-width: 414px) {
    body.introduction section.section_introArticles .container {
        padding: 32px 0;
    }
}

@media (max-width: 375px) {
    body.introduction section.section_introArticles .container {
        max-width: 83vw;
    }
}

body.AllVideo header {
    position: relative;
}

    body.AllVideo header nav ul.nav-bar {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        z-index: 100;
    }

body.AllVideo section.section_VideoSlider {
    position: relative;
}

    body.AllVideo section.section_VideoSlider .container {
        position: relative;
    }

        body.AllVideo section.section_VideoSlider .container .slide-container {
            display: none;
            position: relative;
            z-index: 1;
        }

            body.AllVideo section.section_VideoSlider .container .slide-container .slide {
                height: 700px;
                position: relative;
                overflow: hidden;
                z-index: -1;
            }

                body.AllVideo section.section_VideoSlider .container .slide-container .slide .content {
                    height: 100%;
                    width: 100%;
                    background-color: rgba(0, 0, 0, 0.3);
                    text-align: left;
                    line-height: 30px;
                    position: relative;
                    z-index: 2;
                }

                    body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox {
                        width: 500px;
                        position: absolute;
                        bottom: 10%;
                        right: 5%;
                        transform: translate(-10%, -15%);
                    }

                        body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .text {
                            font-size: 16px;
                            color: #fff;
                            padding: 5px 0 0 0;
                            font-weight: lighter;
                            text-shadw: 0 5px 10px rgba(0, 0, 0, 0.3);
                            max-width: 700px;
                            animation: animate 0.4s linear 0.4s backwards;
                            display: -webkit-box;
                            -webkit-box-orient: vertical;
                            -webkit-line-clamp: 3;
                            overflow: hidden;
                            position: relative;
                        }

                        body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox a {
                            color: #fff;
                            font-weight: lighter;
                            display: flex;
                            align-items: center;
                            padding: 0 0 5px 0;
                            text-decoration: none;
                            width: 100px;
                        }

                            body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox a .learMore {
                                color: #fff;
                                animation: animate 0.4s linear 0.4s backwards;
                                border-bottom: 0.5px solid #fff;
                                font-weight: lighter;
                            }

                            body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox a .arrow {
                                overflow: hidden;
                            }

                                body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox a .arrow i.fa-solid.fa-arrow-right {
                                    margin-left: 6px;
                                    position: relative;
                                    left: 0;
                                    transform: translateX(-22px);
                                    transition: 0.2s;
                                }

                            body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox a:hover .arrow i.fa-solid.fa-arrow-right {
                                transform: translateX(0px);
                            }

                        body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .districtNmae {
                            display: flex;
                            align-items: center;
                            margin-top: 10px;
                        }

                            body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .districtNmae a.btn {
                                display: inline-block;
                                padding: 9px 30px;
                                background-color: #E57063;
                                box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
                                color: #fff;
                                font-weight: bold;
                                font-size: 18px;
                                margin-right: 10px;
                                text-decoration: none;
                                transition: 2s linear;
                                animation: animate 0.4s linear 0.4s backwards;
                                position: relative;
                                z-index: 1;
                                border-radius: 50px 0 80px 50px;
                                width: 125px;
                                height: 45px;
                            }

                                body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .districtNmae a.btn .cityName {
                                    position: absolute;
                                    bottom: -1px;
                                    left: 11px;
                                    font-size: 30px;
                                }

@keyframes animate {
    0% {
        opacity: 0;
        transform: scale(0.5) translateY(-50px);
    }
}

body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .districtNmae a.btn:hover {
    letter-spacing: 2px;
}

body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .districtNmae h3 {
    font-size: 30px;
    padding-top: 15px;
    color: #fff;
    text-shadw: 0 5px 10px rgba(0, 0, 0, 0.3);
    animation: animate 0.4s linear 0.4s backwards;
}

body.AllVideo section.section_VideoSlider .container .slide-container .slide video {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    animation: fadeIn 0.4s linear;
}

@keyframes fadeIn {
    0% {
        transform: scale(1.5);
    }
}

body.AllVideo section.section_VideoSlider .container .slide-container.active {
    display: block;
}

body.AllVideo section.section_VideoSlider .container #next, body.AllVideo section.section_VideoSlider .container #prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
    background-color: rgba(225, 225, 225, 0.5);
    color: #333;
    font-weight: bold;
    height: 60px;
    width: 50px;
    line-height: 55px;
    font-size: 35px;
    cursor: pointer;
    text-align: center;
}

body.AllVideo section.section_VideoSlider .container #next {
    right: 0;
}

body.AllVideo section.section_VideoSlider .container #prev {
    left: 0;
}

@media (max-width: 1440px) {
    body.AllVideo section.section_VideoSlider .container .slide-container .slide {
        height: 600px;
    }
}

@media (max-width: 1200px) {
    body.AllVideo section.section_VideoSlider .container .slide-container .slide {
        height: 550px;
    }

        body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox {
            width: 400px;
        }
}

@media (max-width: 1204px) {
    body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox {
        width: 350px;
    }
}

@media (max-width: 991px) {
    body.AllVideo header {
        height: initial;
    }

    body.AllVideo section.section_VideoSlider .container .slide-container .slide {
        height: 400px;
    }

        body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox .text {
            -webkit-line-clamp: 2;
            font-size: 16px;
        }
}

@media (max-width: 768px) {
    body.AllVideo header {
        height: initial;
    }

    body.AllVideo section.section_VideoSlider .container .slide-container .slide {
        min-height: 100vh;
    }

    body.AllVideo section.section_VideoSlider .container .slide-container video {
        height: 100%;
    }
}

@media (max-width: 575px) {
    body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox {
        width: 345px;
        right: 1%;
    }
}

@media (max-width: 414px) {
    body.AllVideo section.section_VideoSlider .container .slide-container .slide .content .contentBox {
        width: 250px;
    }
}

body.AllVideo section.section_AllVideo .container {
    max-width: 85vw;
    margin: auto;
    padding: 80px 0 0 0;
}

    body.AllVideo section.section_AllVideo .container .row.SelectBox {
        display: flex;
        padding: 0 10px;
    }

        body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox {
            flex: 50%;
        }

            body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox {
                display: flex;
                align-items: center;
                flex-wrap: wrap;
            }

                body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox .CountyCityBtn {
                    padding-right: 20px;
                    margin-bottom: 45px;
                }

                body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox .SearchBtn {
                    margin-bottom: 45px;
                }

                    body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox .SearchBtn a {
                        border: 1.5px solid #fff;
                        text-decoration: none;
                        width: 200px;
                        background-color: #3A3A3A;
                        padding: 7px 45px;
                        border-radius: 5px;
                        color: #fff;
                        font-size: 18px;
                        transition: 0.2s;
                    }

                        body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox .SearchBtn a:hover {
                            border: 1.5px solid #fff;
                            background-color: rgba(58, 58, 58, 0.2);
                            color: #3A3A3A;
                        }

                body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox select {
                    font-size: 18px;
                    font-weight: 500;
                    width: 180px;
                    background-color: #fff;
                    color: #3A3A3A;
                    padding: 8px 20px;
                    border-radius: 5px;
                    -webkit-appearance: none;
                    -moz-appearance: none;
                    appearance: none;
                    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='none' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
                    background-repeat: no-repeat;
                    background-position: right 1rem center;
                    background-size: 2em;
                    outline: none;
                }

        body.AllVideo section.section_AllVideo .container .row.SelectBox .rightCityName {
            flex: 50%;
        }

            body.AllVideo section.section_AllVideo .container .row.SelectBox .rightCityName .cityName {
                font-size: 30px;
                color: #2D3C52;
                text-align: right;
                font-weight: bolder;
            }

                body.AllVideo section.section_AllVideo .container .row.SelectBox .rightCityName .cityName span.En {
                    color: #E57063;
                }

    body.AllVideo section.section_AllVideo .container .row.videoBox {
        margin: 0 0 45px 0;
    }

        body.AllVideo section.section_AllVideo .container .row.videoBox ul {
            display: flex;
            flex-wrap: wrap;
            list-style: none;
        }

            body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video {
                width: 25%;
                padding: 10px;
                margin: 25px 0;
                position: relative;
            }

                body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .imgBox {
                    width: 100%;
                    border-radius: 10px;
                    position: relative;
                    overflow: hidden;
                }

                    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .imgBox img {
                        width: 100%;
                        border-radius: 10px;
                        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
                        transform: scale(1);
                        transition: all 1.1s;
                        background-color: rgba(0, 0, 0, 0.3);
                        display: block;
                    }

                    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .imgBox .cover {
                        width: 100%;
                        height: 100%;
                        background-color: rgba(0, 0, 0, 0.2);
                        position: absolute;
                        top: 0;
                        left: 0;
                        transition: 1s;
                    }

                    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .imgBox .playIcon {
                        border: 2px solid rgba(255, 255, 255, 0.8);
                        position: absolute;
                        top: 50%;
                        left: 50%;
                        transform: translate(-50%, -50%);
                        background-color: rgba(31, 39, 46, 0.4);
                        width: 60px;
                        height: 60px;
                        border-radius: 50%;
                        transition: 1s;
                        cursor: pointer;
                        opacity: 0;
                    }

                        body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .imgBox .playIcon i {
                            position: absolute;
                            top: 50%;
                            left: 50%;
                            transform: translate(-40%, -50%);
                            cursor: pointer;
                            font-size: 28px;
                            color: rgba(255, 255, 255, 0.6);
                            border-radius: 50%;
                        }

                body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a:hover img {
                    transform: scale(1.05);
                }

                body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a:hover .cover {
                    background-color: rgba(0, 0, 0, 0);
                }

                body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a:hover .playIcon {
                    width: 70px;
                    height: 70px;
                    opacity: 1;
                }

                body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a {
                    text-decoration: none !important;
                }

                    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video a .videoName {
                        text-align: center;
                        font-size: 19px;
                        font-weight: 305;
                        margin-top: 20px;
                        color: #585858;
                    }

        body.AllVideo section.section_AllVideo .container .row.videoBox .pagination {
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 60px 40px 0 40px;
        }

            body.AllVideo section.section_AllVideo .container .row.videoBox .pagination ul {
                margin: 20px 15px;
            }

                body.AllVideo section.section_AllVideo .container .row.videoBox .pagination ul li {
                    margin: 0 10px;
                    width: 35px;
                    height: 35px;
                    border-radius: 50%;
                    text-align: center;
                    font-size: 16px;
                    font-weight: 500;
                    line-height: 36px;
                    cursor: pointer;
                    color: #3A3A3A;
                    background-position: 0 -45px;
                    transition: background-position 0.5s;
                }

                    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination ul li.active {
                        color: #fff;
                        background-image: linear-gradient(#E57063, #E57063);
                        background-repeat: no-repeat;
                        background-position: 0 0;
                    }

            body.AllVideo section.section_AllVideo .container .row.videoBox .pagination .btn1, body.AllVideo section.section_AllVideo .container .row.videoBox .pagination .btn2 {
                display: inline-flex;
                align-items: center;
                font-size: 16px;
                font-weight: 500;
                color: #585858;
                background-color: transparent;
                outline: none;
                border: none;
                cursor: pointer;
            }

            body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-left {
                width: 50px;
            }

            body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-right {
                width: 50px;
            }

    body.AllVideo section.section_AllVideo .container .videoBox.phone {
        display: none;
    }

@media (max-width: 991px) {
    body.AllVideo section.section_AllVideo .container .row.videoBox {
        display: none;
    }

        body.AllVideo section.section_AllVideo .container .row.videoBox ul {
            flex-wrap: wrap;
        }

            body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video {
                width: 50%;
            }

        body.AllVideo section.section_AllVideo .container .row.videoBox.phone {
            display: block;
        }
}

@media (max-width: 768px) {
    body.AllVideo section.section_AllVideo .container .row.SelectBox {
        flex-direction: column;
        align-items: center;
    }

        body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox {
            flex-direction: column;
        }

            body.AllVideo section.section_AllVideo .container .row.SelectBox .SelectAreaBox .selecInsideBox .CountyCityBtn {
                padding-right: 0;
                margin-bottom: 25px;
            }

        body.AllVideo section.section_AllVideo .container .row.SelectBox .rightCityName {
            margin-top: 25px;
        }

    body.AllVideo section.section_AllVideo .container .row.videoBox ul {
        flex-wrap: wrap;
    }

        body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video {
            width: 100%;
        }

    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination {
        padding: 60px 0 0 0;
    }
}

@media (max-width: 575px) {
    body.AllVideo section.section_AllVideo .container {
        max-width: 98vh;
    }

        body.AllVideo section.section_AllVideo .container .row.SelectBox .rightCityName .cityName {
            display: flex;
            flex-direction: column;
            align-items: center;
            line-height: 44px;
        }

        body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-left {
            width: 33px;
        }

        body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-right {
            width: 33px;
        }
}

@media (max-width: 414px) {
    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video {
        margin: 25px 0 15px 0;
    }

    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination ul li {
        margin: 0 5px;
    }

    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-left {
        width: 33px;
    }

    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination i.fa-solid.fa-angles-right {
        width: 33px;
    }
}

@media (max-width: 375px) {
    body.AllVideo section.section_AllVideo .container .row.videoBox ul li.video {
        margin: 25px 0 0 0;
    }
}

@media (max-width: 374px) {
    body.AllVideo section.section_AllVideo .container .row.videoBox .pagination ul li {
        margin: 0 3px;
    }
}
/*# sourceMappingURL=style.css.map */