@charset "utf-8";
/* CSS Document */

	#page{
		margin: 0;
		max-width: 100%;
		/*overflow: hidden;	*/
	}
	.clearfix { *display: inline-block; height: 1%; }
	header {
		z-index: 1501;
		position: fixed;
		width: 100%;
		height: 60px;
		left: 0;
		right: 0;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#00a5ff+0,0084ff+100 */
		 /* Old browsers */
		 /* FF3.6-15 */
		 /* Chrome10-25,Safari5.1-6 */
		 /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		 /* IE6-9 */
		transition: all 799ms cubic-bezier(0.740, 0.215, 0.125, 1.020);
		-webkit-transition-timing-function: cubic-bezier(0.740, 0.215, 0.125, 1);
		-webkit-transition-timing-function: cubic-bezier(0.740, 0.215, 0.125, 1.020);
		-moz-transition-timing-function: cubic-bezier(0.740, 0.215, 0.125, 1.020);
		-o-transition-timing-function: cubic-bezier(0.740, 0.215, 0.125, 1.020);
		transition-timing-function: cubic-bezier(0.740, 0.215, 0.125, 1.020);
		transition-delay: 0.06s;
	}
	@media (min-width: 768px) {
		header {
			width: 67px;
			height: 100%;
			background:background: rgba(0,183,226,1);
			background: -moz-linear-gradient(top, rgba(0,183,226,1) 0%, rgba(0,129,255,1) 100%);
			background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,183,226,1)), color-stop(100%, rgba(0,129,255,1)));
			/* background: -webkit-linear-gradient(top, rgba(0,183,226,1) 0%, rgba(0,129,255,1) 100%); */
			background: -o-linear-gradient(top, rgba(0,183,226,1) 0%, rgba(0,129,255,1) 100%);
			background: -ms-linear-gradient(top, rgba(0,183,226,1) 0%, rgba(0,129,255,1) 100%);
			/* background: linear-gradient(to bottom, rgba(0,183,226,1) 0%, rgba(0,129,255,1) 100%); */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7e2', endColorstr='#0081ff', GradientType=0 );
			background: #fff;
		}
		header.menu-is-open { 
			width: 480px; 
			transition-delay: 0s; 
		}
	}
	.shortcut-132-1{
		margin:0;
		padding:0;
		width: 67px;
		padding-top: 25px;
	}
	.shortcut-132-1 .menu{
		margin:0;
		padding:0;
		margin-top:52px;
		text-align:center;
	}
	.shortcut-132-1 .search{
		margin:0;
		padding:0;
		margin-top:20px;
		text-align:center;
	}
	.shortcut-132-1 .change-size{
		margin:0;
		padding:0;
		margin-top:20px;
		text-align:center;
	}
	.shortcut-132-1 .change-size .small{
		font: 16px/20px 'thaisanslite', Arial, sans-serif;
	}
	.shortcut-132-1 .change-size .medium{
		font: 24px/20px 'thaisanslite', Arial, sans-serif;
	}
	.shortcut-132-1 .change-size .big{
		font: 30px/20px 'thaisanslite', Arial, sans-serif;
	}
	.shortcut-132-1 .change-size a{
		color: #000;
	}
	.shortcut-132-1 .change-size a:hover{
		color:#f6ff00;
	}
	.shortcut-132-1 .change-size .text{
		margin-top: 8px;
		font-size:13px;
		line-height:20px;
		color: #000;
	}
	.shortcut-132-1 .language{
		margin:0;
		padding:0;
		margin-top:20px;
		text-align:center;
		position:relative;
	}
	.shortcut-132-1 .language a{
		color: #000;
	}
	.shortcut-132-1 .language a:hover{
		color:#f6ff00;
	}
	.shortcut-132-1 .language img{
		max-width:100%;
		height:auto;
	}
	.shortcut-132-1 .language .th{
		position: absolute;
		top: -8px;
		right: 8px;
		font: 24px/20px 'thaisanslite', Arial, sans-serif;
	}
	.shortcut-132-1 .language .en{
		position: absolute;
		top: -8px;
		right: 8px;
		font: 24px/20px 'thaisanslite', Arial, sans-serif;
	}
	
	.shortcut-132-1 .menu-bar{
		margin:0;
		padding:0;
		margin-top: 20px;
	}
	.shortcut-132-1 .menu-bar .icon{
		text-align:center;
	}
	.shortcut-132-1 .menu-bar .text{
		font-size:13px;
		line-height:20px;
		text-align:
		center;
	}
	.shortcut-132-1 .menu-bar .text a{
		color: #000;
	}
	.shortcut-132-1 .menu-bar .text a:hover{
		color:#f6ff00;
	}
	
	#header-and-body {
	width: 100%;
	margin-top: 60px;
/*	overflow: hidden;*/
	}
	
	@media (max-width: 374px) { 
	header{
		display:none;	
	}
	#header-and-body{
		margin-top:0px;	
	}
	 }
@media (min-width: 375px) and (max-width: 419px) { 
	header{
		display:none;	
	}
	#header-and-body{
		margin-top:0px;	
	}
 }
@media (min-width: 420px) and (max-width: 575px) { 
	header{
		display:none;	
	}
	#header-and-body{
		margin-top:0px;	
	}
 }
@media (min-width: 576px) and (max-width: 767px) {
	header{
		display:none;	
	}
	#header-and-body{
		margin-top:0px;	
	}	
	 }
@media (min-width: 768px) { 
	#header-and-body {
		margin-top: 0;
	}
	#header-and-body,
	#footer {
		width: calc(100% - 67px);
		margin-left: 67px;
	}
}