/* NewsBox */
#NewsBox ul {padding-top: 0vw;}
#NewsBox ul li {margin: 210px 1px 30px 0;}
#NewsBox ul li , #NewsBox ul li .lineBox { position: relative; }
#NewsBox ul li .Nmore {position: absolute;width: 100%;height: 100%;display: block;top: 0;left: 0;z-index: 3;}
#NewsBox ul li .lineBox { margin: 0 5px; }
#NewsBox ul li .lineBox font {position: relative;margin-top: -26px;display: block;text-align: center;font-size: 32px;color: #ba9546;}
#NewsBox ul li .lineBox a {margin-bottom: -13px;display: block;text-align: center;font-size: 18px;color: #6e5829;font-weight: 100;}
#NewsBox ul li .lineBox a:before {position: absolute;top: -10px;left: calc((100% - 50px) / 2);width: 50px;height: 1px;background: #6e5829;content: "";}
#NewsBox ul li .lineBox:before , #NewsBox ul li .lineBox:after {position: absolute;width: calc((100% - 200px) / 2);height: 1px;display: block;background: #6e5829;left: 1px;top: calc((100% - 1px) / 2);content: "";}
#NewsBox ul li .lineBox:after { left: auto; right: 1px; }
#NewsBox ul li .news-block {position: relative;padding: 10px 20px 10px;display: flex;flex-direction: row;align-items: center;}
#NewsBox ul li .news-block a.photo {z-index: 10;background-position: 50% 30%;width: 40%;}
#NewsBox ul li .news-block p {color: #ba9546;font-family: 'Noto Sans TC', 'Noto Sans TC', serif;}
#NewsBox ul li .news-block .info{margin-left: 4%;width: 55%;}
#NewsBox ul li .news-block h3 {margin-bottom: 40px;padding-bottom: 20px;height: 28px;line-height: 190%;font-size: 22px;color: #ffffff;-webkit-line-clamp: 1;transition-duration: .6s;border-bottom: 1px solid #7f652d;}
#NewsBox ul li .news-block article {height: 65px;line-height: 22px;color: #ffffff;-webkit-line-clamp: 3;transition-duration: .8s;font-size: 16px;}
.contentMain #NewsBox ul { font-size: 0; }
.contentMain #NewsBox ul li {margin: 20px 0;width: calc(100% / 1);display: inline-block;}

.moreBtn {display: flex;margin: 30px 0 0;}
.moreBtn .text {font-weight: 400;color: #ac9055;font-size: 13px;line-height: 24px;}
.moreBtn .text.semiBlod {font-weight: 600;padding-left: 3px;}
.moreBtn .arrowWrap {width: 58px;height: 24px;position: relative;}
.moreBtn .arrowWrap::before {content: "";width: 24px;height: 24px;display: block;border-radius: 50%;border: 1px solid #ac9055;box-sizing: border-box;position: absolute;top: 0;right: 0;}
.moreBtn .arrowWrap .arrow {display: block;width: 34px;height: 1px;background-color: #ac9055;position: absolute;top: 11.5px;top: calc(50% - 1px);left: 15px;}
.moreBtn .arrowWrap .arrow::before {content: "";width: 6px;height: 1px;background-color: #ac9055;position: absolute;top: calc(50% - 2.5px);right: 0;transform: rotate(45deg);}
.moreBtn .arrowWrap .arrow::after {content: "";width: 6px;height: 1px;background-color: #ac9055;position: absolute;bottom: calc(50% - 3px);right: 0;transform: rotate(-45deg);}


@media screen and (min-width: 981px) {	
	#NewsBox ul li .news-block:hover .info >* {transform: translateY(18px);}
	#NewsBox ul li .lineBox a:hover{ letter-spacing: .3em;}
	#NewsBox ul li .lineBox a:hover:before { top: -2px; transition-duration: .3s;}
}
@media screen and (max-width: 1280px) {
	#NewsBox ul li:nth-child(2n - 1):after { background: transparent; }
	#NewsBox ul{padding: 2vw;}
}
@media screen and (max-width: 980px) {
	#NewsBox ul li {margin: 100px 1px 30px 0;}
	#NewsBox .btn { left: auto; right: 0; }
	#NewsBox ul li .date {font-size: 28px;}
	#NewsBox ul li .info {display: inline-block;padding: 10px 0px 20px;text-align: center;}
	#NewsBox ul li .news-block {padding: 0px 0px 0px;}
	#NewsBox ul li .slick-slide:after  { background: #6e5829; }
	#NewsBox ul li:nth-child(2n - 1):after,#NewsBox ul li:nth-child(3n - 1):after , #NewsBox ul li:nth-child(3n - 2):after {background: #6e5829;}
	#NewsBox ul li .news-block h3{margin-bottom: 20px;}
}
@media screen and (max-width: 680px) {
	.contentMain #NewsBox ul li{width: 100%;margin: 10px 0;}
	#NewsBox ul li:nth-child(2n - 1):after { background: #b08b3f; }
	#NewsBox ul li .news-block{display: flex;flex-direction: column;}
	#NewsBox ul li .news-block a.photo{
    width: 100%;
}
	#NewsBox ul li .news-block .info{margin: 20px 20px 0;width: auto;}
	.moreBtn {margin: 20px 0 0;}
	#NewsBox ul li .news-block article{    font-size: 12px;}
}
@media screen and (max-width: 440px) {
	#NewsBox ul li {margin: 70px 1px 20px 0;}
}