body{color:#222;margin:0px 0px;padding:0px 0px;font-weight:normal;font-family:Tahoma,Arial,San-Serif,Sans;background:#F0F0F0;}
a:link{color:#222;text-decoration:none;}
a:visited{color:#222;text-decoration:none;}
a:active{color:#087EBB;text-decoration:none;}
a:hover{color:#087EBB;text-decoration:none;}

img{border: 0 none;max-width:100%;vertical-align:middle;}
hr{border:0;border-top:1px solid #222;}
p{margin: 0 0 10px;}

form{padding:0;margin:0;}
input, textarea, button{font-size:16px;color:#222;}

h1{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:38px;color:#000;word-wrap: break-word;line-height:40px;margin:0;font-weight:600;}
h2{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:36px;color:#000;word-wrap: break-word;line-height:38px;font-weight:600;margin: 15px 0 5px;}
h3{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:34px;color:#000;word-wrap: break-word;line-height:36px;margin:0;font-weight:600;}
h4{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:32px;color:#000;word-wrap: break-word;line-height:34px;margin:0;font-weight:600;}
h5{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:30px;color:#000;word-wrap: break-word;line-height:32px;margin:0;font-weight:600;}

.clear-style{clear:both;height:0px;line-height:0px;font-size:0px;padding:0;margin:0;}

.row:after{content:""; display:table; clear:both;}
.table-wrap{display:flex; flex-wrap:wrap;}

.style-title{font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-size:2.2rem; line-height: 38px; font-weight:700; text-align:center; margin:0 0 8px 0; border-bottom: 4px solid #087EBB;}
.style-title a:link , .style-title a:visited{color:#3D4343;} .style-title a:active , .style-title a:hover{color:#087EBB;}

.style-tab-page{color:#3D4343; font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-weight:500; font-size:16px; padding:6px; text-align:center; }
.style-tab-page a:link , .style-tab-page a:visited{color:#FFF; }
.style-tab-page a:active , .style-tab-page a:hover{color:#666; }

.style-nav{line-height:15px; font-size:12px; margin-bottom:15px;color:#333333;}
.style-nav a{color:#333333;}

.style-tag:after{content: "";display: table;clear: both;}
a.style-tag{padding:5px 8px 5px 8px;margin:0 5px 5px 0;font-size:12px;color:#666;float:left;background-color:#F0F0F0;}

.style-num:after{content: "";display: table;clear: both;}
a.style-num{padding:5px 8px 5px 8px;margin:0 5px 5px 0;font-size:12px;color:#FFF;float:left;background-color:#087EBB;}

.style-numactive:after{content: "";display: table;clear: both;}
a.style-numactive{padding:5px 8px 5px 8px;margin:0 5px 5px 0;font-size:12px;color:#666;float:left;background-color:#F0F0F0;}

.col-thumb img{width:100%; height:100%; aspect-ratio:3/2;}
.col-topic{padding:6px; background-color:#F0F0F0; font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;}
.col-img{width:300px;height:200px;object-fit: contain;}

.show-col-thumb img{width:100%; height:100%; aspect-ratio:3/2;}

/* ######################################################################### */

.style-search{width:100%; background-color:#FFF; text-align:right;}

/* ## Mobile ## */
@media(min-width:200px){

.style-header{width:100%; height:45px; padding-bottom:3px; background-color:#FFFFFF; border-bottom:2px solid #087EBB;}
.style-header-container{width:100%; margin:0px auto;}

.style-header-logo{float:left; width:165px; padding-top:5px;}
.style-header-logo img{padding-left:8px; height:40px;}
.style-header-menu{float:right; padding:0 8px 0 0; font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-size:1.8rem; font-weight:600;}
.style-header-menu a:link , .style-header-menu a:visited{color:#000;}
.style-header-menu a:active , .style-header-menu a:hover{color:#087EBB;}

#TopMenu{padding:3px 5px 3px 5px; color:#FFF; background-color:#087EBB; font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-size:1.1rem; font-weight:400;}
#TopMenu a:link , #TopMenu a:visited{color:#FFF; padding:0 7px 0 7px;}
#TopMenu a:active , #TopMenu a:hover{color:#000; padding:0 7px 0 7px;}
#TopMenu ul , #TopMenu li{list-style-type: none;padding:0 5px 5px 5px;}

.style-h1{width:100%;background-color:#F0F0F0;padding:20px 10px 5px 10px; margin-bottom:5px;}

.style-container{background-color:#FFFFFF; padding:10px;}

.style-block{background-color:#FFF; margin-bottom:8px;}

.col-style{float:left;width:100%;margin-bottom:15px;}

.show-col{float:left;width:48%;margin-bottom:15px; margin-left:1%; margin-right:1%;}

.content , .content iframe,  .content object,  .content embed {max-width: 100%;}

.style-show1{width:100%;font-size:18px; line-height:1.5; background-color:#FFF;margin:0px;}
.style-show1 img{padding:10px 0 10px 0;height:auto !important;width:auto !important;}
.style-show1 h1 , .style-show1 h2 , .style-show1 h3{padding:5px 5px 5px 5px; background-color:#F0F0F0;}
.style-show1 a:link , .style-show1 a:visited{color:#087EBB;text-decoration:underline;}
.style-show1 a:active , .style-show1 a:hover{color:#222;text-decoration:underline;}

.style-show2{float:left; width:100%;font-size:16px; background-color:#FFF;}

.footer{width:100%; margin:0px auto; color:#333; padding:40px 0 40px 0; background-color:#F0F0F0; border-top:2px solid #087EBB; text-align:center;font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial;font-size:1.01rem;}
}

@media(min-width:641px){
.col-style{float:left;width:48%;margin-bottom:15px; margin-left:1%; margin-right:1%;}
.show-col{float:left;width:48%;margin-bottom:15px; margin-left:1%; margin-right:1%;}
}

@media(min-width:961px){
.col-style{float:left;width:23%;margin-bottom:15px; margin-left:1%; margin-right:1%;}
.show-col{float:left;width:23%;margin-bottom:15px; margin-left:1%; margin-right:1%;}
}

/* ## Desktop ## */
@media(min-width:1281px){

.style-header{width:100%; padding-top:5px; padding-bottom:5px; background-color:#FFFFFF;height:60px;}
.style-header-container{width:1200px; margin:0px auto;}

.style-header-logo{float:left; width:250px;}
.style-header-logo img{height:50px;}
.style-header-menu{float:right; text-align:right; padding:3px 8px 4px 8px; margin:10px 0 0 0; background-color:#087EBB; font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-size:1.1rem; font-weight:400;}
.style-header-menu a:link , .style-header-menu a:visited{color:#FFF; padding:0 8px 0 8px;}
.style-header-menu a:active , .style-header-menu a:hover{color:#000; padding:0 8px 0 8px;}

.style-h1{width:100%;background-color:#F0F0F0;padding:20px 10px 5px 10px; margin-bottom:5px;}

.style-container{width:1200px; background-color:#FFFFFF; margin:0px auto; padding-top:10px;}

.style-block{background-color:#FFF; padding:10px; margin-bottom:10px;}

.col-style{float:left;width:24%; margin-bottom:15px; margin-left:0.5%;margin-right:0.5%;}

.show-col{float:left;width:100%;margin-bottom:15px;}

.content{width:1200px;margin:0px auto; padding-bottom:10px;}
.content iframe,  .content object,  .content embed {max-width: 100%;}

.style-show1{width:850px;font-size:18px; line-height:1.5; background-color:#FFF; padding:10px;margin: 0px auto;}
.style-show1 img{padding:10px 0 10px 0;height:auto !important;}
.style-show1 h1 , .style-show1 h2 , .style-show1 h3{padding:5px 5px 5px 5px; background-color:#F0F0F0;}

.style-show2{float:left;width:300px; background-color:#FFF; margin-left:10px; padding:10px;}

.footer{width:100%; margin:0px auto; color:#333; padding:40px 0 40px 0; background-color:#F0F0F0; border-top:2px solid #087EBB; text-align:center;font-family:"Noto Sans Thai", San-Serif,Tahoma,Arial; font-size:1.01rem;}
}