@import "https://fonts.googleapis.com/css?family=PT+Sans:400,700|Kanit:300,400,500,700";

@import './jquery-ui.min.css';

@import './bootstrap.min.css';

@import './font-awesome.min.css';

@import './owl.carousel.min.css';

@import './fancybox.css';

@import './data.table.css';

@import './default.css';

@import './fonts.css';

html,body{font-family:"Kanit",sans-serif;padding:0;margin:0;font-weight:300;opacity:1;transition:.3s opacity;min-height:100%;color:#000}

body.loading{opacity:0}

body{background:url('../img/bg.jpg') no-repeat top center;background-size:cover;background-attachment: fixed;padding-top: 0;}

/*body{background:url('../img/pat-paper.png') ;padding-top: 60px;}*/



html,body{max-width:100%;overflow-x:hidden}

ul,li{margin:0;padding:0;list-style:none}

iframe,img{max-width:100%;border:0}

h1,h2,h3,h4,h5,h6{font-family:"Kanit",sans-serif;font-weight:300;line-height:initial}

h1{font-size:22px}

h2{font-size:22px}

h3{font-size:17px}

a{transform:.3s all}

a:hover{text-decoration:none;transform:.3s all}

.orange{color: orange}

.bg-f9{background: #f9f9f9;}

.bg-green{background:#e5fbd7}

.mb2{margin-bottom:2px}

.container{width:1170px;max-width:100%}

.btn-primary{color:#4c4436;font-size:16px;border-radius:30px;background:#FFDE5A;padding:7px 30px;border:1px solid #FFDE5A;font-weight:300}

.btn-primary:hover,.btn-primary:focus{background:#FFDE5A;border-color:#FFDE5A;color: #333;opacity: 0.8;}

.pagination li,.pagination li>a{font-family:Arial,sans-serif;font-size:14px;display:inline-block}

.pagination li{float:left}

.pagination>li>a,.pagination>li>span{color:#393939}

.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{color: #393939;text-decoration: underline;font-weight: bold;}

.pagination>li>a, .pagination>li>span {border: none;background: none;}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {border: none;background: none;}

.nav-tabs>li>a{font-size:16px;color:#333;font-weight:400}

.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover{color:#036}

#pagination{padding-top:15px;border-top:1px solid #eee;margin-top:30px}

#pagination.no-border{border:0;margin-top:0}

.btn-previous,.btn-next{border:1px solid #ccc;padding:5px 25px;color:#333;font-size:16px;font-weight:400;border-radius:4px}

.btn-previous:hover,.btn-next:hover,.btn-previous:focus,.btn-next:focus{text-decoration:none;color:#333;background:#eee}

#gotop{position:fixed;bottom:30px;right:30px;background:#043769;color:#fff;font-size:20px;border-radius:4px;width:34px;height:34px;text-align:center;display:none;padding-top:2px}

#left-bar-button{display:none;white-space:nowrap}

#menu-bars-button{display:none}

.overlay{background:rgba(0,0,0,.5);position:fixed;top:0;left:0;width:100%;height:100%;z-index:100;display:none}

.cc33{color:#c33}

.warp-recapcha{max-height:75px}

.g-recaptcha{display:inline-block}

.modal{z-index:11111}

.opacity1{opacity: 1 !important;z-index: 1;position: relative;}

/*edit*/

i.fa.fa-search {color: #fff;}

footer>div>div {padding-top: 20px;padding-bottom: 10px;background: #035B96;border-top: 1px solid #ccc;}

footer>div.container {text-align: center;font-size: 19px;font-weight: 300;padding: 0;}

textarea{min-height:120px;border-radius:0!important}

input[type='text'],input[type='email'],input[type='password']{font-size:14px;font-family:Arial,sans-serif;line-height:initial;color:#333;border:1px solid #ccc;border-radius:0}

button[type='submit']{font-size:18px;font-family:"Kanit",sans-serif;color:#fff;text-align:center;padding:5px 25px;border-radius:4px;background:#0472FF;border-color:#0472FF;min-width:180px;transition:.3s all;font-weight:300}

button[type='submit']:hover,button[type='submit']:focus,button[type='submit']:active{background: #d6b224;color: #4c4436;border-color: #d6b224;transition: .3s all;outline: none!important;}

#termModal h4{font-size:20px;line-height:20px}

#termModal .modal-body{font-family:Arial,sans-serif;font-weight:400;font-size:13px;color:#111}

#termModal .modal-body li{margin-bottom:5px}

#termModal button[type='button']{font-size:18px;line-height:18px}

/*.fa-download*/{padding:9px;border-radius:50%;width:30px;height:30px;background:#00A2F7;color:#fff;line-height:14px}

/*.fa-download:hover{background:#0472FF}*/

.ck-editor__editable.ck-rounded-corners,.ck-rounded-corners .ck-editor__editable{padding:10px 15px}

.ck-editor__editable{min-height:150px;background:#fff}

.nowrap{white-space:nowrap}

#successModal .modal-header{padding:4px 15px 0;background:#fff;color:#333;border:0;text-align:center}

#successModal .modal-header .fa-check-circle{font-size:50px;margin:10px auto 0;color:green}

#successModal .modal-header h4{font-size:24px;color:green;text-transform:uppercase;padding:0}

#successModal .modal-title{font-size:25px;color:green}

#successModal .modal-content{border-radius:0;box-shadow:none;border:0;background:#fff;padding-top:0}

#successModal .modal-body{padding-top:0}

#successModal .modal-content p{color:#999;font-size:14px;font-family:Arial,sans-serif;text-align:center}

#successModal .modal-header .close{font-size:35px;position:absolute;top:0;right:10px}

#warningModal .modal-header{padding:4px 15px 0;background:#fff;color:#333;border:0;text-align:center}

#warningModal .modal-header .fa-times-circle{font-size:50px;margin:10px auto 0;color:#c33}

#warningModal .modal-header h4{font-size:24px;color:#c33;text-transform:uppercase;padding:0}

#warningModal .modal-title{font-size:25px;color:green}

#warningModal .modal-content{border-radius:0;box-shadow:none;border:0;background:#fff;padding-top:0}

#warningModal .modal-body{padding-top:0}

#warningModal .modal-content p{color:#999;font-size:14px;font-family:Arial,sans-serif;text-align:center}

#warningModal .modal-header .close{font-size:35px;position:absolute;top:0;right:10px}

header #google_translate_element{position:absolute;top:15px;right:15px;z-index:10000}

header nav{display:block;position: relative;}

header nav ul{text-align:right;background:#043769;}

header nav ul>li{display:inline-block;float:none;background:transparent;vertical-align:middle}

header nav>ul>li:first-child{background:transparent;border-right:0;margin-right:28px;margin-left:2px;float:left}

header nav>ul>li:first-child>a{padding:4px 0}

header nav>ul>li:first-child>a img{width:50px;display:inline-block;vertical-align:middle;margin-right:5px;margin-left:5px}

header nav>ul>li:first-child>a>span{display:inline-block;vertical-align:middle;text-align:left;color:#fff;padding-top: 5px}

header nav>ul>li:first-child>a>span>span{display:block}

header nav ul>li>a{display:block;font-size:16px;font-weight:300;color:#fff;padding:18.5px 7px}

header nav ul>li.active>a,header nav ul>li:not(:first-child)>a:hover,header nav ul>li:not(:first-child)>a:focus{color:#043769;text-decoration:none!important;background: #FFDE5A}

header nav ul>li>a:focus,header nav ul>li>a:active{text-decoration:none;color:#205800}

header #banner{background:#c7f1fc;background:-moz-linear-gradient(top,#c7f1fc 0%,#eaf7f9 15%,#f4f9f9 100%);background:-webkit-linear-gradient(top,#c7f1fc 0%,#eaf7f9 15%,#f4f9f9 100%);background:linear-gradient(to bottom,#c7f1fc 0%,#eaf7f9 15%,#f4f9f9 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c7f1fc',endColorstr='#f4f9f9',GradientType=0);background-size:0}

header #information{background:#043769;color:#fff;font-size:13px;padding:0 0;line-height:initial;position:relative;text-align:center;font-weight:400;position:relative;overflow:hidden;font-family:Arial,sans-serif;letter-spacing:1px;margin-top: -1px;}

header #information h1{color:#fff;margin:0}

header #information>div{display: grid;grid-template-columns: max-content auto}

header #information>div>span{display: inline-block;background: #4d90fe;color: white;font-size: 20px;padding: 10px 10px 8px;border-top: 4px solid #FFDE5A}

header #information marquee{padding-top: 14px;font-size: 16px;color: yellow}



header nav{position:relative;top:0;left:0;width:100%;z-index:10000;right:0;margin:0 auto;border-top:0;box-shadow:0 3px 10px -2px rgba(0,0,0,.3);background:#043769;}

header nav ul{width:1170px;margin:0 auto;max-width:100%;}

header.stick nav{position:fixed;top:0;left:0;width:100%;z-index:10000;right:0;margin:0 auto;border-top:0;box-shadow:0 3px 10px -2px rgba(0,0,0,.3);background:#035B96}

header.stick nav ul{width:1170px;margin:0 auto;max-width:100%;background:#035B96}



header.structure-heading h1>img{width:80px;display:inline-block;vertical-align:middle;margin-right:10px}

header.structure-heading h1>span{display:inline-block;vertical-align:middle;text-align:left;font-size:24px;font-weight:300}

header.structure-heading h1>span>span{display:block;font-size:18px}

header .sub-menu{position:relative}

header .sub-menu:hover a{background: #0472FF;}

header .sub-menu:hover ul>li>a:hover{background: #e9ffb9;}

header .sub-menu ul{position:absolute;top:100%;left:0;width:250px;z-index:1000;max-width:250px!important;display:none}

header .sub-menu:hover ul,header .sub-menu:active ul,header .sub-menu:focus ul{display:block}

header .sub-menu>a{cursor:default}

header .sub-menu ul>li{display:block;margin:0;padding:0;text-align:left}

header .sub-menu ul>li>a{display:block;padding:10px 20px;margin:0;border-top:1px solid rgba(0,0,0,.1)}

header .sub-menu ul>li:first-child>a{border-top:0}

main #management{margin-bottom:30px}

main #management h4{font-size:20px;color:#888;text-align:center;margin-bottom:0;letter-spacing:1px}

main #management h4+p{font-size:16px;color:#999;text-align:center}

main #management .btn{width:100%}

main #management img{width:100%;}

main #content{padding-top:15px}

main#wrap-structure{white-space:nowrap;overflow:hidden;overflow-x:scroll;background:#fff}

main#wrap-structure>div{width:fit-content;margin:0 auto}

main#wrap-structure h1>span{display:inline-block;background:#b3d69c;color:#333;border:1px solid #b3d69c;padding:5px 50px;border-radius:7px;font-size:20px}

main .heading{background:transparent;color:white;padding:7px 15px;margin:0;background-size:cover;background-position:center center;background-repeat:no-repeat;margin-bottom:10px;position:relative}

main h2.heading{font-size:20px}

main .sub-heading{text-align:center}

main .sub-heading>span{border-bottom:2px solid #eee;display:inline-block}

main .heading{background: #043769;}

/*main .heading:after{content:'';top:0;left:0;position:absolute;background:#00A2F7;width:100%;height:100%;;opacity:1;background-repeat: repeat;}*/

main .heading.has-link>a{position:relative;z-index:1;}

main .heading>img{position: relative;z-index: 1;margin-right: 7px;}

main .heading>span{position:relative;z-index:1}

main .heading>span>i{display:inline-block;vertical-align:middle;margin-right:5px;background:#fff;border-radius:50%;font-size:12px;padding:5px;width:22px;text-align:center}

main .heading>span>span{display:inline-block;vertical-align:middle}

main .heading>span>img{display:inline-block;vertical-align:middle;margin-right:7px}

main .content{border:1px solid #ccc;padding:15px;margin-bottom:20px}

main .image img{width:100%;transition:.3s all;transform:scale(1)}

main .image{display:block;position:relative;overflow:hidden}

main .image:before{content:'';position:absolute;top:50%;left:0;right:0;margin:0 auto;width:0;height:0;background:rgba(242,241,249,0.17);transition:.3s all;visibility:hidden;z-index:10}

main .image:hover:before{width:100%;height:100%;visibility:visible;transition:.3s all;top:0}

main .image:hover img{transform:scale(1.1);transition:.3s all}

main .list-style1 .list{border-bottom:1px solid #eee;margin-bottom:15px;margin-top:15px;padding-bottom:15px}

main .list-style1 .list:last-of-type{border-bottom:0;padding-bottom:0}

main .list-style1 .list h3{font-size:18px;color:#333;font-weight:-0;line-height:22px;margin:0 0 10px}

main .list-style1 .list h3>a{color:#333}

main .list-style1 .list h3>a:hover{text-decoration:underline;color:#036}

main .list-style1 .list h3+p{font-size:13px;font-family:Arial,sans-serif;margin:0;color:#666}

main .list-style1 .list .read{font-size:13px;font-family:Arial;color:#999;margin:10px 0 0}

main .list-style2 .grid{margin:0 -10px}

main .list-style2 .item{width:33.33%;padding:10px}

main .list-style2 .item .image img{width:100%}

main .list-style2 .item p{font-size:16px;font-weight:300;margin:0;text-overflow:ellipsis;overflow:hidden;height:55px;/*background: #DEECF8;*/padding: 5px 10px}

main .list-style2 .item p>a{color:#333}

main .list-style2 .item p>a:hover{text-decoration:underline}

main .list-style3 .grid{margin:0 -10px}

main .list-style3 .item{width:50%;padding:10px}

main .list-style3.col3 .item{width:33.33%}

main .list-style3 .item a.image{margin-bottom: 0;}

main .list-style3 .item h3{font-size:16px;color:#333;font-weight:400;line-height:20px;margin:0 0 5px;text-overflow:ellipsis;overflow:hidden;height:50px;margin-bottom:5px;/*background: #DEECF8;*/padding: 5px 10px}

main .list-style3 .item h3>a{color:#333}

main .list-style3 .item h3>a:hover{text-decoration:underline}

main .list-style3.col3 .item h3{height: 68px;}

main .list-style3 .item .description{height:38px;overflow:hidden}

main .list-style3 .item .date{font-size:13px;font-family:Arial;color:#999;margin:0;display: inline-block;vertical-align: middle;/*background: #e8f0fd*/;padding: 5px 10px;font-style:italic;}

main .list-style3 .item .read{font-size:13px;font-family:Arial;color:#999;margin:0;display: inline-block;vertical-align: middle;/*background: #e8f0fd*/;padding: 5px 10px;font-style:italic;}

main .list-style4 .grid{margin:0 -10px}

main .list-style4 .item{width:16.66%;padding:10px}

main .tab-content{font-family:Arial,sans-serif}

main .tab-content ul{margin-top:15px}

main .tab-content ul>li>a{color:#036;line-height:initial}

main .tab-content ul>li{display:block;padding:5px}

main .tab-content ul>li>a:before{content:'\f0f6';font-family:"FontAwesome";margin-right:5px}

main .tab-content ul>li>a>span{color:#999;font-size:12px}

main .tab-content ul>li>a:hover{text-decoration:underline;color:#023}

main #webboard table{width:100%;font-family:Arial,sans-serif;font-size:14px}

main #webboard table th{font-family:"Kanit";font-size:15px;font-weight:300}

main #webboard table tr>td>a{color:#036;font-weight:400}

main #webboard table tr>td>a:hover{color:#036;text-decoration:underline}

main #webboard table tr>td:last-child{text-align:right;width:1%;white-space:nowrap;font-size:13px;color:#666}

main #webboard table tr>th:last-child{text-align:right;width:1%;white-space:nowrap}

main #webboard table tr>th:nth-child(3){text-align:center;width:1%;white-space:nowrap}

main #webboard table tr>td:nth-child(3){text-align:center;width:1%;white-space:nowrap;font-size:13px;color:#666}

main #webboard table tr>th:nth-child(2){text-align:center;width:1%;white-space:nowrap}

main #webboard table tr>td:nth-child(2){text-align:center;width:1%;white-space:nowrap;font-size:13px;color:#666}

main #banners img{width:auto;margin:0 auto}

main #banners ul>li{margin-bottom:5px;text-align:center}

main #page .content>h2{font-size:24px;line-height:30px;margin:0 0 5px;background: #c7ecff;padding: 10px 15px}

main #page .content>ul{margin-bottom:15px;display:block;padding-bottom:2px;}

main #page .content>ul>li{display:inline-block;vertical-align:middle;font-family:Arial,sans-serif;font-size:13px;color:#999;padding: 5px 10px;margin: 2.5px;font-style:italic;}

/*main #page .content>ul>li:first-child{margin-right:20px}*/

main .downloads{font-family:Arial,sans-serif}

main .downloads table tr>th{color:#111;font-family:"Kanit";font-size:17px;font-weight:300}

main .downloads table tr>th:not(:nth-child(2)),main .downloads table tr>td:not(:nth-child(2)){width:1%;white-space:nowrap;text-align:center}

main .downloads table tr>td:last-child>a{background: #4D90FE;color: white;padding: 9px;border-radius: 50%;display: inline-block;width: 30px;height: 30px;line-height: 14px;}

main .downloads table tr>td{vertical-align: middle;}

main .downloads table tr>td:nth-child(3){color: #999;font-size: 13px;}

main .downloads table thead{background: #DEECF8;}

main .downloads h3{font-size:20px;margin:0 0 5px}

main .downloads .text-link{color:blue}

main .downloads .text-link:hover{color:blue;text-decoration:underline}

main #webboard .dataTables_length{font-size:13px;font-family:Arial}

main #webboard input[type='search']{width:180px!important;border:1px solid #ccc;border-radius:0}

main #webboard label{font-size:13px;font-family:Arial}

main #webboard .dataTables_info,main #webboard .dataTables_paginate{font-size:13px;font-family:Arial}

main #webboard-form{font-family:Arial,sans-serif;margin-top:30px;border-top:2px dashed #ccc}

main #webboard-form.mt0{margin-top:0}

main #webboard-form.no-border{border:0}

main #webboard-form h2{font-size:28px}

main #webboard-form label{font-size:16px;font-family:"Kanit";line-height:24px;margin-bottom:0;font-weight:400}

main #webboard-form label em{color:#c33;font-family:arial;font-size:11px;font-weight:400}

main #webboard-form form{padding:30px 20px;background:#f6f6f6}

main #webboard-form h3{margin-top:0}

main #webboard-form .conditions li{margin-bottom:5px}

main #contact-form{font-family:Arial,sans-serif;margin-top:30px}

main #contact-form label{font-size:15px;font-family:"Kanit";line-height:17px;margin-bottom:0;font-weight:400}

main #contact-form label em{color:#c33;font-family:arial;font-size:11px;font-weight:400}

main #contact-form form{padding:30px 20px;background:#f6f6f6}

main #contact-form h3{margin-top:0}

main #contact-form .conditions li{margin-bottom:5px}

main #map iframe{border:0;width:100%;height:450px}

main #address{font-size:15px;color:#111;font-weight:300;text-align:center}

main #address p{line-height:22px;margin:0}

main #address p a{font-family:Arial,sans-serif;font-size:14px}

main .select-child-page{font-family:Arial,sans-serif;padding:5px 0 0;display:grid;grid-template-columns:auto max-content}

main .select-child-page>div>h3{display:inline-block;margin:0 5px 0 0;vertical-align:middle}

main .select-child-page>div>div{display:inline-block!important;vertical-align:middle}

main .select-child-page select{max-width:600px;border:1px solid #0472FF;padding:5px;background:#fff;height:initial;min-width: 400px;padding: 7.5px;height: initial;color: #0472FF;}

main .select-child-page label{margin-bottom: 0;font-weight: normal;}

main .select-child-page label p{margin-bottom: 0;font-family: Kanit;font-size: 17px;font-weight: 300;}

main .select-child-page>div>p{font-size: 18px; font-family: Kanit; font-weight: 300; color: #0472FF;}

main .select-child-page>div{background: #c9e8f5;padding: 15px;border: 1px solid #0472FF;}

main .structure-style{text-align:center}

main .structure-style>.col1{width:100%;float:left}

main .structure-style>.col2{width:50%;float:left}

main .structure-style>.col3{width:33.33%;float:left}

main .structure-style>.col4{width:25%;float:left}

main .structure-style>.col5{width:20%;float:left}

main .structure-style .structure{width:350px;display:inline-block;max-width:100%;padding:10px}

main .structure-style a{display:block;border:4px solid #eee;margin-bottom:15px}

main .structure-style h3{font-size:18px;line-height:20px;margin:0;color:#0472ff;}

main .structure-style h3+p{font-family:Arial,sans-serif;font-size:14px;height:100px;overflow:hidden}

main .content-topic{font-family:Arial,sans-serif;color:#111}

main .content-topic .post{font-size:13px;font-family:Arial,sans-serif;color:#111}

main .content-topic{background:#ecf7df;padding:20px}

main .content-topic>h2{font-size:21px;line-height:25px;margin:0 0 5px}

main .content-topic>ul{margin-bottom:15px;display:inline-block;border-bottom:1px solid #00A2F7;padding-bottom:2px}

main .content-topic>ul>li{display:inline-block;vertical-align:middle;font-family:Arial,sans-serif;font-size:13px;color:#666}

main .content-topic>ul>li:first-child{margin-right:20px}

main .content-topic .head-text{font-family:"Kanit";margin:15px 0 0}

main .content-topic .message{padding:15px;background:#fff;font-family:Arial,sans-serif;font-size:14px;color:#333;line-height:initial}

main .content-topic .comments{padding-top:20px;border-top:2px solid #0472FF;margin-top:30px}

main .content-topic .comments h3{margin:0}

main .content-topic .comment{padding:15px 15px 40px;background:#fff;font-family:Arial,sans-serif;font-size:14px;color:#333;line-height:initial;margin-bottom:25px;border:2px solid #e8f3dc;position:relative}

main .content-topic .comment .by{margin-bottom:10px}

main .content-topic .comment .by-admin{color:#77923c}

main .content-topic .comment .no{padding:5px 15px;margin-top:15px;font-size:12px;color:#999;position:absolute;bottom:-10px;left:0;width:100%;text-align:right}

main .no-reponsive-structure{text-align:center}

main .no-reponsive-structure .structure{margin:0 10px;position:relative}

main .no-reponsive-structure .structure>div.clearfix{width:200px;display:inline-block;text-align:center;padding:10px;border:1px solid #77a757;border-radius:7px;margin-bottom:30px;background:#b3d69c}

main .no-reponsive-structure .structure .structure>div.clearfix{display:block}

main .no-reponsive-structure .row.one>.structure>div.clearfix:after{content:'';background:#b3d69c;width:2px;height:10px;position:absolute;bottom:10px;left:0;right:0;height:20px;margin:0 auto}

main .no-reponsive-structure .row>.structure .structure>div.clearfix:last-of-type:after{display:none}

main .no-reponsive-structure .row>.structure .structure>div.clearfix:not(:last-of-type):after{bottom:-40px;content:'';background:#b3d69c;width:2px;height:10px;position:absolute;left:0;right:0;height:40px;margin:0 auto}

main .no-reponsive-structure .row>.structure .structure>div.clearfix:after{display:none}

main .no-reponsive-structure .row.many>.structure:before{content:'';background:#b3d69c;width:10px;height:2px;position:absolute;top:-21px;width:101%;left:0;right:0;margin:0 auto}

main .no-reponsive-structure .row.many>.structure:after{content:'';background:#b3d69c;top:-21px;left:0;right:0;width:2px;height:22px;margin:0 auto;position:absolute}

main .no-reponsive-structure .row.many>div.structure:first-of-type:before{width:51%;left:50%;background:#b3d69c}

main .no-reponsive-structure .row.many>div.structure:last-of-type:before{width:50%;right:50%;background:#b3d69c}

main .no-reponsive-structure h2+div.clearfix{position:relative}

main .no-reponsive-structure h2+div.clearfix:before{content:'';background:#b3d69c;width:2px;height:20px;position:absolute;top:100%;left:0;right:0;margin:0 auto}

main .no-reponsive-structure .row.one>.structure:before{content:'';position:absolute;left:0;right:0;height:22px;width:2px;top:-22px;background:#b3d69c;margin:0 auto}

main .no-reponsive-structure .structure .row.one>.structure:before{height:40px;top:-40px}

main .no-reponsive-structure .structure.no-header .row.one>.structure:before{display:none}

main .no-reponsive-structure .structure.no-header >div.clearfix:before{display:none}

main .no-reponsive-structure .structure .structure>div.clearfix{position:relative}

main .no-reponsive-structure>div.row.one:first-of-type>div.structure:before{display:none}

main .no-reponsive-structure h2{margin:0;line-height:23px;font-size:24px}

main .no-reponsive-structure h4{margin:0;line-height:21px;font-size:22px}

main .no-reponsive-structure h2>span{padding:7px 10px;border-radius:7px;background:#b3d69c;color:#000;display:block;font-weight:300;font-size:16px;line-height:21px;margin:0 auto;margin-bottom:10px;max-width:200px;border:1px solid #b3d69c;white-space:normal}

main .no-reponsive-structure h4>span{padding:7px 10px;border-radius:7px;background:#b3d69c;color:#000;display:block;font-weight:300;font-size:16px;line-height:21px;margin:0 auto;margin-bottom:10px;max-width:200px;border:1px solid #b3d69c;white-space:normal}

main .no-reponsive-structure h3{margin:0 0 5px;line-height:18px;font-size:16px}

main .no-reponsive-structure img{margin-bottom:10px}

main .no-reponsive-structure h3 ~p{margin:0;font-size:13px;font-family:Arial,sans-serif;color:#333}

main .no-reponsive-structure .row{padding:10px 30px 0}

main .no-reponsive-structure .row>div{float:none;margin:0 5px;padding:0;display:inline-block;vertical-align:top}

main .no-reponsive-structure .structure img{width:120px;border:1px solid #fff}

main .no-reponsive-structure .row>div.structure{padding:0 35px;margin:0}

main .no-reponsive-structure .structure .structure>div.clearfix{width:200px;border:0;padding:10px;margin:0 0 30px;max-width:100%;background:#f0f0f0}

main aside>div#menus{padding-bottom:10px;border-top:4px solid #478dbb;background:#DEECF8}

main aside>div#menus h3{color:#fff;background:#035B96;padding:6px 15px 9px;margin:0;background-position:top center;background-repeat:repeat;margin-bottom:10px;font-size:18px;position:relative}

main aside>div#menus h3:before{content:"";position:absolute;top:0;left:-4px;background:#478dbb;height:100%;width:4px}

main aside>div#menus h3:after{content:"";position:absolute;bottom:-4px;left:-3px;transform:rotate(45deg);border:4px solid blue;border-color:transparent;border-bottom-color:#000}

main aside>div#menus ul.menu>li>a{color:#fff;font-family:"Kanit";line-height:initial;display:inline-block;padding:1px 15px;position:relative}

main aside>div#menus ul.menu>li>a:before{content:'\f0a9';font-family:"FontAwesome";margin-right:5px;font-size:12px}

main aside>div#menus ul.menu>li>a:hover,main aside>div#menus ul.menu>li>a:focus{color:#2b2b2b}

main aside>div#menus ul.menu>li>a[href="javascript:void(0)"]:hover,main aside>div#menus ul.menu>li>a[href="javascript:void(0)"]:focus{cursor:text;color:#fff}

main aside>div#menus ul.menu>li.sub-menu>a:before{content:'\f0ab'}

main aside>div#menus ul.menu ul>li>a{color:#013579;font-family:"Kanit";display:inline-block;padding-left:20px;line-height:initial;display: grid;grid-template-columns: max-content auto;font-size: 16px;}

main aside>div#menus ul.menu ul>li>a:hover,main aside>div#menus ul.menu ul>li>a:focus{color:#000}

main aside>div#menus ul.menu ul>li>a:before{content:'●';margin-right:5px;font-size:12px}

main aside>div#menus .sub-menu h4{padding:6px 15px;background:#043769;font-size:18px;color:#fff;font-weight:300;text-shadow:0 1px 0 rgba(255,255,255,.1);position:relative}

main aside>div#menus .no-sub-menu h4{padding:6px 15px;background:#043769;font-size:18px;color:#000;font-weight:300;text-shadow:0 1px 0 rgba(255,255,255,.1);position:relative}

main aside>div#menus .no-sub-menu h4>a{color:#fff}

main aside>div#menus .no-sub-menu:hover h4{background:#043769;text-decoration:none;opacity: 0.7}

main aside>div#menus .sub-menu.toggle{cursor:pointer}

main aside>div#menus li:not(.sub-menu):not(.no-sub-menu) h4{padding:6px 15px 4px;background:#00A2F7;font-size:23px;color:#fff;font-weight:400;text-shadow:0 1px 0 rgba(255,255,255,.1);cursor:pointer;position:relative;margin-bottom:0}

main aside>div#menus li:not(.sub-menu):not(.no-sub-menu) h4 a{display:block;color:#fff}

main aside>div#menus li:not(.sub-menu):not(.no-sub-menu) h4 a span{display:inline-block;vertical-align:middle}

main aside>div#menus li:not(.sub-menu):not(.no-sub-menu) h4 i{font-size:14px;margin-right:5px;background:rgba(0,0,0,.1);display:inline-block;vertical-align:middle}

main aside>div#menus .sub-menu{position:relative}

main aside>div#menus .sub-menu ul{visibility:hidden;height:0;overflow:hidden;transition:.3s all;margin:0}

main aside>div#menus .sub-menu.active ul,main aside>div#menus .sub-menu.active ul{visibility:visible;height:auto;transition:.3s all}

main aside>div#menus .sub-menu:not(.active) h4{margin-bottom:0}

main aside>div#menus .sub-menu.toggle:after{content:'\f105';position:absolute;top:9px;right:10px;font-family:"FontAwesome";color:#d0f4ff}

main aside>div#menus .sub-menu.toggle.active:after,main aside>div#menus .sub-menu.toggle.active:after{content:'\f107'}



main aside>div#facebook{padding:15px 0}

main aside>div#facebook a{background:#4867AA;color:#fff;display:block;text-align:center;padding:10px;border-radius:4px;font-size:15px;font-weight:300}

main aside>div#facebook a:hover{background:#2a4c96;transition:.3s all}

main aside>div#partners{padding:15px;background:#393939;margin-bottom:10px;color:#fff;border-radius:4px}

main aside>div#partners h3{margin:0 0 5px}

main aside>div#partners select{font-family:Arial}

main aside>div#traffic{padding:15px;background:#EEEEEE;border-radius:7px;margin-top:15px;border:2px solid #d0e8c2}

main aside>div#traffic h3{margin:0 0 5px;text-align:center}

main aside>div#traffic table{width:100%;font-size:14px;font-family:Arial;margin-bottom:15px}

main aside>div#traffic table tr>td:last-child{text-align:right}

main aside>div#traffic p{font-family:Arial;color:#999;font-size:11px;margin:0;text-align:center}

main aside>div#inform a{display:block;margin-bottom:5px}

main aside>div#inform a img{width:100%}

main aside #search-form{position:relative;padding:15px 45px 15px 15px;background:#035B96;margin-bottom:10px;font-family:Arial,sans-serif}

main aside #search-form input.form-control{border:1px solid #00a2f7}

main aside #search-form input.form-control:focus{outline:none!important;box-shadow:none!important}

main aside #search-form button[type='submit']{position:absolute;top:15px;right:15px;min-width:initial;border-color:transparent;padding:5px 7px 4px;font-size:15px;border-radius:0 4px 4px 0;background:#00a2f7}

main .personel-style{width:550px;margin:0 auto;max-width:100%}

main .personel-style .personel{display:grid;grid-template-columns:200px auto;margin-bottom:15px;align-items:top;padding:10px;background:#DEECF8;border:1px solid #a6e4ff}

main .personel-style .personel a{display:inline-block;margin-right:15px}

footer>div{text-align:center;font-size:19px;font-weight:300}

footer>div>div{padding-top:20px;padding-bottom:10px}

/*edit*/

i.fa.fa-comments-o {background: none;font-size: 22px;margin-right: 12px;}

button[type='submit'] {background: #FFDE5A; border-color: #FFDE5A;color: #4c4436;}

i.fa.fa-home {color: #035B96;}

.bgff {box-shadow: 0 0px 10px rgba(0,0,0,0.2)}

footer>div>div p{line-height:initial;margin:0 0 5px;font-size:14px;color:#ddd}

footer>div>div a{color:inherit}

footer>div>div a:hover{color:#fff;text-decoration:underline}

.owl-dots{left:0;right:5px;text-align:right;bottom:5px}

.owl-dot{width:15px;height:5px;border-radius:2px;background:#fff}

.owl-dot.active{background:#FFDE5A}

.owl-carousel .owl-item img{border-radius:0}

.owl-carousel .animated{animation-duration:3s}

.owl-carousel .owl-item{font-family:"Kanit"}

.owl-carousel .owl-item p{position:absolute;bottom:0;left:0;width:100%;padding:15px 15px 13px;background:rgba(0,0,0,.75);color:#fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0;font-size: 16px;}

.detail{font-family:Arial,sans-serif;font-size:14px;color:#333;margin-bottom:20px}

.detail h1{font-size:28px;font-family:"Kanit";font-weight:300}

.detail h2{font-size:26px;font-family:"Kanit";font-weight:300}

.detail h3{font-size:22px;font-family:"Kanit";font-weight:300}

.detail h4{font-size:18px;font-family:"Kanit";font-weight:300}

.detail h5{font-size:17px;font-family:"Kanit";font-weight:300}

.detail h6{font-size:16px;font-family:"Kanit";font-weight:300}

.detail ul{list-style:disc;padding-left:30px}

.detail li{list-style:disc}

.detail img{max-width:100%!important;height:auto!important}

.fancybox-skin{padding:10px!important}

#fancybox-loading,.fancybox-close,.fancybox-prev span,.fancybox-next span{background:transparent}

#fancybox-loading:after,.fancybox-close:after{content:'✕';font-size:30px}

.fancybox-prev span:after{content:'\f104';font-family:"FontAwesome";font-size:50px;color:#fff}

.fancybox-next span:after{content:'\f105';font-family:"FontAwesome";font-size:50px;color:#fff}

.fancybox-close{color:#ccc;top:10px;right:15px;text-transform:uppercase;width:auto;height:auto}

.fancybox-close:hover{text-decoration:none;color:#fff}

.fancybox-title-float-wrap{bottom:50px}

.fancybox-nav span{top:44%}

.fancybox-next span{text-align:right}

.fancybox-overlay{z-index:10001}

.fancybox-wrap.fancybox-mobile{z-index:10002}

@media(max-width: 1299px) {

.container{width:1020px;max-width:100%}

header.stick nav{width:1020px}

header nav ul > li > a{padding:19px 7px;font-size:14px}

}

@media(max-width: 1199px){

	header nav{padding-left: 15px;padding-right: 15px}

}

@media(max-width: 1050px){

	header nav ul > li > a{padding: 19px 2px}

}

@media(max-width: 991px) {

	header nav ul > li > a{padding: 19px 8px}

	body{padding-top: 0;}

.sm-mb-20{margin-bottom:20px}

.sm-mb-80{margin-bottom:80px}

footer > .container > div{padding:15px 0 5px}

body{background:#fff}

#left-bar-button{display:block;position:fixed;bottom:6%;left:0;background:#043769;color:#fff;padding:6px 15px;z-index:11111;font-size:17px;border-radius:0 4px 4px 0;transition:.3s all;outline:none!important;text-decoration:none!important;box-shadow:2px 5px 6px -3px rgba(0,0,0,.3);border-left:3px solid #4D90FE}

#menu-bars-button{display:block;position:absolute;top:9px;right:15px;z-index:100;font-size:26px;color:#fff;outline:none!important;text-decoration:none!important}

body:not(.sidebar) #left-bar-button:after{content:'\f105';font-family:"FontAwesome";font-size:18px;margin-left:10px}

#left-bar{position:fixed;top:0;left:-300px;width:250px;overflow-x:hidden;overflow-y:scroll;z-index:1000;background:#fff;height:100%;visibility:hidden;transition:.3s all}

body.sidebar #left-bar{left:0;visibility:visible;transition:.3s all}

body.sidebar #left-bar-button{left:250px;transition:.3s all;border-left:0}

body.sidebar #left-bar-button:before{content:'\f104';font-family:"FontAwesome";font-size:18px;margin-right:10px}

body.sidebar.stick #left-bar{top:55px;transition:.3s all}

body.sidebar .overlay{display:block}

header nav{position:relative;z-index: 1}

header.stick nav{max-width:100%}

header nav ul{position:relative;padding-top:55px}

header nav ul>li:not(:first-child){display:none}

header nav ul > li{display:block;float:none;background:inherit;text-align:left;border-top:1px solid #b0cf69}

header nav ul > li:nth-child(2){border-top:1px solid #8dad42}

header nav ul > li:first-child{float:none;position:absolute;top:-1px;margin:0}

header nav ul > li > a{padding:9px}

body.menu-bar header nav ul>li:not(:first-child){display:block}

body.menu-bar #menu-bars-button>i:before{content:'\f00d'}

main .list-style4 .item{width:20%}

main aside>div#menus .sub-menu h4:before,main aside>div#menus .sub-menu h4:after{display:none}

main #management{padding-top:10px}

main #management h4{font-size:20px}

main #management h4+p{font-size:17px}

main aside>div#menus h3{font-size:17px}

main aside>div#menus .sub-menu h4{font-size:16px}

footer>div>div p{color:#ddd}

header nav li.sub-menu ul{position:relative;width:100%;max-width:100%!important;background:rgba(255,255,255,.4);top:initial;left:initial;padding:0;margin:0}

header nav li.sub-menu ul>li:first-child{position:relative;top:initial}

main aside>div#menus .no-sub-menu h4>a{color:#fff;font-size:16px}}

@media(max-width: 767px) {

body.menu-bar header.stick nav>ul{max-height: 80vh;overflow: scroll;overflow-x: hidden;}

main aside>div#menus ul.menu ul>li>a{padding-left:15px}

main .list-style4 .item{width:25%}

main .content-topic{background:transparent;padding:0}

main .downloads{overflow-x:scroll;overflow-y:hidden}

main #map iframe{height:200px}

main #contact-form form{padding:0;background:transparent}

.dataTables_wrapper .dataTables_paginate .paginate_button{padding:1px 8px}

main #webboard-form form{padding:0;background:transparent}

h1{font-size:20px;line-height:20px}

h1.heading{padding:10px}

h2{font-size:20px;line-height:20px}

main #webboard-form h2{font-size:20px;line-height:20px}

.xs-db{display:block}

.xs-dn{display:none}

#pagination{padding-top:0;text-align:center}

.nav-tabs > li{width:30%}

.nav-tabs > li.active{width:70%}

.nav-tabs > li>a{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:7px 10px 5px}

.detail h2{font-size:22px}

.detail h3{font-size:20px}

.detail h4{font-size:18px}

.detail h5{font-size:17px}

main #page .content>h2{font-size:22px}

.xs-pb-15{padding-bottom:15px}

#webboard>div.table-responsive{overflow-y:hidden;overflow-x:scroll}

#webboard table{min-width:300px}

main .list-style1 .list .image{margin-bottom:10px}

main .list-style2 .item{width:50%}

header #information{padding:10px}

body #left-bar-button{background:#043769}

body #left-bar-button:hover{background:rgb(0, 162, 247)}

body.sidebar #left-bar-button{width:35px;overflow:hidden;color:transparent}

body.sidebar #left-bar-button:before{color:#fff}

footer > .container > div p{font-size:13px;font-weight:400;font-family:Arial,sans-serif;color:#ddd}

main aside > div#traffic{margin-bottom:70px}

main .structure-style>.col5{width:50%}

main .structure-style>.col4{width:50%}

main .structure-style>.col3{width:50%}

main .content-topic .message{padding:15px 0}

.btn-primary{font-size:16px}

header #google_translate_element{opacity:.75;top:5px;right:5px}

#webboard tr>td:first-child{min-width:180px}

.container.pb30{padding-bottom:0}

main .list-style3.col3 .item{width:50%}

main .select-child-page{position:relative}

main .select-child-page>div h3{display:none}

main .select-child-page{display:block}

main .select-child-page>div{display:none}

main aside>div#facebook iframe{height:250px!important}

.fancybox-nav span{visibility:visible;opacity:.5}

header #information>div>span{display: none;}

header #information>div{display: block;}

header #information marquee{padding-top: 0;}

}

@media(max-width: 549px) {

main .list-style4 .item{width:33.33%}

main .list-style3 .item{width:100%}

main .list-style2 .item{width:100%}

main .list-style3.col3 .item{width:100%}

main .select-child-page select{width:100%}

main .personel-style .personel{grid-template-columns:150px auto}

}

@media(max-width: 499px) {

header #banner{min-height:150px;max-width:100%;overflow:hidden;background-size:cover;background-repeat:no-repeat;background-position:center center}

header #banner img{display:none}

.structure-style3 .col-xs-4{width:100%}

}

@media(max-width: 399px) {

main .personel-style .personel{grid-template-columns:100px auto}

main .personel-style .personel h3{margin-top:0}

main .list-style4 .item{width:50%}

.structure-style2 .col-xs-6{width:100%}

main .downloads table{max-width:400px;width:400px}

.g-recaptcha{transform:scale(.75);transform-origin:top left}

main .structure-style .structure{width:100%}

main .structure-style>.col1,main .structure-style>.col2,main .structure-style>.col3,main .structure-style>.col4,main .structure-style>.col5{width:100%;float:none}

main .structure-style h3{white-space:normal}

main .structure-style h3+p{height:auto}

}

@media(max-width: 349px) {

main .personel-style .personel{grid-template-columns:70px auto}

main .personel-style .personel h3+p{margin-bottom:0}

}