﻿
/*===== 通用樣式 =====*/
* {
    /*font-family: "Noto Sans TC", "微軟正黑體";*/
    font-family: Noto Sans TC !important;
}

body {
    background-color: #5a4535;
}

.container-fluid {
    /*background-color: red;*/
    max-width: 1400px;
    font-size: 1.25rem;
}

/*===== 特定項目 =====*/

.content_plan {
    height: 100vh;
    background-image: url('../../_img/bg1.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.content_step {
    height: 100vh;
    background-image: url('../../_img/bg2.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.content_news {
    height: 100vh;
    background-image: url('../../_img/bg3.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.content_result {
    /*height: 100vh;*/
    background-image: url('../../_img/bg4.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    padding-bottom:15px;
}

.content_marquee {
    position: relative;
    top: 80px;
}

.content_fatfooter {
    background-color: #009a76;
    color: white;
    text-align: center;
    padding: 120px 0px 20px 0px; /*為了銜接照片條*/
}

.content_copyright {
    background-color: #5a4535;
    color: white;
    padding: 20px;
    text-align: center;
}

/*===== 特定項目細項 =====*/

.content_plan .container-fluid {
    font-size: 1.75rem;
    background-color: rgba(255, 255, 255, 0.7);
    /*backdrop-filter: blur(10px);*/
    padding: 20px;
    border-radius: 25px;
}

/*===== 特定項目細項 =====*/

#fiveStep {
    text-align:center;
}
#fiveStep img {
    width: 100%;
}
#fiveStepMobile .carousel .carousel-item img {
    width: 70%;
}
#fiveStepMobile .carousel-indicators {
    position: relative;
    justify-content: center;
    margin-top: 10px;
}

/*===== 特定項目細項 =====*/

.newsTitle {
    /*position:relative;
    top:60px;
    left:80px;*/
}

.faqTitle {
    /*position: relative;
    top: 60px;*/
}

#newsBox {
    background-image: url('../../_img/bg_news.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
    height:480px;
    /*border:1px solid red;*/
}

    #newsBox .info {
        color: #FA913D;
    }

    #newsBox .infoTag {
        display: inline-flex;
        background-color: #FFF5C3;
        color: #FA913D;
        padding:5px 15px;
        border-radius:50px;
        margin-right:10px;
        font-size:1rem;
    }

    #newsBox ul li a {
        font-size: 1.5rem;
        color: #643C1E !important;
        font-weight: 700;
        /*margin-left:120px;*/
        margin-top: 5px;
        display: block;
        white-space: nowrap; /* 不換行 */
        overflow: hidden; /* 隱藏超出部分 */
        text-overflow: ellipsis; /* 顯示省略號 */
    }

    #newsBox ul {
        margin:0 auto;
        /*border: 1px solid blue;*/
        list-style: none;
        padding: 70px 50px 0px 50px;
    }

        #newsBox ul li {
            margin-bottom: 20px;
            border-bottom: 1px solid #9DA9B5;
            padding:0px 0px 10px 0px;
        }

            #newsBox ul li:last-child {
                border-bottom:none;
            }

/*===== 特定項目細項 =====*/

#faqBox {
    text-align: center;
    font-size: 1.5rem;
    color: #643C1E;
    font-weight: 500;
}

    #faqBox img {
        width: 90%;
    }

/*===== 特定項目細項 =====*/

.content_result .image-container {
    position: relative;
    display: inline-block;
}

.content_result .circle-bg {
    display: block;
    max-width: 450px; /* 調整為你需要的大小 */
    max-height: 450px;
    width: 100%;
    height: 100%;
}

.content_result .overlay-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -80%);
    max-width: 225px; /* 調整為合適的大小 */
    max-height: 225px;
    width:50%;
    height:50%;
}

.content_result .text-below {
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 25px;
    white-space: nowrap;
    font-size: 1.5rem;
    color: #643C1E;    
}
    .content_result .text-below span {
        font-size: 2.5rem;
        color: #FA913D;
        font-weight: 900;
    }


/*===== 特定項目細項 =====*/

    .content_marquee img {
        width: 100%;
        height: 160px; /* 設定統一高度 */
        object-fit: cover; /* 保持比例並填滿，可能會裁切 */
        object-position: center; /* 裁切時以中心為準 */
        border-radius:25px;
    }

/*===== 特定項目細項 =====*/

.content_fatfooter .container-fluid .row .col {
    font-size: 1.25rem;
    color: #fae73d
}

.content_fatfooter hr {
    margin: 5px 0px;
}

.content_fatfooter a, .content_copyright a {
    color: white;
    text-decoration: none;
    font-size: 1rem;
}
.content_copyright * {
    font-size:1rem;
}
.content_copyright img {
    height: 50px;
}

/*===== 手機版設定 =====*/
@media screen and (max-width: 540px) {
    .content_plan {
        height: 550px;
    }

    .content_step {
        height: 830px;
    }
    .content_news, .content_result {
        height: auto;
        min-height: 100vh;
    }

    .content_copyright {
        margin-top:20px;
    }

    .content_result .text-below {
        margin-top:10px;
    }

    .content_plan .container-fluid {
        font-size:1.25rem;
    }
        #newsBox {
        height: auto;
        background-image: none;
        background-color: rgba(255, 255, 255, 0.8);
        backdrop-filter: blur(10px);
        border: 1px solid #643C1E;
        border-radius: 5px;
        padding-bottom:20px;
    }

        #newsBox .infoTag {
            display:none;
        }

        #newsBox ul {
            padding: 20px 20px 0px 20px;
        }

            #newsBox ul li a {
                font-size: 1.25rem;
            }
}