@charset "utf-8";
/*背景*/
.maintitle{ font-size: 35px; color: #3B4249; position: relative; }
.maintitle .icons { position: absolute; left: 0px; top: 5px; width: 41px; height: 39px; background-image: url(../images/index/titleicon.png); background-repeat: no-repeat; }
.maintitle .icons .lines{ width:8px; height:2px; position:absolute; left:12px; top:20px; transform:rotate(-50deg); transform-origin:100% center; /*animation:ms01 1s infinite ease-out alternate;*/
background: #5b6061; 
background: -moz-linear-gradient(left, #5b6061 49%, #ffd02c 50%);
background: -webkit-linear-gradient(left, #5b6061 49%,#ffd02c 50%);
background: linear-gradient(to right, #5b6061 49%,#ffd02c 50%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b6061', endColorstr='#ffd02c',GradientType=1 ); }
@keyframes ms01{
	0%{ transform:rotate(-50deg); }
	100%{ transform:rotate(220deg); }
}

/*關於本臺*/
.areablock{ padding: 20px 0 0 0; }
.areablock .t_list{ padding:0 0 35px 0; margin:0 0 35px 0; border-bottom: 1px solid #59616e; }
.areablock .t_list:after{ content:""; display:block; clear:both; }
.areablock .titles{ font-size:25px; color:#fff; padding:0 0 10px 0; }
.areablock .text{ font-size:17px; color:#3B4249; line-height:28px; letter-spacing: 4px; }
.areablock .text ul{ margin:15px 0 0 25px; }
.areablock .text ul li{ margin:0 0 5px 0; }
.areablock .text img { border-radius: 20px; padding: 10px; }
.areablock .imgbox{ border:4px solid #fff; width:280px; }
.areablock .imgbox img{ width:100%; }
.areablock .img01{ float:left; margin:0 15px 15px 0; }
.areablock .img02{ float:right; margin:0 0 15px 15px; }

/*大事紀*/
.hisYear{ text-align:center; }
.hisYear .btns-left{ display:inline-block; vertical-align:middle; width:20px; height:40px; position:relative; cursor:pointer; margin:0 5px 0 0; }
.hisYear .btns-left:before{ content:""; display:block; width:20px; height:2px; background-color:#3B4249; transform:rotate(-45deg); position:absolute; top:12px; }
.hisYear .btns-left:after{ content:""; display:block; width:20px; height:2px; background-color:#3B4249; transform:rotate(45deg); position:absolute; bottom:12px; }
.hisYear .btns-right{ display:inline-block; vertical-align:middle; width:20px; height:40px; position:relative; cursor:pointer; margin:0 0 0 5px; }
.hisYear .btns-right:before{ content:""; display:block; width:20px; height:2px; background-color:#3B4249; transform:rotate(45deg); position:absolute; top:12px; }
.hisYear .btns-right:after{ content:""; display:block; width:20px; height:2px; background-color:#3B4249; transform:rotate(-45deg); position:absolute; bottom:12px; }
.hisYear .gridsbox{ font-size:0px; display:inline-block; vertical-align:middle; width:600px; overflow:hidden; }
.hisYear .grids{ text-align:center; display:inline-block; vertical-align:middle; width:80px; height:80px; line-height:80px; background:#1d2025; border:2px solid #fff; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; font-size:17px; color:#fff; margin:0 10px; text-decoration:none; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; }
.hisYear .grids:hover{ background-color:#fff; color:#1d2025; font-weight:bold; }
.hisYear .grids.hold{ background-color:#fff; color:#1d2025; font-weight:bold; }
.hislistbox{ padding:30px 0; }
.hislist{ border-left: 5px solid #fff; padding:15px 20px; margin:0 0 10px 0; background-color:#52453ab4; font-size:17px; color:#fff; line-height:24px; }
.hislist:after{ content:""; clear:both; display:block; }
.hislist .years{ float:left; width:130px; }
.hislist .texts{ margin:0 0 0 150px; }

.hislist a{color:#f7f4ed;}
.hislist a:hover{ color:#f7f4ed; }

/*網站導覽*/
.webbox{ font-size:0px; margin-left:-16px; margin-top:20px; }
.webbox .grids{ display:inline-block; width:20%; padding:0 0 0 16px; margin:0 0 40px 0; vertical-align:top; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.webbox .grids .linktitles{ display:block; background:#242f43; font-size:25px; color:#fff; padding:15px 20px; text-decoration:none; }
.webbox .grids .linktxt{ display:block; background:#404857; font-size:20px; color:#fff; padding:10px 20px; margin:2px 0 0 0; text-decoration:none; }
.webbox .grids-100{ display:inline-block; width:100%; padding:0 0 0 16px; margin:0 0 40px 0; vertical-align:top; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.webbox .grids-100 .linktitles{ display:block; background:#242f43; font-size:25px; color:#fff; padding:15px 20px; text-decoration:none; }
.webbox .grids-100 .linktxt{ display: block; background:#404857; font-size:20px; color:#fff; padding:10px 20px; margin:2px 0 0 0; text-decoration:none; }

/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (min-width:768px) and (max-width:1250px) {
/*網站導覽*/
.webbox .grids{ width:25%; }
}

/*================================●●●●●●●●●●●●手機●●●●●●●●●●●●================================*/
@media screen and (max-width:767px){
.maintitle{ font-size:25px; }
.maintitle .icons { top: 50%; margin-top: -20px; }

/*關於本臺*/
.areablock .titles{ font-size:20px; }
.areablock .imgbox{ border:2px solid #fff; width:100px; }
.areablock .text img {width:auto !important; height: auto !important; max-width: 100%; max-height: 100%; margin: 0 0 0 0; float: none !important;}

/*大事紀*/
.hisYear .gridsbox{ width:200px; height:80px; }
.hislist .years{ float:none; width:auto; margin:0 0 10px 0; }
.hislist .texts{ margin:0; }

/*網站導覽*/
.webbox .grids{ display:block; width:100%; margin: 0 0 20px 0; }
.webbox .grids .linktitles{ font-size:20px; padding:10px 15px; }
.webbox .grids .linktxt{ font-size:16px; padding:5px 15px; }

}