#BodyContentMainDetail #List { /* 列表 */
	display:flex;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:center;	
	margin-top:1em;
}
#BlogMain {
	width:70%;
}
#BlogMain2 {
	width:100%;	
}
#BlogMain .title {
	font-size:larger;
}
#BlogMain #Promo { /* 自訂文章 */
	align-items:stretch;
	display:flex;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	flex-wrap:nowrap;
	-ms-flex-wrap:nowrap;
	-webkit-flex-wrap:nowrap;
	justify-content:space-between;	
	width:95%;
	margin-bottom:2em;	
}
#BlogMain #Promo > div:first-of-type{
	padding-right:0.5em;
}
#BlogMain #Promo > div:last-of-type {
	text-align:left;
}
#BlogMain #Promo > div:last-of-type div {
	margin-bottom:0.5em;
}
#BlogMain li,#BlogMain2 li {
	border-bottom:1px solid #F0F0F0;
	display:flex;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	justify-content:space-between;	
	line-height:2.5;
	width:95%;
}
#BlogMain .Date {
	color:#999;
}
#BlogMain .content {
	padding:0.5em;
	text-align:left;
}
#BlogMain .content table {
	font-size:small;
}
#BlogMain .content th {
	background-color:#F0F0F0;
	color:#333;
}
#BlogMain .content th,#BlogMain .content td {
	border:1px solid #F0F0F0;
	padding:0.5em;	
}
#BlogSide {
	background-color:#F0F0F0;
	max-height:400;
	padding:1em 2em;
	text-align: left;
	width:30%;
}
#BlogSide li{
	line-height: 2;
}

/* 跳頁選單 */
.pages {
	font-size:12px;
	padding:1.5em 0;
	text-align:center;	
}
.pages span{
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	border-right:1px solid #CCC;
	margin-left:-0.5em;
	padding:0.3em 1em;
}
.pages span:first-child {
	border-top-left-radius:0.5em;
	border-bottom-left-radius:0.5em;
	border-left:1px solid #CCC;	
}
.pages span:last-child {
	border-top-right-radius:0.5em;
	border-bottom-right-radius:0.5em;
}
.pages a {
	color:#333;
	padding:0 1em;
}
.pages span a {
	padding:0;
}
.pages .sel { /* 當頁 */
	color:#b1040E;	
}

@media screen and (max-width:767px) {
    #BlogMain, #BlogSide {
      width:100%;
    }
    #BlogMain > div, #BlogMain > ul { display:block!important; width:100%; padding-left:1em; }

    #BlogMain #Promo > div {
      width:100%;
      padding-right:0;
	}
    #BlogMain #Promo img { 
    	display:block; 
      	max-width:100%;
        height:auto;
        width:100%;
    }
    img { 
	width: auto;  
    height: auto;  
    max-width: 100%;  
    max-height: 100%;
    }	
}