@font-face {
font-family: 'LayijiMahaniyomV105';
src: 
url('./font/LayijiMahaniyomV105.ttf');
src: 
url('./font/LayijiMahaniyomV105.eot?') format('embedded-opentype'),
url('./font/LayijiMahaniyomV105.woff') format('woff'),
url('./font/LayijiMahaniyomV105.ttf') format('truetype');
}

/* Final visual polish */
.modern-change-strip {
	position: sticky !important;
	top: 0 !important;
	z-index: 1000 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	background: #0f2f46 !important;
	color: #fff !important;
	min-height: 56px !important;
	padding: 8px 16px !important;
	font: 700 16px/1.45 Tahoma, Arial, sans-serif !important;
	box-shadow: 0 8px 22px rgba(15, 47, 70, .18) !important;
}

.modern-change-strip a {
	margin-left: 0 !important;
	padding: 8px 12px !important;
	border-radius: 8px !important;
	color: #fff !important;
	text-decoration: none !important;
}

.modern-hero {
	min-height: 380px !important;
}

.modern-hero__inner {
	padding: 46px 0 58px !important;
}

.modern-eyebrow {
	background: rgba(255, 255, 255, .18) !important;
}

.modern-nav-shell {
	position: relative !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

#menu {
	justify-content: center !important;
}

#menu .child {
	display: none !important;
}

body > table:not(.old-site-header) {
	max-width: 1060px !important;
	border-radius: 8px !important;
}

body > table:not(.old-site-header):first-of-type {
	margin-top: 28px !important;
}

.sticky-contact-bar {
	display: none !important;
}

@media screen and (max-width: 768px) {
	.modern-change-strip {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		text-align: center !important;
		font-size: 14px !important;
	}

	.modern-change-strip::before {
		content: "บริการรถรับจ้างขนของ 24 ชม.";
		grid-column: 1 / -1;
	}

	.modern-change-strip {
		color: transparent !important;
	}

	.modern-change-strip a {
		color: #fff !important;
		width: 100% !important;
		margin: 0 !important;
	}

	.modern-hero {
		min-height: 470px !important;
	}

	.sticky-contact-bar {
		display: flex !important;
	}
}

* {
  box-sizing: border-box;
}


.style1 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 36px;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}
.style2 {
	color: #FFFFFF;
	font-family: 'LayijiMahaniyomV105';
	font-size: 32px;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}
.style3 {
	color: #4267b2;
	font-family: 'LayijiMahaniyomV105';
	font-size: 32px;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}

.style15 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 34px;
	font-weight:normal;
	line-height: 100%;
}

.style99 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 38px;
	font-weight:900;
	line-height: 100%;
}

.style16 {
	color: #FF0000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 34px;
	font-weight:normal;
	line-height: 100%;
}
.style17 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 34px;
	font-weight:bold;
	line-height: 100%;
}
.style18 {
	color: #0000FF;
	font-size: 34px;
	font-family: 'LayijiMahaniyomV105';
	font-weight:normal;
	line-height: 100%;
}
.style19 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 38px;
	font-weight:normal;
	line-height: 100%;
}
.style20 {
	color: #0000FF;
	font-family: 'LayijiMahaniyomV105';
	font-size: 34px;
	font-weight:normal;
	line-height: 100%;
}
.style21 {
	color: #003300;
	font-size: 34px;
	font-family: 'LayijiMahaniyomV105';
	font-weight:normal;
	line-height: 100%;
}
.style22 {
	color: #003300;
	font-family: 'LayijiMahaniyomV105';
	font-size: 34px;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}

.style24 {
color: #000000;
font-family: 'LayijiMahaniyomV105';
	
font-size: 34px;
font-weight:normal;
line-height: 100%;

/* unvisited link */
a:link {
  color: green;
}







/* visited link */
a:visited {
  color: green;
}

/* mouse over link */
a:hover {
  color: red;
}

/* selected link */
a:active {
  color: yellow;
}

}



.myButton_cus {
 background-color:#44c767;
 -moz-border-radius:28px;
 -webkit-border-radius:28px;
 border-radius:28px;
 border:1px solid #18ab29;
 display:inline-block;
 cursor:pointer;
 color:#ffffff;
 font-family:Arial;
 font-size:30px;
 padding:11px 35px;
 text-decoration:none;
 text-shadow:0px 0px 0px #2f6627;
}
.myButton_cus:hover {
 background-color:#5cbf2a;
}
.myButton_cus:active {
 position:relative;
 top:1px;
}

.imgtransparent
{
opacity:1.0; 
filter:alpha(opacity=100); 
}
.imgtransparent:hover
{
opacity:0.4; 
filter:alpha(opacity=40); 
}


/* Dropdown Button */
.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
	text-decoration:none;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}

/** BASIC */

html, body {
	height: 100%;
	valign : top;
}

body {
	margin: 0px;
	padding: 0px;
	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	text-align: justify;
	color: #273840;
}

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 18px;
	text-transform: uppercase;
	line-height:15px;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	text-transform: uppercase;
	line-height:25px;
}

h2.bigger {
	font-size: 18px;
	text-transform: uppercase;
}

h3 {
	margin: 0px;
	padding: 0px;
	font-size: 44px;
	font-weight: bold;
	text-transform: uppercase;
}

p, ol, ul {
	margin-top: 0px;
}

.img1 {
	float: left;
	margin: 4px 15px 0px 0px;
	border: 2px solid #608B9F;
}

.hr1 {
	clear: both;
	margin-top: 10px 0px 10px 0px;
	border: 1px dashed #608B9F;
}

.hr1 hr {
	display: none;
}

/** WRAPPER */

#wrapper {
	width: 100%;
	height: 100%;
	min-height: 100%;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

html>body #wrapper {
	height: auto;
}

/** HEADER */

#header {
	
	margin-bottom: 0px;
	width: 99%;
	
}


#header h1 {
	margin: 0px;
	padding: 0px;
	font-size: 20px;
}

#header h2 {
	margin: 0px;
	padding: 0px;
	font-size: 18px;
	text-transform: lowercase;
}

/** MAIN-MENU */

#main-menu {
	margin: 0px 0px 0px 0px;
	/*background: #FFFFFF no-repeat center top;*/
	text-transform: uppercase;
}

#main-menu ul {
	height: 10px;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	/*background: transparent url(images/homepage02.gif) no-repeat center top;*/
	list-style: none;
	color: #C1A479;
}

#main-menu li {
	display: inline;
}

#main-menu a {
	padding: 10px 10px 10px 10px;
	/*background : #FFFFFF;*/
	text-decoration: none;
	font-weight: bold;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	text-transform: uppercase;
}

#main-menu .first a {
	/*background : #FFFFFF;*/
	
}

#main-menu ul {
}

/******************/




@media screen and (max-width: 320px) {
 /* Add your styles for devices with a maximum width of 320 */
	body {
	   background-color:#FF0000; /*???*/
	} 

}
 
@media screen and (max-width: 480px) {
 /* Add your styles for devices with a maximum width of 480 */
  body {
                   background-color:#FFFFFF; /*???*/
                } 
	
}
 
@media screen and (max-width: 768px) {
 /* Add your styles for devices with a maximum width of 768 */
  body {
                   background-color:#FFFF00; /*??????*/
                } 
	
	

}
 
@media screen and (max-width: 1024px) {
 /* Add your styles for devices with a maximum width of 1024 */
 body {
                   background-color:#FFFFFF; /*???*/
                } 
				.style1 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 260%;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}


.style3 {
	color: #4267b2;
	font-family: 'LayijiMahaniyomV105';
	font-size: 240%;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}

.style15 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	
	font-size: 240%;
	font-weight:normal;
	line-height: 100%;
}
.style16 {
	color: #FF0000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 240%;
	font-weight:normal;
	line-height: 100%;
}
.style17 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 240%;
	
	line-height: 100%;
}



.style18 {
	color:#FF0000;
	font-size: 340%;
	font-family: 'LayijiMahaniyomV105';
	font-weight:normal;
	line-height: 100%;
}
.style19 {
	color: #000000;
	font-family: 'LayijiMahaniyomV105';
	font-size: 240%;
	font-weight:normal;
	line-height: 100%;
}
.style21 {
	color: #003300;
	font-size: 240%;
	font-family: 'LayijiMahaniyomV105';
	font-weight:normal;
	line-height: 100%;
}
.style22 {
	color: #003300;
	font-family: 'LayijiMahaniyomV105';
	font-size: 240%;
	font-weight:normal;
	line-height: 100%;
	text-decoration:none;
}

.style23 {
	color: #000000;
	}
	
.style24 {
color: #000000;
font-family: 'LayijiMahaniyomV105';
	
font-size: 34px;
font-weight:normal;
line-height: 100%;
}

h4{
	margin-top : 10;
	margin-right : 0;
	margin-bottom : 0;
	margin-left : 0;
}

/* unvisited link */
a:link {
  color: green;
}

/* visited link */
a:visited {
  color: green;
}

/* mouse over link */
a:hover {
  color: red;
}

/* selected link */
a:active {
  color: yellow;
}

 


}

/* Modern service theme refresh */
:root {
	--brand-navy: #12324a;
	--brand-teal: #0f766e;
	--brand-green: #16a34a;
	--brand-orange: #f97316;
	--ink: #1f2937;
	--soft-bg: #f3f7fa;
	--line: #d8e2ea;
	--paper: #ffffff;
}

html { scroll-behavior: smooth; }

body {
	background: var(--soft-bg) !important;
	color: var(--ink);
	font-family: Tahoma, Arial, sans-serif;
	font-size: 18px;
	line-height: 1.75;
	text-align: left;
	padding-bottom: 78px;
}

a {
	color: var(--brand-teal);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

img {
	max-width: 100%;
	height: auto;
}

.old-site-header { display: none; }

.modern-hero {
	position: relative;
	min-height: 430px;
	display: flex;
	align-items: center;
	background:
		linear-gradient(90deg, rgba(8, 27, 42, .88), rgba(18, 50, 74, .68), rgba(18, 50, 74, .20)),
		url("https://xn--12ccascc1h1adc0hbab0n7bmh2a34b.com/image/Header.webp") center/cover no-repeat;
	color: #fff;
}

.modern-hero__inner {
	width: min(1120px, 92%);
	margin: 0 auto;
	padding: 56px 0 72px;
}

.modern-eyebrow {
	display: inline-flex;
	align-items: center;
	margin: 0 0 14px;
	padding: 7px 12px;
	border: 1px solid rgba(255, 255, 255, .38);
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	font-size: 15px;
	font-weight: 700;
	color: #fff;
}

.modern-hero h1 {
	max-width: 760px;
	margin: 0;
	color: #fff;
	font-size: clamp(34px, 5vw, 58px);
	line-height: 1.16;
	text-transform: none;
	letter-spacing: 0;
}

.modern-lead {
	max-width: 720px;
	margin: 18px 0 0;
	color: rgba(255, 255, 255, .92);
	font-size: clamp(18px, 2.2vw, 24px);
	line-height: 1.6;
}

.modern-actions,
.modern-trust {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}

.modern-btn,
.sticky-contact-bar a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 18px;
	border-radius: 8px;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.modern-btn--primary,
.sticky-call {
	background: var(--brand-orange);
	color: #fff !important;
}

.modern-btn--line,
.sticky-line {
	background: var(--brand-green);
	color: #fff !important;
}

.modern-trust span {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 7px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .92);
	color: var(--brand-navy);
	font-weight: 700;
}

.modern-nav-shell {
	position: sticky;
	top: 0;
	z-index: 40;
	height: auto !important;
	min-height: 58px;
	padding: 8px max(16px, 4vw) !important;
	border-bottom: 1px solid var(--line);
	box-shadow: 0 10px 28px rgba(18, 50, 74, .08);
}

#menu {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	margin: 0;
	padding: 0;
}

#menu li { list-style: none; }

#menu a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 9px 12px;
	border-radius: 8px;
	color: var(--brand-navy) !important;
	font: 700 16px/1.3 Tahoma, Arial, sans-serif;
	text-decoration: none;
	background: #fff;
}

#menu a:hover {
	background: #eaf4f2;
	color: var(--brand-teal) !important;
}

hr { display: none; }

body > table:not(.old-site-header) {
	width: min(1120px, 94%) !important;
	margin: 22px auto;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 8px;
	box-shadow: 0 16px 38px rgba(18, 50, 74, .07);
	overflow: hidden;
}

body > table:not(.old-site-header) td {
	padding: 16px;
	overflow-wrap: anywhere;
}

.style1,
.style2,
.style3,
.style15,
.style16,
.style17,
.style18,
.style19,
.style20,
.style21,
.style22,
.style24,
.style99 {
	font-family: Tahoma, Arial, sans-serif !important;
	line-height: 1.75 !important;
	letter-spacing: 0;
}

.style15,
.style19,
.style21,
.style22,
.style24 {
	color: var(--ink) !important;
	font-size: clamp(17px, 2vw, 22px) !important;
	font-weight: 400 !important;
}

.style16,
.style17,
.style18,
.style20,
.style99 {
	color: var(--brand-navy) !important;
	font-size: clamp(24px, 3vw, 36px) !important;
	font-weight: 800 !important;
	text-transform: none;
}

h1,
h2,
h3,
h4 {
	color: var(--brand-navy);
	text-transform: none;
	line-height: 1.35;
	letter-spacing: 0;
}

h1 {
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.25;
}

h2,
h3 {
	font-size: clamp(24px, 3vw, 34px);
}

.imgsCar {
	width: min(760px, 92%) !important;
	display: block;
	margin: 14px auto;
	border-radius: 8px;
	box-shadow: 0 14px 30px rgba(18, 50, 74, .16);
}

td div[style*="background-color:#8cff66"] {
	width: min(520px, 90%) !important;
	margin: 8px auto 22px;
	padding: 10px 14px;
	border-radius: 8px !important;
	background: #e9f8ef !important;
	border: 1px solid #bce8ca;
}

.imgtransparent {
	transition: transform .2s ease, opacity .2s ease;
}

.imgtransparent:hover {
	opacity: .86;
	transform: translateY(-2px);
}

button,
.button,
.myButton_cus {
	border: 0;
	border-radius: 8px !important;
	background: var(--brand-teal) !important;
	color: #fff !important;
	box-shadow: 0 10px 24px rgba(15, 118, 110, .24);
	cursor: pointer;
}

#myBtnTop {
	position: fixed;
	right: 18px;
	bottom: 86px;
	z-index: 60;
	min-width: 52px;
	min-height: 44px;
}

.sticky-contact-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 80;
	display: flex;
	justify-content: center;
	gap: 10px;
	padding: 10px;
	background: rgba(255, 255, 255, .94);
	border-top: 1px solid var(--line);
	box-shadow: 0 -10px 28px rgba(18, 50, 74, .12);
}

.sticky-contact-bar a {
	width: min(260px, 46vw);
	min-height: 46px;
	padding: 10px 14px;
	box-shadow: none;
}

@media screen and (max-width: 768px) {
	body {
		background: var(--soft-bg) !important;
		font-size: 17px;
		line-height: 1.72;
	}

	.modern-hero {
		min-height: 520px;
		background:
			linear-gradient(180deg, rgba(8, 27, 42, .92), rgba(18, 50, 74, .74), rgba(18, 50, 74, .48)),
			url("https://xn--12ccascc1h1adc0hbab0n7bmh2a34b.com/image/Header.webp") center/cover no-repeat;
	}

	.modern-hero__inner {
		padding: 42px 0 70px;
	}

	.modern-actions {
		display: grid;
		grid-template-columns: 1fr;
	}

	.modern-btn {
		width: 100%;
	}

	.modern-nav-shell {
		position: relative;
	}

	#menu {
		display: grid;
		grid-template-columns: 1fr;
		gap: 6px;
	}

	#menu a {
		width: 100%;
		justify-content: center;
	}

	body > table:not(.old-site-header) {
		width: calc(100% - 20px) !important;
		margin: 14px auto;
	}

	body > table:not(.old-site-header) td {
		display: block;
		width: 100% !important;
		padding: 12px;
	}

	.style15,
	.style19,
	.style21,
	.style22,
	.style24 {
		font-size: 18px !important;
	}

	.style16,
	.style17,
	.style18,
	.style20,
	.style99 {
		font-size: 26px !important;
	}
}

/* Final visual polish override */
.modern-change-strip {
	position: sticky !important;
	top: 0 !important;
	z-index: 1000 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	background: #0f2f46 !important;
	color: #fff !important;
	min-height: 56px !important;
	padding: 8px 16px !important;
	font: 700 16px/1.45 Tahoma, Arial, sans-serif !important;
	box-shadow: 0 8px 22px rgba(15, 47, 70, .18) !important;
}

.modern-change-strip a {
	margin-left: 0 !important;
	padding: 8px 12px !important;
	border-radius: 8px !important;
	color: #fff !important;
	text-decoration: none !important;
}

.modern-hero {
	min-height: 380px !important;
}

.modern-hero__inner {
	padding: 46px 0 58px !important;
}

.modern-nav-shell {
	position: relative !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

#menu {
	justify-content: center !important;
}

#menu .child {
	display: none !important;
}

body > table:not(.old-site-header) {
	max-width: 1060px !important;
	border-radius: 8px !important;
}

.sticky-contact-bar {
	display: none !important;
}

@media screen and (max-width: 768px) {
	.modern-change-strip {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		text-align: center !important;
		font-size: 14px !important;
	}

	.modern-change-strip::before {
		content: "บริการรถรับจ้างขนของ 24 ชม.";
		grid-column: 1 / -1;
	}

	.modern-change-strip {
		color: transparent !important;
	}

	.modern-change-strip a {
		color: #fff !important;
		width: 100% !important;
		margin: 0 !important;
	}

	.modern-hero {
		min-height: 470px !important;
	}

	.sticky-contact-bar {
		display: flex !important;
	}
}
