/* —— Base styles —— */
header .lang { max-height: inherit; overflow: inherit; }
header .lang:hover { }
header .lang a:hover { color: #fff; }
header .lang ul { padding-top: 0; }
header .lang a { padding: 0; }
#inquiry__form .-remark { width: 100%; }
.lang .wpml-ls-legacy-dropdown-click a { background: none; border: 0; }
.lang .wpml-ls-legacy-dropdown-click a:hover { background: none; }
.lang .wpml-ls-legacy-dropdown-click a:after { border: 0; background: url(../images/awfUK87fgbod.svg) no-repeat center center; height: 10px; width: 10px; top: calc(50% - 5px); right: 0; }
.lang .wpml-ls-legacy-dropdown-click .wpml-ls-flag+span { font-size: 0; position: relative;  }
.lang .wpml-ls-item-en > a span:before { position: absolute; content: "EN"; height: 100%; width: 100%; left: 10px; top: 4px; font-size: 1.3rem;  }
.lang .wpml-ls-legacy-dropdown-click a[lang="th"] span:before { position: absolute; content: "TH"; height: 100%; width: auto; left: 10px; top: 4px; font-size: 1.3rem; color: #000; }
.lang .wpml-ls-legacy-dropdown-click a[lang="en"] span:before { position: absolute; content: "EN"; height: 100%; width: auto; left: 10px; top: 4px; font-size: 1.3rem; color: #000; }

.lang .wpml-ls-item-en span[lang="th"]:before { position: absolute; content: "th"; height: 100%; width: auto; left: 10px; top: 4px; font-size: 1.3rem; }
.lang .wpml-ls-item-en > a img { display: none; }
.lang .wpml-ls-item-en > a:before { position: relative; content: ""; height: 21px; width: 20px; left: 0; top: 0; background: url(../images/WpitodVTd7Sd.svg) no-repeat center center; }
.wpml-ls-legacy-dropdown-click a:hover,
.wpml-ls-legacy-dropdown-click a:focus,
.wpml-ls-legacy-dropdown-click .wpml-ls-current-language:hover>a { background: none; color: #fff; }
.wpml-ls-legacy-dropdown-click .wpml-ls-flag { display: none; }
.lang .wpml-ls-item-th > a:before { position: relative; content: ""; height: 21px; width: 20px; left: 0; top: 0; background: url(../images/wpYJGzc0MegT.svg) no-repeat center center; }
.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu { border: 0; }
.wrap--inquiryloading .wrap { justify-content: flex-start; font-size: 1.4rem; }
#wrap__inquiry__form .formSuccess1 { border: 0; background: none; }
#wrap__inquiry__form .formSuccess1 p.p1 { padding-top: 15px; }
#wrap__inquiry__form .formSuccess1 p.p2 { font-family: "Butler", sans-serif; font-size: 2.8rem; font-weight: 400; text-transform: uppercase; }
#gdpr-cookie-message { display: none !important; }


:root { 
   --cl-bg-section2: #000; 
   --cl-tx-body:     #000; 
   --cl-tx-alink:    #000000; 
   --cl-tx-ahover:   #ee3a23; 
   --cl-white:       #fff; 
}


/* Filter buttons */
.filter-button-group { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: wrap; flex-flow: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 0 30px; }
.filter-button-group button { background: none; border: 0; border-top: 1px solid var(--cl-tx-body); border-bottom: 1px solid var(--cl-tx-body); color: var(--cl-tx-body); display: inline-block; width: auto; font-size: 1.6rem; height: 30px; margin: 0 7px; padding: 5px 10px; position: relative; margin-bottom: 15px; }
.filter-button-group button:hover { color: var(--cl-white); border-top: 1px solid var(--cl-tx-body); border-bottom: 1px solid var(--cl-tx-body); }
.filter-button-group button.active { color: var(--cl-white); }
.filter-button-group button:before { content: ""; z-index: -1; width: 100%; height: 0%; background: var(--cl-tx-body); bottom: 0; left: 0; position: absolute; -webkit-transition: height 250ms; transition: height 250ms; }
.filter-button-group button:hover:before,
.filter-button-group button.active:before { height: 100%; }

/* Gallery list */
.box_gallery-list .box { width: 20%; padding: 5px; position: relative; }
.box_gallery-list .box img { width: 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$alpha*100)"; filter: alpha(opacity=80); opacity: 0.8; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.box_gallery-list .box ._detail { position: absolute; top: 0; left: 10%; width: 80%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: center; color: var(--cl-white); z-index: 110; font-size: 1.6rem; line-height: 1.5; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.box_gallery-list .box a { display: block; border: 0; background-color: var(--cl-black); padding: 0; }
.box_gallery-list .box a:before { border: 1px solid rgba(255,255,255,0); z-index: 99; width: calc(100% - 2px); height: calc(100% - 2px); top: 0; left: 0; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
.box_gallery-list .box a:hover:before { border: 1px solid #fff; transform: scale(0.8); }
.box_gallery-list .box a:hover img { filter: alpha(opacity=30); opacity: 0.3; }
.box_gallery-list .box a:hover ._detail { filter: alpha(opacity=100); opacity: 1; }

/* Gallery grid */
.sty__gallery { display: grid; grid-template-columns: repeat(5,1fr); gap: 15px; grid-auto-flow: dense; padding-bottom: 120px; }
.sty__gallery.r2 { grid-auto-flow: dense; direction: rtl; }
.sty__gallery.loadac { padding-bottom: 60px; }
.sty__gallery .box.hidden { display: none; }
.sty__gallery .box a { background-color: #000; width: 100%; display: block; overflow: hidden; }
.sty__gallery .box img { display: block; width: 100%; aspect-ratio:1/1; object-fit: cover; opacity: 0.9; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.sty__gallery .box .text { position: absolute; bottom: 15px; left: 30px; right: 30px; }
.sty__gallery .box .detail { position: absolute; z-index:1; top:0; bottom:0; left:0; right:0; color: var(--cl-white); display: flex; justify-content: left; align-items: flex-end; text-shadow:0 0 3px rgba(0,0,0,0.5); transform: translateY(10px); opacity:0; padding:20px; text-align:left; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.sty__gallery .box:hover img { opacity:0.4; transform: scale(1.05); }
.sty__gallery .box:hover .detail { transform: translateY(0); opacity:1; }
.sty__gallery .box h3{ color: var(--cl-white); }

/* Featured box */
.sty__gallery .box:nth-child(1) { grid-row:2 span; grid-column:2 span; }
.sty__gallery .box:nth-child(1) .wrap__row1 { height:100%; padding:0; z-index: 2; position: relative; }
.sty__gallery .box:nth-child(1)::before { position:absolute; content:""; height:100%; width:100%; left:0; top:0; z-index:1; background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(255,255,255,0) 60%); }
.sty__gallery .box:nth-child(1) a { height:100%; }
.sty__gallery .box:nth-child(1) img { opacity:0.9; height:100%; aspect-ratio:auto; position:absolute; top:0; left:0; }
.sty__gallery .box:nth-child(1) .text { color: var(--cl-white); text-transform: uppercase; left:20px; right:20px; bottom:60px; display:flex; justify-content:center; z-index:2; text-align: center; }
.sty__gallery .box:nth-child(1) .text h3 { text-align: center; }
.sty__gallery .box:nth-child(1) .detail { text-align:center; justify-content:center; }
.sty__gallery .box:nth-child(1) a:hover img { filter: grayscale(0); }



/* Load-more link */
.wrap__linkmoregallery { display: none; }
.loadac + .wrap__linkmoregallery { display:flex; padding-bottom:120px;   justify-content: center; }
.loadac.r2 + .wrap__linkmoregallery {  justify-content: center; }

/* Fancybox */
.fancybox-container ._title { text-transform: uppercase; color: var(--cl-white); font-size: 17px; }
.fancybox-container .fancybox-slide--image { padding: 40px 20px 80px; }
.fancybox-container .fancybox-navigation .fancybox-button { border: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; outline: none; }
.fancybox-button:hover { background-color: var(--cl-bg-section2); }
.fancybox-thumbs__list a { position: relative; }
.fancybox-thumbs__list a::before { border: 0; }
.fancybox-thumbs__list a::after { position:absolute; content:""; height:100%; width:100%; left:0; top:0; background-color:#000; z-index:10; opacity:0.65; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.fancybox-thumbs__list a.fancybox-thumbs-active::after,
.fancybox-thumbs__list a:hover::after { opacity: 0; }

.gallery__page .fancybox-caption__body .title h4{ color: var(--cl-white); font-size: 3rem; text-align: center; margin: 0; }


/* Button links */
.btn__h-booknow { position: relative; color: var(--cl-tx-alink); }
.btn__h-booknow:before { position: absolute; content:""; height:1px; width:100%; left:0; bottom:0; background: var(--cl-tx-alink); -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.btn__h-booknow:hover::before { transform: scaleX(0); }
.btn__h-booknow:hover { color: var(--cl-tx-ahover); }
.a__link,
.sty__tab-content #tab_content .tab-nav ul.nav-tabs a,
.detail a,
.detail-cms a { position: relative; color: var(--cl-tx-alink); }
.a__link:before,
.sty__tab-content #tab_content .tab-nav ul.nav-tabs a:before,
.detail a:before,
.detail-cms a:before { position:absolute; content:""; height:1px; width:100%; left:0; bottom:0; background: var(--cl-tx-alink); -webkit-transition: all 0.6s ease; transition: all 0.6s ease; transform: scaleX(0); }
.a__link:hover::before,
.sty__tab-content #tab_content .tab-nav ul.nav-tabs a:hover::before,
.detail a:hover::before,
.detail-cms a:hover::before { transform: scaleX(1); }
.a__link:hover,
.sty__tab-content #tab_content .tab-nav ul.nav-tabs a:hover,
.detail a:hover,
.detail-cms a:hover { color: var(--cl-tx-ahover); }

/* Load more gallery link variants */
.sdty__slidefullright .photo a .act_link .a,
.a__line,
div.loadac + .wrap__linkmoregallery .a__loadmore,
div.loadac.r2 + .wrap__linkmoregallery .a__loadmore { display:inline; text-transform: uppercase; color: var(--cl-tx-body); font-size: 1.5rem; position:relative; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; }
.sdty__slidefullright .photo a .act_link .a::before,
.a__line::before,
div.loadac + .wrap__linkmoregallery .a__loadmore::before,
div.loadac.r2 + .wrap__linkmoregallery .a__loadmore::before { position:absolute; content:""; height:1px; width:100%; left:0; bottom:0px; -webkit-transition: transform 0.6s ease; transition: transform 0.6s ease; background-color: var(--cl-tx-body); transform: scaleX(1); }
.sdty__slidefullright .photo a .act_link .a:hover,
.a__line:hover,
div.loadac + .wrap__linkmoregallery .a__loadmore:hover,
div.loadac.r2 + .wrap__linkmoregallery .a__loadmore:hover { color: var(--cl-tx-alink); }
.sdty__slidefullright .photo a .act_link .a:hover::before,
.a__line:hover::before,
div.loadac + .wrap__linkmoregallery .a__loadmore:hover::before,
div.loadac.r2 + .wrap__linkmoregallery .a__loadmore:hover::before { transform: scaleX(0); }

/* Sub-menu */
/* header .col3 > ul > li{ position: relative; }
header .menu > ul > li .sub-menu{ position: absolute; top: 100%; left: 0; background: var(--cl-white); padding: 8px 0; min-width: 180px; box-shadow: 0 2px 6px rgba(0,0,0,0.2); display: none; z-index: 1000; }
header .menu > ul > li:hover .sub-menu{ display: block; }
header .menu > ul > li .sub-menu li{ text-align: left; line-height: 1.4; }
header .menu > ul > li .sub-menu a{ padding: 5px 15px; font-size: .8em; display: block; } */

/* —— Media Queries —— */
@media screen and (max-width: 1200px) { 
   .sty__gallery .box:nth-child(1) .text h3{ font-size: 3rem; }
   }

@media screen and (max-width: 1024px) {
      .sty__gallery .box .text { font-size: 2.6rem; }
      .sty__gallery .box .detail { padding: 15px; }
   }
   
@media screen and (max-width: 880px) {
      .sty__gallery .box:nth-child(1) .text h3 { font-size: 2.2rem; }
   }
   
@media screen and (max-width: 768px) {
      .sty__gallery { grid-gap: 10px; }
      .sty__gallery .box .text { font-size: 2rem; }
      .sty__gallery .box .detail { font-size: 0.9em; }
      .sty__gallery .box:nth-child(1) .text { top: 60px; align-items: center; text-align: center; }
      .sty__gallery.loadac { padding-bottom: 30px; }
   }
   
@media screen and (max-width: 650px) {
      .sty__gallery { grid-template-columns: repeat(4,1fr); }
      .sty__gallery .box:nth-child(1) { grid-row: 3 span; }
   }
   
@media screen and (max-width: 480px) {
      .sty__gallery { padding-bottom: 60px; gap: 5px;  }
      .sty__gallery .box img { height: 20vw; }
      .sty__gallery .box:nth-child(1) { grid-row: 2 span; }
      .sty__gallery .box:nth-child(4), .sty__gallery .box:nth-child(6) { grid-column: 2 span; }
      .sty__gallery.loadac { padding-bottom: 30px; }
      .loadac + .wrap__linkmoregallery { padding-bottom: 40px; }
      .loadac.r2 + .wrap__linkmoregallery { text-align: right; }
      
   }
   
@media screen and (max-width: 430px) {
      .sty__gallery { gap: 5px; grid-template-columns: repeat(3,1fr); }
      .sty__gallery .box img { height: 30vw; }
      .sty__gallery .box:nth-child(4), .sty__gallery .box:nth-child(6) { grid-column: auto; }
      .sty__gallery .box:nth-child(4), .sty__gallery .box:nth-child(7) { grid-column: 2 span; }
   }
   
@media screen and (min-width: 480px) {
      .fancybox-container ._title { font-size: calc(17px + 3*(100vw - 480px)/544); }
   }
   
@media screen and (min-width: 1024px) {
      .fancybox-container ._title { font-size: 20px; }
   }
 

/* # Video
================================================== */
.sty__video-display { position: relative; z-index: 5; }
.sty__video-display:before { position: absolute; content: ""; height: 340px; width: 100%; left: 0; top: 0; background: url(../images/qnrmyx4kWCjE.png) repeat-x top; z-index: 2000; }
.sty__video-display #video-container, 
.sty__video-display video { width: 100%; height: 100vh; object-fit: cover; }
.sty__video-display.hide { opacity: 0; z-index: -1; }
.sty__video-controls { position: absolute; z-index: 50; bottom: 80px; right: 120px; display: flex; flex-direction: row; justify-content: flex-end; column-gap: 10px; }
.sty__video-controls i { width: 35px; height: 35px; display: block; cursor: pointer; background-size: 50% auto; background-repeat: no-repeat; background-position: center center; border: 1px solid rgba(255, 255, 255, 0.3); padding: 5px; border-radius: 50%; }
.sty__video-controls .hide { display: none; }
.sty__video-controls .icon--gallery { background-image: url(../images/m2pY2zh43x8P.svg); }
.sty__video-controls .icon--video { background-image: url(../images/eQRTDrxV4qiz.svg); left: 2px; position: relative; width: 35px; height: 35px; }
.sty__video-controls .icon--pause { background-image: url(../images/F5byXm1T9aME.svg); background-size: 20px auto; }
.sty__video-controls .icon--sound { background-image: url(../images/ioYTyKilXO21.svg); }
.sty__video-controls .btn__video-mute { position: relative; }
.sty__video-controls .btn__video-mute:before { position: absolute; content: ""; height: 1px; width: 120%; left: -10%; top: 50%; background-color: #fff; transform: rotate(45deg); }
.sty__video-controls .btn__video-mute.sound-on:before { background-color: inherit; }
.sty__video-controls .btn__video-play.play .icon--pause { background-image: url(../images/eQRTDrxV4qiz.svg); }
.sty__video-controls .btn__video-switch { text-align: center; color: #fff; display: flex; flex-direction: column; align-items: center; cursor: pointer; }
.sty__video-controls .btn__video-switch span { font-size: 16px; color: #fff; }
.sty__video-controls .btn__video-switch.hide { display: none; }
.sty__video-controls .btn__video-switch .wrap { display: flex; height: 50px; width: 50px;  border-radius: 50%; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 0px; }
.wrap__mainslide.sty-slider__mainslide-with-video { position: absolute; top: 0; left: 0; width: 100%; bottom: 0; z-index: 0; opacity: 0; }    
.wrap__mainslide.sty-slider__mainslide-with-video.show { opacity: 1; z-index: 5; }  


@media screen and (max-width: 1320px) { 
   .sty__video-controls{ right: 60px; }
   }
@media screen and (max-width: 1024px) { 
   .sty__video-controls{ bottom: 60px; }
   }

@media screen and (max-width: 900px) { 
   /* .sty__video-controls:has(.btn__slide-switch.hide) { right: 30px; } */
   }

@media screen and (max-width: 800px) { 
   .sty__video-controls{ right: 30px; bottom: 40px; }
   }

  

@media screen and (max-width: 767px) { 
   .sty__video-controls { bottom: auto; top: 200px; right: 40px; }
   .sty__video-controls:has(.btn__slide-switch.hide){ right: calc(50% - 50px); top: 300px; }
   .sty__video-controls:has(.btn__slide-switch.hide) .btn__video-switch{ width: 100px; }
   }

@media screen and (max-width: 650px) { 
   header .col2{ text-align: left; }
   .btn__mobilemenu{ right: 40px; }
   }

@media screen and (max-width: 560px) {
   .sty__video-controls{ top: 150px;}
   }

@media screen and (max-width: 480px) {
   .sty__video-controls{ right: 30px; }
   }

@media screen and (max-width: 430px) { 
   .sty__video-controls:has(.btn__slide-switch.hide){ top: 36vh; }
   }

.officecontact {
	margin-top:1rem;
}