html,body {padding:0;margin:0;width:100%;height:100%}
* {box-sizing:border-box}
body {background:#fff;color:#000;font-family:'Anuphan',Tahoma,Arial,sans-serif;font-size:18px}
a,a:hover,a:focus,a:active {text-decoration:none;color:#08293a;transition:.2s all}
h1,h2,h3,h4,h5,h6 {font-weight:700}
pre {white-space:pre;tab-size:24px}

/* ===== Menu TBL ===== */
.topfixed {width:100%;margin:0 auto;background:#08293a}
.topmenu {width:calc(100% - 64px - 4vw);margin:0 auto;max-width:1800px;color:#fff;border-spacing:0;border-collapse:collapse}
.topmenu a {color:#f5f5f5}
.topmenu img {display:inline-block;height:20px;width:20px;width:auto}
.topmenu td {vertical-align:middle;white-space:nowrap;font-size:14px;padding:4px}
.topmenu .ticon {width:40px;text-align:right}
.topmenu .ticon:first-child {width:48px}
.topmenu .ttxt {width:2%;padding-right:24px}
.topmenu .tsocial {text-align:right;padding-right:24px}
.topmenu .tsocial img {height:22px;width:22px;margin-left:24px}

.topfixed2 {width:100%;margin:0 auto;background:#f5f5f5;box-shadow:0 1px 1px #08293a88}
.topmenu2 {width:calc(100% - 64px - 4vw);margin:0 auto;max-width:1800px;color:#000;border-spacing:0;border-collapse:collapse}
.topmenu2 a {color:#08293a}
.topmenu2 img {display:inline-block;max-height:96px;width:auto}
.topmenu2 td {vertical-align:middle;white-space:nowrap;font-size:20px;padding:16px 4px}
.topmenu2 .tmenu {text-align:right;padding-right:24px}
.topmenu2 .tmenu a {display:inline-block;margin-left:60px;font-weight:600}

.topfixed2.idx {background:#08293a linear-gradient(to top, #08293a 0, #0e2d41 75%, #08293a 100%)}
.topfixed2.idx img {filter:invert(100) brightness(128%)}
.topfixed2.idx a {color:#fff}

.topfixed3 {z-index:1002;position:fixed;top:0;right:0;left:0;width:100%;margin:0 auto;background:#f5f5f5;box-shadow:0 1px 1px #08293aaa}
.topmenu3 {height:80px;display:flex;flex-wrap:nowrap;position:relative;margin:0 auto;width:100%;align-items:center}
.topmenu3 .tlogo {height:64px;width:calc(100% - 96px)}
.topmenu3 .tlogo img {max-height:64px}
.topmenu3 .tnav {width:96px;text-align:center}
.topmenu3 .tgm {display:inline-block;width:32px;height:32px;position:relative}
.topmenu3 .tgm:before,.topmenu3 .tgm:after {content:'';display:inline-block;position:absolute;left:0;right:0;height:4px;width:100%;background:#08293a;border-radius:2px}
.topmenu3 .tgm:before {top:8px}
.topmenu3 .tgm:after {bottom:8px}

.topfixed4 {z-index:1001;position:fixed;top:80px;right:0;left:0;width:100%;margin:0 auto;height:calc(100vh - 80px);background:#08293add;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden;white-space:nowrap;opacity:1;transition:.3s all}
.topfixed4.inactive {opacity:0;height:0}
.topmenu4 {margin:0 auto;padding:24px 0;width:80%;text-align:center;border-bottom:1px solid #f5f5f555}
.topmenu4 a {display:block;padding:12px 16px;color:#fff;font-size:18px}
.topsns4 {margin:0 auto;padding:24px 0;text-align:center}
.topsns4 a {display:inline-block;padding:0 8px}
.topsns4 img {height:22px;width:22px}
.topinfo4 {margin:0 auto;padding:20px 0 0;width:80%;color:#fff;border-top:1px solid #f5f5f555;border-bottom:1px solid #f5f5f555;font-size:12px}
.topinfo4 a {color:#fff}
.topinfo4 img {height:18px;width:18px}
.tif4 {display:flex;flex-wrap:nowrap;justify-content:center;padding:0 0 20px}
.t4icon {width:33px}
.t4txt {width:66%;min-width:calc(100% - 40px)}

.topfixed5 {height:80px;margin:0 auto}

/* ===== Footer ===== */
.footer,.footer-nav,.footer-copy {background:#08293a;color:#fff;margin:0 auto}
.footer {padding:64px 64px 24px}
.footer-nav {padding:4px 64px}
.footer-copy {padding:24px 8px}
.footer-nav img {max-width:100%}
.footer-nav a {color:#fff}
.footer-nav a:hover {color:#fffb}
.grid-f {display:flex;flex-wrap:wrap;position:relative;margin:0 auto;width:100%;max-width:1800px;padding-bottom:32px;border-bottom:2px solid #ddd}
.f-col {padding:16px 48px;min-height:48px;font-size:24px}
/*
.f-col.fc-1 {width:32%}
.f-col.fc-2 {width:18%}
.f-col.fc-3 {width:18%}
.f-col.fc-4 {width:32%}
*/
.f-col.fc-1 {width:33.33%}
.f-col.fc-2 {width:33.33%}
.f-col.fc-3 {width:33.33%}
.f-col.fc-4 {width:33.33%}
.f-logo {padding-bottom:24px}
.f-logo img {width:366px}
.f-title {font-weight:600;padding:32px 0 6px;font-size:28px}
.f-link {padding:4px 0}
.f-sns {white-space:nowrap;padding:24px 0}
.f-sns a {display:inline-block;transition:.2s all}
.f-sns a:hover {opacity:.7}
.f-sns img {height:32px;width:32px;margin-right:32px}
.f-sns a:last-child img {margin-right:0}
.fc-4 .f-link {padding-left:38px}
.fc-4 .f-a1,
.fc-4 .f-a2,
.fc-4 .f-a3,
.fc-4 .f-a4 {background-repeat:no-repeat;background-position:0 8px;background-size:24px}
.fc-4 .f-a1 {background-image:url(/imgs/fi-tel.png)}
.fc-4 .f-a2 {background-image:url(/imgs/fi-line.png)}
.fc-4 .f-a3 {background-image:url(/imgs/fi-mail.png)}
.fc-4 .f-a4 {background-image:url(/imgs/fi-map.png)}

/* ===== Slide Show ===== */
.interior {position:relative;background:#1a1a1a;width:100%;height:100px;height:38.07vw}
.inter {z-index:10;position:absolute;top:0;left:0;right:0;background-position:center;width:100%;height:100px;height:38.07vw;background-repeat:no-repeat;background-size:cover;opacity:0;transition:1s all}
.inter.active {z-index:11;opacity:1}
.ind-con {z-index:12;position:absolute;left:0;right:0;bottom:40px;text-align:center;margin:0 auto}
.ind {display:inline-block;width:24px;height:24px;margin:6px;background:#fff;transition:1s all}
.ind:focus {background:#fff}
.ind:hover {background:#263f76}
.ind.active {background:#263f76}

/* ===== Grid ===== */
.main-container {display:block;position:relative;margin:4px auto 0;max-width:1600px;padding-left:16px;padding-right:16px}
.grid-c > .col {padding:16px}
.grid-c {display:flex;flex-wrap:wrap;position:relative;margin:0 auto;margin-left:-16px;margin-right:-16px}
.grid-1 .col {width:100%}
.grid-2 .col {width:50%}
.grid-3 .col {width:33.33%}
.grid-4 .col {width:25%}
.grid-5 .col {width:20%}
.pseudo-hr {margin:0 auto;padding-top:5vh}

/* ===== Clear After===== */
.main-container:after,
.grid-c:after {content:'';display:block;margin:0 auto;clear:both}

/* ===== WIP ===== */
.clear {display:block;margin:0 auto;clear:both}
.laz-text {display:block;margin:0 auto;max-width:100%}
.text-center {text-align:center}
.nowrap {display:inline-block;white-space:nowrap}

/* ===== Main Mod ===== */
.scroller {
	scrollbar-color: #146d #0241;
	scrollbar-width: thin;
}
.scroller::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
.scroller::-webkit-scrollbar-track-piece  {
	background-color: #0241;
}
.scroller::-webkit-scrollbar-thumb,
.scroller::-webkit-scrollbar-thumb:vertical,
.scroller::-webkit-scrollbar-thumb:horizontal {
	height: 8px;
	background-color: #146d;
}
.line-clamp {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}
.line-clamp-1 { -webkit-line-clamp: 1}
.line-clamp-2 { -webkit-line-clamp: 2}
.line-clamp-3 { -webkit-line-clamp: 3}
.line-clamp-4 { -webkit-line-clamp: 4}
.line-clamp-5 { -webkit-line-clamp: 5}

/* ===== Mstyle Mod ===== */
.main-container {background:#fff}
.steptobuy .col img {border-radius:16px;border:1px solid #aaa;overflow:hidden}
.btn-cb {background:#08293a;color:#fff;border:2px solid #08293a;padding:16px 48px;text-align:center}
.btn-cb:hover {background:#fff;color:#000}
.btn-r {border-radius:12px}
.f5bg {background:#f5f5f5}
.tbl_details {width:100%;margin:24px auto;max-width:1024px}
.tbl_details td {width:50%;padding:8px}
.tbl_details td:first-child {padding-left:40px;background:url(/imgs/bluedot.png) left center no-repeat;background-size:18px}

/* ===== Car =====*/
.cars-box {padding:24px 0;font-size:14px}
.cars-box table {width:100%;margin:0 auto;padding:0;border-spacing:0;border-collapse:collapse;height:80px}
.cars-box table.des {height:40px;overflow:hidden;white-space:nowrap}
.cars-box table.des img {height:20px;width:auto;vertical-align:middle;margin-right:12px}
.cars-box table.des td:last-child {text-align:right}
.cars-box .fitw {padding-left:8px}
.cars-img {padding-top:80%;background-position:center;background-repeat:no-repeat;background-size:cover}
.cars-price {background:#08293a;color:#fff;padding:8px;white-space:nowrap;font-size:18px;text-align:right}
.cars-hr {padding-top:2px;background:#888}
.catg span {display:inline-block;white-space:nowrap;margin:0;margin-right:12px}
.fitw {width:2%}

/* ===== Car Filter ===== */
.filter_flex {display:flex;flex-wrap:wrap;justify-content:center;position:relative;margin:0 -64px;padding:16px 0}
.filter_flex > * {border:1px solid #000;border-radius:8px;background:#f5f5f5;color:#000;margin:12px;padding:8px 24px;cursor:pointer;font-family:'Anuphan',Tahoma,Arial,sans-serif;font-size:18px;white-space:nowrap;overflow:hidden;text-align:center}
.filter_flex > * {width:calc((100% / 7) - 24px)}
.filter_flex > .search_btn {border-color:#08293a;background:#08293a;color:#fff;font-family:inherit}
.filter_flex > .search_btn:hover {background:#f5f5f5;color:#029}
.filter_flex select {text-align:justify;text-align-last:center}

/* ===== Plate ===== */
.plate-box {padding:24px 0;white-space:nowrap;text-align:center}
.plate-inbox1 {padding:24px 2px;background:#f5f5f5;color:#000;font-size:18px;font-family:'Overpass','Noto Serif Thai',Tahoma,Arial,sans-serif;font-weight:600}
.plate-inbox2 {padding:24px 2px;background:#08293a;color:#fff;font-size:16px}
.plate_regis {font-size:36px;line-height:56px;transform:scaleX(88%)}
.plate_regis b {font-size:30px;font-weight:600}
.plate_provinces {font-size:20px;line-height:20px;transform:scaleX(88%)}
.plate_value {display:inline-block;padding:2px 28px;background:#f5f5f5;color:#08293a;border-radius:8px;margin:12px auto 0}

/* ===== Responvive ===== */
@media (min-width:1150px) {
	.topfixed3,.topfixed4,.topfixed5 {display:none}
}
@media (max-width:1799px) {
	.laz-text {max-width:100%;height:auto}
	.main-container {padding-left:128px;padding-right:128px}
	.topmenu2 td {padding:16px 8px}
	.topmenu2 img {max-height:64px}
	.topmenu2 .tmenu a {font-size:18px;margin-left:48px}
	.filter_flex > * {margin:12px;padding:8px 12px;font-size:16px}
	.grid-c > .col {padding:8px}
	.f-col {padding:16px 24px;min-height:24px;font-size:16px}
	.f-title {padding:16px 0 6px;font-size:20px}
	.fc-4 .f-a1,
	.fc-4 .f-a2,
	.fc-4 .f-a3,
	.fc-4 .f-a4 {background-repeat:no-repeat;background-position:0 4px;background-size:16px}
}
@media (max-width:1149px) {
	body {font-size:16px}
	.main-container {padding-left:48px;padding-right:48px}
	.laz-text {max-width:100%;height:auto}
	.topfixed, .topfixed2 {display:none}
	.filter_flex {margin:0 auto;padding:12px 0}
	.filter_flex > * {margin:12px;padding:8px 8px;font-size:14px}
	.filter_flex > * {width:calc((100% / 3) - 24px)}
	.grid-c > .col {padding:8px}
	.grid-2 .col {width:50%}
	.grid-4 .col {width:25%}
	.grid-5 .col {width:25%}
	/*
	.f-col.fc-1 {width:100%}
	.f-col.fc-2 {width:30%}
	.f-col.fc-3 {width:30%}
	.f-col.fc-4 {width:40%}
	*/
	.f-col.fc-1 {width:100%}
	.f-col.fc-2 {width:50%}
	.f-col.fc-3 {width:50%}
	.f-col.fc-4 {width:50%}
	.tbl_details td {border-bottom:1px solid #f5f5f5}
	.tbl_details td:first-child {padding-left:36px;background-size:16px}
	.tbl_details tr:last-child td {border-bottom:1px solid #0000}
	.cars-box table {height:48px}
	.cars-box {font-size:12px}
	.cars-price {font-size:12px;padding:8px 4px}
	.plate-box {padding:12px 8px}
	.plate-inbox1 {padding:12px 2px}
	.plate-inbox2 {padding:12px 2px;font-size:16px}
	.plate_regis {font-size:24px;line-height:32px;transform:scaleX(88%)}
	.plate_regis b {font-size:20px;font-weight:600}
	.plate_provinces {font-size:18px;line-height:18px;transform:scaleX(88%)}
	.f-col {padding:16px 24px;min-height:24px;font-size:14px}
	.f-title {padding:16px 0 6px;font-size:20px}
	.fc-4 .f-a1,
	.fc-4 .f-a2,
	.fc-4 .f-a3,
	.fc-4 .f-a4 {background-repeat:no-repeat;background-position:0 4px;background-size:16px}
}
@media (max-width:779px) {
	body {font-size:14px}
	.main-container {padding-left:24px;padding-right:24px}
	.filter_flex > * {margin:8px;padding:8px 4px;font-size:12px}
	.filter_flex > * {width:calc((100% / 2) - 16px)}
	.grid-c > .col {padding:2px}
	.grid-1 .col {width:100%}
	.grid-2 .col {width:100%}
	.grid-3 .col {width:100%}
	.grid-4 .col {width:50%}
	.grid-5 .col {width:33.33%}
	.g4mod .grid-4 .col {width:33.33%}
	.grid-f {justify-content:center}
	.footer {padding:64px 32px 24px}
	.footer-nav {padding:4px 32px}
	.f-col.fc-1,
	.f-col.fc-2,
	.f-col.fc-3,
	.f-col.fc-4 {width:100%;max-width:384px}
	.tbl_details td {border-bottom:1px solid #eee}
	.tbl_details td:first-child {padding-left:32px;background-size:12px}
	.tbl_details tr:last-child td {border-bottom:1px solid #0000}
	.cars-box {font-size:12px}
	.cars-price {font-size:12px;padding:4px 4px}
	.f-sns {padding:24px 0;text-align:center}
	.f-sns img {height:24px;width:24px;margin-right:20px}
}
@media (max-width:511px) {
	.grid-1 .col {width:100%}
	.grid-2 .col {width:100%}
	.grid-3 .col {width:100%}
	.grid-4 .col {width:50%}
	.grid-5 .col {width:50%}
	.g4mod .grid-4 .col {width:50%}
}