@charset "UTF-8";
/* CSS Document */
@font-face {
    font-family: 'db_helvethaicamon_x55_regular';
    src: url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.eot');
    src: url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.woff2') format('woff2'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.woff') format('woff'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
	background-color:#ddd;
	margin:0px; padding:0px;
	font-family: 'db_helvethaicamon_x55_regular'; color:#666;
	font-size:18px;
}
*:focus {
	outline:none !important;
}
img {
	border:0px;
	max-width: 100%;
	height: auto;
	vertical-align:text-bottom;	
}
h1 , h2 , h3 , h4 , h5 , h6 , p {
	margin:0px; padding:0px;
}
ul {
	margin:0px; padding:0px;
	list-style:none;
}
a {
	text-decoration:none;
	color:#666;@font-face {
    font-family: 'db_helvethaicamon_x55_regular';
    src: url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.eot');
    src: url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.woff2') format('woff2'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.woff') format('woff'),
         url('fonts/db_helvethaicamon/db_helvethaicamon_x_v3.2-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

}
a:hover {
	text-decoration:none;
	color:#000;
}
a:focus {
	color:#000;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
figure {
	margin:0px; padding:0px;
}
 textarea , select {
	-webkit-appearance: none;
	-webkit-border-radius: 0px;	
}
@-moz-document url-prefix() {
    select, select:-moz-focusring, select::-moz-focus-inner {
       color: transparent !important;
       text-shadow: 0 0 0 #000 !important;
       background-image: none !important;
       border:0;
    }
}

/***************************************************************************************************Css Default*/
.pageWhite {
	background-color:#fff;
}
.paragraph {
	overflow:hidden;
}

.paragraph20 {
	overflow:hidden; padding:20px;
}
.paragraph2020 {
	overflow:hidden; padding:20px;
}
.paragraphBottom20 {
	overflow:hidden; padding-bottom:20px;
}

.paragraphNone {
	overflow:inherit;
}
.clear {
	clear:both; float:none; font-size:0px;
}
.container {
	width:1200px; margin:0 auto; position:relative;
}

.headerMain {
	position:relative; height:72px; z-index:9; display:block;
}
.boxLogo {
	position:absolute; width:300px; left:0px; top:0px; display:block;
}
.boxLogoSmall {
	position:relative; text-align:center; padding:20px 0; display:none;
}
.pagemenuHeader {
	float:right; margin-top:25px;
}
.pagemenuHeader ul {
	text-align:left; letter-spacing:-4px;
}
.pagemenuHeader ul li {
	letter-spacing:0px; display:inline-block; border-left:1px solid #ddd;
}
.pagemenuHeader ul li:first-child {
	border-left:0px;
}
.pagemenuHeader ul li a {
	display:block; padding:0 10px; font-size:24px;
}
.pagemenuHeader ul li a:hover , .pagemenuHeader ul li a.active {
	text-decoration:underline;
}
.bt360 {
	float:right; width:70px; margin-top:13px; margin-left:10px;
}

.headerMobile {
	position:relative; display:none; z-index:999;
}
.boxLogoMobile {
	position:relative; text-align:center; padding:20px;
}
.pageMenuMobile {
	position:relative; background-color:#999;
}
.bt360Mobile {
	position:absolute; right:10px; top:-5px; z-index:99;
	width:60px; 
}

@media only screen and (min-width : 320px) and (max-width : 1199px) {
.container {
	width:auto; 
}
}
@media only screen and (min-width : 320px) and (max-width : 767px) {
.headerMobile {
	display:block;
}
.headerMain {
	display:none;
}
}
@media only screen and (min-width : 768px) and (max-width : 1199px) {
.boxLogo {
	display:none;
}
.boxLogoSmall {
	display:block;
}
.bt360 {
	float:none; width:50px; margin-top:0px; margin-left:0px;
	position:absolute; right:10px; top:0px;
}
.headerMain {
	height:auto;
}
.pagemenuHeader {
	float:none; padding-bottom:20px;
}
.pagemenuHeader ul {
	text-align:center;
}
.pagemenuHeader ul li a {
	font-size:20px;
}
}
.bgSlide {
	background-size:cover; background-position:center 50%;
}
.boxTextSlide {
	background-color:rgba(0,0,0,0.7); padding:20px; color:#fff; position:absolute; z-index:98; bottom:50px; right:0px;
}
@media only screen and (min-width : 320px) and (max-width : 479px) {
.boxTextSlide {
	position:relative; right:inherit; bottom:inherit; background-color:#000;
}
}
.footerMain {
	padding:20px 0;
}
.showconect {
	display:table; margin:0 auto; overflow:hidden;
}
.showconect ul {
	float:left; overflow:hidden;
}
.showconect ul li {
	float:left; margin:0 5px;
}
.showconect ul li a img {
	height:30px;
}
.showconect nav {
	float:left; margin:0 5px;
}
.showconect nav a {
	font-size:24px;
}
@media only screen and (min-width : 320px) and (max-width : 479px) {
.showconect ul {
	float:none; margin-bottom:10px;
}
.showconect nav {
	float:none;
}
.showconect nav a {
	font-size:18px;
}
}
.coppyright {
	text-align:center; font-size:14px; padding-top:20px;
}
.pageGray {
	padding:20px 0;
}
.pageTitle {
	font-size:30px; text-align:center; margin-bottom:20px; text-transform:uppercase; padding-bottom:20px;
	border-bottom:#999 2px solid;
}
.contactLeft {
	float:left; width:48%; font-size:20px; text-align:center;
}
.contactRight {
	float:right; width:48%; text-align:center;
}
.titleSubContact {
	font-size:28px; margin-bottom:10px;
}
@media only screen and (min-width : 320px) and (max-width : 767px) {
.contactLeft {
	margin:0 10px;
	float:none; width:auto; margin-bottom:10px; padding-bottom:10px; border-bottom:#999 1px solid;
}
.contactRight {
	padding:0 10px;
	float:none; width:auto; 
}


}

.boxMap {
	float:left; width:48%;
}
.boxMap a {
	display:table; margin:0 auto; width:60%;
}
.boxContactForm {
	float:right; width:48%;
}
.boxContactForm ul {
	padding:40px 60px;
}
.boxContactForm ul li {
	margin-bottom:10px;
}
.boxContactForm ul li label {
	float:left; width:28%; padding-top:8px; font-size:20px;
}
.boxContactForm ul li section {
	float:right; width:70%; 
}
.textfield {
	border-radius:30px; -moz-border-radius:30px; -ms-border-radius:30px; -o-border-radius:30px; -webkit-border-radius:30px;
	border:#ddd 1px solid; background-color:#fff;
}
.textfield input {
	width:94%; padding:0 3%; height:40px; border:0px; background-color:transparent; font-family: 'db_helvethaicamon_x55_regular'; font-size:18px;
}
.textArea {
	border:#ddd 1px solid; border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px; -webkit-border-radius:15px; background-color:#fff;
}
.textArea textarea {
	padding:5px 3%; min-width:94%; max-width:94%; height:100px;
	border:0px; background-color:transparent; font-family: 'db_helvethaicamon_x55_regular'; font-size:18px;
}
.buttonForm {
	display:table; margin:0 auto;
}
.buttonForm input {
	border-radius:10px;
	display:block; padding:5px 20px; text-transform:uppercase; font-size:20px; color:#fff;
	border:0px; background-color:#8c6239; cursor:pointer; font-family: 'db_helvethaicamon_x55_regular';
}

@media only screen and (min-width : 320px) and (max-width : 767px) {
.boxMap {
	float:none; width:auto;
}
.boxMap a {
	width:80%; max-width:480px;
}
.boxContactForm {
	float:none; width:auto;
}
.boxContactForm ul {
	padding:20px 20px;
}
}
@media only screen and (min-width : 768px) and (max-width : 1023px) {
.boxMap a {
	width:80%; max-width:480px;
}
.boxContactForm ul {
	padding:20px 20px;
}
	
}

.pageLinkRoom {
}
.pageLinkRoom ul {
	overflow:hidden;
}
.pageLinkRoom ul li {
	float:left; width:33.333334%;
	margin-bottom:20px;
}
@media only screen and (min-width : 320px) and (max-width : 479px) {
.pageLinkRoom ul li {
	width:auto; float:none;
}
}
@media only screen and (min-width : 480px) and (max-width : 767px) {
.pageLinkRoom ul li {
	width:50%;
}
}
.pageLinkRoom ul li a {
	display:block;
	padding:0 10px;
}
.pageLinkRoom ul li a figure img {
	background-size:cover; background-position:center 50%;
}
.pageLinkRoom ul li a article {
	text-align:center; padding-top:10px; font-size:24px; text-transform:uppercase;
}


.galleryBox {
}
.galleryBox ul {
	text-align:center; letter-spacing:-4px;
}
.galleryBox ul li {
	width:25%; letter-spacing:0px; display:inline-block;
}
.galleryBox ul li a {
	display:block; padding:5px;
}
.galleryBox ul li a img {
	background-position:center 50%; background-size:cover;
}