﻿@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);


@font-face {
    font-family: 'Chenyuluoyan';
    /*src: url('../Fonts/Chenyuluoyan.ttf') format('truetype');*/
    src: url('../Fonts/I.Ngaan.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Noto Sans TC';
    font-style: normal;
    font-weight: 500;
    src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.otf) format('opentype');
}

@media (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1400px;
        /* max-width: 1320px;*/
    }
}


body {
    padding-top: 84px;
    background: #FBF9F4;
    /*  font-family: 'Chenyuluoyan', sans-serif;*/
}

/*Set padding to keep content from hitting the edges*/
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/*Override the default bootstrap behavior where horizontal description lists
will truncate terms that are too long to fit in the left column*/

.dl-horizontal dt {
    white-space: normal;
}


/*Set width on the form input elements since they're 100% wide by default*/
input,
select,
textarea {
    max-width: 100%;
    max-width: 280px;
}

.table-head {
    color: #fff;
    background-color: #92555d;
}

.title-bar {
    background: #92555d;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.modal-content-box {
    border-radius: 1rem 1rem 1rem 1rem;
    border: 3px solid #92555d;
}


.modal-content-radius {
    border-radius: 1rem 1rem 0rem 0rem;
}



.validation-summary-errors ul {
    list-style-type: none;
    padding-left: 0;
    padding-right: 0;
}


.btn-pda-title {
    border-color: #fff;
    border-radius: 0.5rem;
}

.text-msg {
    font-weight: 700;
    font-size: calc(1.3rem + 0.6vw);
}




.nav-link {
    font-family: Noto Sans TC;
    font-weight: 400;
    font-size: 1.125rem;
    color: #17842E;
    margin: 0rem 0.5rem ;
}

    .nav-link.active {
        margin: 0.3rem 0rem;
        color: white;
        padding-top: 0.2rem;
        padding-bottom: 0.2rem;
        padding-right: 30px !important;
        border-radius: 6px;
        background: #1DA539;
        background-position: right 8px center;
        background-repeat: no-repeat;
        background-image: url("data:image/svg+xml;charset=utf8,<svg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M8.56632 7.37319C9.99315 7.19294 11.377 6.53481 12.4222 5.42191C13.8685 3.88189 14.3127 1.84768 13.7885 0.0561838C11.8293 -0.205811 9.73568 0.463473 8.28994 2.00286C8.04498 2.26368 7.82876 2.53869 7.64113 2.82429C8.66011 4.15059 8.96026 5.8165 8.56632 7.37319ZM6.79508 8.63307C5.1255 8.8628 3.39011 8.36553 2.04175 7.10413C0.410725 5.57831 -0.255195 3.30749 0.0875737 1.14797C2.04983 0.503138 4.24737 0.910817 5.87853 2.43677C7.50956 3.96259 8.17547 6.23341 7.83271 8.39293C7.80309 8.40266 7.77343 8.41215 7.74371 8.4214V14.0003H6.79508V8.63307Z' fill='white'/></svg>");
    }

    .nav-link.show {
        color: #17842E;
    }

    .nav-link.active:hover {
        color: white;
    }


.dropdown-menu.multi-level {
    border-width: 0px 1px 1px 1px;
    border-style: solid;
    border-color: #A5D11A;
    border-radius: 0;
}

.dropdown-menu .dropdown-item {
    font-family: Noto Sans TC;
    font-weight: 400;
    font-size: 1rem;
    line-height: 120%;
    color: #292624;
    padding-top: 14px;
    padding-right: 24px;
    padding-bottom: 10px;
    padding-left: 24px;
    gap: 10px;
}

    .dropdown-menu .dropdown-item:hover {
        color: #1DA539;
        background: #EEFCF1;
    }

.modal-header, .modal-body, .modal-footer {
    border: 0px;
}

.modal-title {
    font-family: Noto Sans SC;
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0px;
    color: #303133;
}

model-label {
    font-family: Noto Sans TC;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: -0.01px;
    color: rgba(96, 98, 102, 1);
}

/*  .carousel-indicators [data-bs-target].active {
                color: #17842E;
                width: 45px;
                height: 0.1%;
                border-radius: 100%;
                background-color: #1DA539;
                padding: 0px;
                margin: 4px;
            }

            .carousel-indicators [data-bs-target] {
                color: #17842E;
                width: 20px;
                height: 0.1%;
                border-radius: 100%;
                background: #A5D11A;
                padding: 0px;
                margin: 4px;
            }*/


/**/

html {
     font-size: 16px;
    font-size: 16px;
}

@media (max-width: 1280px) {
    html {
        font-size: 14px;
    }
}

/*@media (max-width: 768px) {
    html {
         font-size: 12px; 螢幕變小時減小字體 
        font-size: 12px;  螢幕變小時減小字體 
    }
}

@media (max-width: 480px) {
    html {
        font-size: 10px;  手機進一步縮小 
    }
    .bg-navbar {
        background: transparent !important;
    }
}*/

@media (max-width: 1401px) {
    html {
        font-size: 14px;
    }

    body {
        padding-top: 62px;
    }

    .bg-navbar {
        background: white !important;
    }

    .nav-link {
        font-family: Noto Sans TC;
        font-weight: 600;
        font-size: 16px;
        color: #17842E;
        margin: 0rem 0.5rem;
        padding-top: 16px;
        padding-bottom: 16px;
    }

        .nav-link.active {
            font-family: Noto Sans TC;
            font-weight: 600;
            font-size: 16px;
            color: #17842E;
            margin: 0 8px;
            padding-top: 16px;
            padding-bottom: 16px;
            background: none !important;
            background-image: none !important;
        }



        .nav-link.show {
            color: #17842E;
        }

        .nav-link.active:hover {
            color: #17842E;
        }


    .dropdown-menu.multi-level {
        border-width: 1px 0px 1px 0px;
        border-style: solid;
        border-color: #D9D9D9;
        border-radius: 0;
        background: #FAFAFA;
    }

    .dropdown-menu .dropdown-item {
        font-family: Noto Sans TC;
        font-weight: 400;
        font-size: 16px;
        line-height: 120%;
        color: #363230;
        padding-top: 14px;
        padding-right: 24px;
        padding-bottom: 10px;
        padding-left: 24px;
    }

        .dropdown-menu .dropdown-item:hover {
            color: #1DA539;
            background: #EEFCF1;
        }
}






@media (max-width: 1280px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: none !important;
        width: 100% !important;
    }

    body {
        padding-top: 62px;
    }

    .bg-navbar {
        background: white !important;
    }

    .nav-link {
        font-family: Noto Sans TC;
        font-weight: 600;
        font-size: 16px;
        color: #17842E;
        margin: 0rem 0.5rem;
        padding-top: 16px;
        padding-bottom: 16px;
    }

        .nav-link.active {
            font-family: Noto Sans TC;
            font-weight: 600;
            font-size: 16px;
            color: #17842E;
            margin: 0 8px;
            padding-top: 16px;
            padding-bottom: 16px;
            background: none !important;
            background-image: none !important;
        }



        .nav-link.show {
            color: #17842E;
        }

        .nav-link.active:hover {
            color: #17842E;
        }


    .dropdown-menu.multi-level {
        border-width: 1px 0px 1px 0px;
        border-style: solid;
        border-color: #D9D9D9;
        border-radius: 0;
        background: #FAFAFA;
    }

    .dropdown-menu .dropdown-item {
        font-family: Noto Sans TC;
        font-weight: 400;
        font-size: 16px;
        line-height: 120%;
        color: #363230;
        padding-top: 14px;
        padding-right: 24px;
        padding-bottom: 10px;
        padding-left: 24px;
    }

        .dropdown-menu .dropdown-item:hover {
            color: #1DA539;
            background: #EEFCF1;
        }

    /* 保持整體排版寬度 */
    body {
        min-width: 1320px;
        max-width: 1320px;
        overflow-x: auto;
    }

    /* 強制 tab-container 不換行、不收縮 */
    .tab-container {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 1060px;
    }

        .tab-container::after {
            width: 1190px !important;
        }

    .container,
    .tab-content,
    .body-content {
        width: 1280px !important; /* 固定寬度 */
        /*max-width: 1400px !important;*/
    }


    .tab-container > .tab-title,
    .tab-container > .tab-title-small {
        width: 50% !important;
        flex: none !important;
    }

    .tab-title-small {
        justify-content: flex-end !important;
        text-align: right;
    }

    .tab-pane {
        margin-left: 50px;
        margin-right: 50px;
    }
}


