@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}
html,body{max-width:100%;overflow-x:hidden}
body{background:#fff;background-size:cover;background-position:top center;background-repeat:no-repeat;background-attachment:fixed}
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}
.bg-green{background:#6ca148}
.mb2{margin-bottom:2px}
.container{width:1170px;max-width:100%}
.btn-primary{color:#fff;font-size:18px;border-radius:30px;background:#000977;padding:5px 30px;border:1px solid #010175;font-weight:300}
.btn-primary.fs16{font-size: 16px;padding: 7px 30px}
.btn-primary:hover,.btn-primary:focus{background:#010175;border-color:#000977}
.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{background:#000977;border-color:#000977}
.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:#000977;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}
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:#000977;border-color:#000977;min-width:180px;transition:.3s all;font-weight:300}
button[type='submit']:hover,button[type='submit']:focus,button[type='submit']:active{background:#1a2285;color:#fff;border-color:#000977;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:#000977;color:#fff;line-height:14px}
.fa-download:hover{background:#010175}
.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}
header nav ul{text-align:right;background:#000977}
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:36px;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}
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:18px 12px}
header nav ul>li:first-child a:hover{background: initial;}
header nav ul>li.active>a,header nav ul>li>a:hover,header nav ul>li>a:focus{color:#fff;text-decoration:none!important;background: rgba(255,255,255,.1);}
header nav ul>li>a:focus,header nav ul>li>a:active{text-decoration:none;color:#fff}
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:#1a2285;border-top:0;color:#fff;font-size:13px;padding:10px 0;line-height:initial;position:relative;text-align:center;font-weight:400;position:relative;overflow:hidden;font-family:Arial,sans-serif;letter-spacing:1px;}
header #information h1{color:#fff;margin:0}
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,.5);background: #1a2285;}
header.stick nav ul{width:1170px;margin:0 auto;max-width:100%;background:transparent}
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}
main #management{margin-bottom:30px}
main #management h4{font-size:19px;color:#888;text-align:center;margin-bottom:0;letter-spacing:0px}
main #management h4+p{font-size:16px;color:#999;text-align:center;margin-bottom: 15px;}
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:#fff;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 .heading:after{}*/
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>img{display: inline-block;vertical-align: middle;margin-right: 5px;}
main .heading>span>span{display:inline-block;vertical-align:middle}
main .content{border:2px solid #eee;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:50%;padding:10px}
main .list-style2 .item h3{font-size:16px;color:#333;font-weight:400;line-height:20px;margin:0 0 5px;text-overflow:ellipsis;overflow:hidden;height:40px;margin-bottom:10px}
main .list-style2 .item h3>a{color:#333}
main .list-style2 .item h3>a:hover{text-decoration:underline}
main .list-style2 .item .description{height:38px;overflow:hidden}
main .list-style2 .item .date{font-size:13px;font-family:Arial;color:#999;margin:0}
main .list-style2 .item .read{font-size:13px;font-family:Arial;color:#999;margin:5px 0 0}
main .list-style3 .grid{margin:0 -10px}
main .list-style3 .item{width:33.33%;padding:10px}
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:40px;margin-bottom:10px}
main .list-style3 .item h3>a{color:#333}
main .list-style3 .item h3>a:hover{text-decoration:underline}
main .list-style3 .item .description{height:38px;overflow:hidden}
main .list-style3 .item .date{font-size:13px;font-family:Arial;color:#999;margin:0}
main .list-style3 .item .read{font-size:13px;font-family:Arial;color:#999;margin:5px 0 0}
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>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}
main #page .content>ul{margin-bottom:15px;display:inline-block;border-bottom:1px solid #000977;padding-bottom:2px}
main #page .content>ul>li{display:inline-block;vertical-align:middle;font-family:Arial,sans-serif;font-size:13px;color:#999}
main #page .content>ul>li:first-child{margin-right:20px}
main .downloads{font-family:Arial,sans-serif}
main .downloads table tr>th{color:#333;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 h3{font-size:20px;margin:0 0 5px}
main .downloads .text-link{color:#333}
main .downloads .text-link:hover{color:#333;text-decoration:underline}
main .downloads td{font-size: 14px;}
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}
main .select-child-page select{padding:2px;max-width:200px}
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:200px;display:inline-block;max-width:100%;padding:5px}
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:#000977;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
main .structure-style h3+p{font-family:Arial,sans-serif;font-size:14px;height:45px;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:#f5ffea;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 #000977;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 #001ba0;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 #a6d973;position:relative}
main .content-topic .comment .by{margin-bottom:10px}
main .content-topic .comment .by-admin{color:#000977}
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 #000977;background:#001ba0}
main aside>div#menus h3{color:#fff;background:#010175;padding:6px 15px 9px;margin:0;background-size:cover;background-position:top center;background-repeat:no-repeat;margin-bottom:10px;font-size:18px;position: relative;}
main aside>div#menus h3:before{content:"";position:absolute;top:0;left:-4px;background:#010175;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:#01014e}
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:#f8f4e9;font-family:"Kanit";display:block;padding:10px 10px 10px 25px;line-height:initial;background: rgb(14, 23, 134);margin-top: 1px;}
main aside>div#menus ul.menu ul>li>a:hover,main aside>div#menus ul.menu ul>li>a:focus,main aside>div#menus ul.menu ul>li.active>a{background:rgb(34, 46, 189)}
main aside>div#menus ul.menu ul>li>a:before{content:'■';margin-right:5px;font-size:12px;display: inline-block;vertical-align: middle;}
main aside>div#menus .sub-menu h4{padding:10px 15px;background:#000977;font-size:16px;color:#fff;font-weight:300;position:relative;margin:0;}
main aside>div#menus .sub-menu.toggle{cursor:pointer}
main aside>div#menus li:not(.sub-menu) h4{padding:10px 15px;background:#000977;font-size:16px;color:#fff;font-weight:300;cursor:pointer;position:relative;margin:0 0 1px}
main aside>div#menus li:not(.sub-menu) h4 a{display:block;color:#fff}
main aside>div#menus li:not(.sub-menu) h4:hover,main aside>div#menus li.active:not(.sub-menu) h4{background: rgb(34, 46, 189)}
main aside>div#menus li:not(.sub-menu) h4 a span{display:inline-block;vertical-align:middle}
main aside>div#menus li:not(.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.toggle{position:relative}
main aside>div#menus .sub-menu.toggle ul{visibility:hidden;height:0;overflow:hidden;transition:.3s all;margin:0}
main aside>div#menus .sub-menu.toggle.active ul,main aside>div#menus .sub-menu.toggle.active ul{visibility:visible;height:auto;transition:.3s all}
main aside>div#menus .sub-menu.toggle:not(.active) h4{margin-bottom:0}
main aside>div#menus .sub-menu.toggle:after{content:'\f0a9';position:absolute;top:11px;right:10px;font-family:"FontAwesome";color:#eee}
main aside>div#menus .sub-menu.toggle.active:after,main aside>div#menus .sub-menu.toggle.active:after{content:'\f0ab'}
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:#1a2285;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:#e1efff;border-radius:7px;margin-top:15px;border:2px solid #001ba0}
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:#0e5194;margin-bottom:10px;font-family:Arial,sans-serif}
main aside #search-form input.form-control{border:1px solid #000977}
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:#000977}
footer>div{text-align:center;font-size:19px;font-weight:300}
footer>div>div{padding-top:20px;padding-bottom:10px}
footer>div>div p{line-height:initial;margin:0 0 5px;font-size:14px;color:rgba(255,255,255,.75)}
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:10px;height:10px;border-radius:4px;background:rgba(0,0,0,.2)}
.owl-dot.active{background:#000977}
.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 12px;background:rgba(255,255,255,.75);color:#000;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0}
.textEditor{font-family:Arial,sans-serif;font-size:14px;color:#333;margin-bottom:20px}
.textEditor h1{font-size:28px;font-family:"Kanit";font-weight:300}
.textEditor h2{font-size:26px;font-family:"Kanit";font-weight:300}
.textEditor h3{font-size:22px;font-family:"Kanit";font-weight:300}
.textEditor h4{font-size:18px;font-family:"Kanit";font-weight:300}
.textEditor h5{font-size:17px;font-family:"Kanit";font-weight:300}
.textEditor h6{font-size:16px;font-family:"Kanit";font-weight:300}
.textEditor ul{list-style:disc;padding-left:30px}
.textEditor li{list-style:disc}
.textEditor 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 8px;font-size:14px}
}
@media(max-width: 991px) {
.sm-mb-20{margin-bottom:20px}
footer > .container > div{padding:15px 0 5px}
#left-bar-button{display:block;position:fixed;bottom:6%;left:0;background:#000977;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 #1a2285}
#left-bar-button:hover{background:#1a2285}
#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}
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:#000977;border-right:0;text-align:center;border-top:1px solid #1a2285}
header nav ul > li:nth-child(2){border-top:1px solid #000977}
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 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:#494949}
}
@media(max-width: 767px) {
body{background: #fff !important;}
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}
.textEditor h2{font-size:22px}
.textEditor h3{font-size:20px}
.textEditor h4{font-size:18px}
.textEditor 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}
header #information{padding:10px}
/*body #left-bar-button{background:rgba(90,177,40,.75)}
body #left-bar-button:hover{background:rgba(90,177,40,1)}*/
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:#999}
main aside > div#traffic{margin-bottom:70px}
main .list-style3 .item{width:50%}
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}
}
@media(max-width: 549px) {
main .list-style4 .item{width:33.33%}
main .list-style2 .item{width:100%}
}
@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-style2 .col-xs-4{width:100%}
}
@media(max-width: 399px) {
main .list-style3 .item{width:100%}
main .list-style4 .item{width:50%}
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}
}
.structure-style3 .col-xs-6{width:100%}