/* css page content list */
.hd-pages{border-bottom:1px solid #E1E1E1;}
.pages-main{width:100%; margin: 0 auto; text-align:center;}
.pages-header{}
	.pages-site{text-align: left;}
	.pages-title{width:100%; margin-top:15px; font-weight:600;}
	.pages-control{margin-top:20px;margin-bottom:10px;}
	.pages-menu{white-space:nowrap; display:inline-block; margin-bottom:5px;}
	.control-btn {border: none; outline: none; padding: 2px 6px; background-color: #f1f1f1; cursor: pointer;}
	.control-btn:hover { background-color: #ddd;}
	.control-btn.active { background-color: #008BCE; color: white;}
	
.pages-content{margin-top:15px; margin-bottom:15px;}
	/* page view navigation */
	.pv-menu{white-space:nowrap;}
	.pv-detail-topic{display:inline-block; margin:15px;}
	.pv-detail p img, .pv-detail img{width:auto; max-width:100%; height:auto;}
	
	/* page object */
	.pages-content-body{width:100%; max-width:1000px; margin:0 auto; min-height:450px; padding:10px 0px;}
	.pages-line{border-top:1px dashed #CCCCCC; border-bottom:1px dashed #CCCCCC;}
	.pages-topic{padding:3px 0px; margin:5px 0px; font-weight:600; display: inline-block;} .pages-topic h4{display:inline-block;}
	
	.content-row {min-height:250px; margin:0 auto; padding:10px 0px; display:inline-block; width:100%; text-align:left; /*display: flex; flex-direction: row ; flex-wrap: wrap; justify-content:flex-start;*/ }
	.content-column {display:inline-block; vertical-align:top !important;}	

	.pages-item{border-radius:5px; padding:8px; margin:4px; display:inline-block; vertical-align:top !important; position: relative;} .pages-grid-item:active{border:1px solid #E9E9E9;}
	.pages-item:hover {background-color:#eaf5f9;}
	.pages-img{border-radius:5px;}
	.pages-text{text-align: left !important;}
	
	.pages-mpic img{width:100%; max-width:600px; height:auto;border-radius:5px;}	
	.pages-detail{text-align: left; max-width:1000px; margin:0 auto; padding:15px 0;}
	.pages-detail p{display: block; margin-bottom:15px;}
	.pages-detail p img, .pages-detail img{width:auto; max-width:100%; height:auto; border-radius:5px;}
	.pages-date{white-space: nowrap;}
	
	.content-date{padding:15px 0; text-align:left}
	
	.pages-text-bold{font-weight: 600;}
	.pages-item-notfound{width:100%; min-height:200px; color:#CCC; text-align:center; vertical-align:middle;}
	/*------------------ pages object --------------------*/
	/* news manager */
	.newsm-item-grid{width:230px; height:320px; display: inline-block; border:1px solid #FFF; box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;}
	.newsm-item-grid .pages-img-cover{width:100%; height:140px; display:block; border-radius:5px;}
	.newsm-item-grid img{width:100%; height:auto; border-radius:5px;}	
	.newsm-item-grid div{text-align:center; display: block;}
	.newsm-item-list {width:100%; height:auto; display: inline-block; margin:0; padding:5px;}
	.newsm-item-list img{display: none;}
	.newsm-item-list .pages-text div{display:inline-block;}
	.newsm-date{position: absolute; right:10px; bottom:5px; display:inline-block; color:#B70000}

	/* news */
	.news-item-grid{width:300px; height:115px; display: inline-block; border:1px solid #FFF; box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;}
	.news-item-list{width:100%; height:auto; display: inline-block; margin:0; padding:5px;}
	/* hotbox */
	.hotbox-item-grid{width:300px; height:115px; display: inline-block; border:1px solid #FFF; box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;}
	.hotbox-item-list{width:100%; height:auto; display: inline-block; margin:0; padding:5px;}
	/* banner */
	.banner-item-grid{width:auto; height:auto; display: inline-block;}
	.banner-item-grid .pages-text{display: none;}
	.banner-item-grid .pages-img {display:inline-block;}
	.banner-item-grid .pages-img a{border:0;}
	.banner-item-list{width:100%; height:auto; display: inline-block; margin:0; padding:5px;  text-align:left ;}
	.banner-item-list .pages-text{display:inline-block; border-radius:5px;}
	.banner-item-list .pages-img{display:none;}
	/* videos */
	.videos-item-grid{width:auto; height:auto; display: inline-block; padding:2px;margin:2px}
	.videos-item-grid .yt-player-text {display:inline-block; text-align:center; padding:5px;}
	.videos-item-grid .pages-text{display: none;}	
	.videos-item-grid .yt-player{width:295px; height:166px;}
	.videos-item-grid .yt-player iframe {width:295px; height:166px; border-top-left-radius:5px; border-top-right-radius:5px;}
	.videos-item-grid .yt-player img {width:295px; height:166px;object-fit: cover;display: block;cursor: pointer; transition: 0.4s all; border-top-left-radius:5px; border-top-right-radius:5px;}
	
	.videos-item-list{width:100%; height:auto; display: inline-block; margin:0; padding:5px;  text-align:left ;}
	.videos-item-list .pages-text{display:inline-block; border-radius:5px;}
	.videos-item-list .pages-img{display:none;}
	.content-videos{}
	.content-videos .yt-player{width:640px; height:360px; margin:0 auto;}
	.content-videos .yt-player iframe {width:640px; height:360px;}
	.content-videos .yt-player img {width:640px; height:360px;}
	
.pages-footer{}
	.pages-pagination{padding:10px;}
	/* -------------- pagings button ---------------*/
	.pagings{
		font-size:100%;
		color:#FFF;
		padding:2px 8px;	
		margin:2px;
		background-color: #008BCE;
	  	border-radius: 2px;	
	}
	#paging-num::before{content:"หน้า  ";}
	.pagings:active{background-color:#EBF5FA;}
	.pagings:hover{background-color:#CCC;color:#333 !important;}
	.pagings:link{color:#FFF;}
	.pagings:visited{color:#FFF;}
	.pagings-none{
		font-size:100%;
		font-weight:bold;
		padding:2px 8px;	
		margin:2px;
		background-color:#CCC;  
	  	border-radius: 2px;	
		cursor: pointer;
	}
