@charset "utf-8";
/* CSS Document */
@import url(default.css);

body {
    height: 100%;
    font-family: "微軟正黑體", "Microsoft JhengHei";
}

p, a, td, div {
    font-family: "微軟正黑體", "Microsoft JhengHei";
}


.head {
    height: 141px;
    background: url( ../Images/Layout/head_bg.jpg) left top;
    position: relative;
    font-family: 微軟正黑體;
}



    .nav .btn1, .nav .btn2, .nav .btn3, .nav .btn4, .nav .btn5, .nav .btn6 {
        float: left;
        margin: 25px 48px;
        height: 15px;
        display: block;
    }

        .nav .btn1:hover, .nav .btn2:hover, .nav .btn3:hover, .nav .btn4:hover, .nav .btn5:hover, .nav .btn6:hover, .nav {
            background-position: left bottom;
        }

            .nav .btn1 {
                background: url( ../Images/CH/btn_01.png) left top;
                width: 174px;
            }

            .nav .btn2 {
                background: url( ../Images/CH/btn_02.png) left top;
                width: 30px;
            }

            .nav .btn3 {
                background: url( ../Images/CH/btn_03.png) left top;
                width: 30px;
            }

            .nav .btn4 {
                background: url( ../Images/CH/btn_04.png) left top;
                width: 78px;
            }

            .nav .btn5 {
                background: url( ../Images/CH/btn_05.png) left top;
                width: 63px;
            }

            .nav .btn6 {
                background: url( ../Images/CH/btn_06.png) left top;
                width: 63px;
            }

            .nav .select {
                background-position: left bottom;
            }



.cbb_list {
    width: 944px;
    left: 50%;
    margin-left: -445px;
}

   

        .footer_text .a_02 a:hover {
            color: #ffb55b;
        }

    

.tit_oringe2 {
    background: #fe8360;
    border-right: 1px #fff solid;
    padding: 36px 15px 30px;
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 11pt;
    line-height: 28px;
}

.tit_blue {
    background: #46c4d6;
    border-right: 1px #fff solid;
    padding: 36px 15px 30px;
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14pt;
    line-height: normal;
}

#breadcrumb {
    float: left;
    font-size: 13px;
    margin: 33px 320px 0 50px;
    width: 600px;
}

 

.gen_i06 input, .gen_i07 input {
    border: 0px;
    width: 400px;
}

textarea:focus, input:focus {
    outline: none;
}



.job_openings .sm1, .job_openings .sm2 {
    float: left;
    width: 338px;
    height: 198px;
    border-left: 1px #e7e7e7 solid;
    border-bottom: 1px #e7e7e7 solid;
}

    .job_openings .sm1 p, .job_openings .sm2 p {
        margin: 17px 30px 0 50px;
        color: #616d72;
        font-size: 15px;
        line-height: 30px;
    }

        .job_openings .sm1 p b, .job_openings .sm2 p b {
            font-weight: bolder;
            color: #e5471a;
            line-height: 40px;
            font-size: 18px;
        }

.job_openings .sm1 {
    background: #f8f8f8;
}

.job_openings .sm2 {
    background: #ffffff;
}

.job_openings .sm3, .job_openings .sm4 {
    float: left;
    width: 49.9%;
    height: 220px;
    border-left: 1px #e7e7e7 solid;
    border-bottom: 1px #e7e7e7 solid;
}
    .job_openings .sm3.long, .job_openings .sm4.long {
        height: 515px;
    }
    .job_openings .sm3 p, .job_openings .sm4 p {
        margin: 17px 30px 0 50px;
        color: #616d72;
        font-size: 15px;
        line-height: 30px;
    }

        .job_openings .sm3 p b, .job_openings .sm4 p b {
            font-weight: bolder;
            color: #4fadd9;
            line-height: 40px;
            font-size: 18px;
        }

.job_openings .sm3 {
    background: #f8f8f8;
}

.job_openings .sm4 {
    background: #ffffff;
}


.btn_job, .btn_benefits {
    width: 460px;
    height: 35px;
    background: #ededed;
    margin: 34px 1px 2px 62px;
    float: left;
    color: #616d72;
    text-align: center;
    font-size: 20px;
    padding-top: 6px;
    text-decoration: none;
    display: block;
    cursor: pointer;
    position: relative;
    z-index: 10;
}

.btn_benefits {
    margin-left: 0;
}

    .btn_job:hover, .btn_benefits:hover, .sel_job {
        background: #fe8360;
        color: #fff;
    }

.job_tit {
    width: 974px;
    line-height: 30px;
    font-size: 23px;
    background: #46c4d6;
    color: #fff;
    padding: 17px 0 21px 50px;
    font-weight: bolder;
}

.job_openings .mapintro {
    margin: 0 0 50px 0px;
}

    .job_openings .mapintro p {
        float: left;
        width: 425px;
        margin: 36px 37px 0 50px;
        text-align: left;
        color: #616d72;
        line-height: 30px;
    }

        .job_openings .mapintro p b {
            color: #e5471a;
            font-weight: bold;
            font-size: 18px;
        }

    .job_openings .mapintro a {
        color: #e5471a;
    }

#fancybox-content img {
    width: 100%;
    box-sizing: border-box;
    display: block;
    margin: 0 auto;
}

.about_text {
    text-align: left;
    margin: 5px 45px 20px;
    line-height: 20px;
    font-size: 15px;
}

* {
    margin: 0;
    padding: 0;
}

video#bgvid {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    transition: 1s opacity;
}
.his_bg {
    background: url( ../Images/Layout/ch_ht_bg.jpg) center top no-repeat;
}
.gen_i09 ul li {
        width: 100px;
     
    }
.gen_i09 ul li span {
    line-height: 6px;
  
}


/* Style for Contact Form block
 	 	 * Added on 13 FEB 2023, EEM-1
 	 	*/
.contact-form {
    --lighter-gray: hsl(0 0% 96%);
    --light-gray: hsl(0 0% 80%);
    --dark-gray: hsl(0 2% 42%);
    --darker-gray: hsl(198 10% 65%);
    --darkest-gray: hsl(198 8% 41%);
    --light-blue: hsl(196 92% 77%);
    --dark-blue: hsl(196 61% 46%);
    --red: hsl(0 100% 62%);
    --orange: hsl(13 99% 69%);
    --slate: hsl(196 18% 49%);
    --border-radius: 12px;
    --font-size-small: 12px;
    --font-size-regular: 14px;
    --input-padding-x: 21px;
    --input-padding-y: 24px;
}
    /* Preflight to reset CSS, from Tailwind v3
 	 	 * Added on 13 FEB 2023, EEM-1
 	 	*/
    .contact-form :where( button, input, optgroup, select, textarea) {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        -o-appearance: none;
        appearance: none;
        border: none;
        font-family: inherit;
        font-size: 100%;
        font-weight: inherit;
        line-height: inherit;
        color: inherit;
        margin: 0;
        padding: 0;
    }

    .contact-form :where( button, [type='button'], [type='reset'], [type='submit']) {
        -webkit-appearance: button;
        background-color: transparent;
        background-image: none;
    }

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

    .contact-form :where( button, select) {
        text-transform: none;
    }

    .contact-form textarea {
        resize: vertical;
    }

    .contact-form fieldset {
        border: none;
        margin: 0;
        padding: 0;
    }

    .contact-form legend {
        padding: 0;
    }

    .contact-form :where( input::placeholder, textarea::placeholder) {
        opacity: 1;
        color: var(--darker-gray);
    }

    .contact-form :where( button, [role="button"]) {
        cursor: pointer;
    }

    .contact-form :disabled {
        cursor: default;
    }
/* 
 	 	 * Added on 13 FEB 2023, EEM-1
 	 	*/
.contact-form__section {
    padding: 28px 40px 0px 40px;
}

.contact-form__border {
    padding: 27px 32px 35px 32px;
    border: 1px solid var(--light-gray);
    border-radius: var(--border-radius);
    max-width: 944px;
    margin-inline: auto;
}

.contact-form__notice {
    color: var(--dark-gray);
    text-align: right;
    font-size: var(--font-size-small);
    font-weight: 300;
}

.contact-form__text__red {
    color: var(--red);
}

.contact-form__text__slate {
    color: var(--slate);
}

.contact-form__layout__1col {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contact-form__layout__2cols {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.contact-form__layout__3cols {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 30px;
}

.contact-form__layout__file {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contact-form__layout__captcha {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contact-form__label {
    display: block;
    color: var(--darkest-gray);
    font-size: var(--font-size-regular);
    margin-block-end: 10px;
}

.contact-form__select {
    display: block;
    border-radius: var(--border-radius);
    background-color: var(--lighter-gray);
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAyMSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi45MTcgMTMuNzEyOUMxMS43MTgxIDE1LjM0MzQgOS4yODE5IDE1LjM0MzQgOC4wODMwNSAxMy43MTI5TDEuNTEyNjIgNC43NzcxN0MwLjA1NTkwNDQgMi43OTYwMyAxLjQ3MDUyIDAgMy45Mjk1OCAwTDE3LjA3MDQgMEMxOS41Mjk1IDAgMjAuOTQ0MSAyLjc5NjAzIDE5LjQ4NzQgNC43NzcxN0wxMi45MTcgMTMuNzEyOVoiIGZpbGw9IiNEOEQ4RDgiLz4KPC9zdmc+');
    background-position: center right var(--input-padding-x);
    background-repeat: no-repeat;
    padding: var(--input-padding-y) var(--input-padding-x);
    color: var(--darkest-gray);
    font-size: var(--font-size-regular);
    width: 100%;
}

.contact-form__input {
    display: block;
    border-radius: var(--border-radius);
    background-color: var(--lighter-gray);
    padding: var(--input-padding-y) var(--input-padding-x);
    color: var(--darkest-gray);
    font-size: var(--font-size-regular);
    width: calc(100% - 2 * var(--input-padding-x));
}

.contact-form__textarea {
    display: block;
    border-radius: var(--border-radius);
    background-color: var(--lighter-gray);
    padding: var(--input-padding-y) var(--input-padding-x);
    color: var(--darkest-gray);
    font-size: var(--font-size-regular);
    width: calc(100% - 2 * var(--input-padding-x));
    height: 214px;
}

.contact-form__file {
    color: var(--orange);
}

    .contact-form__file::file-selector-button {
        display: none;
    }

.contact-form__file-label {
    border: 1px solid var(--slate);
    background-color: white;
    border-radius: 9999px;
    padding: 8px 23px;
    color: var(--slate);
    font-size: var(--font-size-small);
    cursor: pointer;
}

    .contact-form__file-label::before {
        content: '';
        display: inline-block;
        background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNC40NDY0OSAwLjkxNkM1LjI0NjkxIC0wLjA3MTE5NDggNi43NTMwOCAtMC4wNzExOTcyIDcuNTUzNTEgMC45MTU5OThMMTEuMzU3MSA1LjYwNzA2QzEyLjQxNzEgNi45MTQ0MyAxMS40ODY3IDguODY2NjcgOS44MDM1NyA4Ljg2NjY3SDIuMTk2NDNDMC41MTMzMTUgOC44NjY2NyAtMC40MTcxMSA2LjkxNDQ0IDAuNjQyOTIyIDUuNjA3MDZMNC40NDY0OSAwLjkxNloiIGZpbGw9IiM3QjhCOTAiLz4KPC9zdmc+');
        background-repeat: no-repeat;
        background-position: 0px 0px;
        width: 12px;
        height: 9px;
        margin-inline-end: 1ch;
    }

.contact-form__submit {
    background-image: linear-gradient(180deg, var(--light-blue) 0%, var(--dark-blue) 100%);
    border-radius: var(--border-radius);
    color: white;
    font-size: var(--font-size-regular);
    padding: 12px 48px;
}