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



@font-face{
font-family:'superspace_light';
src:url(font/SuperspaceLight/SuperspaceLight.eot);
src:url("font/SuperspaceLight/SuperspaceLight.eot?#iefix") format("embedded-opentype"),
	  url("font/SuperspaceLight/SuperspaceLight.woff") format("woff"),
	  url("font/SuperspaceLight/SuperspaceLight.ttf") format("truetype"),
	  url("font/SuperspaceLight/SuperspaceLight.svg#adiNeueBold") format("svg");
	  font-weight:normal;font-style:normal;
}

@font-face{
font-family:'SuperspaceBold';
src:url(font/SuperspaceBold/SuperspaceBold.eot);
src:url("font/SuperspaceBold/SuperspaceBold.eot?#iefix") format("embedded-opentype"),
	  url("font/SuperspaceBold/SuperspaceBold.woff") format("woff"),
	  url("font/SuperspaceBold/SuperspaceBold.ttf") format("truetype"),
	  url("font/SuperspaceBold/SuperspaceBold.svg#adiNeueBold") format("svg");
	  font-weight:normal;font-style:normal;
}


@font-face{
font-family:'DBAdmanX';
src:url(font/DBAdmanX/DBAdmanX.eot);
src:url("font/DBAdmanX/DBAdmanX.eot?#iefix") format("embedded-opentype"),
	  url("font/DBAdmanX/DBAdmanX.woff") format("woff"),
	  url("font/DBAdmanX/DBAdmanX.ttf") format("truetype"),
	  url("font/DBAdmanX/DBAdmanX.svg#adiNeueBold") format("svg");
	  font-weight:normal;font-style:normal;
}


@font-face{
font-family:'DBHelvethaicaX';
src:url(font/DBHelvethaicaX/DB-Helvethaica-X-v3.2_3.eot);
src:url("font/DBHelvethaicaX/DB-Helvethaica-X-v3.2_3.eot?#iefix") format("embedded-opentype"),
	  url("font/DBHelvethaicaX/DB-Helvethaica-X-v3.2_3.woff") format("woff"),
	  url("font/DBHelvethaicaX/DB-Helvethaica-X-v3.2_3.ttf") format("truetype"),
	  url("font/DBHelvethaicaX/DB-Helvethaica-X-v3.2_3.svg#adiNeueBold") format("svg");
	  font-weight:normal;font-style:normal;
}




@font-face{
font-family:'supermarket';
src:url(font/supermarket/supermarket.eot);
src:url("font/supermarket/supermarket.eot?#iefix") format("embedded-opentype"),
	  url("font/supermarket/supermarket.woff") format("woff"),
	  url("font/supermarket/supermarket.ttf") format("truetype"),
	  url("font/supermarket/supermarket.svg#supermarket") format("svg");
	  font-weight:normal;font-style:normal;
}




body{
	margin:0px;
	font-family:'supermarket';
	font-size: 17px; line-height:120%;
	 color:#FFF;
	background:#939598;
	min-width:1000px;
}



a{
	
	color:#FFF;
}
a:link { text-decoration: none }
a:visited { text-decoration: none }
a:active {  text-decoration: none }
a:hover {
	color:#ccc;
	text-decoration: none;
}

a img:hover{
	opacity: .8;
	filter: alpha(opacity=80);
}

a img{
	border:0;
}

h1{
	font-size:38px; line-height:120%;
	padding-bottom:10px; color:#FFF; letter-spacing:2px;	
	background:url(../img/webpage/bg-title.jpg) bottom center no-repeat;	
}

.title{
	padding-top:40px;	
}


/* Loading Page */
div#loadPage{  
    position:fixed;  
    margin:auto;  
    left:0;  
    top:0;  
    width:100%;  
    height:100%;  
    color:#000;  
    background-color:#FFF;    
    z-index:500000000;  
    text-align:center;  
	opacity:0.7;
	padding-top:200px;
	vertical-align:middle;
	filter:alpha(opacity=70); /* For IE8 and earlier */
	display:none;

}  

.left{
	float:left;	
}

.right{
	float:right;	
}

.clear{
	clear:both;	
}

.style1{
	color:#f8d32a;	
}

.italic{
	font-style:italic;
}

.size40{
	font-size:36px; line-height:120%;	
}

.size30{
	font-size:30px; line-height:120%;	
}

.size24{
	font-size:24px; line-height:120%;	
}


.top10{
	margin-top:10px;	
}


.top20{
	margin-top:20px;	
}


.top30{
	margin-top:30px;	
}


.top40{
	margin-top:40px;	
}


.input_register{
	width:97%; 
	padding-left:3%;
	height:38px;
	font-size:16px; 
	background:#c2c2c2;
	font-family:'supermarket';
	color:#6c6c6c;
	border:0px;	
	resize:none;
	outline:none;
}


.area_register{
	width:98%; 
	padding-left:2%;
	height:38px;
	font-size:16px; 
	background:#c2c2c2;
	font-family:'supermarket';
	color:#6c6c6c;
	border:0px;	
	resize:none;
	outline:none;
}


.input_register::-webkit-input-placeholder ,.area_register::-webkit-input-placeholder {
	opacity: 1 !important;
		color:#6c6c6c;	
}
.input_register:-moz-placeholder ,.area_register::-moz-placeholder {
	opacity: 1 !important;
		color:#6c6c6c;	
}



.input_register_error{
	width:97%; 
	padding-left:3%;
	height:38px;
	font-size:16px; 
	background:#f8d32a;
	font-family:'supermarket';
	color:#fff;
	border:0px; resize:none;	
}



.input_register_error::-webkit-input-placeholder{
	opacity: 1 !important; color:#6c6c6c;
}
.input_register_error:-moz-placeholder {
	opacity: 1 !important; color:#6c6c6c;
} 

.input_register_error::-moz-placeholder{
	opacity: 1 !important; color:#6c6c6c;
}

.mobileshow{
	display:none;	
}

.webshow{
	
}

.bg_enter{
	background:#939598; padding-top:10px; padding-bottom:10px;
}


.header{
	width:94%; margin-left:auto; margin-right:auto;
	max-width:1054px;  border:0px #000 solid;
			
}

.fixe{
	position:fixed; top:0; width:100%; height:50px;
	background:#939598; z-index:99;
}

.header a{
color:#000000;	
}

.header li{
	display:inline-block; vertical-align:top;
	color:#000000; font-size:24px; margin-left:30px; margin-right:30px;
	padding-top:15px; padding-bottom:15px;	
}

.area_content{
	width:94%; margin-left:auto; margin-right:auto;
	max-width:1000px;  border:0px #F00 solid;	
}

.bg_concept{
	background:url(../img/webpage/bg-concept.jpg) top center no-repeat;
	width:100%; height:787px;	
}

.concept{
	width:100%; max-width:400px;
	color:#b4b5b4; font-size:16px; line-height:120%;
	padding-top:140px;	
}

.bg_detail{
	background:url(../img/webpage/bg-detail.jpg) top center no-repeat;
	width:100%; height:650px;	
}

.bg_detail .left{
	float:left; width:55%;
	padding-top:80px;
}

.bg_detail .right{
	float:right; width:40%;
	color:#ffffff;
	padding-top:80px;
}

.bg_location1{
	background:url(../img/webpage/bg-location1.png) top center no-repeat;
	background-color:#333;	
}

.bg_location2{
	background:url(../img/webpage/bg-location2.png) bottom center no-repeat;
	color:#FFF;	 padding-bottom:40px;
}

.bg_plan{
	background:url(../img/webpage/bg-plan.jpg) top center no-repeat;
	width:100%; height:801px;	
}

.menu-plan{
	color:#bababa; display:inline-block; vertical-align:top;
	margin-left:20px; margin-right:20px;
	font-size:20px; line-height:120%; margin-top:20px; padding-bottom:7px;
}

.menu-plan:hover ,.menu-plan-active{
	color:#bababa; display:inline-block; vertical-align:top;
	margin-left:20px; margin-right:20px;
	font-size:20px; line-height:120%;
	padding-bottom:5px; border-bottom:2px #bababa solid; margin-top:20px;
}

.plan{
	padding-top:50px;
}

.plan img{
	max-width:100%;
}

.bg_gallery{
	background:url(../img/webpage/bg-gallery.jpg) top center no-repeat;
	width:100%; height:956px;	
}

.bg_contact{
	background:url(../img/webpage/bg-contact.jpg) top center no-repeat;
	width:100%; 	
}

.area_contact{
	padding-top:50px; padding-bottom:20px;
	width:94%; margin-left:auto; margin-right:auto;
	max-width:1000px;  border:0px #F00 solid;	
}

.contact_L{
	float:left;
	width:28%; margin-left:4%; margin-right:4%;  margin-top:20px;	
} 

.contact_R{
	float:left; width:64%;
}

.label{
	float:left; width:48%; margin-top:20px;	
}

.label2{
		  margin-top:20px;	
}

.margin{
	margin-left:4%;	
}

.label_check{
	float:left; margin-left:40px;	
}

.bt_submit{
	float:right;
}

.footer{
	padding-top:60px;	
}

.footer a{
	color:#545454; margin-right:20px;	
}



.logo_foot{
	float:left; padding-left:40px;
		
}

.copyright{
	color:#727374; text-align:right;
	font-size:14px;
}	

.img_large{
	height:500px !important; 
}

.img_mini{
	width:80px !important; height:53px !important;	
}

#area_gallery{
	margin-top:40px; max-width:800px;	
}

@media screen and (max-width: 50em) {
body{
	min-width:300px;
	font-size: 12px;
	
}
	
	
.mobileshow{
	display:block;
}

.webshow{
	display:none;	
}	




.bg_menu{
	border:0px #000 solid;
	text-indent:1;
	background:#3a3b3d;	
	width:100%;
	position:absolute; z-index:9999;
}
	
	
.bg_menu_load{
	border:0px #000 solid;
	text-indent:1;
	background:#000000;	
	display:block;
	width:100%;
	position:fixed; z-index:9999;
}	

.menu_mobile{
	position:absolute; margin:10px;	
}
	
#menu_mobile{
	text-indent:1;
}	
	
#menu_mobile a{
	font-size:14px;
	color:#666;
}

#menu_mobile a:hover , #menu_mobile .active{
font-size:14px;
color:#000000;
}


.logo_mobile{
	padding:10px;
	 text-align:right;
}

h1{
	font-size:26px; line-height:120%;
	padding-bottom:10px; color:#FFF; letter-spacing:2px;	
	background:url(../img/webpage/mobile/bg-title.jpg) bottom center no-repeat;	
}

.title{
	padding-top:10px;	
}


.bg_concept{
	background:#232426;
	width:100%; height:auto;	
}

.concept{
	width:94%; margin-left:auto; margin-right:auto; max-width:400px;
	color:#b4b5b4; font-size:12px; line-height:120%;
	padding-top:30px; padding-bottom:30px;	
}

.absolute{
	position:absolute; text-align:center; width:100%;	
}

.area_content{
	width:100%; margin-left:auto; margin-right:auto;
	max-width:1000px;  border:0px #F00 solid;	
}

.concept .top40{
	margin-top:20px;	
}

.detail2{
	background:url(../img/webpage/mobile/bg-detail2.png) bottom left no-repeat;
	padding-bottom:30px;		
}

.bg_detail{
	background:url(../img/webpage/mobile/bg-detail.png) top center no-repeat;
	background-color:#939598;
	width:100%; height:auto; 
}

.bg_detail .left{
	float:none; width:94%; margin-left:auto; margin-right:auto;
	padding-top:40px;
}

.bg_detail .right{
	float:none; width:86%; margin-left:auto; margin-right:auto;
	padding-top:40px; 
}

.bg_location1{
	background:url(../img/webpage/mobile/bg-location1.png) top left no-repeat;
	background-color:#333;	
}

.bg_location2{
	background:url(../img/webpage/bg-location2.png) bottom center no-repeat;
	color:#FFF;	 padding-bottom:40px;
}

.bg_plan{
	background:url(../img/webpage/mobile/bg-plan.jpg) top right no-repeat;
	width:100%; height:auto;	
}


.menu-plan{
	color:#bababa; display:inline-block; vertical-align:top;
	margin-left:10px; margin-right:10px;
	font-size:16px; line-height:120%; margin-top:20px; padding-bottom:7px;
}

.menu-plan:hover ,.menu-plan-active{
	color:#bababa; display:inline-block; vertical-align:top;
	margin-left:10px; margin-right:10px;
	font-size:16px; line-height:120%;
	padding-bottom:5px; border-bottom:2px #bababa solid; margin-top:20px;
}



.plan{
	padding-top:0px; text-align:center;
}

.plan img{
	max-width:90%;
}

.bg_gallery{
	background:url(../img/webpage/mobile/bg-gallery.png) bottom left no-repeat;
	background-color:#555555;
	width:100%; height:auto; padding-bottom:40px;	
}

.bg_contact{
	background:url(../img/webpage/mobile/bg-contact.png) top left no-repeat;
	background-color:#939598;
	width:100%; 	
}

.area_contact{
	background:url(../img/webpage/mobile/bg-contact2.png) bottom right no-repeat;
	padding-top:20px; padding-bottom:0px;
	width:100%; margin-left:auto; margin-right:auto;
	max-width:1000px;  border:0px #F00 solid;	
}

.contact_L{
	float:none;
	width:92%; margin-left:4%; margin-right:4%;  margin-top:0px;	
} 

.contact_R{
	float:none;
	width:94%; margin-left:auto; margin-right:auto;  margin-top:20px;	
}

.label{
	float:left; width:100%; margin-top:20px;	
}

.label2{
		  margin-top:20px;	
}

.margin{
	margin-left:0%;	
}


.img_large{
	height:300px !important; 
}

.img_mini{
	width:80px !important; height:53px !important;	
}



.bt_submit{
	float:none; text-align:center;
	padding-top:30px; clear:both;
}

.footer{
	padding-top:10px; padding-bottom:10px; margin-top:40px;
	background:#f8d32a;	
}

.footer a{
	color:#545454; margin-right:20px;	
}



.logo_foot{
	float:none; padding:10px; text-align:center;
		
}

.copyright{
	color:#333333; text-align:center;
	font-size:12px;
}	

}