body{font-family: "Noto Sans Thai"}
.site-header { background: #F2EFEA; border-bottom: 1px solid #e9ecef; position: fixed;top: 0;z-index: 5;opacity: 0.9;}
.logo-img { height: 48px; width: auto; }
.contact-phone { font-weight: 600; letter-spacing: 0.2px; }
#top-menu{background: #F2EFEA;}
/* HERO section */
.hero {
position: relative;
background: url('../img/warehouse-plan.jpg') center center/cover no-repeat;
height: 70vh;
display: flex;margin-top: 65px;
align-items: center;
justify-content: center;
color: #fff;
text-align: center;
}
.hero::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.2); /* Overlay ให้ข้อความชัดขึ้น */
}
.hero-content {
position: relative;
z-index: 1;
}
.hero-content h1 {
font-size: 2.5rem;opacity: 0.9;
font-weight: 700;background: #F2EFEA;color: #0B4876; padding: 10px;border-radius:5px;
}
#bar-text{padding: 10px 0; text-align:center; font-size: 1.6em;background: #2ECA7F;}
#main-content{padding-top: 25px; text-align:center;}
#main-content ul{ width: 50%; margin:auto;list-style:none;font-size: 1.4em;}
#main-img{text-align:center;}
#main-img img{width: 155px;float: left;margin: 2px;opacity: 0.8;}
#main-img img:hover{opacity: 1;cursor: pointer;}
#footer{background: #F2EFEA;height: 80px; padding-top: 20px;margin-top: 5px;}


.divider {
    position: relative;
    text-align: center;
    margin: 30px 0; 
  }

  /* เส้นทั้งสองข้าง */
  .divider::before,
  .divider::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 40%;           
    height: 2px;      
    background: #33b37a;     
    transform: translateY(-50%);
  }
  .divider::before { left: 0; }
  .divider::after  { right: 0; }

  /* ข้อความตรงกลาง */
  .divider span {
    display: inline-block;
    position: relative;
    padding: 0px 12px;       
    background: #FFF;    
    color: #33b37a;          
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.6px;
  }

#show-price{font-size: 1.8em;}
#show-map iframe{width: 95%;min-height: 350px;margin: auto; margin: 2px 0;}

.marquee {
  position: relative;
  overflow: hidden;        
  height: 50px;           
}

.marquee span {
  position: absolute;
  white-space: nowrap;     /* ไม่ตัดบรรทัด */
  display: inline-block;
  padding-left: 100%;     
  animation: marquee 12s linear infinite alternate;  
  font-weight: 600;
  color: #333;
}

@keyframes marquee {
  0%   { transform: translateX(0); }    
  100% { transform: translateX(-100%); }   
}

#footer-mobile{display: none;}
#footer-mobile a{color: #000;text-decoration: none;}
#show-doc{text-align:center;}
@media (max-width: 575.98px) {
		.contact-phone { font-size: 0.95rem; }
		.logo-img { height: 40px; }
		.hero {height: 60vh;margin-top: 62px;}
		.hero-content h1 { font-size: 1.6rem; }
		#main-content{padding-top: 25px; text-align:left;}
		#main-content ul{ width: 80%; margin:auto;list-style:square;font-size: 1.4em;padding: 0;}
		#main-img img{width: 24%;}
		#show-price{text-align:center;}
		.divider::before, .divider::after { width: 30%; }
		.divider span { padding: 0 12px; font-size: 1.4rem; }
		#show-map iframe{width: 100%;}
		#footer-mobile:hover{background-color: #FF4E7A;}
		#footer-mobile{
				  display: block;text-align:center;background-color: #0F4E7A;position: fixed; border-radius: 20px;font-size: 0.8em;
				  bottom: 30px;right: -20px;height: 45px; padding: 5px 0;width: 32%; opacity: 0.8;color: #FFF;height: 40px;
		}
		#footer-mobile a{color: #FFF;}
}