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

.mayor-999-1{
	margin:0;
	padding:0;
	min-height: 668px;
	background: url(../images/mayor-999-1/bg.png) top center no-repeat;
	margin-top: -200px;
}
.mayor-999-1 .count .kon-nara img{
	
max-width: 100%;
}
.mayor-999-1 .m-left{
	position:relative;
	
}
.mayor-999-1 .m-left-1{
	position:relative;
	height: 542px;
}

.mayor-999-1 .m-left-1 .mayor-pic{
	position:absolute;
	bottom: 0;
	left:0;
	top: 184px;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
	max-width:100%;
	height:auto;
}
.mayor-999-1 .m-right-1{
	position:relative;
	height: 542px;
}

.mayor-999-1 .m-right-1 .mayor1-pic{
	position:absolute;
	bottom: 0;
	left:0;
	/* top: 74px; */
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
	max-width:100%;
	height:auto;
}
.mayor-999-1 .mayor-name{
	position:absolute;
	top: 570px;
	left: 330px;
	color:#fff;
	width: 100%;
}
.mayor-999-1 .mayor-name .name{
	font-style:italic!important;
	font: 28px/35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
	font-style:italic!important;
	font: 22px/30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .know{
	
}
.mayor-999-1 .mayor-name .know img{
	max-width:100%;
	height:auto;
}
.mayor-999-1 .mayor-name1{
	position:absolute;
	top: 460px;
	left: -300px;
	color:#fff;
	width: 100%;
}
.mayor-999-1 .mayor-name1 .name1{
	font-style:italic!important;
	font: 35px/47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .name1 span{
	font-style:italic!important;
	font: 22px/30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
	
margin-left: 12px;
}
.mayor-999-1 .mayor-name1 .know1 img{
	max-width:100%;
	height:auto;
}
.mayor-999-1 .count{
	position:relative;
	height: 542px;
}
.mayor-999-1 .count .kon-nara{
	position:absolute;
	top: 205px;
	/* left: 228px; */
	font: 33px/47px 'Kanit', Arial, sans-serif;
	color:#fff;
}
.mayor-999-1 .count .block-1{
	width:189px;
	height:121px;
	background: #ff6215b8;
	position:absolute;
	top: 110px;
	left: 120px;
	padding: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}
.mayor-999-1 .count .block-2{
	width:189px;
	height:121px;
	background: #0038b7b8;
	position:absolute;
	top: 110px;
	left: 390px;
	padding: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}
.mayor-999-1 .count .block-3{
	width:189px;
	height:121px;
	background: #0038b7b8;
	position:absolute;
	top: 260px;
	left: 120px;
	padding: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}
.mayor-999-1 .count .block-4{
	width:189px;
	height:121px;
	background: #ff6215b8;
	position:absolute;
	top: 260px;
	left: 390px;
	padding: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}
.mayor-999-1 .count .number{
	text-align:center;
	font: 41px/45px 'Kanit', Arial, sans-serif;
	color:#fff;		
}
.mayor-999-1 .count .topic{
	text-align:center;
	font: 22px/30px 'Kanit', Arial, sans-serif;
	color:#fff;	
}


.mayor-999-1 .m-right{
	margin:0;
	padding:0;
	padding-left: 80px;
}
.mayor-999-1 .m-right .meet-top{
	margin:0;
	margin-top: 62px;
	/* margin-left: 50px; */
	padding:0;
	font: 24px/45px 'Kanit', Arial, sans-serif;
	color:#fff;
	font-style:italic;
	/* background:url(../images/meet/line.png) bottom left no-repeat; */
}
.mayor-999-1 .m-right .meet-mid{
	margin:0;
	padding:0;
	margin-top: 10px;
	/* width: 100%; */
}
.mayor-999-1 .m-right .meet-mid .pic{
	margin:0;
	padding:0;
	height: auto;
	border: 1px solid #fff;
}
.mayor-999-1 .m-right .meet-mid .pic img{
	max-width:100%;
	height:auto;
}
.mayor-999-1 .m-right .meet-mid .text{
	margin:0;
	padding:10px 0px;
	text-align:center;
	font: 16px/24px 'Kanit', Arial, sans-serif;
	font-style:italic;
	background: #fff;
}
.mayor-999-1 .m-right .meet-mid .text a{
	color: #000;
}
.mayor-999-1 .m-right .meet-bottom{
	margin:0;
	padding: 20px 0px;
}



@media (max-width: 374px) { 
.mayor-999-1 .mayor-name .name{
	font: 23px/35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
	font: 16px/30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .count .kon-nara{
	left: 0;
	top: 115px;
}
.mayor-999-1 .count .block-1{
	left: 0;
    width: 159px;
    padding: 15px;	
}
.mayor-999-1 .count .block-2{
	left: 176px;
	background: #012983;
	width: 159px;
	padding: 15px;
}
.mayor-999-1 .count .block-3{
	left: 0;
	 background: #012983;	
	 width: 159px;
    padding: 15px;
}
.mayor-999-1 .count .block-4{
	left: 176px;
	width: 159px;
	padding: 15px;
}
.mayor-999-1 .mayor-name{
	left: 53px;
	top: 525px;
}
.mayor-999-1 .count{
	height: 146px;
}
.mayor-999-1 .m-left-1{
		
top: -113px;
}
.mayor-999-1 .m-left-1 .mayor-pic{
		
left: 0px;
		
top: 285px;
}
.mayor-999-1 .mayor-name .know{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 75%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 80%;
}
.mayor-999-1 .mayor-name .know img{
		
max-width: 85%;
}
.mayor-999-1{
	background-size: cover;
	margin-top: -270px;
	/* min-height: 656px; */
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
top: 6px;
}
.mayor-999-1 .m-right-1{
		
height: 480px;
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
		
max-width: 80%;
}
.mayor-999-1 .mayor-name1{
		
top: 360px;
		
left: 9px;
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 25px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1 .mayor-name1 .know1 img{
		
}
}
@media (min-width: 375px) and (max-width: 419px) { 
.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .count .kon-nara{
	left: 0;
	top: 115px;
}
.mayor-999-1 .count .block-1{
	left: 0;
    width: 169px;
    padding: 15px;	
}
.mayor-999-1 .count .block-2{
	left: 176px;
	background: #012983;
	width: 169px;
	padding: 15px;
}
.mayor-999-1 .count .block-3{
	left: 0;
	 background: #012983;	
	 width: 169px;
    padding: 15px;
}
.mayor-999-1 .count .block-4{
	left: 176px;
	width: 169px;
	padding: 15px;
}
.mayor-999-1 .mayor-name{
	left: 40px;
	top: 545px;
}
.mayor-999-1 .count{
	height: 145px;
}
.mayor-999-1 .m-left-1{
		
top: 0px;
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 100%;
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 70%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 70%;
}
.mayor-999-1 .mayor-name .know img{
		
max-width: 85%;
}
.mayor-999-1 .mayor-name .name{
		
font: 25px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
		
font: 18px / 30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1{background-size: cover;margin-top: -280px;}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
top: 6px;
}
.mayor-999-1 .m-right-1{
		
height: 480px;
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
		
max-width: 70%;
}
.mayor-999-1 .mayor-name1{
		
top: 360px;
		
left: 9px;
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 25px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1 .mayor-name1 .know1 img{
		
}
}
@media (min-width: 420px) and (max-width: 575px) { 
.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .count .kon-nara{
	left: 0px;
	top: 115px;
}
.mayor-999-1 .count .block-1{
	left: 0;	
}
.mayor-999-1 .count .block-2{
	left: 205px;
	 background: #012983;	
}
.mayor-999-1 .count .block-3{
	left: 0;
	 background: #012983;	
}
.mayor-999-1 .count .block-4{
	left: 205px;	
}
.mayor-999-1 .mayor-name{
	left: 65px;
	top: 535px;
}
.mayor-999-1 .count{
	height: 180px;
}
.mayor-999-1 .m-left-1{
		
top: 15px;
		
left: 95px;
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 60%;
}
.mayor-999-1 .mayor-name .know img{
		
max-width: 75%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 65%;
}
.mayor-999-1 .mayor-name .name{
		
font: 25px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
		
font: 17px / 30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1{
		
background-size: cover;
		
margin-top: -265px;
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
top: -5px;
		
left: 80px;
}
.mayor-999-1 .m-right-1{
		
height: 480px;
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
		
max-width: 70%;
}
.mayor-999-1 .mayor-name1{
		
top: 345px;
		
left: 90px;
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 25px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1 .mayor-name1 .know1 img{
		
}
}	
@media (min-width: 576px) and (max-width: 767px) { 

.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .count .kon-nara{
	left: 0;	
}
.mayor-999-1 .count .block-1{
	left: 0;	
}
.mayor-999-1 .count .block-2{
	left: 205px;
	 background: #012983;	
}
.mayor-999-1 .count .block-3{
	left: 0;	
	 background: #012983;
}
.mayor-999-1 .count .block-4{
	left: 205px;	
}
.mayor-999-1 .mayor-name{
	left: 50px;	
}
.mayor-999-1 .count{
	height:372px;	
}
.mayor-999-1 .m-left-1{
		
}
.mayor-999-1 .mayor-name{
		
}
.mayor-999-1 .m-right .meet-mid .pic{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 100%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
}
.mayor-999-1 .mayor-name .know img{
		
}
}
@media (min-width: 768px) and (max-width: 991px) { 
.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .count{
	height: 90px;
}
.mayor-999-1 .count .block-2{
    background: #012983;	
}
.mayor-999-1 .count .block-3{
    background: #012983;	
}
.mayor-999-1 .m-left-1{
		
top: -55px;
}
.mayor-999-1 .mayor-name{
		
top: 590px;
		
left: 200px;
}
.mayor-999-1 .m-right .meet-mid .pic{
		
/* width: 100%; */
}
.mayor-999-1 .m-right .meet-mid{
	width: 89%;
}
.mayor-999-1 .m-left-1{
		
top: 122px;
		
left: -45px;
}
.mayor-999-1 .m-right .meet-mid .pic{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 70%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 75%;
}
.mayor-999-1 .mayor-name .know img{
		
}
.mayor-999-1 .mayor-name .name{
		
font: 27px / 22px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
	
font: 20px / 27px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .count .kon-nara{
		
top: -310px;
		
left: 200px;
}
.mayor-999-1 .m-right-1{
		
/* text-align: right; */
		
left: 520px;
		
height: 35px;
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
top: -327px;
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
		
max-width: 75%;
}
.mayor-999-1 .mayor-name1{
		
top: -170px;
		
left: 273px;
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 25px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1{
		
/* min-height: 0px; */
}
}

@media (min-width: 992px) and (max-width: 1199px) { 
.mayor-999-1{
	/* background: #1b46ab url(../images/mayor-999-1/bg.jpg) top left no-repeat; */
}
.mayor-999-1 .mayor-name {
	    width: 140%;
	    top: 565px;
	    left: 275px;
}
.mayor-999-1 .m-right{
	padding-left: 0px;	
}
.mayor-999-1 .m-right .meet-top{
	text-align: center;
	background: url(../images/meet/line.png) bottom center no-repeat;
	margin-top: -55px;
}
.mayor-999-1 .m-right .meet-mid .pic{
	margin: 0 auto;	
}
.mayor-999-1 .m-right .meet-bottom{
	padding: 20px 0px;	
}
.mayor-999-1 .count{
		
left: -100px;
		
/* height: 481px; */
}
.mayor-999-1 .m-right .meet-mid{
		
width: 64%;
		
/* text-align: center; */
		
/* padding: 0px 0px 0px 0px; */
		
margin-left: 170px;
}
.mayor-999-1 .m-right .meet-mid .text{
		
}
.mayor-999-1 .m-left-1{
		
top: 104px;
}
.mayor-999-1 .m-right .meet-mid .pic{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 70%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 90%;
}
.mayor-999-1 .mayor-name .know img{
		
}
.mayor-999-1 .mayor-name .name{
		
font: 27px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
	
font: 20px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .count .kon-nara{
		
top: 205px;
		
/* left: 200px; */
}
.mayor-999-1 .m-right-1{
		
/* text-align: right; */
		
left: 720px;
		
height: 35px;
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
top: -254px;
}
.mayor-999-1 .m-right-1 .mayor1-pic img{
		
max-width: 90%;
}
.mayor-999-1 .mayor-name1{
		
top: -85px;
		
left: 475px;
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 25px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1{
		
/* min-height: 0px; */
}
}
@media (min-width: 1200px) and (max-width: 1280px){
.mayor-999-1 .m-left-1 .mayor-pic img{
	
max-width: 140%;
}
.mayor-999-1 .mayor-name{
		
top: 570px;
		
width: 130%;
}
.mayor-999-1 .mayor-name .name{
		
font: 28px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .know{
		
}
.mayor-999-1 .count{
		
}
.mayor-999-1 .count .kon-nara{
		
left: 110px;
		
top: 215px;
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 100%;
}
.mayor-999-1 .m-right-1{
		
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
}
.mayor-999-1 .mayor-name1{
		
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 32px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1 .m-left-1 .mayor-pic{
		
top: 191px;
}
.mayor-999-1 .m-left-1{
		
}
}
@media (min-width: 1281px) and (max-width: 1366px) { 
.mayor-999-1{
	 /* background: #1b46ab url(../images/mayor-999-1/bg.jpg) -440px 0px no-repeat; */
}
.mayor-999-1 .mayor-name{
	    width: 170%;	
}
.mayor-999-1 .count .kon-nara{
	left: 130px;
}
.mayor-999-1 .count .block-1{
	left: 80px;	
}
.mayor-999-1 .count .block-2{
	left: 320px;	
}
.mayor-999-1 .count .block-3{
	left: 80px;	
}
.mayor-999-1 .count .block-4{
	left: 320px;	
}
.mayor-999-1 .m-right{
	padding-left:0;	
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 128%;
}
.mayor-999-1 .mayor-name{
		
top: 570px;
		
width: 130%;
}
.mayor-999-1 .mayor-name .name{
		
font: 30px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .know{
		
}
.mayor-999-1 .count{
		
}
.mayor-999-1 .count .kon-nara{
		
left: 90px;
		
top: 220px;
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 90%;
}
.mayor-999-1 .mayor-name .name span{
		
font: 20px / 30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .m-right-1{
		
}
.mayor-999-1 .m-right-1 .mayor1-pic{
		
}
.mayor-999-1 .mayor-name1{
		
}
.mayor-999-1 .mayor-name1 .name1{
		
font: 32px / 47px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name1 .know1{
		
}
.mayor-999-1 .m-left-1 .mayor-pic{
		
top: 191px;
}
.mayor-999-1 .m-left-1{
		
}
.mayor-999-1 .m-left-1 .mayor-pic{
		
}
}
@media (min-width: 1367px) and (max-width: 1440px) { 
.mayor-999-1{
	 /* background: #1b46ab url(../images/mayor-999-1/bg.jpg) -340px 0px no-repeat; */
}
.mayor-999-1 .mayor-name{
	    width: 170%;	
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 130%;
}
.mayor-999-1 .count .kon-nara{
		
left: 80px;
		
top: 220px;
}
.mayor-999-1 .count{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 90%;
}
.mayor-999-1 .mayor-name .name{
		
font: 30px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
		
font: 19px / 30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .know img{
		
max-width: 85%;
}
}
@media (min-width: 1441px) and (max-width: 1600px) { 
.mayor-999-1{
	 /* background: #1b46ab url(../images/mayor-999-1/bg.jpg) -250px 0px no-repeat; */
}
.mayor-999-1 .mayor-name {
	width:140%;
}
.mayor-999-1 .m-left-1 .mayor-pic img{
		
max-width: 116%;
}
.mayor-999-1 .count .kon-nara{
		
left: 140px;
		
top: 195px;
}
.mayor-999-1 .count{
		
}
.mayor-999-1 .count .kon-nara img{
		
max-width: 90%;
}
.mayor-999-1 .mayor-name .name{
		
font: 30px / 35px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .name span{
		
font: 19px / 30px 'Kanit', Arial, sans-serif;
}
.mayor-999-1 .mayor-name .know img{
		
max-width: 85%;
}
}