﻿.main-content{background-color:#fafafa}
/*新訊列表*/
 
.news-list { width: 100%;   margin:40px auto auto auto;padding: 0px; display: flex; flex-wrap: wrap; position: relative;  z-index: 0; }
.news-list li { width: calc(100%/3 - 40px);height: auto;  margin:0px 20px 50px 20px; padding:0px; list-style: none; background-color: #fff; transition: all 0.3s linear 0s;}
.news-list .item {  display: flex; flex-wrap: wrap; flex-direction: column;  padding:0px; border-bottom: 1px solid #555;  border-radius: 15px 15px 0px 0px; transition: all 0.3s linear 0s; }
.news-list .news-pic { width: 100%;padding: 0 ;  border-radius: 15px 15px 0px 0px; overflow: hidden}
.news-list .news-box { width: 100%;padding: 20px;  }
.news-list figure  {width: 100%; padding-bottom: 56.4%; height: 0; overflow: hidden; position: relative;  z-index: 1;  background: #1d1d1f;  transition: all 0.5s ease-in-out;}
.news-list figure img { max-width:100%; height: auto; object-fit: cover; margin: auto; display: block; border-radius:0px;   transition: all 0.5s ease-in-out;}
.news-list .news-box .news-date { width: 100%; margin:0px;  display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center;  -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.news-list .news-box .news-date .date { font-size: 12px; font-weight: 400;}
.news-list .news-box .news-date .date .top { }
.news-list .news-box .news-date .date .bom {font-size: 12px;margin-left: 10px;}
.news-list .news-box .news-date .new-tag  {padding: 2px  10px;border-radius: 15px;color: #b64400;display: block;	font-size: 12px;border: 1px solid #b64400; }
.news-list .news-box .news-inner {width: 100%;}

.news-list .news-box h3 {   margin-bottom: 12px; }
.news-list .news-box h3 a {  font-weight: 500; font-size: 1.125rem; font-size: min(max(3.5vw, 1rem), 1.125rem); color: #1d1d1f; white-space: wrap;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break:normal; overflow-wrap: break-word;  }
.news-list .news-box p {min-height:70px;font-size: 0.875rem; color: #333333; line-height: 1.375rem; letter-spacing: 0.75px;   margin:5px 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow-wrap: break-word; word-break:normal;}
.news-list li:hover .item{ transform: scale3d(1.01, 1.01, 1.01); box-shadow: 2px 4px 16px rgba(0,0,0,.1);}

.news-list li:hover .item  h3 a ,.news-list li:hover .item  p ,.news-list li:hover .item .news-date{color: #b64400;}
.news-list li:hover:hover figure img { transform: scale(1.05);  opacity: 0.6; }


 
@media (max-width: 1180px) {
.news-list li { width: calc(100%/3 - 40px)   }
.more-btn a::before { right:30%; }    
}
@media (max-width: 840px) {
.news-list {margin: 30px auto;}
.news-list li{ width:calc(100%/2 - 40px);   }
}
 @media (max-width: 640px) {
.news-list li{ width:calc(100% - 40px);   }
 }
@media (max-width: 320px) {
.news-list li{ width:100%;  margin:0px auto 50px auto;  }
 }

 
.category{width: 398px; border-left: 1px solid #a5a5a5;}
.category-title { background:#333237; padding: 22px 42px; color: #fff; font-weight: 400; font-size: 26px;}
.category-menu { padding: 10px 10px 10px 20px;}
.category-menu .news-list {margin: 0px auto;}
.category-menu .news-list li {  width: 100%;  list-style: none;position: relative;  margin: 0px 0px 20px 0px; background-color: transparent; }
.category-menu .news-list .news-box { padding:10px; }
.category-menu .news-list .news-box h3  {  font-weight: 500; font-size: 1.125rem; font-size: min(max(3.5vw, 1rem), 1.125rem); color: #1d1d1f;   }
 .category-menu .news-list li::after {  content: ""; width: 100%; height: 1px; display: block; background-color: #d0d0d0;margin-right: 0px; margin-top: 10px;}
.category-menu .news-list li:hover{ background-color:#dae4e9}
/*  詳細頁樣式*/
.main-post-wrap{ width: calc(100% - 398px); padding: 0px 40px 100px 40px; margin:0px;  }

