
.box-body {
    border-top: 1px solid #e9e9e9;
}
	.box-body .list {
	    border-top: 1px solid #ffffff;
	    border-bottom: 1px solid #e9e9e9;
        min-height: 70px;
	    position: relative;
        border-left: 4px solid #fff;
        transition: .5s;
	}
	.box-body .list:hover {
		border-left-color: rgba(12, 12, 12, 0.41);
	}
	.box-body .list.new {
		border-left-color: rgba(12, 12, 12, 0.41);
	    border-top: 1px solid rgba(111, 111, 111, 0.41);
	    border-bottom: 1px solid rgba(111, 111, 111, 0.41);
	}
		.box-body .list a {
	    	background: #ffffff;
		    padding: 20px;
		    display: block;
		    color: #0e3c5d;
	        padding-right: 50px;
	        transition: .5s;
		}
	@media only screen and (min-width: 1026px) {
		.box-body .list:hover a {
	        background: rgba(255, 255, 255, 0.65);
		}
	}
		.box-body .list.new a {
		    background: rgba(12, 12, 12, 0.41);
		    color: #facb00;
		}
			.box-body .list a .new {
		        background: #eeaa2d !important;
			    color: #ffffff;
			    padding: 8px;
			    position: absolute;
			    right: 0px;
			    top: 0px;
			}
			.box-body .list a .new::after {
			    content: "";
			    background: rgba(255, 255, 255, 0.3);
			    margin: 5px;
			    background-clip: padding-box;
			    position: absolute;
			    width: calc(100% - 10px);
			    height: calc(100% - 10px);
			    left: 0px;
			    top: 0px;
			    transform: rotate(0deg);
			    animation: box-new 1.5s infinite;
			}
			@-webkit-keyframes box-new {
			    50% {transform: rotate(90deg);}
			    100% {transform: rotate(180deg);}
			}
			@keyframes box-new {
			    50% {transform: rotate(90deg);}
			    100% {transform: rotate(180deg);}
			}
				.box-body .list .box-day {
				    font-size: 0.9em;
				    color: #000000;
				    margin-top: 10px;
				}
				.box-body .list.new .box-day {
					color: rgba(255, 255, 255, 0.71);
				}
				.box-body .list .box-day::before {
				    content: "วันที่ประกาศ : ";
				}
					.box-body .list .box-day .Audience {
					    float: right;
					}
					.box-body .list .box-day .Audience::before {
					    content: "ผู้เข้าชม : ";
					}
					.box-body .list .box-day .Audience-en::before {
					    content: "Viewer : ";
					}
		

/* ---------------------------------------------------**** Tablet ****--------------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 1024px) {


}


/* ---------------------------------------------------**** Mobile ****--------------------------------------------------- */
@media only screen and (min-width: 320px) and (max-width: 767px) {

	.list::before {
	    position: initial;
	    float: left;
        margin-right: 11px;
        width: 45px;
	    height: 45px;
    }
    .box-body .list .box-day {
	    width: calc(100% + 20px);
	}
    .box-body .list .box-day .Audience {
	    float: none;
	}
	.box-body .list {
	    border-left: 0;
    }
}
