/**
 * 注意：此檔案包含自定義樣式，請勿在系統更新時覆蓋
 * Note: This file contains custom styles, do not overwrite during system updates
 * 最後更新 / Last updated: 2025-04-16
 */
@import url('https://fonts.googleapis.com/css2?family=Abel&family=Big+Shoulders:opsz,wght@10..72,100..900&display=swap');

html[lang='en'] {
    font-family: "Abel", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
body {
    letter-spacing: .05rem;
    background: url("../images/bg.webp") no-repeat;
    background-attachment: fixed;
}
/* 全局|header|header-template20 */
.header-template20 {
    &.header--unfixed {
        background: linear-gradient(to bottom, rgb(0 0 0 / 61%) 0%, rgba(255, 255, 255, 0) 100%);
        .header__inner {
            background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 38%,rgba(0,0,0,0.3) 60%,rgba(0,0,0,0.29) 61%,rgba(0,0,0,0) 100%);
        }
    }
    .header__inner {
        .nav__box {
            .nav{
                > .nav__item {
                    > .nav__name {
                        font-size: 20px;
                        font-weight: 800;
                        font-family: "Big Shoulders", sans-serif;
                    }
                    .nav__item-div {
                        .nav__name {
                            font-size: 20px;
                            font-weight: 800;
                            font-family: "Big Shoulders", sans-serif;
                        }
                    }
                    > .nav__layer {
                        top: 85px;
                    }
                }
            }
        }
        .nav__name {
            padding: 30px;
            &.active {
                &:before {
                    background: #DA2E26;
                }
                &:hover {
                    &:after {
                        background-color: #DA2E26;
                    }
                }
            }
            &:hover {
                color: #DA2E26;
                opacity: 1;
                &:after {
                    background-color: #FFFFFF;
                }
            }
        }
    }
}
@media (max-width: 991px) {
    .header-template20 {
        .header__inner {
            .nav__box {
                .nav {
                    > .nav__item {
                        > .nav__layer {
                            top: 0;
                        }
                    }
                }
            }
            .nav__name {
                padding: 10px 15px;
            }
        }
    }
}
/* 全局|header|箭頭樣式 */
.nav__btn::after{
    font-family: "icomoon";
    content: "\f105";
    font-size: 20px;
    color: #da2e26;
    transform: rotate(90deg);
}

.nav__layer .nav__btn::after{
    font-family: "icomoon";
    content: "\f105";
    font-size: 20px;
    color: #da2e26;
    transform: rotate(0deg);
}

@media screen and (max-width:991px) {
    .nav__btn::after{
        font-family: "icomoon";
        content: "\f105";
        font-size: 20px;
        color: #fff !important;
        transform: rotate(0deg);
    }
}
.nav__btn-icon{
    display: none;
}
/* 首頁|列表標題|字體粗度 */
section .title.title--lg{
    font-weight: bold;
}

/* 首頁|banner|文字區塊 */
.ind-banner .ind-banner__text {
    max-width: 600px;
    overflow: hidden;
    .title, p {
        text-align: left;
    }
    p {
        margin: 20px 0 10px;
    }
    &:after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 40%;
        height: 100%;
        clip-path: polygon(50% 0, 95% 0, 70% 100%, 20% 100%);
        /*background-color: rgba(255, 158, 28, 0.65) !important;*/
        z-index: -1;
        transition: all 500ms ease-in-out;
    }
    .btnbox {
        display: flex !important;
    }
    &:hover {
        &:after {
            transform: translateX(50%);
        }
    }
}

/* 首頁|banner|左右鍵 */
.ind-banner .swiper-button-next::after, .ind-banner .swiper-button-prev::after {
    content: "\e912";
    transform: rotate(90deg);
}
.ind-banner .swiper-button-next::after {
    transform: rotate(-90deg);
}

/* 首頁|banner|bullet */
.ind-banner .swiper-pagination .swiper-pagination-bullet{
    width: 30px;
    height: 6px;
    border-radius: 10px;
    transition: all 500ms ease-in-out;
}
.ind-banner .swiper-pagination .swiper-pagination-bullet-active {
    width: 12px;
    height: 12px;
    border-radius: 20px;
}


.inner > .title span::before{
    display: none !important;
}


/*.header-template20 .header__inner .nav__name:before{*/
/*    background-color: #DA2E26;*/
/*}*/


/*.logo__img{*/
/*    padding: 8px 0;*/
/*}*/

.header-template20 .topblock .left-info li{
    text-shadow: none !important;
}

.contact-editor-template1::after{
    display: none !important;
}

.nav__layer .nav__item .nav__name{
    padding: 7px 25px !important;
    font-weight: unset !important;
}

.contact-block__info iframe{
    width: 100% !important;
}

@media only screen and (max-width: 991px) {
    .nav__box, .nav__box--turnover .nav__layer {
        background: #DA2E26 !important;
    }
}

@media only screen and (max-width: 768px) {
  .index-editor-template41 .wrapper .inner__div{
    margin-top: 24px !important;
  }

.index-editor-template41 .wrapper .inner__div:nth-child(1){
    margin-top: 0px;
  }
}

.nav__item{
    position: relative;
}

.nav__item:nth-child(1){
    order: 1;
}

.nav__item:nth-child(2){
    order: 2;
}

.nav__item:nth-child(3){
    order: 3;
}

.nav__item:nth-child(4){
    order: 5;
}

.nav__item:nth-child(5){
    order: 6;
}

.nav__item:nth-child(6){
    order: 4;
}