.webboard-portfolio {
	z-index: 9;
	margin: 0;
	padding: 0;
	padding-top: 0;
	min-height: 647px;
	position: relative;
	/* background:
	url(../images/wb-120-1/bg.jpg) top center no-repeat; */
	margin-top: 50px;
}

.webboard-block {
	margin: 0;
	padding: 0;
}

.webboard-block .wb-top {
	margin: 0;
	padding: 0;
	color: #fff;
	margin-bottom: 20px;
	font: 28px/42px 'anakotmai-medium', Arial, sans-serif;
}

.webboard-block .wb-tab-row {
	margin: 0;
	padding: 0;
	height: 66px;
	/* background:url(../images/news-120-1/border.jpg) bottom left repeat-x; */
}

.webboard-block .wb-tab-row .wb-tap {
	width: 667px;
	height: 70px;
	text-align:
		center;
	font: 20px/71px 'Kanit', Arial, sans-serif;
	/* padding: 0 4px; */
}

.webboard-block .wb-tab-row .wb-tap .select {
	width: 100%;
	height: 70px;
	/* -webkit-border-radius: 50px; */
	-moz-border-radius: 50px;
	/* border-radius: 50px; */
	background: #008cff;
	padding: 0 9px;
}

.webboard-block .wb-tab-row .wb-tap .select a {
	color: #fff;
}

.webboard-block .wb-tab-row .wb-tap .normal {
	width: 100%;
	height: 70px;
	/* background: url(../images/wb-120-1/normal.png) top center no-repeat; */
	background-size: 100% 100%;
	background: #fff;
	padding: 0 6px;
}

.webboard-block .wb-tab-row .wb-tap .normal:hover {
	cursor: pointer;
}

.webboard-block .wb-tab-row .wb-tap .normal a {
	/* display: inline-block; */
	color: #333;
	/* padding: 0 5px; */
}

.webboard-block .wb-tab-row .wb-tap .normal:hover a {
	color: #0ca483;
}

.webboard-block .wb-mid {
	margin: 0;
	padding: 20px;
	/* margin-top: 20px; */
	background: #fff;
	border: 1px solid #52b420;
	border-bottom: none;
	border-top: 1px solid #ececec;
}

.webboard-block .wb-mid a {
	color: #333;
}

.webboard-block .wb-mid a:hover {
	color: #007bff;
}

.webboard-block .wb-mid table thead {
	/* border-bottom: 3px solid #0a855e; */
	color: #3d3939;
	background: #efebee;
	/* -webkit-border-top-left-radius: 10px; */
	/* -webkit-border-top-right-radius: 10px; */
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	/* border-top-left-radius: 10px; */
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	/* border-top-right-radius: 10px; */
}

.webboard-block .wb-mid table thead th {
	text-align: center;
	border-top: none;
}

.webboard-block .wb-mid table tbody {
	background: #ffffffd1;
}

.webboard-block .wb-mid .table td {
	border-bottom: 1px solid #efebee;
	color: #333;
}

.webboard-block .wb-bottom {
	margin: 0;
	padding: 0;
	background: #ffffff;
	border: 1px solid #52b420;
	border-top: none;
}

.webboard-block .table {
	margin-bottom: 0px;
}


.portfolio-block {
	margin: 0;
	padding: 0;
}

.portfolio-block .portfolio-top {
	margin: 0;
	padding: 0;
	color: #fff;
	margin-bottom: 32px;
	padding-bottom: 7px;
	font: 28px/42px 'anakotmai-medium', Arial, sans-serif;
	background: url(../images/wb-120-1/line.png) bottom left no-repeat;
}

.portfolio-block .portfolio-mid {
	margin: 0;
	padding: 0;
}

.portfolio-block .portfolio-mid .pic {
	margin: 0;
	padding: 0;
	position: relative;
}

.portfolio-block .portfolio-mid .alpha {
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	/* height:150px; */
	padding-top: 30px;

}

.portfolio-block .portfolio-mid .alpha .text {
	padding: 20px;
	font: 18px/26px 'Kanit', Arial, sans-serif;
	background: url(../images/wb-120-1/bg-1.png) top left repeat-x;
}

.portfolio-block .portfolio-mid .alpha .text a {
	color: #fff;
}

.portfolio-block .portfolio-mid .alpha .text a:hover {
	color: #fee570;
}

.portfolio-block .portfolio-mid .alpha .view {
	width: 92px;
	height: 29px;
	margin-left: 75%;
	margin-bottom: 10px;
	padding: 5px;
	padding-left: 44px;
	color: #fff;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background: #8c7e01 url(../images/eye.png) 11px 8px no-repeat;
	font: 16px/22px 'anakotmai-medium', Arial, sans-serif;
}

.portfolio-block .portfolio-mid .pic img {
	max-width: 100%;
	height: auto;
}

.portfolio-block .portfolio-bottom {
	margin: 0;
	padding: 0;
}

@media (max-width: 374px) {
	. .webboard-block .wb-tab-row .wb-tap {
		width: 159px;
		font-size: 16px;
	}

	.portfolio-block .portfolio-mid .alpha .view {
		margin-left: 68%;
	}

	.portfolio-block .portfolio-mid .alpha .text {
		font: 15px/20px 'anakotmai-medium', Arial, sans-serif;
	}

	.webboard-portfolio {
		min-height: 1223px;
		padding-top: 40px !important;
	}

}

@media (min-width: 375px) and (max-width: 419px) {

	.webboard-block .wb-tab-row .wb-tap {
		width: 242px;
		font-size: 14px;
	}

	.portfolio-block {
		margin-top: 30px;
	}

	.portfolio-block .portfolio-top {
		/* color: #fff; */
	}

	.portfolio-block .portfolio-mid .alpha {
		padding-top: 8px;
	}

	.portfolio-block .portfolio-mid .alpha .text {
		font: 16px/23px 'anakotmai-medium', Arial, sans-serif;
	}

	.portfolio-block .portfolio-mid .alpha .view {
		margin-left: 70%;
	}

	.webboard-portfolio {
		min-height: 470px;
		padding-top: 50px !important;
	}

}

@media (min-width: 420px) and (max-width: 575px) {

	.webboard-block .wb-tab-row .wb-tap {
		width: max-content;
		/* font-size:18px; */
	}

	.portfolio-block .portfolio-top {
		color: #fff;
		margin-top: 40px;
	}

	.portfolio-block .portfolio-mid .alpha {
		padding-top: 8px;
	}

	.webboard-portfolio {
		min-height: 500px;
		padding-top: 50px !important;
	}
}

@media (min-width: 576px) and (max-width: 767px) {
	.webboard-portfolio {
		min-height: 2283px;
	}

	.portfolio-block {
		margin-top: 30px;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.webboard-block .wb-tab-row .wb-tap {
		width: 369px;
	}

	.webboard-portfolio {
		padding-top: 50px !important;
		background-size: 430%;
		min-height: 500px;
	}

	.portfolio-block .portfolio-mid .alpha .view {
		margin-left: 85%;
	}
}

@media (min-width: 819px) and (max-width: 820px) {
	.webboard-block .wb-tab-row .wb-tap {
		width: 395px;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.webboard-block .wb-tab-row .wb-tap {
		width: 497px;
	}

	.webboard-portfolio {
		/* min-height: 934px; */
	}

	.portfolio-block .portfolio-mid .alpha {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.portfolio-block .portfolio-mid .alpha .p-0 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}

	.portfolio-block .portfolio-mid .alpha .d-flex {
		display: -ms-blockbox !important;
		display: block !important;
	}

	.portfolio-block .portfolio-mid .alpha .text {
		padding: 10px 20px;
		font: 14px/20px 'anakotmai-medium', Arial, sans-serif;
	}

	.portfolio-block .portfolio-mid .alpha .view {
		margin-top: 11px;
		margin-left: 65%;
	}

	.webboard-block .wb-bottom img {
		max-width: 80%;
		height: auto;
	}

	.portfolio-block .portfolio-bottom img {
		max-width: 33%;
		height: auto;
	}
}

@media (min-width: 1200px) and (max-width: 1280px) {
	.portfolio-block .portfolio-mid .alpha .text {
		padding: 20px;
		font: 15px/24px 'anakotmai-medium', Arial, sans-serif;
	}
}

@media (min-width: 1281px) and (max-width: 1366px) {
	.portfolio-block .portfolio-mid .alpha .text {
		padding: 20px;
		font: 15px/24px 'anakotmai-medium', Arial, sans-serif;
	}
}

@media (min-width: 1367px) and (max-width: 1440px) {
	.portfolio-block .portfolio-mid .alpha .text {
		padding: 20px;
		font: 15px/24px 'anakotmai-medium', Arial, sans-serif;
	}
}

@media (min-width: 1441px) and (max-width: 1600px) {
	.portfolio-block .portfolio-mid .alpha .text {
		padding: 20px;
		font: 18px/26px 'anakotmai-medium', Arial, sans-serif;
	}
}