#historyContentBox .TTTxt{width:100%;padding:10px 30px;border-left:4px solid #e7e7e7;padding-left:40px;margin:40px 0 0px 0}
#historyContentBox .TTTxt p{font-size:20px;color:#000;margin-bottom:10px;font-weight:600}
.historyMainArea > .wrap{width:1200px;padding-left:20px;padding-right:20px}
#historyContentBox{padding-bottom:40px}
#historyContentBox h3{font-size:25px;margin-bottom:0px;font-weight:600}
#historyContentBox .yearLine{color:#ac1821;font-size:34px;padding-right:40px;display: none;}
.historyList{position:relative;max-width:100%;margin-left:auto;margin-right:auto;}
.historyList::before{content:'';position:absolute;top:0;left: calc(25% - 32px);width:1px;height:100%;background:linear-gradient(to bottom,#e5e5e5 0,#e5e5e5 100%) 0 0 no-repeat;}
#historyContentBox ul li.show{display:flex;margin: 0 0 40px 0;align-items:center;position:relative;overflow:hidden;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;/* border-bottom: 3px #f4f4f4 solid; */}
#historyContentBox .historyItemList li{padding: 8px 0;}
#historyContentBox ul li .tit{color:#898f97;text-align:center;position:relative;display:flex;align-items:center;justify-content:space-between;width: 25%;z-index:10}
#historyContentBox ul li .tit h3 i{color:#d5d5d5;text-align:center;font-size:34px;margin:10px}
.yearLine{position:relative;display:flex;text-align:center;font-size:25px;align-items:baseline;font-weight:600;color:#535353}
.yearLine span{color:#e3e3e3;font-size:17px;font-weight:400;line-height:1;letter-spacing:1px;display:inline-block;text-align:center;display:none}
#historyContentBox ul li .tit::before{content:"";position:absolute;top:calc(50% - 7px);z-index:3;width:14px;height:14px;border-radius:50%;border:1px solid var(--primary);right:24px}
#historyContentBox ul li .tit::after{content:"";position:absolute;top:calc(50% - 2px);width: 6px;aspect-ratio: 1/1;border-radius:50%;background-color:var(--primary);-webkit-box-shadow:0 0 0 10px #f5f5f5;box-shadow: 0 0 0 10px #ffffff;right: 29px;}
.yearLine::before{position:absolute;top:50%;left:136px;width:9px;height:9px;margin-top:-4.5px;display:none}
.monthRound{position:absolute;top:16px;left:-30px;z-index:1;display:flex;justify-content:center;align-items:center;width:0px;height:0px;font-size:15px;font-family:Arial,Helvetica,"Noto Sans TC",sans-serif;font-weight:bold;color:#494949;background-color:#ffffff;border-radius:5%;border:1px solid #dddddd;box-shadow:0 0 0 4px #dddddd,0 0 0 9px #fff}
.monthRound::after{content:'.';display:none}
.historyItemList{padding-top:0px;padding-bottom: 5px;padding-left:20px;padding-right:20px;width: calc(75% - 0px);}
.historyItemList li{position:relative}
.historyItemList li{color:#333;position:relative}
.historyItemList li + li{margin-top:10px}
.historyItemList li .textEditor.clearfix{overflow:hidden;color:#535353;position:relative;font-weight:600;display:flex;flex-direction:column}
.historyItemList li .textEditor.clearfix h2{font-size:22px;font-weight:600;padding:0px 0 0px;color:var(--primary)}
.historyItemList li .textEditor.clearfix p{padding: 0px 0;margin:0;line-height:160%;display:inline-block;font-size:16px;font-weight:400}
.historyItemList li .textEditor.clearfix .leftBox{overflow:hidden;float:left;width:57%}
.historyItemList li .textEditor.clearfix .leftBox h2{font-size:22px;padding-bottom:10px;color:#000}
.historyItemList li .textEditor.clearfix .leftBox article{color:#4b4b4b;font-weight:500;font-size:15px}
.historyItemList li .textEditor.clearfix .rightBox{overflow:hidden;float:right;width:40%}
.historyItemList .textEditor{font-size:18px}
.historyQuickLinkBox{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin-bottom:75px}
.historyLinkItem{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding:5px 20px;border-radius:30px;border:1px solid #1884c4}
.historyLinkItem::before{content:'';margin-right:20px;font-size:16px;color:#373737}
.historyLinkItem a{position:relative;z-index:1;padding:10px 20px;border-radius:30px;font-family:Arial,Helvetica,"Noto Sans TC",sans-serif;color:#777;overflow:hidden}
.historyLinkItem a + a{margin-left:10px}
.historyLinkItem a::before{content:'';position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background:linear-gradient(to right,#2d77bc 0,#29bc9f 100%) 0 0 no-repeat;opacity:0}
@media (max-width:1280px){
    .historyList::before{left: calc(15% - 31px);}
	.historyMainArea > .wrap{width:100%}
	#historyContentBox{padding-left:0px}
	#historyContentBox ul li .tit{width:175px}
}
@media (max-width:1024px){
    .historyList::before{left: calc(18% - 24px);}
}
@media (max-width:768px){
	.historyList::before,#historyContentBox ul li.show::after{left: 55px;}
	#historyContentBox ul li .tit::before{right:17px}
	#historyContentBox ul li .tit::after{right:22px}
	#historyContentBox ul li .tit{width:80px}
	#historyContentBox .historyItemList li{padding:20px 0}
	#historyContentBox ul .show::before{left:0%}
}
@media (max-width:640px){
	#historyContentBox ul li .tit{width:60px}
	#historyContentBox ul li .tit::before{right:21px}
	#historyContentBox ul li .tit::after{right:26px}
	.historyItemList li .textEditor.clearfix h2{font-size:18px}
	.historyItemList{width:calc(100% - 0px);padding-right:10px}
	.historyList::before,#historyContentBox ul li.show::after{left: 21px;}
}