@charset "utf-8";
/*CSS RESET*/

a {
    text-decoration: none;
}

    a img {
        border: 0;
    }

:focus {
    outline: 0;
}


/*去除連結虛線框*/
/*將影像及欄位集的邊框歸零*/
img,
fieldset {
    border: 0;
}

input,
button,
textarea,
select,
optgroup,
option {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

/*CSS END RESET*/
.mb-0 {
    margin-bottom: 0 !important;
}

.mb-1 {
    margin-bottom: 1rem !important;
}

.text-right {
    text-align: right !important;
}

body,
button,
input,
select,
textarea {
    font-family: "微軟正黑體", "Microsoft JhengHei", Arial, sans-serif;
}

body {
    background-color: #fff;
    font-size: 1rem;
    color: #000;
}



.header {
    width: 100%;
    background: #fff;
    padding-top: 21px;
    display: flex;
    padding-bottom: 3px;
    border-top: 8px solid #4eb234;
}

    .header.fixed {
        position: fixed;
    }

    .header li {
        list-style: none;
    }

.header-wrapper {
    position: relative;
    width: 100%;
    max-width: 1310px;
    margin: 0 auto;
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.top-menu {
    display: flex;
    margin-bottom: 28px;
    align-items: center;
    padding-left: 16px;
}

    .top-menu li {
        position: relative;
    }

        .top-menu li a {
            color: #000;
            display: inline-block;
            padding: 0 9px;
        }

            .top-menu li a:hover {
                text-decoration: underline;
            }

        .top-menu li + li:before {
            content: "";
            display: inline-block;
            height: 19px;
            width: 1px;
            background: #000;
            position: absolute;
            top: 2px;
        }

.main-menu {
    font-size: 1.25rem;
    display: flex;
    align-items: center;
}

    .main-menu li {
        min-width: 125px;
        position: relative;
        margin-left: 2px;
    }

        .main-menu li:last-child {
            margin-right: 0;
        }

        .main-menu li a {
            padding: 18px 8px;
            color: #000;
            transition: all 0.3s ease;
            display: block;
            text-align: center;
            position: relative;
        }

        .main-menu li a:after {
            content: "";
            position: absolute;
            width: 0%;
            height: 5px;
            bottom: 0;
            left: 0;
            right: 0;
            transition: all 0.3s ease;
            background: #2d691d;
            opacity: 0;
        }

        .main-menu li a:hover::after,
        .main-menu li a.active::after {
            opacity: 1;
            width: 100%;
        }

        .main-menu li p{
            padding: 18px 8px;
        }



.logo,
.logo2 {
    flex: 1;
}

.logo {
    max-width: 175px;
}

.logo2 {
    max-width: 171px;
}

    .logo img,
    .logo2 img {
        width: 100%;
        height: auto;
    }

/* 內頁 */
.banner-contact {
    background-image: url(/CHT/images/contact-mainview.jpg);
}

.banner-news {
    background-image: url(/CHT/images/news-mainview.jpg);
}

.banner-search {
    background-image: url(/CHT/images/search-mainview.jpg);
}

.banner-file {
    background-image: url(/CHT/images/file-mainview.jpg);
}

.banner-home {
    background-image: url(/CHT/images/home-mainview.jpg);
}

.banner {
    background-position: center top;
    height: 175px;
    background-repeat: no-repeat;
}

.wrapper {
    width: 1250px;
    margin: 0 auto;
}

.main {
    min-height: 250px;
    background: url(/CHT/images/left-backgroup.png) center top no-repeat;
}

    .main.bg-home {
        background: url(/CHT/images/left-backgroup.png) center top no-repeat, url(/CHT/images/home-main-bg.png) center top no-repeat;
    }


.main-head {
    display: flex;
    justify-content: space-between;
    padding-top: 17px;
    padding-bottom: 15px;
    align-items: center;
}

.page-title {
    font-size: 1.25rem;
    padding-left: 40px;
    min-height: 32px;
    background: url(/CHT/images/arrow01.png) no-repeat left center;
}

.path {
    display: flex;
    list-style: none;
    font-size: 0.9375rem;
}

    .path li {
        display: flex;
        align-items: center;
    }

    .path,
    .path a {
        color: #000;
    }

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

        .path li + li:before {
            content: ">";
            margin: 0 4px;
            display: inline-block;
        }

.pc-sub-nav {
    display: flex;
    margin-bottom: 26px;
}

    .pc-sub-nav li {
        flex: 1;
        display: block;
        background: #6c6c6c;
        margin: 0 2px;
    }

        .pc-sub-nav li.active {
            background: #0a7591;
        }

            .pc-sub-nav li.active.nav-purple {
                background: #6754b5;
            }

            .pc-sub-nav li.active.nav-orange {
                background: #b55005;
            }

            .pc-sub-nav li.active.nav-green {
                background: #2d691d;
            }

            .pc-sub-nav li.active.nav-news {
                background: #13669f;
            }


        .pc-sub-nav li a {
            display: flex;
            color: #fff;
            text-align: center;
            min-height: 34px;
            padding: 2px;
            align-items: center;
            justify-content: center;
            font-size: 1.125rem;
/*            background-color: #555555;*/
        }

    .pc-sub-nav.sds li a {
        padding-top: 10px;
        padding-bottom: 10px;
    }


    .pc-sub-nav li a:hover {
        color: #000;
    }

.con-about {
    line-height: 1.5;
    font-size: 0.9375rem;
    padding: 0 8px;
    padding-bottom: 100px;
    border-bottom: 7px solid #D9D9D9;
    margin-bottom: 70px;
}

.text-red {
    color: red;
}

.backtop {
    margin-top: 30px;
    margin-bottom: 14px;
    display: flex;
    justify-content: flex-end;
}

    .backtop a {
        width: 100px;
        height: 36px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        background: #0c7793;
        color: #fff;
        font-size: 0.875rem;
    }

.mobile-sub-nav {
    margin-bottom: 20px;
}

.select-menu {
    font-size: 1.2em;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    background: url(/CHT/images/icon-select.svg) no-repeat right center, #fff;
    border: 1px solid #6C6C6C;
    border-radius: 5px;
    padding: 8px 52px 8px 14px;
    color: #000;
}


.select-menu-link {
    position: relative;
    font-size: 1.2em;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    background: #fff;
    border: 1px solid #6C6C6C;
    border-radius: 5px;
    padding: 8px 52px 8px 14px;
    color: #000;
    overflow: hidden;
}

    .select-menu-link:after {
        width: 46px;
        position: absolute;
        height: 100%;
        top: 0;
        border-left: 1px solid #6C6C6C;
        right: 0;
        display: block;
        content: "";
        background: url(/CHT/images/icon-select.svg) no-repeat right center, #0a7591;
    }

.select-menu-dropdown {
    display: none;
    position: absolute;
    background: #fff;
    width: 100%;
    border: 1px solid #ccc;
}

    .select-menu-dropdown a {
        padding: 10px;
        display: block;
        color: #000;
        border-bottom: 1px solid #ccc;
    }

.tag-wrap {
    display: flex;
    align-items: center;
    position: relative;
    margin-bottom: 12px;
}

.tag {
    position: relative;
    background-color: #0a7591;
    /* 藍色背景 */
    color: white;
    padding: 6px 15px;
    padding-right: 0;
    display: inline-block;
    min-width: 200px;
}

    .tag.year {
        min-width: 200px;
    }
    /* .tag::before{
  width: 20px;
  position: absolute;
  content: "";
  background: #000;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
} */
    .tag::after {
        content: "";
        position: absolute;
        right: -20px;
        top: 0;
        width: 20px;
        /* 固定三角形寬度 */
        height: 100%;
        background-color: #0a7591;
        -webkit-clip-path: polygon(16% 0, 100% 50%, 16% 100%, 0% 100%, 0 54%, 0% 0%);
        /* 為舊版 WebKit 瀏覽器添加 */
        clip-path: polygon(16% 0, 100% 50%, 16% 100%, 0% 100%, 0 54%, 0% 0%);
    }

    .tag.purple {
        min-width: 278px;
        background-color: #6754b5;
    }

        .tag.purple::after {
            background-color: #6754b5;
        }

    .tag.orange {
        min-width: 278px;
        background-color: #b55005;
    }

        .tag.orange::after {
            background-color: #b55005;
        }

    .tag.green {
        min-width: 278px;
        background-color: #2d691d;
    }

        .tag.green::after {
            background-color: #2d691d;
        }

.tag-wrap i {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 1px;
    display: block;
    background: #B7B7B7;
}

.history-list,
.file-list {
    list-style: none;
}

    .history-list p {
        padding-left: 14px;
        line-height: 1.5;
    }

    .history-list li,
    .file-list li {
        margin-bottom: 20px;
    }

.content {
    padding-bottom: 20px;
    min-height: 200px;
}

.file-list {
    font-size: 1.125rem;
}

.file-item {
    margin-bottom: 9px;
}

.file-name {
    padding-right: 8px;
}

.file-item.in-news-page {
    margin-bottom: 20px;
}

.file-item a {
    display: flex;
    padding: 8px 8px 8px 18px;
    color: #000;
    align-items: center;
    background: #F2F1F1;
    justify-content: space-between;
}

    .file-item a:hover {
        background: #e4e4e4;
    }

.file-icon {
    width: 33px;
    height: 33px;
    margin-left: 8px;
    display: inline-block;
    background: url(/CHT/images/pdf.gif);
}

.file-info {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.ghs-img-list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

    .ghs-img-list li {
        margin-bottom: 34px;
    }

.unit-ghs-pic .tag-wrap {
    font-size: 1.125rem;
    margin-bottom: 22px;
}

.ghs-img-download {
    text-align: center;
}

    .ghs-img-download a {
        color: #064b6e;
        padding: 0 2px;
    }

        .ghs-img-download a:hover {
            text-decoration: underline;
        }

.ghs-img-photo {
    padding-right: 16px;
}

    .ghs-img-photo img {
        width: 92px;
        height: 91px;
    }

.use-rule {
    line-height: 1.5;
    font-size: 0.9375rem;
    margin-bottom: 32px;
}

.use-rule-list {
    margin-top: 15px;
    list-style: none;
}

    .use-rule-list li i {
        width: 30px;
        height: 30px;
        flex: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #0a7591;
        color: #fff;
        font-weight: 700;
        font-style: normal;
        margin-right: 9px;
        font-family: Arial, Helvetica, sans-serif;
    }

    .use-rule-list li {
        display: flex;
        border-bottom: 1px solid #DADADA;
        padding: 8px 0;
    }

        .use-rule-list li p {
            padding-top: 3px;
        }


.common-rwd-table {
    max-width: 825px;
    width: 100%;
    border: 1px solid #CECECE;
    border-collapse: separate;
    background: #fff;
    border-spacing: 5px;
    /*cellspacing */
}

    .common-rwd-table tr {
        background: #F2F1F1;
    }

        .common-rwd-table tr:nth-child(even) {
            background: #E7FCFE;
        }

    .common-rwd-table td,
    .common-rwd-table th {
        padding: 7px;
        text-align: left;
        font-weight: 400;
    }

    .common-rwd-table th {
        padding-left: 15px;
    }

.input {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid #7D7D7D;
    background: #fff;
    padding: 3px 5px;
    width: 410px;
    height: 30px;
}

.select {
    border: 1px solid #7D7D7D;
    background: #fff;
    padding: 3px 5px;
    height: 30px;
}


.input.check-code {
    max-width: 200px;
}

.check-code-img {
    vertical-align: middle;
}


.btn-default {
    width: 150px;
    height: 47px;
    color: #fff;
    font-size: 1.5rem;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    background: #B7B7B7;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    border: none;
}

.btn-blue {
    background: #0a7591;
}

.btn-default:hover {
    background: #8e8e8e;
}

.btn-blue:hover {
    background: #0f94b5;
}

.common-rwd-table .btn-default {
    margin: 0 10px;
}

input[type=radio],
input[type=checkbox] {
    width: 20px;
    height: 20px;
    vertical-align: top;
}

.form-check {
    display: inline-flex;
    align-items: center;
}

    .form-check + .form-check {
        margin-left: 10px;
    }

    .form-check input[type=radio],
    .form-check input[type=checkbox] {
        margin-right: 4px;
    }

.news-subnav {
    list-style: none;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    font-size: 1rem;
}

    .news-subnav li {
        margin-right: 2px;
    }

        .news-subnav li a {
            padding: 7px 14px;
            color: #000;
            min-width: 160px;
            display: block;
            position: relative;
            text-align: center;
            transition: all 0.3s ease;
            border-bottom: 5px solid #B7B7B7;
        }

            .news-subnav li a:hover {
                color: #13669f;
            }

        .news-subnav li.active a::after {
            width: 18px;
            height: 18px;
            position: absolute;
            top: calc(100% + 4px);
            left: 50%;
            transform: translateX(-50%);
            content: "";
            display: inline-block;
            background: url(/CHT/images/down-arrow.svg) no-repeat;
        }

        .news-subnav li.active a {
            border-bottom: 5px solid #13669f;
        }

.news-list {
    list-style: none;
    margin-bottom: 40px;
}

    .news-list li {
        padding-top: 18px;
        padding-bottom: 12px;
        border-bottom: 1px solid #DADADA;
    }

        .news-list li:last-child {
            border-bottom: none;
        }

        .news-list li a {
            color: #000;
            display: block;
        }

            .news-list li a .news-list--title,
            .news-list--title {
                color: #13669f;
                font-size: 1.5rem;
                border-left: 8px solid #13669f;
                padding-left: 8px;
            }

.news-list--top {
    display: flex;
    margin-bottom: 16px;
    justify-content: space-between;
}

.news-list--body {
    padding-left: 17px;
    max-width: 1125px;
    line-height: 1.4;
}

.news-list li a:hover {
    color: #333;
}

    .news-list li a:hover .news-list--title {
        text-decoration: underline;
    }

/* 頁數 */
.paginator {
    margin-top: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.pagination-item {
    padding: 1px 10px;
    border: solid 1px #ddd;
    background: #fff;
    text-decoration: none;
    margin-right: 2px;
    color: #000;
    display: inline-block;
    margin-bottom: 5px;
}

    .pagination-item.now {
        font-weight: bold;
        border: none;
    }

    .pagination-item.disabled {
        cursor: default;
        border: solid 1px #f7f7f7;
        color: #666;
    }

    .pagination-item:hover {
        background: #000;
        color: #fff;
    }

    .pagination-item.disabled:hover {
        background: initial;
        color: #666;
    }

    .pagination-item.now:hover {
        background: initial;
        color: #000;
    }

.btn-back {
    color: #024c97;
    font-weight: bold;
    padding: 10px;
}

    .btn-back:hover {
        color: #00264d;
    }

.back-wrap {
    margin-top: 40px;
    text-align: center;
    padding-bottom: 8px;
    border-bottom: 1px dotted #ccc;
}

/* 編輯器 */
.editor {
    line-height: 1.8;
}

    .editor ol {
        padding-left: 1.2em;
    }

    .editor ul {
        padding-left: 1.2em;
    }

    .editor img {
        max-width: 100%;
        height: auto;
    }

/*  */
.info-rwd-table {
    width: 100%;
    background: #fff;
    border-spacing: 2px;
    border-collapse: separate;
}

    .info-rwd-table thead tr {
        background: #D0FFFF;
        color: #0864a4;
        ;
    }

    .info-rwd-table th,
    .info-rwd-table td {
        padding: 8px;
        text-align: left;
    }

    .info-rwd-table tbody tr {
        background: #F2F2F2;
        font-size: 0.9rem;
    }

    .td-view,
    .info-rwd-table th.td-view {
        text-align: center;
    }

        .td-view a {
            color: #252b2c;
            text-decoration: underline;
        }

            .td-view a:hover {
                text-decoration: none;
            }

.s-tool {
    margin-bottom: 30px;
}

.tool-button {
    font-weight: 700;
    padding: 3px 8px;
    font-size: 0.9rem;
}

/*------FOOTER--------*/
footer {
    padding: 23px 0;
    border-top: 7px solid #BDDBF8;
    width: 100%;
}

.footer-info {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .footer-info .cc {
        color: #000;
        font-size: .8em;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

        .footer-info .cc p {
            margin: 0 10px;
        }

.accessibility-mark {
    margin-left: 10px;
}

    .accessibility-mark img {
        width: 100px;
        height: auto;
    }

.sds-hint {
    margin-bottom: 16px;
    padding-left: 2px;
}

.apply-area {
    display: flex;
    gap: 10px;
}

    .apply-area a {
        font-size: 1.125rem;
        text-align: center;
        padding: 14px 6px;
        background: #6754b5;
        color: #fff;
        max-width: 355px;
    }

        .apply-area a:hover {
            background: #7863d9;
        }

.blue-table {
    width: 100%;
    border-collapse: separate;
    background: #fff;
    border-spacing: 2px;
}

    .blue-table tr.main-th th,
    .blue-table tr.main-th td {
        background: #b8ddf3;
        color: #0864a4;
        font-weight: bold;
    }

    .blue-table tbody th {
        color: #0864a4;
        font-weight: bold;
    }

    .blue-table th,
    .blue-table td {
        padding: 5px;
        background: #e5f5ff;
    }

    .blue-table th {
        text-align: left;
    }

    .blue-table td {
        text-align: center;
    }

.btn-download,
.btn-blue-sm {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #fff;
    padding: 5px 12px;
    background: #0a7591;
    border: none;
    cursor: pointer;
}

    .btn-download:hover,
    .btn-blue-sm:hover {
        background: #118caa;
    }

.hint {
    color: red;
    margin-top: 22px;
    margin-bottom: 22px;
    padding-left: 1px;
}

.blue-table2 {
    width: 100%;
    border-collapse: separate;
    background: #fff;
    border-spacing: 2px;
    color: #0864a4;
    font-weight: bold;
}

    .blue-table2 a {
        color: #0864a4;
        display: inline;
    }

        .blue-table2 a:hover {
            text-decoration: underline;
        }

    .blue-table2 th {
        text-align: left;
    }

    .blue-table2 tr {
        background: #efefef;
    }

        .blue-table2 tr:nth-child(odd) {
            background: #e5f5ff;
        }

        .blue-table2 tr.main-th {
            background: #c0e7fe;
        }

    .blue-table2 th,
    .blue-table2 td {
        padding: 10px;
    }

    .blue-table2 td,
    .blue-table2 th {
        word-break: break-word;
        /* 也幫整個表格欄位補上 */
    }

.country-name {
    font-size: 1.1rem;
    color: #024c97;
    font-weight: bold;
    margin: 10px 0;
    padding-left: 1px;
}

.country-list {
    list-style: none;
}

    .country-list li {
        margin-bottom: 20px;
    }


.consult-area {
    margin-top: 30px;
    display: flex;
    padding: 25px;
    max-width: 800px;
    align-items: center;
    border: 1px solid #d1d1d1;
}

.ca-photo {
    max-width: 282px;
}

.contact-info {
    padding-left: 20px;
    line-height: 1.5;
    color: #024c97;
    font-weight: bold;
}

.text-link {
    color: #0864a4;
    padding: 5px;
}

    .text-link:hover {
        text-decoration: underline;
    }

.btn-default2 {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #fff;
    padding: 6px 28px;
    border-radius: 8px;
    background: #13669f;
    border: none;
    cursor: pointer;
    text-align: center;
    font-size: 1.5rem;
}

    .btn-default2:hover {
        background: #0060a0;
    }

.l-btn-area {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    justify-content: center;
    align-items: center;
}

.login-hint {
    line-height: 1.5;
    font-size: 1.25rem;
    margin-bottom: 20px;
}

.l-title {
    color: #13669f;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 14px;
}

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

.common-account-login {
    width: 52%;
    margin-bottom: 25px;
}

.login-table th {
    width: 140px;
    white-space: nowrap;
}

.business-login {
    width: 48%;
    padding-right: 16px;
    padding-left: 57px;
    margin-bottom: 25px;
}

    .business-login img {
        max-width: 100%;
        height: auto;
    }

.ghs-home-article {
    margin-top: 40px;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.forget-area {
    width: 825px;
    margin: 0 auto;
}

.text-center {
    text-align: center !important;
}

.register-step,
.step-title {
    font-size: 1.25rem;
    font-weight: 700;
}

.policy-wrap {
    margin-top: 50px;
}

.policy-content {
    border: 1px solid #7D7D7D;
    margin: 12px 0;
    padding: 20px;
    height: 316px;
    overflow-y: scroll;
    line-height: 1.5;
}

.register-step ul {
    display: flex;
    list-style: none;
    margin-bottom: 38px;
}

.register-step li.now {
    color: #13669f;
}

.step-title {
    color: #13669f;
    margin-bottom: 16px;
}

.register-step li + li:before {
    content: "＞";
    color: #000;
}

.policy-check {
    margin-bottom: 40px;
}

    .policy-check .form-check {
        margin: 0 20px;
    }

.w-title {
    text-align: center;
    background: #D1F8FE;
    color: #0864a4;
    padding: 8px 5px;
    font-weight: 700;
    border-bottom: 2px solid #fff;
}

.w-first {
    background: #F2F2F2;
    display: flex;
    margin-bottom: 2px;
}

.wf-title {
    width: 200px;
    text-align: right;
    padding: 8px;
    border-right: 2px solid #fff;
}

.wf-content {
    flex: 1;
    padding: 8px;
}

.w-row {
    display: flex;
    background: #ECFDFF;
    border-bottom: 2px solid #fff;
}

.w-label {
    width: 200px;
    padding: 8px;
    border-right: 2px solid #fff;
    justify-content: flex-end;
    display: inline-flex;
    align-items: center;
}

.w-content {
    padding: 8px;
    flex: 1;
}

.w-row--hint {
    padding: 10px;
    line-height: 1.8;
}

.mark-required {
    padding-left: 4px;
}


.text-blue {
    color: #0864a4;
    font-weight: bold;
}

.sitemap-content {
    line-height: 1.8;
}

    .sitemap-content ul {
        padding-left: 1.2rem;
    }

.sitemap-list,
.sitemap-list a {
    color: #0864a4;
    font-weight: bold;
}

    .sitemap-list a:hover {
        text-decoration: underline;
    }

    .sitemap-list > li {
        margin-bottom: 10px;
    }


/*------   RWD   -------*/
.mobile-sub-nav {
    display: none;
    position: relative;
}

/* 手機版選單 */
.m-hamburger {
    position: relative;
    width: 52px;
    height: 52px;
    display: none;
    font-size: 0;
}

    .m-hamburger i {
        opacity: 1;
        position: absolute;
        top: 0;
        background: #2d691d;
        margin-top: 12px;
        left: 0;
        width: 37px;
        height: 4px;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: left center;
        -moz-transform-origin: left center;
        -ms-transform-origin: left center;
        -o-transform-origin: left center;
        transform-origin: left center;
        -webkit-transition: all .15s ease-in-out;
        -moz-transition: all .15s ease-in-out;
        -o-transition: all .15s ease-in-out;
        transition: all .15s ease-in-out;
    }

        .m-hamburger i:nth-child(1) {
            top: 0;
        }

        .m-hamburger i:nth-child(2) {
            top: 12px;
            width: 32px;
        }

        .m-hamburger i:nth-child(3) {
            top: 24px;
            width: 25px;
        }

    .m-hamburger.show i {
        background: #608F27;
    }

        .m-hamburger.show i:nth-child(1) {
            left: 15px;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg);
        }

        .m-hamburger.show i:nth-child(2) {
            opacity: 0;
            width: 0;
        }

        .m-hamburger.show i:nth-child(3) {
            top: 26px;
            left: 15px;
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
            width: 37px;
        }

.mobile-menu {
    display: none;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    z-index: 10000;
    top: 98px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #2d691d;
    color: #fff;
}


@media only screen and (max-width: 1320px) {

    .header-wrapper,
    .wrapper {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .main-menu {
        font-size: 1.1rem;
    }
}


@media only screen and (max-width: 1024px) {
    .news-subnav li {
        flex: 1;
    }

        .news-subnav li a {
            min-width: 100%;
            padding-left: 0;
            padding-right: 0;
        }

    .banner {
        background-position: 30% top;
        height: 132px;
        background-repeat: no-repeat;
        background-size: cover;
    }


    .select.set-mb {
        margin-bottom: 6px;
    }

    .menu-pc-area {
        display: none;
    }

    .m-hamburger {
        display: block;
    }

    .header {
        padding-top: 4px;
    }

    .logo img,
    .logo2 img {
        max-height: 80px;
        width: auto;
    }

    .header {
        border-top-width: 7px;
        height: 98px;
    }

    /* 手機版選單 區塊 */
    .mobile-menu li {
        list-style: none;
    }

    .m-top-menu {
        background: #13669f;
        font-size: 1.3rem;
        padding: 20px;
    }

        .m-top-menu > div {
            display: flex;
            align-items: center;
        }

        .m-top-menu a,
        .main-menu li a {
            color: #fff;
        }

    .main-menu {
        font-size: 1.5rem;
        padding: 20px;
        flex-direction: column;
        align-items: flex-start;
    }

        .main-menu li {
            width: 100%;
        }

            .main-menu li a {
                padding: 10px 8px;
                text-align: left;
            }

    .m-top-menu a {
        padding: 0 18px;
        margin-bottom: 18px;
        display: inline-block;
        position: relative;
        height: 28px;
        line-height: 28px;
    }

        .m-top-menu a i {
            width: 2px;
            position: absolute;
            height: 28px;
            background: #fff;
            display: inline-flex;
            top: 0;
            right: -4px;
        }


    /* //手機版選單 區塊END */

    .main-head {
        flex-direction: column-reverse;
        align-items: flex-start;
    }

    .path {
        width: 100%;
        justify-content: flex-end;
        padding-bottom: 8px;
    }

    .con-about {
        font-size: 1rem;
    }

    .common-rwd-table {
        width: 100%;
    }

    .input {
        width: 100%;
    }

    .w-content .input {
        width: calc(100% - 20px);
    }


    .apply-area {
        flex-wrap: wrap;
        gap: 0;
        margin: 0 2px;
        justify-content: space-between;
    }

        .apply-area a {
            max-width: inherit;
            margin-bottom: 14px;
            width: calc(50% - 2px);
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

    .l-btn-area {
        justify-content: end;
    }
}

@media only screen and (max-width: 768px) {

    .news-list--top {
        flex-wrap: wrap;
    }

    .news-list--title {
        width: 100%;
        font-size: 1.2rem;
    }

    .news-list--date {
        width: 100%;
        text-align: right;
        padding-top: 8px;
        padding-right: 5px;
    }

    .pc-sub-nav {
        display: none;
    }

    .mobile-sub-nav {
        display: block;
    }

    .consult-area {
        flex-direction: column;
        align-items: flex-start;
    }

    .contact-info {
        margin-top: 20px;
        padding-left: 0;
    }

    .ca-photo img {
        max-width: 100%;
        height: auto;
    }

    .business-login {
        padding-right: 8px;
        padding-left: 20px;
    }

    .login-table th {
        width: 100px;
    }
}

@media only screen and (max-width: 767px) {
    .register-step ul {
        flex-direction: column;
    }

    .register-step li + li:before {
        display: none;
    }

    .w-first,
    .w-row {
        flex-direction: column;
    }

    .wf-title {
        width: 100%;
        text-align: left;
        border-right: none;
    }

    .w-label {
        width: 100%;
        padding-bottom: 0;
        border-right: none;
        justify-content: flex-start;
    }

    /* RWD TABLE */
    .info-rwd-table thead {
        display: none;
    }

    .info-rwd-table,
    .info-rwd-table tbody,
    .info-rwd-table th,
    .info-rwd-table td,
    .info-rwd-table tr {
        display: block;
        width: 100%;
        padding: 0;
    }

        .info-rwd-table tr {
            margin-bottom: 10px;
        }

        .info-rwd-table td::before {
            content: attr(data-label);
            width: 100px;
            display: block;
            padding: 10px;
        }

        .info-rwd-table td {
            display: flex;
            border-bottom: 1px solid #ccc;
        }

            .info-rwd-table td p {
                padding: 10px;
                width: calc(100% - 200px);
            }

        .td-view,
        .info-rwd-table th.td-view {
            text-align: left;
        }
}


@media only screen and (max-width: 600px) {
    .footer-info .cc {
        justify-content: start;
    }

        .footer-info .cc p {
            margin: 0;
            width: 100%;
            margin-bottom: 4px;
            padding-right: 8px;
        }

    .header-wrapper {
        padding-left: 8px;
        padding-right: 0;
    }


    .common-rwd-table,
    .common-rwd-table tbody,
    .common-rwd-table tr,
    .common-rwd-table th,
    .common-rwd-table td {
        display: block;
        width: 100%;
    }

        .common-rwd-table td,
        .common-rwd-table th {
            padding: 12px 14px;
        }

        .common-rwd-table th {
            padding-bottom: 0;
        }

    .input {
        height: 35px;
    }

        .input.check-code {
            max-width: 120px;
        }

    .path a,
    .path li {
        display: inline-flex;
    }

    .login-hint {
        font-size: 1rem;
    }

    .common-account-login,
    .business-login {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    .login-table.common-rwd-table {
        max-width: 100%;
    }

    .business-login img {
        width: 100%;
    }

    .main-head {
        padding-top: 10px;
    }

    .wf-content {
        display: flex;
        flex-direction: column;
    }

        .wf-content .form-check {
            margin-left: 0;
            margin-bottom: 8px;
        }

    .logo img {
        max-height: 70px;
    }

    .logo2 img {
        max-height: 60px;
    }
}

@media only screen and (max-width: 460px) {

    .ghs-img-list li {
        width: 33.3%;
        text-align: center;
    }

    .ghs-img-download a {
        padding: 0 4px 8px;
        display: inline-block;
    }

    .apply-area a {
        width: 100%;
    }
}

@media only screen and (max-width: 420px) {
    .btn-default {
        width: 100%;
    }

    .common-rwd-table .btn-default {
        margin: 6px 0;
    }

    .banner {
        background-position: 28% top;
    }
}

@media only screen and (max-width: 412px) {

    .m-top-menu {
        font-size: 1.2rem;
        padding: 15px 6px;
    }

    .main-menu {
        font-size: 1.2rem;
        padding: 10px;
    }
}

@media only screen and (max-width: 360px) {

    .tag.purple,
    .tag.orange,
    .tag.green {
        min-width: 250px;
    }
}

.a_Color {
    color:#13669f !important ;
}

.visually-hidden-focusable {
    display: none;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.select-menu-dropdown {
    display: none;
    position: absolute;
    background: #fff;
    width: 100%;
    border: 1px solid #ccc;
    z-index: 1000; /* 添加這一行 */
}

    .select-menu-dropdown a {
        padding: 10px;
        display: block;
        color: #000;
        border-bottom: 1px solid #ccc;
    }