@charset "UTF-8";

#advan-heading .breadcrumb {
    margin-bottom: 20px;
}

    #advan-heading .breadcrumb li {
        display: inline;
        list-style: none;
        font-size: 14px;
        color: #666;
    }

        #advan-heading .breadcrumb li .nolink-crumb {
            padding: 0;
            font-weight: normal;
            color: #004280;
        }

        #advan-heading .breadcrumb li .last-crumb {
            padding: 0;
            font-weight: normal;
        }

.corporate-content-sidebar .sidebar-heading {
    line-height: 0.85;
    font-size: 26px;
    padding: 10px 0px 15px 10px;
    border-bottom: 3px solid #004280;
    margin-bottom: 20px;
}

.corporate-content-sidebar ul {
    list-style: none;
    margin-bottom: 10px;
}

    .corporate-content-sidebar ul li.nav-heading {
        font-size: 16px;
        font-weight: bold;
        margin-left: 10px;
        padding: 10px 0 5px 0;
    }

    .corporate-content-sidebar ul li a {
        display: block;
        color: #004280;
        padding: 4px 0;
        padding-left: 10px;
        font-size: 14px;
    }

.corporate-main-heading {
    display: block;
    font-size: 36px;
    line-height: 1.3em;
    margin: 0 0 10px 0;
}

.content-main-wrap .corporate-subtitle {
    font-size: 20px;
    font-weight: bold;
    margin: 0 0 10px 0;
    overflow-wrap: break-word;
}

.corporate-box-img {
    text-align: center;
    margin-bottom: 20px;
}

    .corporate-box-img img {
        width: 62%;
    }

.corporate-box-title h2 {
    font-size: 26px;
    font-weight: normal;
}

.corporate-video-thumb {
    width: 100%;
}

.content-main-wrap .img-content .item {
    float: left;
    width: 48%;
    margin-right: 2%;
}

    .content-main-wrap .img-content .item .info-card {
        margin-bottom: 15px;
    }

        .content-main-wrap .img-content .item .info-card p {
            font-size: 16px;
            font-weight: bold;
        }

.content-main-wrap .img-content .subtitle {
    font-size: 16px;
    margin-bottom: 15px;
}

.content-main-wrap .img-content {
    margin-top: 20px;
}

    .content-main-wrap .img-content .corporate-subtitle {
        margin-bottom: 5px;
    }

    .content-main-wrap .img-content p {
        margin-bottom: 8px;
    }

    .content-main-wrap .img-content ul {
        font-size: 14px;
        line-height: 1.5;
        margin-left: 20px;
        margin-bottom: 10px;
    }

@media screen and (max-width:580px) {
    .content-main-wrap .img-content .item {
        float: none;
        width: 100%;
        margin-right: 0;
    }
}

@media screen and (max-width:768px) {
    .corporate-main-heading {
        display: none;
    }

    .sidebar-heading-mobile {
        display: block;
        font-size: 36px;
        line-height: 1.3em;
        margin: 0 0 10px 0;
    }

    .corporate-box-img img {
        width: 70%;
    }
}

@media screen and (max-width:580px) {
    .corporate-content-main {
        width: 100%;
        margin-bottom: 20px;
        padding-right: 0;
    }

    .corporate-box-img img {
        width: 100%;
    }
}
/************************************************************

    以下區段為about專案新增樣式
    所有新增樣式皆以about字樣開頭
    註解部分註明有參考到該樣式的頁面

************************************************************/
/* start list css */
/* for Index, Global PR Team */
.about-list {
    margin-bottom: 20px;
}

.about-list-header {
    background-color: #F2F2F2;
    font-size: 16px;
    padding: 11px;
    line-height: 1.2;
    margin-top: -1px;
    border-top: 1px solid #c6c2c2;
    border-bottom: 1px solid #c6c2c2;
}

.about-list-item li {
    font-size: 14px;
    padding: 12px;
    line-height: 1.2;
    margin-top: -1px;
    border-top: 1px solid #c6c2c2;
    border-bottom: 1px solid #c6c2c2;
    list-style: none;
}

.about-award-list li {
    padding-left: 20px;
}

    .about-award-list li span {
        width: 45%;
        margin-right: 5%;
        float: left;
        display: list-item;
        list-style: disc;
    }

@media screen and (max-width:580px) {
    .about-award-list li {
        border: none;
        padding-top: 0px;
        padding-bottom: 0px;
    }

        .about-award-list li span {
            width: 100%;
            padding-bottom: 12px;
        }
}
/* for PR Team */
.about-label {
    width: 20%;
    float: left;
    font-size: 16px;
    padding: 0 0 0 0;
    margin: 6px 0 0 0;
}

.about-form-wrap {
    display: block;
    margin: 0 0 15px 0;
    padding: 0;
}

.about-input {
    width: 80%;
    margin: 0 0 0 0;
    float: left;
}

.about-textarea {
    width: 100%;
    min-height: 200px;
    border: 1px solid #ddd;
    font-family: Arial, Helvetica, sans-serif;
}

.about-submit {
    text-align: center;
}

    .about-submit a {
        display: inline-block;
        padding: 10px 35px;
        background: #004280;
        color: #fff;
        font-weight: bold;
        opacity: 0.75;
        filter: alpha(opacity=75);
        text-decoration: none;
    }

.about-form-wrap input[type="text"] {
    padding: 6px 10px;
    border: 1px solid #ddd;
    box-sizing: border-box;
    width: 100%;
    font-family: Arial, Helvetica, sans-serif;
    color: #666;
}

.about-form-wrap textarea {
    width: 99.2%;
}
/* end list css */
/* start contentlist css */
/* for Executive Team */
.about-contentlist-item {
    margin-bottom: 45px;
}

    .about-contentlist-item:before, .about-contentlist-item:after {
        content: " ";
        display: table;
    }

    .about-contentlist-item:after {
        clear: both;
    }

.about-contentlist-pic {
    float: left;
    box-sizing: border-box;
    width: 11.66%;
}

    .about-contentlist-pic img {
        width: 100%;
        height: 100%;
        border: 1px solid #ccc;
    }

.about-contentlist-content {
    float: left;
    box-sizing: border-box;
    width: 88.34%;
    padding-left: 20px;
    position: relative;
}

    .about-contentlist-content h2 {
        font-weight: normal;
        font-size: 16px;
        /*color: #004280;*/
        margin-bottom: 5px;
    }

    .about-contentlist-content h3 {
        font-weight: normal;
        font-size: 14px;
        color: #666666;
        margin-bottom: 12px;
    }

    .about-contentlist-content ul {
        margin-left: 15px;
    }

    .about-contentlist-content li {
        list-style-type: disc;
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 7px;
    }
/* end contentlist css */
/* start ul css */
/* for History */
.about-table td, .about-table th {
    border: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.8;
    text-align: left;
    vertical-align: top;
}

    .about-table td:first-child {
        font-size: 12px;
        width: 14px;
        padding: 0 0 0 4px;
    }

#timeline .about-contentlist-content {
    padding-left: 0;
}

    #timeline .about-contentlist-content p {
        line-height: 1.4em;
        margin-bottom: 7px;
    }
/* end ul css */
/* start contentbox css */
/* for Magazine */
.about-contentbox-wrap {
    margin-left: -5%;
    box-sizing: border-box;
}

    .about-contentbox-wrap:before, .about-contentbox-wrap:after {
        content: " ";
        display: table;
    }

    .about-contentbox-wrap:after {
        clear: both;
    }

.about-contentbox-item {
    float: left;
    margin-bottom: 45px;
    box-sizing: border-box;
    padding-left: 5%;
    width: 33.3%;
}

.about-contentbox-pic {
    margin-bottom: 10px;
    border: #ccc solid 1px;
}

    .about-contentbox-pic img {
        width: 100%;
        margin-bottom: -2px;
    }
/*----*/
.about-contentbox-content h2 {
    font-weight: normal;
    font-size: 26px;
    float: left;
    color: #004280;
    margin-bottom: 10px;
}

.about-contentbox-content h3 {
    font-weight: normal;
    float: left;
    font-size: 14px;
    color: #666666;
    padding: 10px 0 0 10px;
    margin-bottom: 10px;
}

.about-contentbox-content p {
    font-size: 14px;
    line-height: 1.5;
}

.about-magazine h2 {
    font-size: 16px;
    float: none;
    margin-bottom: 5px;
    line-height: 1.5em;
}

.about-magazine h3 {
    font-size: 14px;
    float: none;
    padding: 0 0 0 0;
    margin-bottom: 5px;
    line-height: 1.3em;
    display: block;
}
/* end contentbox css */
/* start newslist css */
/* for News */
.about-newslist-item {
    margin-bottom: 45px;
}

.about-newslist-content h1 {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 7px;
}

.about-newslist-content h2 {
    font-weight: normal;
    font-size: 16px;
    color: #004280;
    margin-bottom: 7px;
}

.about-newslist-content h3 {
    font-weight: normal;
    font-size: 14px;
    color: #666666;
    margin-bottom: 10px;
}

.about-newslist-content p {
    font-size: 14px;
    line-height: 1.5;
}
/*for news detail*/
.corporate-main-heading-news-title {
    font-size: 36px;
    line-height: 1.3em;
    margin: -40px 0 10px 0;
}
/* end newslist css */
/* start form css */
/* for News & Archives */
.about-form {
    border-bottom: 2px solid #ededed;
    margin-bottom: 45px;
}

    .about-form:before, .about-form:after {
        content: " ";
        display: table;
    }

    .about-form:after {
        clear: both;
    }

    .about-form h1 {
        font-weight: normal;
        font-size: 26px;
        margin-bottom: 9px;
    }

.about-form-group {
    margin-bottom: 20px;
    float: left;
    width: 100%;
}

    .about-form-group:before, .about-form-group:after {
        content: " ";
        display: table;
    }

    .about-form-group:after {
        clear: both;
    }

.about-form-box1 {
    float: left;
    width: 40%;
    background-color: #fafafa;
    background-image: none;
    border: 1px solid #ccc;
}

.about-form-box2 {
    float: left;
    width: 5%;
    text-align: center;
    padding-top: 8px;
}

.about-form-box3 {
    float: left;
    width: 85%;
    box-sizing: border-box;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}

.about-form-box4 {
    float: left;
    width: 15%;
    box-sizing: border-box;
    padding-left: 10px;
}

.about-form-control {
    float: left;
    height: auto;
    box-sizing: border-box;
    width: 95%;
    padding: 8px 10px;
    /*font-size: 14px;*/
    line-height: 1.3em;
    background-color: transparent;
    background-image: none;
    border: 0;
}


.about-form-group button {
    cursor: pointer;
}

    .about-form-group button.cancel {
        border: 0;
        outline: 0;
        padding: 0 0;
        margin-top: 12px;
        margin-right: 10px;
        font-size: 23px;
        float: right;
        color: #555;
        background-color: transparent;
    }

a.about-btn {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 8px 10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.4;
    text-align: center;
    background-image: none;
    background-color: var(--main-color);
    border: 1px solid transparent;
    color: #ffffff;
}

    a.about-btn:hover {
        cursor: pointer;
        text-decoration: none;
        background-color: #004280;
        color: #ffffff;
    }

.about-magazine .about-form-box1 {
    width: 84.3%;
}

.about-magazine .about-form-control {
    padding: 13px 10px;
}

.about-magazine a.about-btn {
    padding: 12px 8px;
}
/* end form css */
/* start piclist */
/* for Community */
.about-piclist {
    margin-bottom: 20px;
}

    .about-piclist:before, .about-piclist:after {
        content: " ";
        display: table;
    }

    .about-piclist:after {
        clear: both;
    }

.about-piclist-item {
    float: left;
    margin-bottom: 15px;
    margin-right: 15px;
}

.about-piclist.border {
    border-top: 1px solid #c6c2c2;
    padding-top: 35px;
}

.about-piclist-item.wechat {
    width: 640px;
}

.about-piclist-item img {
    width: 70px;
    height: 70px;
}

.about-piclist-item .piclist-logo {
    float: left;
}

.about-piclist-item .piclist-content.border-right {
    border-right: 1px solid #ccc;
    margin-right: 20px;
}

.about-piclist-item .piclist-content {
    font-family: "微軟雅黑體", "Microsoft YaHei", "Arial", "Helvetica", "sans-serif";
    float: left;
    height: 70px;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 25px;
    line-height: 1.3;
}

    .about-piclist-item .piclist-content h4 {
        font-size: 16px;
        font-weight: bold;
    }

    .about-piclist-item .piclist-content p {
        font-size: 16px;
        padding-top: 5px;
    }

    .about-piclist-item .piclist-content span {
        font-size: 14px;
        color: #b4b4b4;
    }

    .about-piclist-item .piclist-content .piclist-qrcode {
        float: left;
        margin-left: 20px;
    }

        .about-piclist-item .piclist-content .piclist-qrcode img {
            width: 75px;
            height: 75px;
            margin-top: -2px;
        }

.about-piclist-item .wechatInner {
    float: left;
    width: 33.3%;
    margin-bottom: 45px;
}

.wechatInner .piclist-logo {
    border: 2px solid #eaeaea;
    padding: 10px;
}
/* end piclist */
/* start piclist2 */
/* for Community */
.about-piclist2 {
    border-bottom: 1px solid #c6c2c2;
}

    .about-piclist2:before, .about-piclist2:after {
        content: " ";
        display: table;
    }

    .about-piclist2:after {
        clear: both;
    }

.about-piclist2-item {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding: 15px;
    margin-bottom: -1px;
    border-bottom: 1px solid #c6c2c2;
    position: relative;
}

    .about-piclist2-item img {
        width: 40px;
        height: 40px;
    }

    .about-piclist2-item span {
        display: block;
        position: absolute;
        top: 25px;
        left: 65px;
        font-size: 16px;
    }
/* end piclist2 */
.search-note {
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
    display: block;
    float: none;
    clear: both;
}

    .search-note h2 {
        font-size: 36px;
    }

@media screen and (max-width: 768px) {
    .about-magazine .about-form-group {
        float: none;
        width: auto;
        margin: 0 auto 20px auto;
    }
    /*.about-magazine .about-form-box1, .about-magazine .about-form-box4 {
    float: none;
    display: inline-block;
  }*/
}

@media screen and (max-width:580px) {
    .about-contentlist-item {
        margin-bottom: 30px;
    }

    .about-contentlist-pic {
        width: 15.7%;
    }

    .about-contentlist-content {
        padding-left: 15px;
        width: 84.3%;
    }

    .about-contentbox-wrap {
        margin-left: 0;
    }

    .about-contentbox-item {
        width: 48%;
        padding-left: 0;
        margin-left: 0;
        margin-right: 2%;
        margin-bottom: 15px;
    }

    .about-contentbox-pic {
        width: 100%;
    }

    .about-piclist-item .piclist-content {
        padding-right: 0;
    }

    .about-form-group {
        width: 100%;
    }

    .about-piclist2-item {
        width: 100%;
    }

    .about-form-box1, .about-form-box2, .about-form-box3, .about-form-box4, .about-form-box5 {
        clear: both;
        width: 100%;
        padding-left: 0;
    }

    .about-magazine .about-form-box1 {
        clear: both;
        width: 73%;
        padding-left: 0;
    }

    .about-magazine .about-form-box4 {
        clear: none;
        width: 25%;
        padding-left: 0;
        margin-left: 3px;
        padding: 0 0;
    }

    .about-form-control {
        float: left;
        height: auto;
        box-sizing: border-box;
        width: 85%;
        padding: 8px 10px;
        /* font-size: 14px; */
        line-height: 1.3em;
        background-color: transparent;
        background-image: none;
        border: 0;
    }
}
/************************************************************

    以下區段為覆寫jquery ui樣式區域
    僅新增元件的樣式名稱並以about字樣為開頭，例如.about-accordion、.about-tabs
    其餘部分為覆寫jquery ui樣式，沒有新增或更改原有jquery ui的class name或id name

************************************************************/
/* start override tabs */
.about-tabs.ui-tabs.ui-corner-top, .about-tabs.ui-tabs.ui-corner-bottom, .about-tabs.ui-tabs.ui-corner-all {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: 0;
}

.about-tabs.ui-tabs.ui-widget-content {
    border: 0;
    background: none;
    color: #000;
}

.about-tabs.ui-tabs .ui-tabs-nav {
    padding-left: 10px;
    margin-bottom: 20px;
}

    .about-tabs.ui-tabs .ui-tabs-nav li {
        box-sizing: border-box;
        list-style: none;
        float: left;
        position: relative;
        top: 0;
        width: 33%;
        margin: 0 20px 0 -10px;
        padding: 5px;
        white-space: nowrap;
        text-align: center;
    }

        .about-tabs.ui-tabs .ui-tabs-nav li.ui-tabs-active {
            margin: 0 20px 0 -10px;
            padding: 5px;
        }

        .about-tabs.ui-tabs .ui-tabs-nav li.last-child {
            margin: 0 -10px 0 -10px;
        }

        .about-tabs.ui-tabs .ui-tabs-nav li:hover {
            background-color: #c6c2c2;
        }

    .about-tabs.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
        float: none;
        text-decoration: none;
        padding: 0;
        display: block;
        font-size: 14px;
    }

.about-tabs.ui-tabs .ui-widget-header {
    border: 0;
    background: none;
    color: #000;
    font-weight: normal;
}

.about-tabs.ui-tabs .ui-tabs-panel {
    display: block;
    border: 0;
    padding: 0;
    background: none;
}

.about-tabs.ui-tabs .ui-corner-top, .about-tabs.ui-tabs .ui-corner-bottom, .about-tabs.ui-tabs .ui-corner-all {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: 0;
}

.about-tabs.ui-tabs .ui-widget-content {
    border: 0;
    background: none;
    color: #000;
}

.about-tabs.ui-tabs .ui-state-default {
    background: #fff;
    border: 1px solid #c6c2c2;
}

    .about-tabs.ui-tabs .ui-state-default a, .about-tabs.ui-tabs .ui-state-default a:link, .about-tabs.ui-tabs .ui-state-default a:visited {
        color: #000;
        text-decoration: none;
    }

.about-tabs.ui-tabs .ui-state-active {
    background: #004280;
    border: 1px solid #004280;
}

    .about-tabs.ui-tabs .ui-state-active a, .about-tabs.ui-tabs .ui-state-active a:link, .about-tabs.ui-tabs .ui-state-active a:visited {
        color: #fff;
        text-decoration: none;
    }

.ui-datepicker {
    background-color: #ffffff;
    border: #CCC solid 1px;
    padding: 8px 12px 2px 8px;
}

@media screen and (max-width:580px) {
    .about-tabs.ui-tabs .ui-tabs-nav {
        padding-left: 0;
    }

        .about-tabs.ui-tabs .ui-tabs-nav li {
            width: 100%;
            margin: 0 0 5px 0;
        }

            .about-tabs.ui-tabs .ui-tabs-nav li.ui-tabs-active {
                margin: 0 0 5px 0;
            }

            .about-tabs.ui-tabs .ui-tabs-nav li.last-child {
                margin: 0 0 5px 0;
            }
}
/* end override tabs */
/*2017.03.08 by Becky */
/*for executive detail*/
.about-contentlist-content-detail-features {
    width: 24%;
    margin-left: 4%;
    margin-top: -80px;
    float: right;
}

.about-contentlist-content-detail {
    box-sizing: border-box;
    margin-bottom: 35px;
    position: relative;
}

    .about-contentlist-content-detail h2 {
        font-weight: normal;
        font-size: 26px;
    }

    .about-contentlist-content-detail h3 {
        font-weight: normal;
        font-size: 16px;
        color: #666666;
        margin-bottom: 12px;
    }

    .about-contentlist-content-detail ul {
        margin-left: 15px;
    }

    .about-contentlist-content-detail li {
        list-style-type: disc;
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 7px;
    }

.about-contentlist-pic-l {
    text-align: center;
    box-sizing: border-box;
    margin-bottom: 25px;
}

    .about-contentlist-pic-l img {
        border: 1px solid #ccc;
    }

.about-contentlist-text {
    margin: 0 0 35px 0;
    line-height: 1.5em;
    font-size: 14px;
    width: 72%;
    float: left;
}

    .about-contentlist-text p {
        margin-bottom: 35px;
    }

@media screen and (max-width: 768px) {
    .about-contentlist-content-detail-features {
        width: 100%;
        clear: both;
        margin-top: 0px;
    }

    .about-contentlist-text {
        width: 100%;
        clear: both;
    }

    .about-contentlist-pic-l {
        float: left;
        width: 25%;
    }

        .about-contentlist-pic-l img {
            width: 100%;
        }

    .about-contentlist-content-detail {
        float: left;
        width: 72%;
        margin-left: 3%;
    }
}

@media screen and (max-width: 580px) {
    .about-piclist-item.wechat {
        width: 100%;
    }

    .about-piclist-item .wechatInner {
        width: 50%;
    }
}

@media screen and (max-width:580px) {
    .about-contentlist-content-detail-features {
        margin-left: 0px;
    }

    .about-contentlist-pic-l {
        clear: both;
        width: 100%;
    }

        .about-contentlist-pic-l img {
            width: auto;
        }

    .about-contentlist-content-detail {
        clear: both;
        width: 100%;
        margin-left: 0;
    }
}
/* Main Content Lists Buttons
----------------------------------------*/
.content-main-wrap .listButton {
    /*text-align: center;*/
    padding: 4px 0;
    margin-top: 20px;
    margin-bottom: 1px;
}

    .content-main-wrap .listButton li {
        display: inline;
    }

        .content-main-wrap .listButton li a {
            padding: 5px 10px;
            margin: 0 2px;
            list-style: none;
            font-size: 12px;
            line-height: 11px;
            color: #004280;
            border: 1px solid #ccc;
            background: #fff;
            text-decoration: none;
        }

        .content-main-wrap .listButton li.active a {
            border: 1px solid #004280;
            background: #004280;
            color: #fff;
        }

        .content-main-wrap .listButton li:hover a {
            border: 1px solid #ccc;
            background: #ccc;
            color: #004280;
        }

@media screen and (max-width: 380px) {
    .about-piclist-item .wechatInner {
        float: left;
        width: 100%;
    }
}