@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,500&family=Lato:wght@400;700&family=Noto+Sans+TC:wght@100;300;400;500&display=swap");
.newsList {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 margin: 0 -20px;
}
.newsList .newsItem {
 width: 33.3333333333%;
 padding: 0 20px 20px;
}
@media (max-width: 768px) {
 .newsList .newsItem {
  width: 50%;
 }
}
@media (max-width: 640px) {
 .newsList .newsItem {
  width: 100%;
 }
}
.newsList .Img a {
 display: block;
 overflow: hidden;
}
.newsList .Img img {
 display: block;
 width: 100%;
 -webkit-backface-visibility: hidden;
         backface-visibility: hidden;
}
.newsList .Txt {
 overflow: hidden;
 padding: 20px 0;
}
.newsList .Txt h3 {
 color: #000;
 font-size: 22px;
 font-weight: 400;
}
.newsList .Txt h3 a {
 display: block;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}
.newsList .Txt p {
 max-height: 50px;
 color: #666;
 font-size: 16px;
 line-height: 1.6;
 margin-top: 10px;
}
@media (max-width: 1024px) {
 .newsList .Txt h3 {
  font-size: 20px;
 }
 .newsList .Txt p {
  font-size: 15px;
 }
}

.top {
 -webkit-box-align: center;
     -ms-flex-align: center;
         align-items: center;
 color: #666;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 font-size: 16px;
 line-height: 1;
 letter-spacing: 1px;
 margin-bottom: 10px;
}
.top .class {
 margin-right: 10px;
}
.top .date {
 text-transform: uppercase;
}
.top .period {
 width: 100%;
 padding-top: 10px;
}
@media (max-width: 1024px) {
 .top {
  font-size: 14px;
 }
}

.shareBox {
 float: right;
}
.shareBox .btn-fb {
 display: inline-block;
 vertical-align: middle;
 margin-right: 5px;
}
.shareBox .back {
 display: inline-block;
 vertical-align: middle;
 padding: 3px 5px;
 border-radius: 3px;
 font-size: 12px;
 color: #fff;
 background: rgb(174, 66, 51);
 /* Old browsers */
 /* FF3.6+ */
 /* Chrome,Safari4+ */
 /* Chrome10+,Safari5.1+ */
 /* Opera 11.10+ */
 /* IE10+ */
 background: -webkit-gradient(linear, left top, left bottom, from(rgb(174, 66, 51)), to(rgb(196, 76, 76)));
 background: linear-gradient(to bottom, rgb(174, 66, 51) 0%, rgb(196, 76, 76) 100%);
 /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ae4233", endColorstr="#c44c4c", GradientType=0);
 /* IE6-9 */
 cursor: pointer;
}
.shareBox .back:hover {
 background: #398cb1;
}

.titleArea .top .period {
 width: auto;
 padding-top: 0;
 margin-left: 15px;
}
@media (max-width: 1024px) {
 .titleArea .top .period {
  width: 100%;
  padding-top: 10px;
  margin-left: 0;
 }
}
.titleArea h1 {
 font-size: 22px;
}
@media (max-width: 1024px) {
 .titleArea h1 {
  font-size: 20px;
 }
}