body{color:#000;background:#fff;width:100%;overflow-x:hidden;word-break:break-word}
body.mod-active{font-family:'Sarabun','Kanit','Prompt',Tahoma,Arial,sans-serif;font-size:14px}
h1,h2,h3,h4,h5,h6{font-weight:400}
a:hover,a:focus,a:active{text-decoration:none;color:#2ac}
.fc-bl{color:rgb(4,30,66);color:#041e41}
.fc-gd{color:rgb(132,117,78);color:#84754e}
.ar1-1{padding-top:100%}
.ar4-3{padding-top:75%}
.ar3-2{padding-top:66.65%}
.ar16-9{padding-top:56.25%}
.ar2-1{padding-top:50%}
.ar3-1{padding-top:33.33%}
.ar4-1{padding-top:25%}
.ar5-1{padding-top:20%}
.ar3-4{padding-top:133.33%}
.ar2-3{padding-top:150%}
.ar9-16{padding-top:177.76%}
.ar1-2{padding-top:200%}
.ar-calculate {padding-top: calc(768px / 1920px * 100%);}
.bold{font-weight:700}
.btn{border-radius:12px}

/* Mstyle 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;}

.product-default-link {
	height: 80px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-bottom: 20px;
}

/* ===== General ===== */
.main-container {padding-left:96px;padding-right:96px}
.btn {border-radius:4px}
.btn.btn-primary {display:inline-block;background:#08293a;border-color:#08293a;color:#fff;text-align:center;border-radius:8px;transition:.5s all}
.btn.btn-primary:hover {background:#414248;border-color:#414248;color:#f9f5f1}
.btn.btn-link {color:#08293a;border-radius:8px;transition:.5s all}
.btn.btn-link:hover {color:#414248;text-decoration:none}
.laz-text {display:block;margin:0 auto;max-width:100%;height:auto}
.autoSize {white-space:nowrap;overflow:auto;transition:1s opacity}
.b-type {background:#08293a;color:#fff;padding:2px 8px;border-radius:4px;font-size:12px;margin-bottom:16px}
.hi {font-weight:600;color:#b74125}
.hl {font-weight:500;color:#b74125}
.de {font-weight:400;color:#d33;border-bottom-color:#fa7c95;font-size:16px}

/* ===== Responvive ===== */
@media (min-width:1150px) {
	.topfixed3,.topfixed4 {display:none}
	.topfixed5 {height:198px;margin:0 auto}
}
@media (max-width:1799px) {
	body {font-size:18px}
	.laz-text {max-width:100%;height:auto}
	.main-container {padding-left:64px;padding-right:64px}
	.topmenu2 td {padding:16px 4px}
	.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}
}
@media (max-width:1149px) {
	body {font-size:16px}
	.main-container {padding-left:48px;padding-right:48px}
	.topfixed, .topfixed2 {display:none}
	.grid-c > .col {padding:8px}
	.grid-2 .col {flex:50%}
	.grid-4 .col {flex:25%}
	.grid-5 .col {flex:20%}
}
@media (max-width:779px) {
	body {font-size:14px}
	.main-container {padding-left:24px;padding-right:24px}
	.grid-c > .col {padding:2px}
	.grid-1 .col {flex:100%}
	.grid-2 .col {flex:100%}
	.grid-3 .col {flex:100%}
	.grid-4 .col {flex:50%}
	.grid-5 .col {flex:50%}
	.footer .grid-5 .col:first-child {flex:100%;text-align:center}
}
@media (max-width:383px) {
	.grid-1 .col {flex:100%}
	.grid-2 .col {flex:100%}
	.grid-3 .col {flex:100%}
	.grid-4 .col {flex:100%}
	.grid-5 .col {flex:100%}
}

/* ===== Cover Info ===== */
.cover-info {text-align:center;padding:48px 16px 32px;max-width:1600px;margin:0 auto}
.cover-info .title {font-size:32px;color:#000}
.cover-info .text {font-size:28px;color:#000;position:relative;display:inline-block;padding-left:12px;padding-right:12px}
.cover-info .a-back {text-align:left;margin:24px 12px}
.cover-info .a-back a {font-size:24px;color:#998}
@media (min-width:992px) {
	.smart-menu {display:none}
	.smart-menu-open {display:none}
}
@media (max-width:991px) {
	.cover-info .title {font-size:24px;color:#000}
	.cover-info .text {font-size:20px;color:#000}
	.smart-menu-open.inactive {height:0px;width:100%;overflow:hidden}
	.smart-menu-open {height:100vh;width:100%;overflow:hidden;background:#9986;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
}
@media (max-width:479px) {
	.cover-info .title {font-size:24px;color:#000}
	.cover-info .text {font-size:18px;color:#000}
}