/* css reset */
ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 { font-weight: 400; margin: 0;}
a:hover, a:focus, a:active { text-decoration: none;}
img { border: 0;}

/* base */
html, body {
    height: 100%;
    font-size: 16px;
    line-height: 1.5;
}
@media screen and (max-width:767.98px) {
    html, body {
        font-size: 13px;
    }
}

body {
    margin: 0;
    padding: 0;
    font-family: "微軟正黑體", Arial, sans-serif;
    color: #333;
}

a { color: #148464;}
a:focus, a:visited { color: #148464;}
a:hover { color: #F38323;}


/* layout */
.page { min-height: 100%;}
.page-wrapper {
    max-width: 1366px;
    min-width: 320px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 40px;
}
/* IE8 */
@media \0screen {
    .page-wrapper {
        min-width: 998px;
    }
}

.container {
    padding-top: 0;
    padding-bottom: 0;
    max-width: 930px;
}
@media screen and (max-width: 767.98px) {
    .container {
        padding-left: 12px;
        padding-right: 12px;
        width: 100%;
    }
}
@media (min-width: 768px) and (max-width: 1020px){
    .container {
        padding-left: 60px;
        padding-right: 60px;
        width: 100%;
    }
}
@media screen and (min-width: 992px) {
    .container { width: 100%;}
}
@media screen and (min-width: 768px) {
    .container { width: 100%;}
}

.table { display: table; margin-bottom: 0;}
.tr { display: table-row;}
.td { display: table-cell;}

.page-header {
    border-bottom: 3px solid #148464;
    background-color: #fff;
    padding: 0;
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
}
.page-header .page-wrapper {
    padding: 18px 0;
    position: relative;
}
.page-header .absolute-right {
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -12px;
}
.header-logo { color: #0e8162;}
.logo-img {
    width: 247px;
    height: 44px;
    background: url(../images/fcb_logo@2x.png) no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
}
.logo-net {
    width: 111px;
    height: 38px;
    background: url(../images/fcb_logo_e@2x.png) no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
}
.logo-title {
    color: #148464;
    font-size: 24px;
    display: inline-block;
    vertical-align: middle;
}
/* IE8 */
@media \0screen {
    .logo-img { background-image: url(../images/fcb_logo@1x.png);}
    .logo-net { background-image: url(../images/fcb_logo_e@1x.png);}
}
@media screen and (max-width:767.98px) {
    .page-header .page-wrapper{ padding: 14px 0;}
    .logo-img {
        width: 149px;
        height: 28px;
    }
    .logo-net {
        width: 62px;
        height: 22px;
    }
    .logo-title { display: none;}
}
.logo-title::before {
    content: '';
    width: 1px;
    height: 15px;
    display: inline-block;
    background-color: #ccc;
    display: inline-block;
    margin-right: 16px;
    margin-left: 24px;
}
.language-link {
    font-size: 14px;
    padding: 4px 12px;
    border-radius: 4px;
    border: 1px solid #148464;
    transition: all 0.3s ease;
}
.language-link:hover { color: #F38323; border-color: #F38323;}
.language-link:active, .language-link:focus { border-color: #148464;}
.language-link.mobile { display: none;}

@media screen and (max-width:767.98px) {
    .language-link { display: none; font-size: 12px;}
    .language-link.mobile { display: inline-block;}
}


/*content */
.page-content {
    margin-top: 83px;
}
@media screen and (max-width:767.98px) {
    .page-content{
        margin-top: 59px;
    }
}

.visual {
    background: url(../images/pic_oversea.png) no-repeat top center;
    background-size: auto 230px;
    height: 230px;
}
@media screen and (max-width:768px) {
    .visual{
        background-image: url(../images/pic_oversea_md.png);
        background-size: auto 180px;
        height: 180px;
    }
}
@media screen and (max-width:390px) {
    .visual{
        background-image: url(../images/pic_oversea_sm.png);
        background-size: auto 140px;
        height: 140px;
    }
}
/* IE8 */
@media \0screen {
    .visual { background-image: url(../images/pic_oversea@1x.png);}
}

/* breadcrumb */
.breadcrumb {
    padding: 0;
    margin-top: 20px;
    margin-bottom: 0;
    background-color: transparent;
    font-size: 14px;
}
.breadcrumb-item::before {
    content: '';
    width: 16px;
    height: 16px;
    display: inline-block;
    background: url(../images/svg/icon_breadcrumb.svg) center center no-repeat;
    background-size: 100%;
    vertical-align: middle;
    margin-right: 4px;
    margin-top: -4px;
}
.breadcrumb > li + li::before { content: '';} /* 覆蓋 bs 樣式*/
.breadcrumb-item.home::before {
    background-image: url(../images/svg/icon_home.svg);
    margin-right: 2px;
}
.breadcrumb-item a:hover { color: #F38323;}
.breadcrumb-item.active { color: #333;}

/* IE8 */
@media \0screen {
    .breadcrumb-item::before { background-image: url(../images/ie8/icon_breadcrumb.png);}
    .breadcrumb-item.home::before { background-image: url(../images/ie8/icon_home.png);}
}

@media screen and (max-width: 767.98px) {
    .breadcrumb {
        font-size: 12px;
        margin-top: 16px;
    }
}


.section-title {
    font-size: 38px;
    font-weight: 700;
    color: #0e8162;
    margin-top: 50px;
    transition: all .3s;
}
@media screen and (max-width:767.98px) {
    .section-title { font-size: 24px; margin-top: 32px;}
}
.overseas-list {
    margin-top: 18px;
}
.overseas-item .td {
    padding-top: 30px;
    padding-bottom: 18px;
    border-bottom: 1px solid #E8EBEC;
}
.overseas-item.border-none .td { border: 0;}
@media screen and (max-width:767.98px){
    .overseas-list {
        margin-top: 4px;
    }
    .overseas-item .td {
        padding-top: 0;
        padding-bottom: 0;
    }
    .overseas-item .tr { display: block;}
    .overseas-item .td { display: block; width: 100%;}
    .overseas-item .td.w130px { border: 0; padding-top: 20px; padding-bottom: 0;}
}
.overseas-item:last-child {
    border-bottom: none;
    padding-bottom: 0px;
}
.overseas-location {
    font-size: 22px;
    font-weight: 700;
}
@media screen and (max-width:767.98px){
    .overseas-location {
        font-size: 16px;
        margin-bottom: 12px;
    }
}
.branch-item {
    display: inline-block;
    vertical-align: top;
    width: 24%;
    margin-bottom: 30px;
}
[lang="en"] .branch-item { width: 32%;}
.branch-item a {
    color: #333;
    display: inline-block;
    position: relative;
    font-size: 18px;
    transition: all 0.3s ease;
    padding-left: 22px;
}
.branch-item a:hover { color: #F38323;}
.branch-item .icon-location {
    margin-left: -22px;
    margin-right: 6px;
    margin-top: -4px;

}

@media screen and (max-width: 767.98px) {
    .branch-item { width: 32%; margin-bottom: 16px;}
    [lang="en"] .branch-item { width: 49%;}

    .branch-item a { font-size: 14px;}
    .branch-item .icon-location { margin-top: -2px;}
}

.customer-info {
    display: inline-block;
    width: 100%;
    background: #148464 url(../images/consumer_hotline_bg.gif) repeat-y left top;
    background-size: 100% auto;
    color: #fff;
    text-align: center;
    padding: 10px 20px
}
.ebank-info {
    padding: 10px 20px;
    text-align: center;
}
.info-txt {
    display: inline-block;
    margin-right: 8px;
}
.info-browser {
    display: inline-block;
    margin-right: 16px;
}
.link-info{
    display: inline-block;
    margin-left: 0px
}
.link-info li { display: inline-block;}
.link-info a { color: #333;}
.link-info a:hover { text-decoration: underline;}
.link-info a:first-child { padding-right: 10px;}
.link-info a:last-child { padding-left: 10px;}
.link-info li:last-child::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 10px;
    background: #333;
}
@media screen and (max-width: 767.98px) {
    .customer-info { padding: 3px 10px;}
    .info-txt{
        font-size: 12px;
        margin-right: 0px;
    }
    .info-browser { display: none;}
    .link-info { display: block;}
    .link-info a { font-size: 12px;}
}

/* 海外分行下載頁 */
.empty-visual {
    background: none;
    height: auto;
    padding: 0;
}
.empty-visual .section-title{
    margin-top: 42px;
    margin-bottom: 42px;
}
.overseas-bank-info { margin-bottom: 28px;}
.overseas-bank-info.mt-80 { margin-top: 80px;}

@media screen and (max-width: 767.98px) {
    .empty-visual .section-title{
        margin-top: 32px;
        margin-bottom: 32px;
    }
    .overseas-bank-info { margin-bottom: 16px;}
    .overseas-bank-info.mt-80 { margin-top: 32px;}
}

.info-title {
    font-size: 22px;
    font-weight: 700;
    color: #148464;
}
.info-title .icon-list {
    margin-right: 6px;
    margin-top: -4px;
}
@media screen and (max-width:767.98px) {
    .info-title { font-size: 16px;}
    .info-title::before{
        width: 16px;
        height: 16px;
    }
}

.download-acrobat .icon-acrobatreader {
    margin-right: 6px;
    margin-top: -2px;
}

.gutters-s {
    margin-left: -6px;
    margin-right: -6px;
}
.gutters-s > [class*="col-"] {
    padding-left: 6px;
    padding-right: 6px;
}


/* 安全 */
.accordion-area .panel-heading { padding: 0;}
.accordion-area .panel-group { margin: 0;}
.accordion-area .panel-default {
    border: none;
    border-bottom: 1px solid #E8EBEC;
    box-shadow: none;
}
.accordion-area .panel { border-radius: 0;}
.accordion-area .panel + .panel { margin-top: 0;}
.accordion-area .panel-heading a {
    font-size: 18px;
    padding-right: 40px;
    position: relative;
    display: block;
    padding: 12px 16px;
    color: #333;
}
.accordion-area .panel-heading a:hover {
    background: #E8EBEC;
}
.accordion-area .panel-default > .panel-heading {
    background: #fff;
    border-radius: 0px;
}
.accordion-area .panel-heading .icon {
    width: 24px;
    height: 24px;
    background-image: url(../images/svg/icon_minus.svg);
}
.accordion-area .panel-heading a:hover .icon {
    background-image: url(../images/svg/icon_minus_active.svg);
}
.accordion-area .panel-heading a.collapsed .icon {
    background-image: url(../images/svg/icon_plus.svg);
}
.accordion-area .panel-heading a.collapsed:hover .icon {
    background-image: url(../images/svg/icon_plus_active.svg);
}
/* IE8 */
@media \0screen {
    .accordion-area .panel-heading .icon { background-image: url(../images/ie8/icon_minus.png);}
    .accordion-area .panel-heading a:hover .icon { background-image: url(../images/ie8/icon_minus_active.png);}
    .accordion-area .panel-heading a.collapsed .icon { background-image: url(../images/ie8/icon_plus.png);}
    .accordion-area .panel-heading a.collapsed:hover .icon { background-image: url(../images/ie8/icon_plus_active.png);}
}

.accordion-area .panel-body {
    padding: 12px 16px;
    margin-left: 8px;
    font-size: 14px;
}
.accordion-area .panel-body h3 {
    font-size: 18px;
    margin-bottom: 12px;

}
.accordion-area .panel-heading + .panel-collapse > .panel-body { border-top: none;}

@media (max-width: 767.98px){
    .accordion-area .panel-heading a { padding: 8px;}
    .accordion-area .panel-heading a { font-size: 14px;}
    .accordion-area .panel-heading .icon {
        width: 16px;
        height: 16px;
    }    
}


/* utilities */
.list_cjk > li {
    list-style-type: decimal;
    margin-bottom: 10px;
}
.list_cjk > .list_disc { margin-top: 10px;}
.list_disc > li {
    list-style-type: disc;
    margin-bottom: 10px;
}
[lang="en"] .list_cjk > li {
    list-style-type: decimal;
}


.icon {
    display: inline-block;
    vertical-align: middle;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.icon-collapse {
    width: 16px;
    height: 16px;
    background: url(../images/svg/icon_collapse.svg) no-repeat center center;
    background-size: contain;
    margin-left: 2px;
    margin-top: -2px;
}
.icon-phone {
    width: 26px;
    height: 26px;
    background-image: url(../images/svg/icon_phone.svg);
}
.icon-download {
    width: 16px;
    height: 16px;
    background-image: url(../images/svg/icon_download.svg);
}
.icon-acrobatreader {
    width: 16px;
    height: 16px;
    background-image: url(../images/svg/icon_acrobatreader.svg);
}
.icon-list {
    width: 24px;
    height: 24px;
    background-image: url(../images/svg/icon_list.svg);
}
.icon-location {
    width: 16px;
    height: 16px;
    background-image: url(../images/svg/icon_location.svg);
}

/* IE8 */
@media \0screen {
    .icon-collapse { background-image: url(../images/ie8/icon_collapse.png);}
    .icon-phone { background-image: url(../images/ie8/icon_phone.png);}
    .icon-download { background-image: url(../images/ie8/icon_download.png);}
    .icon-acrobatreader { background-image: url(../images/ie8/icon_acrobatreader.png);}
    .icon-list { background-image: url(../images/ie8/icon_list.png);}
    .icon-location { background-image: url(../images/ie8/icon_location.png);}
}

@media (max-width: 767.98px){
    .icon-phone {
        width: 20px;
        height: 20px;
    }  
}

.w100p { width: 100%;}
.w50p { width: 50%;}
.w30px { width: 30px;}
.w60px { width: 60px;}
.w130px { width: 130px;}
.h100p { height: 100%;}
.vmid { vertical-align: middle;}
.ml-20 { margin-left: 20px;}
.ml-40 { margin-left: 40px;}
.mb-10 { margin-bottom: 10px;}


/* 下載項目 */
.download-table .td:nth-child(even) { padding-left: 6px;}
.download-table .td:nth-child(odd) { padding-right: 6px;}
.download-table .td {
    width: 50%;
    height: 88px;
    padding-bottom: 12px;
}
.download-table a {
    display: block;
    border-radius: 6px;
    border: 1px solid #E8EBEC;
    padding: 16px;
    height: 100%;
    color: #333;
}
@media screen and (max-width: 767.98px) {
    .download-table .td { min-height: 56px; height: auto;}
    .download-table .td-empty { min-height: auto; height: 0;}
    .download-table a { padding: 12px;}
}

.download-table a:hover,
.download-table a:active {
    color: #148464;
    border-color: #148464;
}
.download-table a:focus,
.download-table a:visited {
    color: inherit;
    border-color: #E8EBEC;
}

.download-pdf { color: #148464;}
.download-pdf .icon-download {
    display: inline-block;
    vertical-align: middle;
    margin-right: 2px;
    margin-top: -4px;
}

@media screen and (max-width: 767.98px) {
    .download-table { display: block;}
    .download-table .tr { display: block; width: 100%;}
    .download-table .td {
        display: block;
        width: 100%;
    }
    .download-table .td:nth-child(even) {
        padding-left: 0;
    }
    .download-table .td:nth-child(odd) {
        padding-right: 0;
    }
    .accordion-area .panel-body{
        font-size: 12px;
    }
}

.collapse-download-area { height: 100%; display: block;}
@media screen and (max-width: 767.98px) {
    .collapse-download-area { height: 0; overflow: hidden;}
    .collapse-download-area.in { height: 100%;}
}

/* go top */
.gotop {
    display: none;
    position: fixed;
    bottom: 60px;
    right: 12px;
    width: 50px;
    height: 50px;
    border-radius: 999px;
    background-color: rgba(51,51,51,.4);
    background-image: url(../images/svg/icon_top.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40px;
}
@media screen and (min-width: 768px) {
    .gotop { display: none !important};
}
a:hover .icon-collapse{
    background: url(../images/svg/icon_collapse_active.svg) no-repeat center center;
}
.link-style,
.link-style:hover{
    color: #1591DD;
    text-decoration: underline;
}