.table.tx_researcher {
    border-bottom: 1px solid #ddd
}
.tx_researcher tbody tr:hover {
    background-color: #eee;
}
.tx_researcher strong {
    color: #8c1515;
    font-weight: normal;
}
.tx_researcher a:hover {
    cursor: pointer;
}
.f3-widget-paginator {
    display: inline-block;
    padding-left: 0;
    margin: 10px 0;
    border-radius: 4px;
    float: right;
}
.f3-widget-paginator>li {
    display: inline;
}
.f3-widget-paginator>li>a, .f3-widget-paginator>li.current {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #8c1515;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}
.back-to-list a {
    border: 1px solid #ddd;
    padding: 5px 20px;
}
.f3-widget-paginator>li.current {
    font-weight: bold;
}
.f3-widget-paginator {float:none;margin-bottom:30px;}
.f3-widget-paginator>li.current {padding: 0;border: 0;}
.f3-widget-paginator>li.current a {background:#8c1515;color:#fff;}

.frame-layout-1 img.image-embed-item {width:100% !important;height:auto !important;}
.frame-layout-2 img.image-embed-item {width:auto !important;height:auto !important;}
.ce-headline-center {text-align:center;}

.img-shadow{box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px;}

.frame-space-before-extra-small{margin-top:5px;}
.frame-space-before-small{margin-top:15px;}
.frame-space-before-medium{margin-top:30px;}
.frame-space-before-large{margin-top:45px;}
.frame-space-before-extra-large{margin-top:60px;}

.frame-space-after-extra-small{margin-bottom:5px;}
.frame-space-after-small{margin-bottom:15px;}
.frame-space-after-medium{margin-bottom:30px;}
.frame-space-after-large{margin-bottom:45px;}
.frame-space-after-extra-large{margin-bottom:60px;}

.ce-textpic .ce-gallery img, .ce-image .ce-gallery img {width:auto;height:auto;overflow:hidden;max-width: 100%;margin-bottom: 8px;}
.ce-center {text-align:center}
.ce-border img {border: 10px solid #FFFFFF;box-shadow: rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px;}



.ce-left .ce-gallery {margin: 0 15px 0 0;}
.ce-right .ce-gallery {margin: 0 15px 0 15px;}
.bx-controls.bx-has-pager {margin:15px 0;}
.bx-controls.bx-has-pager .bx-pager {display: flex;width: 100%;flex-wrap: wrap;justify-content: flex-end;column-gap: 5px;row-gap: 10px;}
.bx-controls.bx-has-pager .bx-pager div {margin }
.bx-controls.bx-has-pager .bx-pager div a { display: table-cell; width: 15px; height: 15px; border: 1px solid #E10600; background: #fff; color: #fff; border-radius: 50%; text-align: center; vertical-align: middle; font-size:0;}
.bx-controls.bx-has-pager .bx-pager div a.active {background: #E10600;}

.news.news-single h1 {font-size: 200%;font-weight: bold;}
.news.news-single .news-text-wrap {font-weight: 300;font-size:90%;}
.shortcutmenu-mobile .action-size-list {padding:0 0 15px 25px;}
.shortcutmenu-mobile .action-size-list div{justify-content: flex-start;}
.navbar-header .shortcutmenu ul.table {margin: 0 0 10px 0;}
.navbar-header .shortcutmenu {position: relative !important; top: 0 !important; right: 0; }
.shortcutmenu a {padding: 0 0 0 8px;}
.navbar-default .navbar-toggle {margin:10px;}

ul.list-two-column{ column-count: 2; list-style-type: none;margin:0; padding:0;}
ul.list-two-column li{border-bottom:1px solid #eeeeee;padding:5px 0px;}

/*---Update after 23 November 2023, please add below this section only---*/
strong,b {font-family:inherit!important;color: inherit !important;font-weight: bold;}
header .header-menu-bar .menu-list > li.has-submenu > a.disabled {cursor:pointer;}
header .header-menu-bar .menu-list > li.has-submenu > a { padding-right: 2rem; 
}
header .header-menu-bar .menu-list > li.has-submenu > a:after { right: 1rem;}
.sdg-type{display:flex}
.sdg-type .sdg-item-headline{width:3rem}
.sdg-type a {color:#fff;}
.sdg-type a:hover {color:#eee;}
.shortcut-banner img:hover{filter:grayscale(0%);filter:gray;-webkit-filter:grayscale(0%);filter:none;transition:1s ease;-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.05);box-shadow:rgba(17,12,46,0.15) 0 48px 100px 0}
.news-list-view img:hover{filter:grayscale(100%);-webkit-filter:grayscale(0%);-webkit-transition:all 1s ease;box-shadow:rgba(50,50,93,0.25) 0 50px 100px -20px,rgba(0,0,0,0.3) 0 30px 60px -30px}
.news-list-date{color: #646469;    font-size: 90%;    font-family: 'athitisemibold', sans-serif;}
.blog-shortcutmenu ul{margin:0;padding:0;list-style:none;display:flex;justify-content:space-between;align-items:stretch;gap:15px}
.blog-shortcutmenu ul li{margin:0;padding:30px 0;flex-basis:100%;border-radius:10px;background:#F2EBDA;color:#544216;text-align:center;text-transform:uppercase;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.blog-shortcutmenu a{margin:auto;color:#544216;font-size:1.25rem;font-weight:700}
.blog-shortcutmenu ul li:hover{color:#fff;background:#8c1515;cursor:pointer}
.blog-shortcutmenu ul li:hover a{color:#fff;text-decoration:none}
.side-menu ul li.active a {color:#cf2d1e;}

.card-img-top { width: 100%; height: auto; object-fit: cover; -o-object-fit: cover; object-position: top; -o-object-position: top;}
.slick-autoplay-toggle-button {display:none;}
.slick-slider .slick-dots li button {width: 1.5rem;height: 1.5rem;}

header .header-primary .head-search-form form button{font-size: 2rem;top: -0.3rem;}

@media (min-width: 320px) {
	.card-img-top{height:30vw}
	.card-img-2col{height:30vw}
	.card-img-3col{height:60vw}
	.card-img-slide1col,.card-img-slide2col,.card-img-slide3col{height:60vw}
	header .xs-head-logo img {
		width: 100%;
		max-width: 30rem;
	}
	header.header{
		box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
	}
}
@media (min-width: 576px) {
	.card-img-top{height:23vw}
	.card-img-2col{height:23vw}
	.card-img-3col{height:30vw}
	.card-img-4col{height:30vw}
	.card-img-slide1col,.card-img-slide2col,.card-img-slide3col{height:23vw}
}
@media (min-width: 992px) {
	.card-img-top{height:10vw}
	.card-img-2col{height:21vw}
	.card-img-3col{height: 10vw;}
	.card-img-slide1col{height:32vw}
	.card-img-slide2col{height:20vw}
	.card-img-slide3col{height:13vw}
	.card-img-top.news-img-detail {height: 16vw;}
	.news-nav-tabs.df-tab nav {border-bottom:1px solid #efefef;}
	.news-nav-tabs.df-tab .nav-tabs .nav-link {border-radius: 15px 15px 0 0;}
	.news-nav-tabs.df-tab .nav-tabs .nav-link:hover {background-color:#cf2d1e;color:#fff;}
	.news-nav-tabs.df-tab .nav-tabs .nav-link.active {font-weight:bold;}
}

ul.news-tags, ul.news-tags li { list-style:none;padding:0;margin:0; }
ul.news-tags { display:flex; flex-wrap:wrap; justify-content: flex-start;gap:5px; }
ul.news-tags li{ padding: 5px; border: 1px solid #efefef; border-radius: 5px;}

.blog-maincontent a {color:#333333;}
.blog-maincontent a:hover {color:#cf2d1e;}
.blog-maincontent .view-all {display: block;text-align: right;}
.blog-maincontent .view-all a{background-color: #cf2d1e;border-color: #cf2d1e;color: #fff;padding: 5px 15px;border-radius: 0.25rem;}
.blog-maincontent .view-all a:hover {color:#eee;}
.blog-maincontent .frame-default {font-family: 'Pridi', sans-serif;}

.hover-image img{filter:grayscale(100%);-webkit-filter:grayscale(0%);-webkit-transition:all 1s ease;box-shadow:rgba(50,50,93,0.25) 0 50px 100px -20px,rgba(0,0,0,0.3) 0 30px 60px -30px}
.hover-image img:hover{filter:grayscale(0%);filter:gray;-webkit-filter:grayscale(0%);filter:none;transition:1s ease;-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.05);box-shadow:rgba(17,12,46,0.15) 0 48px 100px 0}

/*.service-box ul{margin:30px 0;padding:0;list-style:none;display:flex;justify-content:space-between;align-items:stretch;gap:15px}
.service-box ul li{margin:0;padding:30px 0;flex-basis:100%;border-radius:10px;background:#F2EBDA;color:#544216;text-align:center;text-transform:uppercase;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.service-box a{margin:auto;color:#544216;font-size:1.25rem;font-weight:700}
.service-box ul li:hover{color:#fff;background:#8c1515;cursor:pointer}
.service-box ul li:hover a{color:#fff;text-decoration:none}*/
/*Service Box*/
/*.service-box {
  font-family: "athitisemibold", sans-serif;
  position: relative;
  width: 100%;
  margin-top: 30px;
  margin-bottom: 30px;
}
.service-box ul, .service-box ul li {
  list-style: none;
  padding: 0;
  margin: 0;
}
.service-box ul {
  box-sizing: border-box;
  overflow: hidden;
  display:block;
}
.service-box ul li {
  width: 24.2%;
  position: relative;
  min-height: 1px;
  float: left;
  margin: 5px 5px 20px 5px;
  border-radius: 20px;
}
.service-box ul li a {
  font-size: 110%;
  font-weight: 500;
  margin: auto;
  padding: 30px;
  color: #544216;
  display: block;
  background-color: #F2EBDA;
  border-radius: 20px;
  text-align: center;
  -webkit-transition-duration: .5s;
  -moz-transition-duration: .5s;
  -o-transition-duration: .5s;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}
.service-box ul li a:hover {
  background: #8c1515;
  color: #fff;
}

@media (max-width: 576px){
  .service-box ul li{ width:100%; margin:0px 0px 5px 0px; padding:10px}
  header .xs-head-logo img {    width: 100%;    max-width: 19rem;   }
}*/

/*Service Box Updated 2025.03.07*/
.service-box {
  font-family: "Athiti", sans-serif;
  width: 100%;
  margin: 30px 0;
}

.service-box ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 15px; 
  padding: 0;
  list-style: none;
  margin: 0;
}

.service-box ul li {
  border-radius: 20px;
}

.service-box ul li a {
  display: block;
  padding: 30px;
  font-size: 1.1rem;
  font-weight: 500;
  text-align: center;
  color: #544216;
  background-color: #F2EBDA;
  border-radius: 20px;
  transition: all 0.3s ease-in-out;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.service-box ul li a:hover {
  background: #8c1515;
  color: #fff;
  transform: translateY(-5px);
  box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.2);
}

/*Service Box 2 ปกติจะใช้ในหน้าหลักสูตร*/

.frame-22 {
  font-family: "athitisemibold", sans-serif;
  width: 100%;
  margin: 30px 0;
	transition-duration: 0.4s;
	cursor: pointer;
}

.frame-22 ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 15px; 
  padding: 0;
  list-style: none;
  margin: 0;
}

.frame-22 ul li {
  border-radius: 20px;
}

.frame-22 ul li a {
  display: block;
  padding: 20px;
  font-size: 1.2rem;
  text-align: center;
  color: #FFFFFF;
  background-image: linear-gradient(25deg, #310024, #69002b, #a40132, #e30637);
  border-radius: 30px;
  box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

.frame-22 ul li a:hover {
  background-image: linear-gradient(25deg, #310024, #69002b, #a40132, #e30637);
  color: #fff;
  transform: translateY(-5px);
  box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

@media (min-width: 992px) {
  .service-box ul {
    grid-template-columns: repeat(4, 1fr) !important; 
  }
}

@media (max-width: 991px) and (min-width: 576px) {
  .service-box ul ,.frame-22 ul{
    grid-template-columns: repeat(2, 1fr) !important; 
  }
}


@media (max-width: 575px) {
  .service-box ul, .frame-22 ul{
    grid-template-columns: 1fr !important;
  }
  header .xs-head-logo img {
    width: 100%;
    max-width: 19rem;
  }
}

.auto-height figure,.frame-17 figure, .frame-17 .card-img-3col, .frame-17 .card-img-4col{height:auto}
.side-link{position:relative}
.side-link .toggle{font-size:20px;position:absolute;right:15px;top:-2px;z-index:1;cursor:pointer}
.side-link .toggle:hover{color:#fff}
.frame-12 ul,.frame-13 ul{list-style:none;margin:0;padding:0}
.frame-12 li a{border:1px solid #544216;padding:5px 15px;background-color:#fff;color:#544216;margin-bottom:3px;display:block;border-radius:5px;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.frame-12 li a:hover{background-color:#544216;color:#fff;text-decoration:none}
.frame-13 li a{font-size:20px;padding:5px 15px;background-color:#8c1515;color:#fff;margin-bottom:3px;display:block;border-radius:5px;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.frame-13 li a:hover{background-color:#a07617;color:#fff;text-decoration:none;padding:5px 30px}
.frame-14 h2{font-size:36px;color:#333;border-bottom:10px solid #E10600;padding-bottom:10px;margin-bottom:20px}
.PageTitle{margin-bottom:30px;}
.frame-15 h2{font-size: 320%;font-weight:300;color:#1f1f27;/*padding-bottom:10px;margin-bottom:20px*/}

.accordion-button.collapsed,
.accordion-button:not(.collapsed) {color: #fff;background-color: #252a33;font-size: 80%;}
.accordion-button.collapsed::after {background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
.accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}


/*---- DARK THEME ----*/
/*body.dark-theme {filter:grayscale(100%);}*/
.dark-theme .blog-shortcutmenu a,
.dark-theme .blog-shortcutmenu ul li:hover a {color:#555;}
.dark-theme .blog-shortcutmenu ul li:hover {background: #eee;}
.dark-theme .frame-14 h2 {border-bottom: 10px solid #eee;}
.dark-theme .view-all a,
.dark-theme .btn-primary,.dark-theme .btn-primary:hover,
.dark-theme footer .menu-box-list li a,
.dark-theme footer .social-media-list ul li a,
.dark-theme header .header-menu-bar,
.dark-theme header .header-primary .action-menu-list .action-menu-item a.active, 
.dark-theme header .header-primary .action-menu-list .action-menu-item a:hover,
.dark-theme header .header-primary .action-menu-list .action-menu-item a.primary-link {background:transparent;background-color:#333;}
.dark-theme .title-red-line { border-bottom: solid 0.625rem #fff; }
body.dark-theme .service-box ul li a, body.dark-theme .box-link li a, body.dark-theme .footer{ background:#333333; }
body.dark-theme .side-menu ul li a:hover{background:#333333;}
body.dark-theme .menu-list > li a{color:#ffffff;}
/*body.dark-theme .header img{filter: grayscale(100%);}*/

/* Modernized Box Link */
.box-link ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%;
  text-align: center;
}

.box-link li {
  width: 100%; 
  margin-bottom: 10px; 
}

.box-link li a {
  display: block;
  width: 100%; 
  padding: 12px 16px;
  font-family: 'Athiti', sans-serif;
  font-size: 1.2rem;
  font-weight: ถ00;
  text-decoration: none;
  color: #ffffff;
  background: #b58f64;
  border-radius: 10px;
  transition: background 0.3s, transform 0.2s, box-shadow 0.3s;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px;
  text-align: center;
}

.box-link li a:hover {
  background-color: #ae1b1f;
  color: white;
  transform: translateY(-2px); 
  box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 15px;
}



/* tx-mfunewsletter */
.tx-mfunewsletter article , .tx-mfuissue article{
    min-height: 380px;
}
.tx-mfunewsletter figure , .tx-mfuissue figure{
    clear: both;
}
.tx-mfunewsletter figure figcaption , .tx-mfuissue figure figcaption{
    background: #C6A969;
    padding: 10px 5px;
    display: block;
    color: #fff;
}
.tx-mfunewsletter h1 , .tx-mfuissue h1{
    color: #fff;
    display: block;
    text-decoration: none;
    border: none;
    padding: 0;
    margin: 0;
    font-size: 120%;
    line-height: 20px;
}
.tx-mfunewsletter p , .tx-mfuissue p{
    margin: 0;
    font-size: 75%;
    font-family: 'athitimedium', sans-serif;
}
.tx-mfunewsletter img, .tx-mfuissue img{
    border-top: 5px solid #C6A969;
}
.tx-mfunewsletter a:hover figure figcaption , .tx-mfuissue a:hover figure figcaption{
    background: #CF2D1E
}
.tx-mfunewsletter a:hover img , .tx-mfuissue a:hover img{
    border-top: 5px solid #CF2D1E;
}
.tx-mfunewsletter a, .tx-mfunewsletter a:hover h1, .tx-mfunewsletter a:hover p , .tx-mfuissue a, .tx-mfuissue a:hover h1, .tx-mfuissue a:hover p{
    display: block;
    text-decoration: none;
    color: #fff;
}
.tx-mfunewsletter a , .tx-mfuissue a{
    margin-bottom: 30px;
}
.tx-mfunewsletter .issue-pdf , .tx-mfuissue .issue-pdf{
    display: block;
    text-align: center;
    padding: 5px 20px;
    background: #555;
    color: #fff;
}
.tx-mfunewsletter .issue-pdf a , .tx-mfuissue .issue-pdf a{
    margin: 0 !important;
    padding: 0 !important;
}
.tx-mfunewsletter.ebook figure figcaption , .tx-mfuissue.ebook figure figcaption{
    background: #eee;
    color: #333;
}
.tx-mfunewsletter.ebook img, .tx-mfunewsletter.ebook a:hover img , .tx-mfuissue.ebook img, .tx-mfuissue.ebook a:hover img{
    border-top: 0;
    padding: 10px;
}
.tx-mfunewsletter.ebook h1, .tx-mfunewsletter.ebook p, .tx-mfunewsletter.ebook a, .tx-mfunewsletter.ebook a:hover p , .tx-mfuissue.ebook h1, .tx-mfuissue.ebook p, .tx-mfuissue ebook a, .tx-mfuissue.ebook a:hover p{
    color: #333;
    text-decoration: none;
    text-align: center;
}
.tx-mfunewsletter.ebook p , .tx-mfuissue.ebook p{
    margin: 0 0 10px 0;
    font-size: 100%;
    font-family: 'athitimedium', serif;
}
.tx-srlanguagemenu-links {
    display: flex;
    display: -webkit-flex;
    justify-content: flex-end;
    -webkit-justify-content: flex-end;	
	column-gap:5px;
}
.tx-srlanguagemenu-links div a {
	display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-align-items: center;
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 50%;
    border: 0.0625rem solid #cf2d1e;
    padding: 5px 10px;
    border-radius: 50%;
    background: #efefef;
}
.tx-srlanguagemenu-links div.CUR a {
    background: #333;
	color:#efefef;
}

.custom-pagination .arrow{ 
	display:flex;
	display: -webkit-flex;
	justify-content: end;
	-webkit-justify-content: end; 
	gap: 15px;
	color:#555;
}
.custom-pagination .arrow a {background: #333333;color: #FFFFFF;}
.custom-pagination .arrow a:hover {background:#cf2d1e;}

.container-video {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.responsive-iframe-video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
  content: "sandbox='allow-scripts allow-same-origin'"
}

.link-news{
   font-family: "athitimedium", sans-serif;
   font-size: 1.07em;
   color:black;
}
.link-news a:hover{
   color:red;
}

.academicyear {display:flex;gap: 10px;margin-bottom: 15px;}
.academicyear a {padding: 7px 10px; border:1px solid #efefef; background-color: #cf2d1e; color:#fff;}
.academicyear a:hover { background-color: #efefef; color:#cf2d1e;}

.fb-messenger-link {position:fixed; top:90%; right:15px; z-index:10; font-size:150%; }

.border-headline {
    padding-right: 10%;
    min-width: 70%;
    display: table;
    margin-bottom: 15px;
    border-bottom: 2px solid #8c1515;
    padding-bottom: 5px;
}
@-moz-document url-prefix() {
    .border-headline {
      height:1px;
    }
}

@media (max-device-width: 600px) {
  .mobile-text {
    text-align: center;
  }
}

.tx_mfudocu .mfudocu-last-update {
  font-size:80%;
  color:#B7B7B7;
  font-style: italic;
}

.news .accordion-button{
  padding:3%;
  font-size:1rem;
}

/*Hover Image*/
.hover-image img , .frame-18 img{
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.hover-image img:hover , .frame-18 img:hover {
  transition: 1s ease;
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.05);
  box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}


/*column shadow*/
.column-shadow01 div{
   box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}

.social-box ul{
	font-family: "athitimedium", sans-serif;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;  
}
.social-box ul li{
	font-size:1rem;
}
.social-box ul li a{
  float:left;
  background-color: #EEEEEE;
  margin:5px;
  padding:5px 10px;
  border-radius: 10px;
}

.social-box ul li a:hover{
  background-color: #B58F64;
  color:#FFFFFF;
}

.nav-tabs {
    border-bottom: 1px solid #000000;

}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #CF2D1E;
    background-color: #fff;
    border-bottom: 5px solid #CF2D1E;
    border-color: #ffffff #ffffff #CF2D1E#ffffff;

}

.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover {
    border-color:#ffffff #ffffff #333333 #ffffff;
    border-bottom: 5px solid #ae1b1f;
}
.nav-tabs .nav-link:hover {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

.nav-link{
   color:#333333;
    font-size:1.2rem;
    font-family: 'athitimedium', sans-serif;
}

.nav-link:focus,.nav-link:hover {
    color: #ae1b1f;
}

@media (max-width: 576px){
    .nav-link{
       font-size:1rem;
    }
}

/*Statistics Blog*/
#mfu-statistics-container {
  font-family: "athitisemibold", sans-serif;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  flex-direction: row;
}

#mfu-statistics-container .stat-box {
  flex: 0 0 calc(25% - 20px); /* Default: 4 คอลัมน์บน Desktop */
  margin: 10px;
  text-align: center;
  background-color: #F9F9F9;
  box-sizing: border-box;
}

#mfu-statistics-container .stat-value{
    font-size: 4rem;
    color: #735829;
}
#mfu-statistics-container .stat-title {
    font-size: 1.2em;
    background-color: #543310;
    padding: 10px 5px;
    /* margin-bottom: 7px; */
    color: #FFFFFF;
}

/* Tablet และมือถือ: แสดง 2 คอลัมน์ */
@media (max-width: 991.98px) {
  #mfu-statistics-container .stat-box {
    flex: 0 0 calc(50% - 20px) !important;
  }
  #mfu-statistics-container .stat-value{
    font-size: 1.5rem;
   }
   #mfu-statistics-container .stat-title{
    font-size: 1rem;
    padding: 1px;
   }
}


/* จอเล็กมาก: ถ้าอยากให้ 1 คอลัมน์จริง ๆ ค่อยใช้ส่วนนี้ */
@media (max-width: 480px) {
  #mfu-statistics-container .stat-box {
    flex: 0 0 100%;
  }
}

.line-break::after {
  content: "\A"; 
  white-space: pre;
}

@media (max-width: 767.98px) { 
  .line-break::after {
    content: ""; 
  }
}

@media (max-width: 767.98px) { 
  .hidden-mobile {
    visibility: hidden;
    display: block;
    line-height: 0;
  }
}

.text-justify {
   text-align: justify;
}

.blog-video-list .title-video{
    color: yellow;
    font-family: 'athitisemibold', sans-serif;
    font-size: 180%;
    text-align: center;
}
.blog-video-list .detail-video{
    font-family: 'athitisemibold', sans-serif;
    font-size: 130%;
    padding: 0% 6%;
}

/*header .header-primary .head-shortcut-menu li a{
    font-size:50%;
}*/

/* custom language menu*/
.custom-language-menu {}
.custom-language-menu .lang-item a{
	background: #eeeeee;
	padding: 1px 4px;
	color: #000000;
	border: 1px solid #dddddd;
}
.custom-language-menu .lang-item a:hover, .custom-language-menu .lang-item .active{
	background: #8c1515;
	color: #FFFFFF;
	border: 1px solid #8c1515;
}
.custom-language-menu .lang-item:first-child {border-right:1px solid #eeeeee;}

@media (max-width: 991px) {
	.custom-language-menu .lang-item a{color:#fff;}
	.custom-language-menu .lang-item a:hover{text-decoration:underline;}
	.sdg-type .sdg-item-headline {
		width: 5rem;
	}

    .sdg-type > span {
        /* Increase actual visible size while maintaining design proportions */
        width: 2.5rem;  /* 40px - visible element */
        height: 2.5rem; /* 40px - visible element */
        font-size: 1rem; /* 16px - more readable on mobile */
        line-height: 2.5rem;
        
        /* Add padding to create 48x48px touch target */
        padding: 0.25rem; /* 4px padding creates 48px total touch area */
        margin-right: 0.5rem; /* 8px - proper spacing between targets */
        
        /* Ensure touch target is properly interactive */
        position: relative;
        cursor: pointer;
        
        /* Smooth transition for hover states */
        transition: transform 0.2s ease, background-color 0.2s ease;
    }
    
    /* If the span is within a clickable parent, ensure proper touch area */
    .sdg-type > span:before {
        content: "";
        position: absolute;
        top: -0.25rem;
        right: -0.25rem;
        bottom: -0.25rem;
        left: -0.25rem;
        /* Creates 48x48px minimum touch target */
    }
    
    /* Visual feedback for touch interaction */
    .sdg-type > span:active {
        transform: scale(0.95);
        opacity: 0.9;
    }

}

a.news-title {
    font-size: 1.1rem;
    font-family: 'athitimedium',sans-serif;
}
a.news-title:hover{
    color: #ae1b1f;
}

.news-category{
   font-family: 'athitiregular',sans-serif;
}