/*========================================================*/
/*========================================================*/
@font-face {
    font-family: supermarket;
    src: url('/fonts/supermarket.ttf');
}
@font-face {
    font-family: Arial;
    src: url('/fonts/Arial.ttf');
}
@font-face {
    font-family: Helvetica;
    src: url('/Helvetica.otf');
}

.font-supermarket{
	font-family: supermarket;
}
.font-Arial{
	font-family: Arial;
}
.font-Verdana{
	font-family: Verdana;
}
.font-Helvetica{
	font-family: Helvetica;
}
/*========================================================*/
/*========================================================*/
body {
	color: #6D6E70;
	font-family: Verdana;
	font-size: 12px;
	margin: 0px;
}
a {
	color: #959598;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.CLS {
	clear: both;
}
.cb{
	clear: both;
}
.hid{
	display:none;
}

.widht-1000{
	margin:auto;
	max-width:97.00000%;
}
.move_slow{
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	-ms-transition: all .3s ease;
	transition: all .3s ease;	
}


#TopMenu {
	background-color: #F7F7F9;
	z-index: auto;
	padding-top: 10px;
	height: auto;
}
#TopMenu .TMBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
}
#TopHead {
	background-color: #F7F7F9;
	padding-top: 5px;
	/*padding-bottom: 5px;*/
	z-index: 1;
}
#TopHead .THBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	overflow: auto;
}
#TopHead .THBox .THBoxL {
	float: left;
	margin-right: 10px;
}
#TopHead .THBox .THBoxR {
	float: right;
	padding-right: 5px;
	width: 550px;
}
.THBoxR .THLink {
	/*float: left;*/
}
.THBoxR .THLinkUser {
	margin-top: 5px;
	margin-bottom: 5px;
	text-align: right;
}



#TopHead2{
	max-width: 97.00000%;
	padding-top: 10px;
	margin-right: auto;
	padding-bottom: 10px;
	margin-left: auto;
}
#TopHead2 .THLink{
	vertical-align: middle;
	display: inline-block;
	margin-right: 10px;
}
#TopHead2 .THBoxL {
	/*float: left;*/
	vertical-align: middle;
	display: inline-block;
	width: 190px;
}
#TopHead2 .THBoxL form.FrmSearch {
	/*width: 172px;*/
	margin: 0px;
}
#TopHead2 .THBoxL form .TxtSearch {
	background-image: url(/images/search_bg.jpg);
	background-repeat: no-repeat;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin: 0px;
	height: 32px;
	float: left;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 5px;
}
#TopHead2 .THBoxL form .BtnSearch {
	height: 32px;
	width: 30px;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
}
#TopHead2 .THLinkUser{
	vertical-align: middle;
	display: inline-block;
	margin-right: 15px;
	margin-top: 7px;
	text-align: right;
	float: right;
}
#TopHead2 .BtnCart {
	width: 170px;
	vertical-align: middle;
	display: inline-block;	/*float: right;*/
	float: right;
}
#TopHead2 .BtnCart .BtnCartL {
	background-image: url(/images/cart.png);
	height: 30px;
	width: 30px;
	float: left;
}
#TopHead2 .BtnCart .BtnCartR {
	background-image: url(/images/cart.png);
	background-position: -100px;
	float: left;
	height: 30px;
	font-weight: bold;
	color: #FFF;
	padding-top: 5px;
	width: 140px;
}
#TopHead2 .BtnCart .BtnCartR a{
	color: #FFF;
}

#TopHead2 .THLinkUser .flage{
	display: inline-block;
	margin-right: 15px;
}



#HomeInto {
	background-color: #F7F7F9;
	margin-bottom: 10px;
	margin-top: 0px;
	/*overflow: hidden;*/
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 1px;
	padding-left: 0px;
	z-index: 0;
}
#HomeInto .HIBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	/*max-height: 360px;*/
}
#HIBox_Pro  {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	/*height: 100px;*/
}


#HomeNews {
	overflow:hidden;
	margin-bottom: 30px;
	margin-top: 30px;
}
#HomeNews .HNBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.NewsLogo {
	float: left;
	margin-top: 30px;
	margin-right: 10px;
	margin-left: 20px;
}
.NewsBoxHome  {
	/*float: left;*/
	display: inline-block;
	margin: 5px;
	/*width: 29%;*/
	width: 28%;
}
.NewsBoxHome img {
	/*width: 282px;*/
}


#HomeBox {
	background-color: #F7F7F9;
	overflow: hidden;
	padding-bottom: 30px;
	padding-top: 30px;
}
#HomeBox .HBBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.HBBoxL {
	display: inline-block;
	margin-top:10px;
	margin-bottom:10px;
}
.HBBoxL1 {
	float:left;
}
.HBBoxL1 h2 , .HBBoxL2 h2 , .HBBoxL3 h2{
	display: inline-block;
	vertical-align: middle;
	text-align: left;
}
.HBBoxL2 {
}
.HBBoxL3 {
	float:right;
}
.img_n_01 {
margin-right: 20px;
display: inline-block;
vertical-align: middle;
margin-right: 20px;
}
.img_n_02 {
	float: left;
}
.img_c_01 {
display: inline-block;
vertical-align: middle;
	margin-right: 20px;
}
.img_c_02 {
	float: left;
}
.img_cm_01 {
	float: left;
}
.img_cm_02 {
	float: left;
}


#Foot {
	background-color: #B2B2B2;
	overflow: visible;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666;
}
#Foot .FBox {
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	color: #E0E1E2;
	text-align: right;
}
#Foot .FBox a {
	color: #E0E1E2;
	text-decoration: none;
}

.MenuList {
	background-color: #B2B2B2;
	margin: 0px;
	overflow: visible;
	position: absolute;
}
.ColorFrame{
	margin: 5px;
	padding: 0px;
	float: left;
	height: 14px;
	width: 14px;
}
.ColorFrame img{
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;	
}
.Box_ShowHide{
	max-width: 97.00000%;
	margin-right: auto;
	margin-left: auto;
	height: 15px;
	
}
.banner_hide {
	width: 90px;
	text-align: right;
	cursor: pointer;
	float: right;
	background-image: url(/images/view_up.gif);
	background-repeat: no-repeat;
	height: 15px;
}
.banner_show {
	width: 90px;
	text-align: right;
	cursor: pointer;
	float: right;
	background-image: url(/images/view_down.gif);
	background-repeat: no-repeat;
	height: 15px;
}

#NwsNumpage {
	margin-top: 15px;
	margin-bottom: 15px;
	font-size: 16px;
	margin-right: 15px;
	overflow: hidden;
}
.PageNumBer  {
	float: right;
}
.PageNumBer a  {
	color:#6D6E70;
}
.PageNumBer span {
	color: #F00;
}
.socialwrapper {
	float: left;
	margin: 5px;
	width: 90px;
}
.socialwrapperIE {
	float: left;
	margin: 5px;
	width: 100px;
}
.totalview{
	background-color: #F7F7F9;
	text-align: center;
	padding: 5px;
	
}
#browserWarning {
	background-color: #FCDFA8;
	font-size: 14px;
	color: #000;
	font-weight: bold;
}









/*===เมนูด้านบน===*/
.tbx_bg_grey{
	background-color: #B2B2B2;
}
.tbx_bg_red{
	background-color: #E63831;
}
.tbx_bg_blue{
	background-color: #25AAE2;
}
.tbx_bg_yellow{
	background-color: #D8DF20;
}
.tbx_bg_orange{
	background-color: #F29B31;
}
#TopMenu .TMBox #TopHead .TopBox{
	max-width: 100%;
	/*background: #E63831; /* Old browsers */	/*background: -moz-linear-gradient(left,  #E63831 30%, #B2B2B2 30%); /* FF3.6+ */
	/*background: -webkit-gradient(linear, left top, right top, color-stop(30%,#E63831), color-stop(30%,#B2B2B2)); /* Chrome,Safari4+ */
	/*background: -webkit-linear-gradient(left,  #E63831 30%,#B2B2B2 30%); /* Chrome10+,Safari5.1+ */
	/*background: -o-linear-gradient(left,  #E63831 30%,#B2B2B2 30%); /* Opera 11.10+ */
	/*background: -ms-linear-gradient(left,  #E63831 30%,#B2B2B2 30%); /* IE10+ */
	/*background: linear-gradient(to right,  #E63831 30%,#B2B2B2 30%); /* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E63831', endColorstr='#B2B2B2',GradientType=1 ); /* IE6-9 */
}

#TopMenu .TMBox #TopHead .TopBox .tbx {
	height: 40px;
	width: 20%;
	float: left;
	text-align: center;
	border-right: 1px solid #FFF;
	
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
}
#TopMenu .TMBox #TopHead .TopBox .tbx0 {
	background-color: #E63831;
}
#TopMenu .TMBox #TopHead .TopBox .tbx0_XXXX {
	border-top: 40px solid  #B2B2B2;
	border-right: 20px solid transparent;
	height: 0px;
	margin-right:-20px;
}
#TopMenu .TMBox #TopHead .TopBox .tbx1 {
	background-color: #B2B2B2;
	/*-webkit-transform: skew(-25deg); 
	-moz-transform: skew(-25deg); 
	-o-transform: skew(-25deg);*/
}
#TopMenu .TMBox #TopHead .TopBox .tbx1.active {
	background-color: #0bb107;
}
#TopMenu .TMBox #TopHead .TopBox .tbx2 {
	background-color: #B2B2B2;
	/*-webkit-transform: skew(-25deg); 
	-moz-transform: skew(-25deg); 
	-o-transform: skew(-25deg);*/
}
#TopMenu .TMBox #TopHead .TopBox .tbx2.active {
	background-color: #25AAE2;
}
#TopMenu .TMBox #TopHead .TopBox .tbx3 {
	background-color: #B2B2B2;
	/*-webkit-transform: skew(-25deg); 
	-moz-transform: skew(-25deg); 
	-o-transform: skew(-25deg);*/
}
#TopMenu .TMBox #TopHead .TopBox .tbx3.active {
	background-color: #D8DF20;
}
#TopMenu .TMBox #TopHead .TopBox .tbx4 {
	background-color: #B2B2B2;
	/*border-bottom: 40px solid  #B2B2B2;
	border-left: 20px solid transparent;*/
	/*height: 0px;*/
	/*margin-left:-20px;
    width: -moz-calc(20% + 20px);
    width: -webkit-calc(20% + 20px);
    width: calc(20% + 20px);*/
}
#TopMenu .TMBox #TopHead .TopBox .tbx4.active {
	/*border-bottom: 40px solid  #F29B31;
	border-left: 20px solid transparent;*/
	/*height: 0px;*/
	/*margin-left:-20px;*/
}
#TopMenu .TMBox #TopHead .TopBox .txt{
	line-height: 40px;
	color: #FFF;
	text-align: center;
	width: 100%;
	font-size: 24px;
	display: block;
}
#TopMenu .TMBox #TopHead .TopBox a.txt:hover{
	/*text-decoration: none;*/
}
#TopMenu .TMBox #TopHead .TopBox .tbx1 .txt , #TopMenu .TMBox #TopHead .TopBox .tbx2 .txt , #TopMenu .TMBox #TopHead .TopBox .tbx3 .txt{
	font-family: Helvetica;
	/*-webkit-transform: skew(25deg); 
	-moz-transform: skew(25deg); 
	-o-transform: skew(25deg);*/
}
#TopMenu .TMBox .flage {
	text-align: right;
	max-width: 100%;
}
#TopMenu .TMBox .flage img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 5px;
	display: inline-block;
	vertical-align: middle;
}
#TopMenu #TopHead2 .THLinkUser .flage img {
	border-bottom-width: 2px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-bottom-color: #F00;
	padding-bottom: 1px;
	vertical-align: middle;
	display: inline-block;
}
#TopMenu #TopHead2 .THLinkUser .flage img.grayscale {
	border-bottom-width: 2px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-bottom-color: #FFF;
	padding-bottom: 1px;
	vertical-align: middle;
	display: inline-block;
}

.hid_menu{
	float: left;
	margin-left: 2px;
	cursor: pointer;
	display:none;
}

.HmNews{
	max-width: 97.00000%;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 20px;
	padding-bottom: 20px;
	/*background-color: #000;*/
	color: #666;
}
.HmNews h2{
font-size: 18px;
margin: 0px;
font-weight: normal;
padding: 0px;
width: 100%;
line-height: 20px;
}
.HmNews h2:after{
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(40%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
	margin-left: 10px;
	content: ' ';
	height: 3px;
	top: 20px;
	width: 60%;
	position: absolute;
}
.HmNews .HmNwL{
	float: left;
	width: 60%;
}
.HmNews .HmNwL .Bx , .HmNews .HmNwR .Bx{
	padding: 10px;
	position: relative;
}
.HmNews .HmNwL .Bx .BxNwPro .pro{
	text-align: center;
	display: block;
	float: left;
	width: 33%;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-left: 0px;
	margin-bottom: 20px;
}
.HmNews .HmNwL .Bx .BxNwPro , .HmNews .HmNwR .Bx .BxNwCtn{
	padding-top: 40px;
	padding-bottom: 20px;
	font-size: 16px;
}
.HmNews .HmNwR .Bx .BxNwCtn{
	max-height: 200px;
}
.HmNews .HmNwR .Bx .BxNwCtn .imgR{
	float: right;
	margin-bottom: 5px;
	margin-left: 5px;
	width: 40%;
}
.HmNews .HmNwR{
	float: left;
	width: 40%;
}







.display-1000 , .display-800 , .display-550 , .display-500{
	display:none;
}

/*==========STYLE_1000px===========*/
@media (max-width:1017px){
	.display-1000{display:block;}
	.hid-1000{display:none;}

	.NewsBoxHome{
		width: 31%;
	}
	.NewsBoxHome img{
		width:100%
	}
}

/*==========STYLE_800px===========*/
@media (max-width:817px){
	.display-800{display:block;}
	.hid-800{display:none;}
	
	.NewsBoxHome{
		width: 47%;
	}
	.HBBoxL{
		float:none;
	}

	/*===MENU-Home-Ablut-..........*/
	#TopHead2 .THLink{
	width: 100%;
    margin: 5px 0px;
    text-align: center;
	}
	.HmNews .HmNwL , .HmNews .HmNwR{
	float: none;
	width: 100%;
	}
}

/*==========STYLE_550px===========*/
@media (max-width:567px){
	.display-550{display:block;}
	.hid-550{display:none;}

	.NewsBoxHome{
		width: 95%;
	}
	.HBBoxL{
		float:none;
		width: 95%;
	}
	.img_n_01 , .img_n_02{
		float:none;
	}
	.img_c_01 , .img_c_02{
		float:none;
		margin-top:auto;
		display: inline-block;
		vertical-align: middle;
	}
	.img_cm_01 , .img_cm_02{
		float:none;
	}
	
	/*===MENU-Home-Ablut-..........*/
	#TopHead2{
	text-align: center;
	}
	#TopHead2 .THBoxL{
	width: 100%;
	text-align: center;
	margin: 5px 0px;
	}
	#TopHead2 .THBoxL form.FrmSearch{
		display: inline-block;
	}
	#TopHead2 .BtnCart{
	float: none;
	margin: 5px 0px;
	}
	#TopHead2 .THLinkUser{
	float: none;
	width: 100%;
	text-align: center;
	margin: 5px 0px;
	}
	
}

/*==========STYLE_500px===========*/
@media (max-width:517px){
	.display-500{display:block;}
	.hid-500{display:none;}

	#HIBox_Pro{
		display:none;
	}
	.Box_ShowHide{
		display:none;
	}
}

/*==========STYLE_450px===========*/
@media (max-width:467px){
.HmNews .HmNwL .Bx .BxNwPro .pro{
	width: 50%;
}
}