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

@media screen and (max-width:30em){ /*480px / 16px = 30em ขนาหน้าจอน้อยกว่า 480px*/  
/*Header
-----------------------------------------------------------------------------------------------------------*/
header {
	background:#0071be;
	width:100%;
	height:auto;
}
.main_header {
	width:100%;
	margin:auto;
}

.block_logo {
	width:97%;
	padding-left:3%;
	float: left;
	text-align:center;
}
.block_logo img {
	width:auto;
}
.block_seo {
	display:none;
}
.block_seo img {
	width:60%;
}
.block_phone_facebook {
	width:100%;
	padding-top:5%;
	float:none;
	text-align:center;
}
.block_phone {
	float:none;
	padding-left:0;
	width:100%;
}
.block_facebook_top {
	display:none;
}

/*Banner
-----------------------------------------------------------------------------------------------------------*/
.banner {
	width:100%;
	height: auto;
	background:url(../images/new/bg_banner_2.jpg) no-repeat center top;
}
.main_banner {
	width:100%;
	margin:auto;
	height: auto;
}
.block_name_company {
	padding-left:0px;
	padding-top:205;
	text-align:center;	
}

.block_name_company img {
	width:98%;
}

.block_inquiry {
	padding-left:0;
	padding-top:10%;
	width:86px;
	height:86px;
	display:none;
}
.block_inquiry  a{
	
	background: url(../images/new/inquiry.png);
    background-repeat: no-repeat;
    width:86px;
    height:86px;
    display: block;
    text-indent: -9999px;
	clear:both;
	outline: 0;
	 -webkit-transition:all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.block_inquiry a:hover {
    background-position: bottom;
}
.blcok_topic {
	margin-top:80%;
}
.block_ccorporate, .block_services, .block_job_opportunity {
	width:90%;
	height: auto;
	padding:5%;
	float:none;
	text-align:center;
	color:#FFF;
}
.block_ccorporate img, .block_services img, .block_job_opportunity img {
	width:50%;
}
.block_ccorporate p, .block_services p, .block_job_opportunity p {
	padding:0;
	margin-top:5%;
}

.block_ccorporate {
	background:url(../images/new/bg_corporate.png) repeat;
}
.block_services {
	background:url(../images/new/bg_services.png) repeat;
}
.block_job_opportunity {
	background:url(../images/new/bg_job.png) repeat;
}

/*Announcement
-----------------------------------------------------------------------------------------------------------*/
.block_announcement {
	width:90%;
	height: auto;
	background:#FFF;
	padding:0 5%
}
.block_announcement a {
	color:#3d92cc;
	text-decoration:none;
}
.block_announcement a:hover {
	color:#535353;
	text-decoration:none;
}

.title_announcement {
	padding:5%;
	text-align:center;
}
.block_annoiuncement_article {
	width:100%;
	padding:0%;

	float:none;
}
.block_annoiuncement_date {
	width:30%;
	height: auto;
	padding:5px;
	background:#3d92cc;
	color:#FFF;
	float:left;
	text-align:right;
}
.block_annoiuncement_date  p {
	padding-bottom:10px; 
}
.block_annoiuncement_date .month {
	font-size:36px;
	font-weight:bold;
}

.block_annoiuncement_text {
	width:60%;
	padding-left:5%;
	float:left;
	font-size:12px;
	padding-bottom:10%
}

/*Web Creative
-----------------------------------------------------------------------------------------------------------*/
.web_creative {
	width:90%;
	padding:0 5%;
	margin:auto;
	
}

.web_creative img {
	width:100%;
	height:auto;
}

.web_creative_left {
	width:100%;
	float:none;
}
.web_creative_right {
	width:100%;
	float:none;
	position:relative;
}

.web_creative_1 {
	display:none;
}

.web_creative_2 {
	z-index:7777;
	position: relative;
    padding:3%;
	border:1px solid #CCC;
	margin-bottom:5%;
}
.web_creative_2 img {
	width:100%;
}



/*About Us
-----------------------------------------------------------------------------------------------------------*/
.block_about_us {
	width:90%;
	background:#6babd6 ;
	height: auto;
	padding:0 5%;
}
.main_about_us {
	width:100%;
	margin:auto;
	padding-top:10%;
}
.about_us_left {
	width:100%;
	float:none;
	font-size:16px;
	color:#FFF;
}
.about_us_right {
	width:100%;
	text-align:center;
	padding:5% 0;
}
.about_us_right img {
	width:100%;
}

/*Contact Us
-----------------------------------------------------------------------------------------------------------*/
.block_contact_us {
	width:100%;
	background:#FFF;
	padding-bottom:30px;
}
.main_contact_us {
	width:90%;
	margin:auto;
	padding:10% 5% 0 5%;
	
}
.contact_us_left {
	width:100%;
	float:none;
}
.contact_us_right {
	width:100%;
	float:none;
	padding-top:10%;
}
.contact_us_right  img {
	width:100%;
}
.title_contact_us {
	margin-bottom:10px;
}

.contact_table {
	width:100%;
}
.contact_table th {
	width:90%;
	padding:3% 0;
	text-align:left;
	vertical-align:top;
	float:left;
}
.contact_table td {
	width:100%;
	padding:0;
	float:left;
}
.text_filed {
	width:92%;
	padding:4%;
	border:1px solid #CCC;
}
.text_area {
	width:92%;
	height:50px;
	padding:4%;
	border:1px solid #CCC;
}
.block_btn{
	text-align: center;
}



/*Footer
-----------------------------------------------------------------------------------------------------------*/
footer {
	background:#0071be;
	height: auto;
	color:#FFF;
}
.main_footer {
	width:100%;
	margin:auto;
}
.footer_left {
	width:100%;
	float:none;
}
.block_logo_footer {
	display:none;
}
.block_copyright  {
	margin-top:0;
	text-align:center;
	padding:10% 5%; 
}
.footer_right {
	width:100%;
	float:none;
}
.block_facebook {
	display:none;
	text-align:one;
	margin-top:25px;
}
.nav_footer {
	display:none;
}

}


@media screen and (max-width:48em) and (min-width:30em){

/*Header
-----------------------------------------------------------------------------------------------------------*/
header {
	background:#0071be;
	width:100%;
	height:auto;
}
.main_header {
	width:100%;
	margin:auto;
}

.block_logo {
	width:47%;
	padding-left:3%;
	float: left;
	text-align:lefft;
}
.block_logo img {
	width: auto;
}
.block_seo {
	width:50%;
	float: left;
	text-align:center;
	display:none;
}
.block_seo img {
	width:60%;
}
.block_phone_facebook {
	width:50%;
	padding-top:5%;
	float:left;
	text-align:right;
}
.block_phone {
	float:left;
	padding-left:0;
	padding-top:8%;
	padding-right:3%;
	width:97%;
}
.block_facebook_top {
	display:none;
}

/*Banner
-----------------------------------------------------------------------------------------------------------*/
.banner {
	width:100%;
	height: auto;
	background:url(../images/new/bg_banner_2.jpg) no-repeat center top;
}
.main_banner {
	width:100%;
	margin:auto;
	height: auto;
}
.block_name_company {
	padding-left:0px;
	padding-top:20%;
	text-align:center;
			
}

.block_name_company img {
	width: auto;
}

.block_inquiry {
	display:none;
	padding-left:0;
	padding-top:10%;
	width:86px;
	height:86px;
}
.block_inquiry  a{
	background: url(../images/new/inquiry.png);
    background-repeat: no-repeat;
    width:86px;
    height:86px;
    display: block;
    text-indent: -9999px;
	clear:both;
	outline: 0;
	 -webkit-transition:all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.block_inquiry a:hover {
    background-position: bottom;
}
.blcok_topic {
	margin-top:30%;
}
.block_ccorporate, .block_services, .block_job_opportunity {
	width:90%;
	height: auto;
	padding:5%;
	float:none;
	text-align:center;
	color:#FFF;
}
.block_ccorporate img, .block_services img, .block_job_opportunity img {
	width:50%;
}
.block_ccorporate p, .block_services p, .block_job_opportunity p {
	padding:0;
	margin-top:5%;
}

.block_ccorporate {
	background:url(../images/new/bg_corporate.png) repeat;
}
.block_services {
	background:url(../images/new/bg_services.png) repeat;
}
.block_job_opportunity {
	background:url(../images/new/bg_job.png) repeat;
}

/*Announcement
-----------------------------------------------------------------------------------------------------------*/
.block_announcement {
	width:90%;
	height: auto;
	background:#FFF;
	padding:0 5%
}
.block_announcement a {
	color:#3d92cc;
	text-decoration:none;
}
.block_announcement a:hover {
	color:#535353;
	text-decoration:none;
}

.title_announcement {
	padding:5%;
	text-align:center;
}
.block_annoiuncement_article {
	width:100%;
	padding:0%;

	float:none;
}
.block_annoiuncement_date {
	width:30%;
	height: auto;
	padding:5px;
	background:#3d92cc;
	color:#FFF;
	float:left;
	text-align:right;
}
.block_annoiuncement_date  p {
	padding-bottom:10px; 
}
.block_annoiuncement_date .month {
	font-size:36px;
	font-weight:bold;
}

.block_annoiuncement_text {
	width:60%;
	padding-left:5%;
	float:left;
	font-size:12px;
	padding-bottom:10%
}

/*Web Creative
-----------------------------------------------------------------------------------------------------------*/
.web_creative {
	width:90%;
	padding:0 5%;
	margin:auto;
}

.web_creative img {
	width:100%;
	height:auto;
}
.web_creative_left {
	width:100%;
	float:none;
}
.web_creative_right {
	width:100%;
	float:none;
	height:auto;
}

.web_creative_1 {
	display:none;
}

.web_creative_2 {
	z-index:7777;
	position: relative;
    padding:3%;
	border:1px solid #CCC;
	margin-bottom:5%;
}
.web_creative_2 img {
	width:100%;
}


/*About Us
-----------------------------------------------------------------------------------------------------------*/
.block_about_us {
	width:90%;
	background:#6babd6 ;
	height: auto;
	padding:0 5%;
}
.main_about_us {
	width:100%;
	margin:auto;
	padding-top:10%;
}
.about_us_left {
	width:100%;
	float:none;
	font-size:16px;
	color:#FFF;
}
.about_us_right {
	width:100%;
	text-align:center;
	padding:5% 0;
}
.about_us_right img {
	width:100%;
}

/*Contact Us
-----------------------------------------------------------------------------------------------------------*/
.block_contact_us {
	width:100%;
	background:#FFF;
	padding-bottom:30px;
}
.main_contact_us {
	width:90%;
	margin:auto;
	padding:10% 5% 0 5%;
	
}
.contact_us_left {
	width:100%;
	float:none;
}
.contact_us_right {
	width:100%;
	float:none;
	padding-top:10%;
}
.contact_us_right  img {
	width:100%;
}
.title_contact_us {
	margin-bottom:10px;
}

.contact_table {
	width:100%;
}
.contact_table th {
	width:90%;
	padding:3% 0;
	text-align:left;
	vertical-align:top;
	float:left;
}
.contact_table td {
	width:100%;
	padding:0;
	float:left;
}
.text_filed {
	width:96%;
	padding:2%;
	border:1px solid #CCC;
}
.text_area {
	width:96%;
	height:50px;
	padding:2%;
	border:1px solid #CCC;
}
.block_btn{
	text-align: center;
}


/*Footer
-----------------------------------------------------------------------------------------------------------*/
footer {
	background:#0071be;
	height: auto;
	color:#FFF;
}
.main_footer {
	width:100%;
	margin:auto;
}
.footer_left {
	width:100%;
	float:none;
}
.block_logo_footer {
	display:none;
}
.block_copyright  {
	margin-top:0;
	text-align:center;
	padding:10% 5%; 
}
.footer_right {
	width:100%;
	float:none;
}
.block_facebook {
	display:none;
	text-align:one;
	margin-top:25px;
}
.nav_footer {
	display:none;
}
}