@charset "UTF-8";
/* 管理網站色系 */
:root {
  --main-color: #00866b;
  --main-color-opacity: rgba(0,134,107,.25);
  --second-color: #ff7a40;
  --third-color: #ff7a40;
  --forth-color: #009678;
  --fifth-color: #fdfcb6;
  /*--sixth-color: #4e7770;*/
}

/* 設計師用 RWD版CSS檔 style_rwd.css */
/* css檔案為套件web compiler產生，建議修改在scss檔案上重新生成 */
/* 說明：可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/
@media (min-width: 768px) {
  .header .navbar .navbar-brand {
    margin: 17px 0;
  }
}
@media (min-width: 992px) {
  .wid-float-section,
body.scroll-down .wid-float-section.mobile-animate {
    bottom: 0;
  }
  .wid-float-section.fixed,
body.scroll-down .wid-float-section.mobile-animate.fixed {
    position: absolute;
    bottom: 0;
  }

  .wid-float-section ul li.top a {
    padding: 0;
    display: inherit;
    height: 0;
    overflow: hidden;
  }
  .wid-float-section ul li.top a .icon {
    margin-top: 12px;
    font-size: 15px;
  }
  .wid-float-section ul li {
      width: 40px;
  }
  .wid-float-section ul li a {
      width: 40px;
      padding: 6px 2.5px 5px;
      color: #fff;
     /* font-size: 6px;*/
      letter-spacing: 1px;
  }

  .wid-float-section ul li.b4 .icon {
    width: 12px;
    height: 16px;
  }
  .wid-float-section ul li.b4 a span {
    writing-mode: vertical-lr;
  }
  .is_scroll .wid-float-section ul li.top a {
    height: 40px;
  }

  .header .navbar .navbar-nav > .nav-item {
    /*&:nth-child(2) {
        > ul {
            > .nav-item {
                &:nth-child(3) {
                    .nav-link {
                        span {
                            display: block;
                        }
                    }
                }
            }
        }
    }*/
  }
  .header .navbar .navbar-nav > .nav-item:nth-child(1) > ul > .nav-item:nth-child(2) .nav-link span {
    display: block;
  }
  .header .navbar .navbar-nav > .nav-item:nth-child(6) > ul > .nav-item:nth-child(2) .nav-link span {
    display: block;
  }

  .is_scroll .header .navbar .navbar-brand {
    width: 120px;
    height: 40px;
  }
  .is_scroll .header .navbar .navbar-nav > .nav-item > .nav-link {
    padding-top: 25px;
    padding-bottom: 25px;
  }

}
@media (min-width: 1480px) {
  body.home .container, body.home .container-lg, body.home .container-md, body.home .container-sm, body.home .container-xl, body.home .container-xxl {
    max-width: 1440px;
  }
}
@media (min-width: 1620px) {
  body.home .container, body.home .container-lg, body.home .container-md, body.home .container-sm, body.home .container-xl, body.home .container-xxl {
    max-width: 1600px;
  }
}
@media (max-width: 1479px) {
  .header .navbar .navbar-nav > .nav-item {
    margin: 0 1vw;
  }
  .header .navbar .navbar-nav > .nav-item > .nav-link {
    padding: 36px 5px;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link {
    padding: 12px 10px;
  }
  .header .navbar .lang {
    margin-left: 20px;
    margin-right: 10px;
  }

  body.home .content .about a .txt {
    font-size: 28px;
  }
  body.home .content .link-box {
    margin-top: 55px;
    padding-left: 20px;
  }
  body.home .content .link-box .item .txt {
    font-size: 22px;
  }
  body.home .content .wid .h2 {
    font-size: 22px;
  }
  body.home .content .wid .h2 .txt-en {
    margin-left: 0.5em;
  }
  body.home .content .wid .btn-more {
    padding: 0.5em 1.6em;
  }
  body.home .content .wid.wid-home-news .txt-list {
    padding: 32px 2px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item + .list_item {
    margin-top: 20px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item .info {
    font-size: 15px;
  }

  .table-responsive-md {
    overflow-x: auto;
  }
}
@media (max-width: 1399px) {
  .footer .footer_content {
    padding: 45px 0;
  }
  .footer .footer_content .sitemap {
    padding-left: 4vw;
  }
  .footer .footer_content .sitemap > ul > li {
    flex: 0 0 100%;
  }

  body.home .content .link-box {
    margin-top: 50px;
    padding-left: 20px;
  }
  body.home .content .link-box .item .txt {
    font-size: 22px;
  }
  body.home .content .wid .h2 {
    font-size: 20px;
  }
  body.home .content .wid .h2 .txt-en {
    margin-left: 0.5em;
  }
  body.home .content .wid .btn-more {
    padding: 0.5em 1.2em;
  }
  body.home .content .wid.wid-home-news .txt-list {
    padding: 18px 2px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item + .list_item {
    margin-top: 20px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item .info {
    font-size: 15px;
  }

  .feature-box.en {
    width: 70%;
  }

  .feature-en.right .feature-num-en {
    top: -37px;
  }
}
@media (max-width: 1199px) {
  .header .navbar .navbar-nav > .nav-item {
    margin: 0 0.35vw;
    /*> .nav-link {
        padding: 36px 2px;
    }*/
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link {
    padding: 10px 7px;
  }
  .header .navbar .lang {
    margin-left: 15px;
    margin-right: 5px;
  }

  .footer .footer_content {
    padding: 40px 0;
  }
  .footer .footer_content .sitemap {
    padding-left: 2vw;
  }
  .footer .footer_content .sitemap > ul > li {
    flex: 0 0 100%;
  }
  .footer .footer_content .siteinfo ul li {
    flex: 0 0 100%;
  }
  .footer .footer_content .siteinfo ul li:nth-child(even) {
    flex: 0 0 100%;
  }

  body.home .content .about .row > .col {
    flex: 0 0 100%;
  }
  body.home .content .about .row > .col .pic {
    height: 250px;
  }
  body.home .content .about .row > .col + .col {
    flex: 0 0 100%;
  }
  body.home .content .about a .txt {
    font-size: 24px;
  }
  body.home .content .link-box {
    margin-top: 48px;
    padding-left: 12px;
  }
  body.home .content .link-box .item .txt {
    font-size: 22px;
  }
  body.home .content .wid .h2 {
    font-size: 18px;
  }
  body.home .content .wid .btn-more {
    padding: 0.3em 1em;
  }
  body.home .content .wid.wid-home-news .txt-list {
    padding: 15px 2px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item + .list_item {
    margin-top: 8px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item .info {
    font-size: 15px;
  }

  /*核心價值*/
  .core_left {
    margin-left: 0;
  }

  .core_right {
    position: relative;
    margin-top: 0;
  }

  .mobile_hidden {
    display: none;
  }

  .mobile_show {
    display: block;
  }

  .right_box {
    margin-top: 20px;
  }

  /*about 新設定*/
  .feature {
    display: block;
    margin: 0 0 40px;
  }

  .feature-en {
    display: block;
    margin: 0 0 90px;
  }

  .feature-img {
    width: 100%;
    height: 0;
    padding-top: 78.53%;
  }

  .feature-box {
    position: static;
    width: auto;
    margin: 24px 0 0;
  }

  .feature-num {
    /*font-size: 56px;*/
  }

  .feature-data {
    padding-top: 24px;
    padding-right: 20px;
  }

  .feature-ttl {
    font-size: 22px;
    margin: 0 0 24px;
  }

  .feature.left .feature-img {
    width: 100%;
  }

  .feature.left .feature-num,
.feature-en.left .feature-num-en {
    text-align: left;
  }

  .feature.left .feature-data {
    padding-left: 20px;
  }

  .feature-sub-ttl {
    display: block;
    width: auto;
    writing-mode: inherit;
    margin: 0 0 16px;
    font-size: 24px;
  }

  .feature-box.en {
    position: relative;
    margin: 0;
  }

  .feature-box.en {
    width: 100%;
  }

  .feature-en.right .feature-num-en {
    top: 0;
    padding-left: 0;
  }
}
@media (max-width: 991px) {
  .header .navbar .navbar-brand {
    width: 120px;
    height: 40px;
  }
  .header .navbar .navbar-nav > .nav-item {
    margin: 0;
  }
  .header .navbar .navbar-nav > .nav-item > .nav-link {
    padding: 10px;
  }
  .header .navbar .navbar-nav > .nav-item > .nav-link:after {
    display: none;
  }
  .header .navbar .navbar-nav > .nav-item:hover > .nav-link, .header .navbar .navbar-nav > .nav-item:focus > .nav-link, .header .navbar .navbar-nav > .nav-item:active > .nav-link, .header .navbar .navbar-nav > .nav-item.in > .nav-link {
    background: var(--main-color);
    color: #fff;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link {
    padding: 8px 15px;
    text-align: left;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:hover, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:focus, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:active, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link.in {
    background: var(--main-color);
    color: #fff;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav {
    background: #d4d4d4;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link {
    padding: 8px 20px;
    font-size: 14px;
  }
  .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:hover, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:focus, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link:active, .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link.in {
    background: var(--main-color);
    color: #fff;
  }
  .header .navbar .lang {
    position: sticky;
    bottom: 0;
    display: block;
    margin: 0;
  }
  .header .navbar .lang ul {
    margin: 0;
  }
  .header .navbar .lang ul li a {
    display: block;
    padding: 10px;
    background: var(--second-color);
    color: #fff;
  }

  .banner {
    margin-top: 74px;
  }
  .banner .slick:before {
    height: 15%;
  }

  body.home .content .about .row > .col {
    flex: 0 0 100%;
  }
  body.home .content .about .row > .col .pic {
    height: 200px;
  }
  body.home .content .about .row > .col + .col {
    flex: 0 0 100%;
  }
  body.home .content .about .row > .col .row .col .pic {
    height: 200px;
  }
  body.home .content .about a .txt {
    font-size: 24px;
  }
  body.news .article-list .item.pin .txt {
    padding: 25px 0 0 1.5em;
  }
  body.news .article-list .item .pic {
    flex: 1 1 50%;
  }
  body.news .article-list .item .txt {
    flex: 1 1 50%;
    padding: 0 0 0 1.5em;
  }

  .cause_flex {
    flex-direction: column;
  }

  .cause_main01 {
    width: 100%;
  }

  .feature-num-en {
    padding-left: 0;
  }
}
@media (max-width: 767px) {
	.content .function-bar p {
    position: static;
    margin-top: 8px;
}
    .header .navbar .navbar-nav > .nav-item > .navbar-nav > .nav-item .nav-link > .caret{
        display:none;
    }
    body .bsnav-mobile .navbar-nav li ul .navbar-nav {
        display: block !important;
    }
    .banner {
        margin-top: 60px;
    }
  .banner .slick .slick-arrow {
    height: 50px;
    width: 50px;
  }
  .banner .slick .slick-arrow:before {
    height: 50px;
    width: 50px;
  }

  .bsnav-mobile {
    top: 60px;
  }
  .bsnav-mobile .bsnav-mobile-overlay {
    top: 60px;
  }

  .wid-float-section ul li {
    width: 60px;
  }
  .wid-float-section ul li a {
    width: 60px;
    height: 100%;
    padding: 8px 0 4px;
    letter-spacing: 1px;
  }
  .wid-float-section ul li a .icon {
    font-size: 24px;
  }
  .wid-float-section ul li.b4 .icon {
    width: 18px;
    height: 24px;
  }

  .footer .footer_content {
    padding: 30px 0;
  }
  .footer .footer_content .footer-brand {
    max-width: 150px;
    margin-left: auto;
    margin-right: auto;
  }
  .footer .footer_content .sitemap {
    max-width: none;
    margin-top: 10px;
    padding-left: 0;
    border-left: 0;
  }
  .footer .footer_content .sitemap > ul {
    display: block;
    margin-bottom: 10px;
    text-align: center;
  }
  .footer .footer_content .sitemap > ul > li {
    display: inline-block;
    margin: 0 3px;
  }
  .footer .footer_content .siteinfo ul li {
    text-align: center;
  }
  .footer .footer_content .siteinfo ul li:nth-child(1) {
    display: none;
  }
  .footer .footer_content .copyright {
    text-align: center;
  }

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

  .main {
    padding: 15px 0;
  }
  .main:not(.home) {
    padding: 15px 0;
  }
  .main .side {
    margin-bottom: 15px;
  }

  .content .nav.nav-pills .nav-item .nav-link {
    padding: 0.75em 1em;
  }

  body.home .content section {
    padding: 10px 0;
  }
  body.home .content .about .row > .col .pic {
    height: 150px;
  }
  body.home .content .about .row > .col .row .col .pic {
    height: 150px;
  }
  body.home .content .about .row > .col .row .col .row .col {
    flex: 0 0 100%;
    margin-bottom: 24px;
  }
  body.home .content .about .row > .col .row .col .row .col:last-child {
    margin-bottom: 0;
  }
  body.home .content .about a .txt {
    font-size: 20px;
  }
  body.home .content .link-box {
    margin-top: 15px;
    padding-left: 7px;
  }
  body.home .content .link-box .item .pic {
    height: 200px;
  }
  body.home .content .link-box .item .pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  body.home .content .link-box .item .txt {
    font-size: 16px;
  }
  body.home .content .wid.wid-home-news .txt-list {
    padding: 12px 2px;
  }
  body.home .content .wid.wid-home-news .txt-list .list_item + .list_item {
    margin-top: 10px;
  }
  body.news .article-list .item.pin .txt {
    padding: 25px 0 0;
  }
  body.news .article-list .item.pin .txt:after {
    font-size: 14px;
    letter-spacing: 0.15em;
    padding: 0.5em 0.35em 0.5em 0.5em;
  }
  body.news .article-list .item + .item {
    border-top: dotted 1px #ccc;
  }
  body.news .article-list .item a {
    flex-wrap: wrap;
  }
  body.news .article-list .item .pic {
    flex: 1 1 100%;
  }
  body.news .article-list .item .txt {
    flex: 1 1 100%;
    padding: 10px 0 0;
    margin-top: 10px;
  }

  /*核心*/
  .core_box {
    min-height: inherit;
  }

  .core_center {
    margin-top: 20px;
    background: url(../images/about/core_bg.jpg) no-repeat center bottom;
    padding: 30px 0px;
  }

  .core_main {
    flex-direction: column;
  }

  .core_word {
    margin-bottom: 10px;
    margin-right: 0;
    width: 100%;
  }

  .core_main::after {
    font-size: 40px;
  }

  /*事業單位*/
  .cause_flex02 {
    flex-direction: column-reverse;
  }

  .width60 {
    width: 100%;
  }
}
@media (max-width: 576px) {
  .banner .slick:before {
    height: 70px;
  }

  .pagination .page-item .page-link {
    width: 32px;
  }

  .breadcrumb {
    padding-left: 0;
    padding-right: 0;
  }

  body:not(.show).news .breadcrumb, body:not(.show).about .breadcrumb, body:not(.show).investor .breadcrumb, body:not(.show).sitemap .breadcrumb {
    float: none;
    justify-content: flex-start;
  }

  .core_main::after {
    font-size: 30px;
  }

  .energy_main {
    margin: 0 20px 0 40px;
    padding-top: 110px;
  }
}
@media (max-width: 400px) {
  .energy_main {
    margin: 0 0 0 40px;
    padding-top: 110px;
  }

  .cause_main03 {
    margin: 30px 0 0;
  }

  .map_main {
    flex-direction: column;
  }
}