


/*========================================================*/
/*-------最新消息樣式--------*/
/*========================================================*/


.news_area{
    box-sizing: border-box;
    position: relative;
    display: grid;
    flex-wrap: wrap;
    grid-template-columns: repeat(3 , 1fr);
    gap: 25px;
    column-gap:  clamp(0.9375rem, 1.3021vw, 1.5625rem); /* 最小值 15px、大小約 1.3021vw、最大值 25px */
    row-gap:  clamp(1.875rem, 2.6042vw, 3.125rem); /*  最小值 30px、大小約 2.6042vw、最大值 50px */
}



/* 最新消息列表 */
.news_list{
    /* padding: 0 15px 0; */
    /* width: 33.3%; */
    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    flex-grow: 1;
}


    /* 首頁_最新消息圖片 */
    .news_Img{
    }
        .news_Img img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            float: none;
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
            transition: 0.3s ease all;
        }
        .news_Img a{
            position: relative;
            padding-top: 75%;
            /* border-radius: 10px; */
            display: block;
            overflow: hidden;
        }
        .news_Img a:hover img{
            transform: scale(1.1);
            transition: 0.3s ease all;
        }




        /* 首頁_最新消息文區 */
        .news_bottom{
            /* color: #1c2a5b; */
            padding: 30px;
            padding:clamp(0.9678rem, 1.5625vw, 1.8750rem); /*  最小值 15.48px、大小約 1.5625vw、最大值 30.00px */
            background-color: #fff;
            display: flex;
            flex-direction: column;
            gap: .625rem; /*10px*/

            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }
            .news_bottom_content{
                display: inherit;
                flex-direction: inherit;
                flex-grow: inherit;

                gap: inherit;
            }
            
                .news_bottom .news_title{
                    /* font-family: genseki_b; */
                    font-size: clamp(1.0000rem, 0.9375vw, 1.1250rem); /* 字體 最小值 16.00px、大小約 0.9375vw、最大值 18.00px */
                    line-height: 1.5;	
                    color: var(--dark_color);	
                    margin: 0;
                    padding: 0;

                    overflow : hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                }
                    .news_bottom .news_title a{
                        color: inherit;	
                        display: block;
                        text-decoration: none;

                        min-height: clamp(calc(1rem * 3), calc(0.9375vw * 3), calc(1.1250rem * 3));
                        transition: 0.3s ease all;
                    }
                    .news_bottom .news_title a:hover{
                        color: var(--primary_color);	
                        transition: 0.3s ease all;
                    }

                .news_bottom .description {
                    text-align: left;
                    color: var(--dark_color2);
                    line-height: 1.2;
                    font-size: clamp(0.8750rem, 0.8333vw, 1.0000rem); /* 字體 最小值 14.00px、大小約 0.8333vw、最大值 16.00px */
                    flex-grow: 1;
                }	
                    .news_bottom .description p{
                        overflow : hidden;
                        text-overflow: ellipsis;
                        display: -webkit-box;
                        -webkit-line-clamp: 3;
                        -webkit-box-orient: vertical;
                    }




            .news_bottom .date{
                color: var(--primary_color);
                font-size: 1.125rem; /*18px*/
                line-height: 1.5;
                font-weight: 500;
                font-family: var(--foreign_font);
            }
            .news_bottom .btn{
                display: block;
                margin-top: 40px;
            }






            
@media (max-width: 990px){	


    
}

@media (max-width: 768px){	

    .news_area{
        grid-template-columns: repeat(2 , 1fr);
    } 

}

@media (max-width: 510px){	

    .news_area{
        display: flex;
        flex-direction: column;
    } 

}





