@charset "utf-8";
/* CSS Document */
body, ul, li, ol, h1, h2, h3, h4, h5, h6, form, p, figure, figcaption { padding:0; margin:0; }


.shadow{
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3); 
    -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3); 
    -o-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3); 
    -ms-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3); 
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
}

#banner{
	padding-bottom:5px;
}

.ico_1{padding-left:35px;background: url('../include/share/icon/1.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_2{padding-left:35px;background: url('../include/share/icon/2.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_3{padding-left:35px;background: url('../include/share/icon/3.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_4{padding-left:35px;background: url('../include/share/icon/4.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_5{padding-left:35px;background: url('../include/share/icon/5.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_6{padding-left:35px;background: url('../include/share/icon/6.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_7{padding-left:35px;background: url('../include/share/icon/7.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_8{padding-left:35px;background: url('../include/share/icon/8.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_9{padding-left:35px;background: url('../include/share/icon/9.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_10{padding-left:35px;background: url('../include/share/icon/10.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_11{padding-left:35px;background: url('../include/share/icon/11.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_12{padding-left:35px;background: url('../include/share/icon/12.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_13{padding-left:35px;background: url('../include/share/icon/13.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_14{padding-left:35px;background: url('../include/share/icon/14.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_15{padding-left:35px;background: url('../include/share/icon/15.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_16{padding-left:35px;background: url('../include/share/icon/16.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_17{padding-left:35px;background: url('../include/share/icon/17.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_18{padding-left:35px;background: url('../include/share/icon/18.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_19{padding-left:35px;background: url('../include/share/icon/19.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_20{padding-left:35px;background: url('../include/share/icon/20.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_21{padding-left:35px;background: url('../include/share/icon/21.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_22{padding-left:35px;background: url('../include/share/icon/22.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_23{padding-left:35px;background: url('../include/share/icon/23.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_24{padding-left:35px;background: url('../include/share/icon/24.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_25{padding-left:35px;background: url('../include/share/icon/25.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_26{padding-left:35px;background: url('../include/share/icon/26.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_27{padding-left:35px;background: url('../include/share/icon/27.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_28{padding-left:35px;background: url('../include/share/icon/28.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_29{padding-left:35px;background: url('../include/share/icon/29.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_30{padding-left:35px;background: url('../include/share/icon/30.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_31{padding-left:35px;background: url('../include/share/icon/31.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_32{padding-left:35px;background: url('../include/share/icon/32.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_33{padding-left:35px;background: url('../include/share/icon/33.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_34{padding-left:35px;background: url('../include/share/icon/34.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_35{padding-left:35px;background: url('../include/share/icon/35.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_36{padding-left:35px;background: url('../include/share/icon/36.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_37{padding-left:35px;background: url('../include/share/icon/37.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_38{padding-left:35px;background: url('../include/share/icon/38.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_39{padding-left:35px;background: url('../include/share/icon/39.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_40{padding-left:35px;background: url('../include/share/icon/40.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_41{padding-left:35px;background: url('../include/share/icon/41.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_42{padding-left:35px;background: url('../include/share/icon/42.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_43{padding-left:35px;background: url('../include/share/icon/43.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_44{padding-left:35px;background: url('../include/share/icon/44.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_45{padding-left:35px;background: url('../include/share/icon/45.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_46{padding-left:35px;background: url('../include/share/icon/46.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_47{padding-left:35px;background: url('../include/share/icon/47.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_48{padding-left:35px;background: url('../include/share/icon/48.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_49{padding-left:35px;background: url('../include/share/icon/49.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_50{padding-left:35px;background: url('../include/share/icon/50.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_51{padding-left:35px;background: url('../include/share/icon/51.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_52{padding-left:35px;background: url('../include/share/icon/52.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_53{padding-left:35px;background: url('../include/share/icon/53.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_54{padding-left:35px;background: url('../include/share/icon/54.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_55{padding-left:35px;background: url('../include/share/icon/55.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_56{padding-left:35px;background: url('../include/share/icon/56.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_57{padding-left:35px;background: url('../include/share/icon/57.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_58{padding-left:35px;background: url('../include/share/icon/58.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_59{padding-left:35px;background: url('../include/share/icon/59.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_60{padding-left:35px;background: url('../include/share/icon/60.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_61{padding-left:35px;background: url('../include/share/icon/61.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_62{padding-left:35px;background: url('../include/share/icon/62.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_63{padding-left:35px;background: url('../include/share/icon/63.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_64{padding-left:35px;background: url('../include/share/icon/64.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}
.ico_65{padding-left:35px;background: url('../include/share/icon/65.png') 10px 0px no-repeat; border-bottom:1px dashed #F5F5F5; padding-bottom:5px;}

.shadow {
-webkit-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
-khtml-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
-moz-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
-moz-box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
-webkit-box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
box-shadow: 0 0 8px #B6BDC4; /* กำหนดสีของกรอบและเงาครับ */
padding:5px; /* กำหนดระยะห่างจากขอบด้านในของกรอบถึงขอบของรูป���าพ */
}	


/*================= ข่าวแบบที่ 2 =======================*/

.News2-Box{
	width:100%; height:80px; border-bottom:1px dashed #F4F4F4;
	vertical-align: top;
	float:left;
	padding-bottom:5px;
}
.News2-img {
	width: 120px;
	display: block;
	float: left;
	height: 80px;
}
.News2-detail {
	width:143px;
	display: block;
	float: left;
}
.News2-pad-zero {
	margin: 0px;
	padding: 0px;
}
.News2-normal {
	font-family: Tahoma;
	font-size: 11px;
	color: #333333;
	font-weight: normal;
}


.News3-img {
	width: 130px;
	display: block;
	float: left;
	height: 1000px;
}
.News3-detail {
	width:390px;
	display: block;
	float: left;
}
.News3-pad-zero {
	margin: 0px;
	padding: 0px;
}
.News3-normal {
	font-family: Tahoma;
	font-size: 11px;
	color: #333333;
	font-weight: normal;
}
								
								
								
/*================= ข่าวแบบที่ 3 =======================*/								




/*================= ข่าวแบบที่ 4 =======================*/		
.News4-Box{
	width:100%; border:1px  #EAEAEA dashed;
	vertical-align: top;
	float:left;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
}




/*================= ข่าวแบบที่ 5 =======================*/		
.News5-Box{
	width:100%; border:1px  #EAEAEA dashed;
	vertical-align: top;
	float:left;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
}
.News5-img {
	width: 130px;
	display: block;
	float: left;
	height: 1000px;
}
.News5-detail {
	display: block;
	float: left;
}
.News5-pad-zero {
	margin: 0px;
	padding: 0px;
}
.News5-normal {
	font-family: Tahoma;
	font-size: 11px;
	color: #333333;
	font-weight: normal;
}





/*************** Pagination ***************/
.pagination {
	  text-align: center;
	  padding: 20px 0 5px 0;
	  font-family: Verdana, Arial, Helvetica, sans-serif;
	  font-size: 12px;
}

.pagination a {
	  margin: 0 5px 0 0;
	  padding: 3px 6px;
}

.pagination a.number {
	  border: 1px solid #ddd;
}

.pagination a.current {
	  background: #469400 url('./images/bg-button-green.gif') top left repeat-x !important;
	  border-color: #459300 !important;
	  color: #fff !important;
}
	  
.pagination a.current:hover {
	  text-decoration: underline;
}








/*================= ข่าวแบบที่ 2 =======================*/

.News22-Box{
	width:100%;  border-bottom:1px dashed #F4F4F4;
	vertical-align: top;
	float:left;
	padding-bottom:5px;
}
.News22-img {
	width: 160px;
	display: block;
	float: left;
}
.News22-detail {
	width:143px;
	display: block;
	float: left;
}
.News22-pad-zero {
	margin: 0px;
	padding: 0px;
}
.News22-normal {
	font-family: Tahoma;
	font-size: 11px;
	color: #333333;
	font-weight: normal;
}



/*================= กรอบรูปภาพ =======================*/
div.img
{
  margin: 2px;
  border: 1px solid #E6E4E4;
  float: left;
  background-color:#EFEFEF;
  text-align: center;
}	

div.img img
{
  display: inline;
  margin: 3px;
  border: 1px solid #EFEFEF;
}

div.img a:hover img {border: 1px solid #CCC;}




#title_regis{
	font-family:supermarketRegular;
	font-size:18px;
	text-align:center;
	vertical-align:bottom;
}
		
		

/*================= เว็บบอร์ด =======================*/		
#webboard{
	width:100%;
}

#webboard th{
	background-image: url(../include/share/title_board.png);
	height:34px;
	background-repeat:repeat-x;
}

#webboard .line{
	background-image: url(../include/share/lineboard.png);
	height:28px;
	background-repeat:repeat-x;
}


		

/*++++++++  Chat Live 2024-06-01 +++++++++*/
.live-chat-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.live-chat-buttons {
    display: none;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 10px;
}

.chat-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    font-size: 24px;
    transition: background-color 0.3s ease;
    position: relative;
}

.chat-button.messenger {
    background-color: #0084ff;
}

.chat-button.phone {
    background-color: #34b7f1;
	cursor: pointer;
}

.chat-button.phone .phone-number {
    display: none;
    position: absolute;
    left: -160px;
    background-color: #34b7f1;
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff;
}

.chat-button:hover {
    opacity: 0.8;
}

.toggle-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #ff5e3a;
    color: #fff;
    font-size: 30px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.toggle-button:hover {
    opacity: 0.8;
}
/*++++++++  END  Chat Live +++++++++*/
