* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

@font-face {
    font-family: THSarabunNew;
    src: url("../fonts/THSarabunNew/THSarabunNew.ttf");
}

html {
    scroll-behavior: smooth;
    width: 100% !important;
    height: 100% !important;
    overflow-x: hidden !important;
}

body {
    font-family: THSarabunNew !important;
    background: transparent;
}

ul {
    list-style-type: none;
}

a {
    text-decoration: none;
     color: #353030; 
}

a:hover {
    /* color: #ee3700; */
}

p {
    margin-bottom: 0rem;
}

.header {
    position: fixed;
    text-align: center;
    width: 100%;
     display:  flex; z-index: 4; padding: 0;
}

header .info-title {
    background-image: linear-gradient(to right, #DA22FF, #9733EE);
    padding: 10px 0px;
}

header .logo .logo-light {
  
}
#navbar {
    flex-flow: column; position: relative; z-index: 4;
}
nav.navbar {
    display: flex;
    width: 100%;
    align-items: center;
    justify-items: center;
    justify-content: center;     
}

nav.navbar .pc_nav {
    display: flex;
    width: 100%;
    align-items: center;
    justify-items: center;
    justify-content: right;
}

footer .navbar-nav{
    flex-direction : unset;
}
nav.navbar .navbar-nav .nav-item {
    padding: 0 10px;
}

nav.navbar .navbar-nav .nav-item .nav-link {
    color: #0a0a0a;
    font-size: 1.4rem;
    margin-left: 0px;
    padding: 0px 0px 0px 0px;
    font-weight: 600;
    display: flex;
    align-items: center;
border-bottom: transparent solid 3px;
    transition: 0.1s;
}

nav.navbar .navbar-nav .nav-item .nav-link:hover {
    color: #fff !important;
    border-bottom: #1693f9 solid 3px;
    transition: 0.1s;
}


nav.navbar .navbar-nav .nav-item .nav-link.active {
    transition: 0.1s;
    color: #1693f9;
    border-bottom: #1693f9 solid 3px;
}





/* --------------------- */
#top_sec {
    background: #f4f4f4;
    padding-bottom: 5%;
}

#top_sec_dis {
    position: relative;
    z-index: 1;
    top: -100px;
}

#top_sec_bg_img {
    position: absolute;
    width: 100%;
    z-index: 0;
}

#top_sec_bg_img img {
    width: 100%;
}

#executive_1,
#executive_2 {
    position: relative;
    z-index: 1;
    top: 85px;
    text-align: center;
}

#executive_1 img,
#executive_2 img {
    width: 75%;
}

#top_img_btn {
    display: flex;
    width: 100%;
    height: 60%;
    justify-content: center;
    justify-items: center;
    align-items: center;
}

#top_img_btn a {
    margin-right: 50px;
}

#top_img_btn a img {
    width: 100%;
}

/* --------------------- */


/* ----------Main section----------- */
.sec_title {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    justify-items: center;
    align-items: center;

    padding: 35px 0;
}

.sec_title img {
    width: 100%;
}



section#sec_vision {
    background: #f4f4f4;
    border-top: solid #e5e6e7 30px;

    position: relative;
    top: 5px;
}


section#sec_top_news {
    background-image: url(../web_design/top_news_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

section#sec_news_update {
    background-image: url(../web_design/sec_news_update.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}


section#sec_news_events {
    background: #fff;
}


section#sec_news_tab {
    background-image: url(../web_design/sec_news_tab.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}



section#sec_news_tab .nav-tabs {
    display: flex;
    justify-content: center;
    justify-items: center;
    align-items: center;

    width: 100%;
    height: auto;
    border-bottom: 0;
}

section#sec_news_tab .nav-tabs .nav-link {
    background: #e6d5f4;
    font-size: 1.5rem;
    font-weight: 600;
    color: #242424;
    padding: 0.5rem 2.5rem 0rem 2.5rem;
    transition: 0.3s;
    letter-spacing: normal;
    border-radius: 1px;
    margin: 0 5px;
}

section#sec_news_tab .nav-tabs .nav-link:hover {
    color: #242424;
    transition: 0.3s;
    letter-spacing: 2px;
}

section#sec_news_tab .nav-tabs .nav-link.active {
    color: #242424;
    background: #FABB00;
}

section#e_oss {
    background-image: url(../web_design/oss_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

    padding: 20px 0px 20px 0px;
}

#oss_img {
    justify-content: center;
    align-items: center;
    justify-items: center;

    text-align: center;
}

#oss_img a img {
    transition: 0.3s;
}

#oss_img a:hover img {
    transition: 0.3s;
    transform: scale(1.2);
}

#oss_img_0 {
    width: 100%;
}

#oss_img_1,
#oss_img_2,
#oss_img_3 {
    width: 80px;
    margin: 25px 10px 10px 10px;
}

#oss_title h5 {
    color: #242424;
    font-weight: 600;
    margin-bottom: 0rem;
}


section#sec_public_service {
    background-image: url(../web_design/public_service_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

    padding: 0px 0px 70px 0px;
}


#sec_public_service img {
    width: 100%;
}


section#sec_e_service {
    background-image: url(../web_design/e_service_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

    padding: 0px 0px 70px 0px;
}

#sec_e_service img {
    width: 100%;
}


section#sec_hearing_op {
    background-image: url(../web_design/hearing_op_bg.webp);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;

    padding: 0px 0px 70px 0px;
}

#sec_hearing_op img {
    width: 100%;
}

section#sec_videos {
    background: #f7f4ff;
}


.item_related {
    /* display: flex;
    width: 100%; */
    background: #fff;
}

.item_related img {
    width: 150px;
}

section#sec_Trophy {
    background: #fff;
    padding: 50px 0px;
}


#sec_Trophy img {
    width: 250px;
}



section#sec_attraction {
    background-image: url(../web_design/attraction_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

    padding: 0px 0px 70px 0px;
}

section#sec_attraction .topic_title {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

section#sec_attraction .topic_title img,
section#sec_attraction .topic_title a img {
    width: 100%;
    padding: 0 10px;
}


/* --------tourist_attraction-------- */
._item_0 {
    transform: rotate(352deg);
}

._item_1 {
    transform: rotate(6deg);
}

._item_2 {
    transform: rotate(350deg);
}

._item_0 figcaption img {
    width: 100%;
}

._item_1 figcaption img {
    width: 100%;
}

._item_2 figcaption img {
    width: 100%;
}

._item_0,
._item_1,
._item_2 {
    padding: 50px;
}

/* --------/tourist_attraction-------- */




section#index_google_maps {
    margin-bottom: -34px;
}

section#index_google_maps a img {
    width: 100%;
}




section#related_agencies {
    background-image: url(../web_design/related_agencies_bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 20px 0px;

    position: relative;
    z-index: 0;
}

/* --------------------- */







/* ------------------------doc_item------------------------ */
/* .doc_item {
    width: 100%;
    padding: 0px 20px 0px 0px;
} */

.doc_item .list_item {
display: flex;
    padding: 3px 10px 3px 10px;
    justify-content: space-between;
    transition: 0.1s; align-items: center;
}

.doc_item a:hover .list_item {
    background: #cdcbcb;
}

/* .doc_item a:hover .list_item .post_topic{
    color: #fff;
  } */

.doc_item .list_item img {
    width: 45px;
    height: fit-content;
    margin: 0px 5px 0px 0px;
}

.doc_item .list_item p {
    margin-left: 5px;
}

.post_topic .fa-chevron-right {
    font-size: xx-small;
    font-weight: bold;
    color: #242424;
}

/* .post_topic,
.post_date {
    display: flex;
    align-items: center;

    color: #242424;
    font-size: 1.5rem;
    font-weight: 600;
} */

.item_position {
    display: flex;
    align-items: center;
    justify-content: space-between;

    background: #fff;
    border-radius: 5px;
    border: solid #ccc 2px;
    padding: 0px 10px;

    transition: 0.3s;
}

.item_position:hover {
    transform: scale(0.9);
    transition: 0.3s;
}

.post_topic {
    display: flex;
    /*flex-wrap: wrap;*/
    align-items: center;

    color: #242424;
    font-size: 1.5rem;
    font-weight: 600; width: 80%;
}


.post_topic p {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.post_date {
    display: flex;
    justify-content: center;
    font-size: 20px;
    width: 85px;
    color: #1693f9;
    /* margin-top: 70px; */
}

.widget_poll {
    background: #fff;
    padding: 10px;
    border-radius: 5px;
}

.post_download {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #0a0a0a;
    border-left: solid #9c9ea1 3px;
    margin-left: 60px;
}

/* ------------------------------------------------ */

























.footer {
   /* background-image: url(../../../assets/img/bg-footer.png);
    background-repeat: no-repeat;
    background-position: bottom center;*/
}

footer .copyright {
    text-align: center;
    background: #7a0f9a;
    color: #fff;
    font-weight: 600;
}

footer .copyright a {
    font-weight: bold;
    color: #fff;
}

.foot_line {
    border: solid 6px #f8b500;
}


footer .footer_info {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0px 0px 25px 0px;
    color: #282828;
}

footer .footer_info img {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0px 0px 25px 0px;
    color: #282828;
}

footer .footer_info .f_text {
    margin-left: 20px;
    margin-top: 20px;
    color: #fff;
    font-weight: 500;
    font-size: 22px;
}

footer .footer_info .f_text p {
    margin-bottom: 0.5rem;
}

footer .footer_info .f_text h3 {
    font-weight: 600;
    color: #fff;
}

footer .footer_info .f_text .contact-item {
    font-weight: 500;
    color: #fff !important;
}

footer .footer_info .f_text .contact-item div a {
    font-weight: 500;
    color: #fff !important;
}

footer .f_siteMaps {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

footer .f_siteMaps_btn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
}

footer .f_siteMaps_btn .f_siteMaps_btn_2 {
    margin-left: 25px;
}

footer .f_siteMaps_btn .f_siteMaps_btn_1,
footer .f_siteMaps_btn .f_siteMaps_btn_2 {
    width: 70px;
}

footer .f_siteMaps .navbar .nav-link {
    width: max-content !important;
   
    line-height: 5px !important;
    color: #fff !important;
    font-size: 24px !important;
    font-weight: 500 !important;
}





footer .f_maps_btn {
    display: flex;
    justify-content: end;
    align-items: center;

    font-size: 18px;
}

footer .f_maps_btn .f_maps_btn_1 {
    background: #002971;
    color: #fff;
    padding: 1px 20px 1px 20px;
    border-radius: 5px;
    transition: 0.4s;
    font-weight: 500 !important;
    margin-right: 5px;
}

footer .f_maps_btn .f_maps_btn_2 {
    background: #1693f9;
    color: #fff;
    padding: 1px 20px 1px 20px;
    border-radius: 5px;
    transition: 0.4s;
    font-weight: 500 !important;
}
/*
footer .row.row_cus {
    padding-bottom: 500px;
}*/
.footer-img{ width:100% }













/* --------------------- tricks style -------------------- */
.post-image img {
    width: 100%;
}

.slide a img {
    transition: 0.3s;
}

.slide a:hover img {
    transition: 0.3s;
    transform: scale(0.8);
}

/* figcaption imagehover */

[class*=" imghvr-"] figcaption,
[class^="imghvr-"] figcaption {
    background-color: #fff !important;
    padding: 0px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #fff;
}

[class*=" imghvr-"],
[class^="imghvr-"] {
    position: relative;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    background-color: #fff;
    color: #fff;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    transform: translateZ(0);
    box-shadow: 1px 2px 10px #000000e7;
}

.spin_360deg {
    transition: 0.6s;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -ms-transition: 0.6s;
    -o-transition: 0.6s;

    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.spin_360deg:hover {
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;

    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.transform_scale_small {
    transition: 0.3s;
    transform: scale(1);
}

.transform_scale_small:hover {
    transition: 0.3s;
    transform: scale(0.8);
}

.transform_scale_big {
    transition: 0.3s;
    transform: scale(1);
}

.transform_scale_big:hover {
    transition: 0.3s;
    transform: scale(1.5);
}

/* @keyframes spin {
    from {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  } */

.img-block a {
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    border-radius: 2px;
    /* border          : solid #eee 2px; */
}


.row_view_more {
    display: flex;
    align-items: center;
    justify-content: right;
    justify-items: center;
}

.view_more_btn {
    background: #1693f9;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    padding: 2px 15px 2px 15px;
    border-radius: 8px;
}
.view_more_btn:hover{
    color: #fff;
}

.view-btn {
    display: flex;
    justify-content: space-between;
    align-items: end;

    color: #1693f9 !important;
    font-weight: 600;
}

.view-btn a {
    color: #1693f9 !important;
    font-weight: 600;
}

.card .card-body .card-title {
    color: #0a0a0a;
    font-weight: bold;
    text-align: start;
}


/*  */
#sec_vision .card .card-body .card-title {
    color: #1693f9;
    font-weight: bold;
    font-size: 2rem;
}

#sec_vision .card .card-body .view-btn {
    display: flex;
    justify-content: center;
    align-items: end;
    width: 100%;
}

#sec_vision .card .card-body .view-btn a {
    color: #1693f9;
    font-weight: bold;
    font-size: 2rem;
}
/*.firstPage img:nth-of-type(1){
    max-height: 100vh;
}*/
    .firstPage tr:first-child img{
        max-width: 100%;
            max-height: calc(100vh - 100px);
    } 

@media  (min-width: 768px) {
/*    .firstPage tr:first-child img{
        max-height: 100vh;
        max-width: 100%;
    } */ 
}
@media  (max-width: 767px) {
    .firstPage img{
        max-width: 100%;
    }
}
/*  */
/* -------------------------------------------------------------------------- */