@charset "utf-8";
/* CSS Document */

.block-all{
    position: relative;
    z-index: 1;
    background:url(../images/block-all/bg.png) top center no-repeat;
    background-size: 100% 100%;
    /* margin-top: -45px; */
 }
.highlight-block{
	width:100%;
	height:auto;
	} 
.highlight-block .top{
	width:100%;
	height:auto;
	position: relative;
    left: 10px;
	}
.highlight-block .title{
	padding-left:100px;
	height: 105px;
	font: 29px/122px 'Kanit', Arial, sans-serif;
	color:#000;
	background:url(../images/block-all/top-h.png) 0 0 no-repeat;
	}
.highlight-block .h-mid{
	margin:0;
	padding:0;
	margin-top: 0px;
}

.highlight-block .h-mid a{
	color:#000;
}

.highlight-block .h-mid .col-lg-4 a{
	color:#010101;
}
.highlight-block .h-mid .col-lg-4 a:hover{
	color:#ad00f2;
}
.highlight-block .h-block{
	padding:22px 17px;
	border: 1px solid #e2e2e2;
	border-left: #fa990e 14px solid;
	/* border-radius: 15px; */
	width:100%;
	/* height:122px; */
	font: 16px/24px 'Kanit', Arial, sans-serif;
	-webkit-box-shadow: 8px 8px 14px -2px rgba(0,0,0,0.05);
	-moz-box-shadow: 8px 8px 14px -2px rgba(0,0,0,0.05);
	box-shadow: 8px 8px 14px -2px rgba(0,0,0,0.05);
}



.highlight-block .bg-1{
	background: #fff;
}
.highlight-block .bg-2{
	background: #fff;
	border-left: #18b04b 14px solid;
}
.highlight-block .bg-3{
	background: #fff;
}

.highlighttoday-137-1 .highlight .h-bottom{
	margin:0;
	padding:0;
	margin-top: 25px;
}
.highlight-block .list{
	width:100%;
	height:auto;
	}
.highlight-block .list ul{
	width:100%;
	height:auto;
	}	
.highlight-block .list ul li{
	width:100%;
	height:auto;
	margin-top: 20px;
	font: 16px/24px 'Kanit', Arial, sans-serif;
	background: url(../images/block-all/li-h.png) 2% 16% no-repeat;
	padding-left:30px;
	padding-bottom:20px;
	border-bottom: 2px solid #c4c4c4;
	}	
.highlight-block .list ul li a{
	color:#000;
	}
.highlight-block .list ul li a:hover{
	color: #000;
	}
.highlight-block .bottom{
	width:100%;
	height:auto;
	margin-top: -26px;
	}
	
/***************************************************/	
	
.good-block{
	width:100%;
	height:auto;
	padding-top: 15px;
	} 
.good-block .top{
	width:100%;
	height:auto;
	position: relative;
    left: 10px;
	}
.good-block .title{
	padding-left:100px;
	height: 105px;
	font: 25px/122px 'Kanit', Arial, sans-serif;
	color: #fff;
	background:url(../images/block-all/top-j.png) 0 0 no-repeat;
	}	
.good-block .pic {
    margin: 0 auto;
    border: #fff 5px solid;
    overflow: hidden;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}	
.good-block .pic img{
	max-width:100%;
	height:auto;
	/* -webkit-border-radius: 10px; */
	-moz-border-radius: 10px;
	/* border-radius: 10px; */
}
.good-block .text{
	font: 17px/20px 'Kanit', Arial, sans-serif;
	
}
.good-block .text a{
	color: #fff;
}

.good-block .bullet{
	position:absolute;
	/* bottom: 86px; */
	left:0;
	right:0;
	}	
.fix-z{
	position:relative;
		z-index:1;
	}
/***************************************************/	
	
.sc-block{
	width:100%;
	height:auto;
	position:relative;
	} 
.sc-block .top{
	width:100%;
	height:auto;
	position: relative;
    left: 10px;
	}
.sc-block .title{
	padding-left:100px;
	height: 105px;
	font: 25px/122px 'Kanit', Arial, sans-serif;
	color: #000;
	background:url(../images/block-all/top-k.png) 0 0 no-repeat;
	}	
.sc-block .mid{
	margin:0;
	padding:0;
	margin: 0px 20px;
}
.sc-block .mid ul{
	margin:0;
	padding:0;
}
.sc-block .mid ul li{
	margin:0;
	padding:10px 10px;
	margin-bottom:11px;
	background:#ffffff;
	border: 1px solid #e2e2e2;
	border-left: 5px solid #fa990e;
	font: 16px/20px 'Kanit', Arial, sans-serif;
}
.sc-block .mid ul li .sc-block-1{
	
/* border: 1px solid #0028ff; */
	
/* border-left: 5px solid #0028ff; */
}
.sc-block .mid ul li a{
	color:#010101;	
}
.sc-block .mid ul li a:hover{
	/* color:#ff7800; */
}


/***************************************************/
.executive-block{
	width:100%;
	height:auto;
	}
.executive-block .top-e{
	height:auto;
	position: absolute;
    right: 15px;
    top: 80px;
	}
.executive-block .title-e{
	width: 100%;
    height: auto;
    margin-top: 175px;
    font: 30px/25px 'Kanit', Arial, sans-serif;
    color: #fff;
    padding: 12px 0px;
	}
.executive-block .link-e{
	width:100%;
	height:auto;
	background:#844bfe;
	margin-top: 10px;
	padding: 5px 10px;
	
	-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
	}
.executive-block .link-e ul{
	width:100%;
	height:auto;
	}	
.executive-block .link-e ul li{
	width:100%;
	height:auto;
	font: 16px/20px 'Kanit', Arial, sans-serif;
	background:url(../images/block-all/li-e.png) 0% 0% no-repeat;
	padding-left:20px;	
    margin-top: 10px;
	}	
.executive-block .link-e ul li a{
	color:#fff;
	}
.executive-block .link-e ul li a:hover{
	color:#fff;
	}
/**********************************************/
.mayor-block{
	width:100%;
	height:auto;
	}
.mayor-pic{
	height:auto;
	position:absolute;
	right:0;
	top: -67px;
	}
.mayor-text{
	width:100%;
	height:auto;
	padding: 10px 20px;
	position:absolute;
	top: 203px;
	background: rgba(132,71,255,1);
background: -moz-linear-gradient(left, rgba(132,71,255,1) 0%, rgba(137,161,239,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(132,71,255,1)), color-stop(100%, rgba(137,161,239,1)));
background: -webkit-linear-gradient(left, rgba(132,71,255,1) 0%, rgba(137,161,239,1) 100%);
background: -o-linear-gradient(left, rgba(132,71,255,1) 0%, rgba(137,161,239,1) 100%);
background: -ms-linear-gradient(left, rgba(132,71,255,1) 0%, rgba(137,161,239,1) 100%);
background: linear-gradient(to right, rgba(132,71,255,1) 0%, rgba(137,161,239,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8447ff', endColorstr='#89a1ef', GradientType=1 );

-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
	}
.mayor-name{
	width:100%;
	height:auto;
	font: 27px/40px 'Kanit', Arial, sans-serif;
	color:#fff;
	}
.mayor-rank{
	width:100%;
	height:auto;
	font: 20px/20px 'Kanit', Arial, sans-serif;
	color:#ffef9f;
	}
.mayor-logo{
	width:100%;
	height:auto;
	}
.bottom-all{
	width:100%;
	height:auto;
	margin-top: 340px;
	}
.mayor-buttom{
	width:183px;
	height:auto;
	text-align:center;
	background:#8447ff;
	font: 20px/20px 'Kanit', Arial, sans-serif;
	color:#fff;
	padding: 10px 23px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	}
.mayor-buttom:hover{
	background:#702afe;
	color:#fff;
	}
@media (max-width: 374px) { 
	.block-all {

}

.executive-block .top-e {
    position: relative;
    left: 12px;
    top: 0px;
	text-align: center;
}
.executive-block .title-e {
    margin-top: 15px;
	
}
.mayor-pic {
    top: 20px;
	right: 80px;
}
.mayor-text {
    position: relative;
    top: 311px;
}
.highlight-block {
    margin-top: 20px;
}
.mayor-name {
    font: 22px/40px 'Kanit', Arial, sans-serif;
}
.mayor-rank {
    font: 17px/20px 'Kanit', Arial, sans-serif;
}
.mayor-buttom {
    font: 16px/20px 'Kanit', Arial, sans-serif;
}
.highlight-block .top {
    text-align: center;
}
.highlight-block .title{
		
font: 27px/122px 'Kanit', Arial, sans-serif;
}
.good-block{
		
padding-top: 20px;
}
	}
@media (min-width: 375px) and (max-width: 413px) {
	.block-all {

}

.executive-block .top-e {
    position: relative;
    left: 12px;
    top: 0px;
	text-align: center;
}
.executive-block .title-e {
    margin-top: 15px;
	
}
.mayor-pic {
    top: 20px;
	right: 100px;
}
.mayor-text {
    position: relative;
    top: 311px;
}
.highlight-block {
    margin-top: 20px;
}
.mayor-name {
    font: 24px/40px 'Kanit', Arial, sans-serif;
}
.mayor-rank {
    font: 17px/20px 'Kanit', Arial, sans-serif;
}
.mayor-buttom {
    font: 16px/20px 'Kanit', Arial, sans-serif;
}
.highlight-block .top {
    text-align: center;
}
.good-block{
		
padding-top: 30px;
}
	}

@media (min-width: 414px) and (max-width: 575px) {
	.block-all {

}

.good-block{
	    padding-top: 60px;
}
.executive-block .top-e {
    position: relative;
    left: 12px;
    top: 0px;
	text-align: center;
}
.executive-block .title-e {
    margin-top: 15px;
}
.mayor-pic {
    top: 20px;
	right: 100px;
}
.mayor-text {
    position: relative;
    top: 311px;
}

.highlight-block {
    margin-top: 20px;
}
.highlight-block .top {
    text-align: center;
}
}
@media (min-width: 576px) and (max-width: 991px) {
	.block-all {

}

.executive-block .top-e {
    position: relative;
    left: 12px;
    top: 0px;
	text-align: center;
}
.executive-block .title-e {
    margin-top: 15px;
}
.good-block{
    margin: 0 auto;
	    width: 81%;	
}
.mayor-pic {
    top: 20px;
	right: 265px;
}
.mayor-text {
    position: relative;
    top: 311px;
}
.highlight-block {
    margin-top: 20px;
}
.highlight-block .top {
    text-align: center;
}
.highlight-block .list ul li{
	border-bottom: 2px solid #ffffeb;	
}
.executive-block {
    margin-top: 14px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.block-all {

}
.sc-block{
		
margin-top: 20px;
}
.executive-block .top-e {
    position: relative;
    left: 12px;
    top: 0px;
	text-align: center;
}
.executive-block .title-e {
    margin-top: 15px;
}
.highlight-block .list ul li{
    margin-top: 0;	
}
.mayor-pic {
    top: 20px;
	right: 60px;
}
.mayor-text {
    position: relative;
    top: 311px;
	padding: 10px 10px;
}

.highlight-block {
    margin-top: 20px;
}
.highlight-block .top {
    text-align: center;
}
.highlight-block .title{
	padding-top: 45px;
	font: 27px/29px 'Kanit', Arial, sans-serif;
}
.executive-block {
    margin-top: 13px;
}
.mayor-name {

    font: 21px/40px 'Kanit', Arial, sans-serif;
}
.mayor-rank {
    font: 17px/20px 'Kanit', Arial, sans-serif;
}
.mayor-buttom {
    font: 13px/20px 'Kanit', Arial, sans-serif;
}
.sc-block .mid{
		
margin: 0px 0px;
}
}
@media (min-width: 1200px) and (max-width: 1360px) {
	.executive-block .top-e {
    right: 30px;
}
.mayor-pic {
    right: 55px;
}
.mayor-text {
    width: 87%;
}
.mayor-buttom {
    font: 18px/20px 'Kanit', Arial, sans-serif;
}
	}