@import url('/css/01/bootstrap.css');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+TC:700');

/* titBox */
h4.titBox { margin-bottom: 15px; border-bottom: 1px #ccc solid; font-size: 25px; font-family: 'Noto Serif TC', serif; color: #21a1c4; }

/* content-wrapper */
#content-wrapper { margin-top: 10px; float: left; width: calc(100% - 400px); }
#content-wrapper .box { margin-top: 20px; }

/* waylink */
.waylink { overflow: hidden; font-size: 16px; }
.waylink ol { padding: 0; margin: 0; }
.waylink ol li { position:relative; padding-left: 15px; display: inline-block; font-size: 16px; color: #565656; }
.waylink ol li:first-child { padding-left: 0; }
.waylink ol li:before { position: absolute; left:0; top:0; content: ">"; }
.waylink ol li:first-child:before { content: ""; }
.waylink ol li a { font-size: 16px; color: #565656; }

/* laybanner */
#laybanner .bd { width: 65%; height: 310px; margin-right: 0; }
#laybanner .bd ul li { position: relative; transition: none; }
#laybanner .bd ul li b { position: absolute; padding: 5px 10px 5px 10px; display: block; background: #3B9ABD; top: 15px; left: 15px; }
#laybanner .bd ul li b a { color: #fff; }
#laybanner .hd { width: 35%; }
#laybanner .hd ul li { border: 1px #F0F0F0 solid; border-bottom: 0; transition: none; }
#laybanner .hd ul li:last-child  { border-bottom: 1px #F0F0F0 solid; }
#laybanner .hd ul li a { padding: 0 15px; height: 61px; border-left: 10px rgba(59, 154, 189, 0.5) solid; color: #464545; font-size: 17px; line-height: 61px; -webkit-line-clamp: 1; }
#laybanner .hd ul li.on a { background: -webkit-gradient(linear,left top,right bottom,color-stop(0,rgba(0,0,0,.15)),color-stop(1,rgba(0,0,0,0))); }

/* content-main */
.content-main h2.mainTit { font-size: 32px; font-weight: normal; }
.content-main article * { font-size: 16px; }

/* advBox */
#content-wrapper .advBox { text-align: center; }
#content-wrapper .advBox a , #content-wrapper .advBox >div { margin : 15px 7px 0; width: 336px; display: inline-block; }

/* otherBox */
.otherBox { margin: 20px 0; }
.otherBox h4 { margin-bottom: 15px; padding: 5px 0; border-top: 1px rgba(0, 0, 0, 0.1) solid; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; font-size: 16px; color: #009FCC; }
.otherBox ul li { margin-bottom: 20px; }
.otherBox ul li p { height: 52px; font-size: 16px; -webkit-line-clamp: 2; }
.otherBox ul li p a { font-size: 16px; color: #464545; }

/* sideNav */
#sideNav { margin-top: 10px; float: right; width: 330px; }
#sideNav > div { margin-bottom: 10px; }
#sideNav #sidevote .voteImg { position: relative; display: block; }
#sideNav #sidevote .voteImg b {box-sizing: border-box;position: absolute;padding: 0 25px;width:100%;height: 76px;background: rgba(0, 0, 0, .7);line-height: 150%;font-weight: normal;font-size: 20px;color: #fff;-webkit-line-clamp: 2;left: 0;bottom: 0;text-align: center;padding: 13px;}
#sideNav .articles ul li { padding: 10px 5px; border-bottom: 1px #ccc solid; }
#sideNav .articles ul li font { width: calc(100% - 55px); display: inline-block; vertical-align: middle; }
#sideNav .articles ul li font.notxt { margin-right: 15px; width: 30px; height: 30px; background: #3B9ABD; color: #fff; text-align: center; line-height: 30px; font-size: 18px; }
#sideNav .articles ul li font a { max-height: 46px; font-size: 16px; color: #464545; -webkit-line-clamp: 2; }
#sideNav #sideSear font { padding: 2px 5px; display: inline-block; }
#sideNav #sideSear font a { font-size: 16px; color: #464545; }

/* sideNew */
#sideNew h4.titBox , #sideTalk h4.titBox { margin-bottom: 0; }

/* faqList */
#faqList ul li h3 { padding: 5px 10px; background: #71d8d5; display: inline-block; font-size: 16px; color: #fff; }

/* pagenav */
#pagenav { position: relative; z-index: 5; }
#pagenav font { display: block; text-align: center; }
#pagenav a { padding: 8px 13px; display: inline-block; font-size: 16px; color: #3B9ABD; }
#pagenav a:hover { background: #e9ecef; }
#pagenav strong { padding: 8px 13px; background: #3B9ABD; display: inline-block; font-size: 16px; color: #fff; }
#pagenav font.pagGo { margin-top: 15px; text-align: right; color: #3B9ABD; }
#pagenav font.pagGo input { margin: 0 10px; width: 60px; border: 1px #117a96 solid; text-align: center; outline: none; -webkit-appearance: none; }
#pagenav font.pagGo #gopage { margin-left: 10px; padding: 5px 10px; background: #3B9ABD; color: #fff; }

/* ItemAdv, advBox */
.ItemAdv , .advBox { position: relative; z-index: -1; }

@media screen and (max-width: 960px) {
	#content-wrapper { padding: 0 5px; float: none; width: auto; }
	#laybanner { position: relative; padding-bottom: 0; }
	#laybanner .bd { padding-bottom: 10px; float: none; width: 100%; height: auto; }
	#laybanner .bd ul li a img { height: auto; }
	#laybanner .bd ul li b { top: auto; bottom: 40px; }
	#laybanner .bd ul li p { height: 36px; -webkit-line-clamp: 1; }
	#laybanner .bd ul li p a { margin-top: 10px; display: block; font-size: 16px; color: #444; }
	#laybanner .hd , #newTextBox ul li h4 font { display: none; }
	#laybanner .slick-dots { bottom: -31px !important; }
	#laybanner .slick-dots li button:before { font-size: 16px !important; }
	.mBox { display: none; }
	/*#newTextBox{display: none;}*/
	#categoryBox{display: block;}
}
@media screen and (max-width: 680px) {
	#content-wrapper .advBox a:nth-child(2) , #content-wrapper .advBox >div:nth-child(2) { display: none; }
}
@media screen and (max-width: 480px) {
	#pagenav a , #pagenav strong { padding: 2px 8px; font-size: 14px; }
}
@media screen and (max-width: 320px) {
	#pagenav a , #pagenav strong { padding: 2px 6px; font-size: 12px; }
}