@import url('https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body { font-family: 'Poppins', 'Kanit', sans-serif; font-weight: 300; color: #303030; background-color: #29BCB2; letter-spacing: 0.5px }

a { transition: all 0.2s; text-decoration: none }
a:link, a:visited, a:active {
	color: #29BCB2
}

a.btn { background-color: #29BCB2; color: #fff; border:0; border-radius: 50px; padding: 10px 30px }

.navbar-collapse { justify-content: flex-end }
.navbar-collapse a { padding: 10px 0px !important; font-size: 14px }
.navbar-collapse .nav-item { margin-left: 30px }
/* Footer
===============================================================================*/
header {
    position: relative;
    z-index: 3;
    box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    background: #fff;
}

/* Footer
===============================================================================*/
footer {
    padding-top: 60px;
    color: #fff;
	overflow: hidden
}
.carousel-control-prev,
.carousel-control-next { display: none }
footer a:link,footer a:visited,footer a:active { color: #fff; text-decoration: none }
footer a:hover { color: rgba(255,255,255,0.5) }
footer h2 { font-size: 16px; margin-bottom: 30px; color:#fff; font-weight: 600; }
footer ul { padding: 0; list-style: none }

footer > div:nth-child(2) { margin-top: 60px; padding: 30px 0px; text-align: center }

main section > .Name:after { content: ""; width: 48px; height: 2px; background: #f78d0d; display: block; margin: 30px auto 30px }

main { background:#fff; }

.FirstPage main .Row:nth-child(1) .Column:nth-child(1) { float: none }

main .Name { margin: 0px; line-height: 1; margin-bottom: 20px; font-weight: 600; color: #29BCB2 }

.SubPage main .Name h2 { text-align: center }


.FirstPage main > div:nth-child(2) { position: relative; z-index: 1 }
.FirstPage main > div:nth-child(2):before { content: ""; position: absolute; width: 36px; height: 36px; left: 0; right: 0; bottom: -18px;background: #fff; margin: auto; transform: rotate(45deg); border-radius: 0px;  box-shadow: 0px 0px 4px rgba(0,0,0,0.05); z-index: -1 }
.FirstPage main > div:nth-child(2) > div { background: #fff }



.FirstPage main { padding: 0px }

main > div:nth-child(3) { background-color: #F7F9FB }
#Section595 .Name h2 { text-align: center; margin-bottom: 48px }
#Section595 .Text .col-lg-3 > div:first-child { width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px ; background: #29BCB2; border-radius: 50px; float: left }
#Section595 .Text .col-lg-3 > div:first-child i { font-size: 0 }
#Section595 .Text .col-lg-3 > div:first-child i:before { font-size: 0px; color: #fff }
#Section595 .Text .col-lg-3 > p { display: none }
#Section595 .Text .col-lg-3 h4 { padding: 0px 0px 0 30px }
#Section595 h4 { font-size: 16px }

#Section596 .Name h2 { text-align: center; margin-bottom: 48px }
#Section596 .List { display: flex; justify-content: space-between }
#Section596 .Item { width: 32% }
#Section596 .Item h4 { font-size: 16px }

main > div:nth-child(5) { background-color: #F7F9FB }
#Section597 p { font-size: 14px }
#Section597 h2 { margin-bottom: 48px }
#Section597 h4 { font-size: 16px; margin-bottom: 16px }
#Section597 p span { font-weight: bold; font-size: 16px }
main > div:nth-child(6) { height: 360px }

#Section601 .Name h2 { text-align: center; margin-bottom: 48px }
#Section601 .List { display: flex; flex-wrap: wrap }
#Section601 .Item { width: 32%; margin: 20px 0 20px 2% }
#Section601 .Item:nth-of-type(3n+1) { margin-left: 0 }
#Section601 .Item h4 { font-size: 16px }

#Page204 main > div:nth-child(2) h2 { font-size: 18px }
#Page204 main > div:nth-child(2) > .container > .row > div { margin-bottom: 60px }

#Section600 { margin: 100px 0 }
#Section600 h1 { font-size: 32px; margin-bottom: 36px }



#Section618 .Name h2 { text-align: center; margin-bottom: 48px }
#Section618 .List { display: flex; justify-content: space-between; flex-wrap: wrap }
#Section618 .Item { width: 32%; margin: 20px 0 20px 2% }
#Section618 .Item:nth-of-type(3n+1) { margin-left: 0 }
#Section618 .Item h4 { font-size: 16px }
#Section618 .Cover > * { padding-top: 30%; background-image: url(/public/assets/sites/images/29/202411130025070.jpeg); display: block; background-size: cover; background-position: center center }
#Section618 .Cover { margin-bottom: 24px }

#Section618 .Item:nth-child(18) .Cover > * { background-image: url(/public/assets/sites/images/29/202411140736170.jpg); }
#Section618 .Item:nth-child(19) .Cover > * { background-image: url(/public/assets/sites/images/29/202411140736171.jpg); }

#Section596 .Item { border-radius: 8px; padding: 20px; position: relative; background: #fff; transition: all 0.2s }
#Section596 .Item:hover { border-color: #f78d0d }
#Section596 .Preheader { order: 2; color: #f78d0d;font-weight: 600; border-radius: 4px }
#Section596 .Item .DetailBox { display: flex; flex-direction: column }
#Section596 .Title h4 { font-size: 24px; margin-bottom: 24px; font-weight: 300 }

#Page204 main > div:nth-child(2) .col-lg-4 .Content { border: 2px solid #ddd; border-radius: 8px; padding: 20px; height: 100% }


.FirstPage header { box-shadow: none }



#Section594 { font-size: 24px }

#Section599 .row { margin: 40px 0 100px }
.img-float { float: right; margin-left: 24px; margin-bottom: 100px;  }
.img-float img { max-height: 560px }
#Section599 h3 { clear: both; }

@media only screen and (max-width: 1199px) {  

}
@media only screen and (max-width: 959px) {  

}
@media only screen and (min-width: 768px) {  

.FirstPage main > div:nth-child(2) section > .Name:after { margin-left: 0px }
#Section625 .Text > p:first-child { max-width: 360px; margin: auto }
}

@media only screen and (min-width: 959px) {  
.carousel-item { height: 600px }

.FirstPage main > div:nth-child(1) { background: #DEF3F2; }
#Gallery126 h2 {font-size: 36px;color: #29BCB2;font-weight: 700}

.carousel-caption { left: 0; right: auto; text-align: left; margin: 0 auto; bottom: 50%;
                   color: #000;
                   font-size: 16px;
                   transform: translateY(50%);
                   width: 32%; font-weight: 400 }
.carousel-item img { position: absolute; max-height: 500px; right: 33%; transform: translateX(50%); overflow: hidden; border-radius: 10px; margin: auto; margin-top: 50px }
}


@media only screen and (max-width: 960px) {
    .navbar { justify-content: end }
    .navbar-collapse { position: absolute; top: 60px; background: #fff; width: 200px }    
    .navbar-collapse .nav-item { margin-right: 30px }
    #Section618 .Item { width: 49% }
    #Section618 .Item:nth-of-type(3n+1) { margin-left: 2% }
    #Section618 .Item:nth-of-type(2n+1) { margin-left: 0% }

    #Section601 .Item { width: 49% }
    #Section601 .Item:nth-of-type(3n+1) { margin-left: 2% }
    #Section601 .Item:nth-of-type(2n+1) { margin-left: 0% }

	.carousel-caption { background: rgba(0,0,0,0.5) }
}
@media only screen and (max-width: 767px) {
	#Section625 .Text > p:first-child { max-width: 100% }
	#Section594   { text-align: center }
    #Section596 .List { flex-direction: column }
    #Section596 .Item { width: 100%; margin: 10px 0 }
    footer { text-align: center }
    #Section603, #Section592 { text-align: center }
	#Section603 img { max-width: 180px !important }
    footer .col-sm-4 { margin: 30px 0; }
    .img-float { float: none; margin-left: 0; margin-bottom: 50px;  }
    .img-float img { max-height: 100%; max-width: 100% }
    #Section618 .Item { width: 100% }
    #Section618 .Item:nth-of-type(3n+1) { margin-left: 0% }
    #Section601 .Item { width: 100% }
    #Section601 .Item:nth-of-type(3n+1) { margin-left: 0% }
}

.ScrollUp { 	
	position: fixed;
	display: none;
	cursor: pointer;
	border-radius: 50%;
	right: 20px; 
	bottom: 20px; 
	height: 60px; 
	width: 60px;
	padding: 30px;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;	
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	font-size: 0px;
	background-color: #e7e7e7
}
.ScrollUp:before, .ScrollUp:after { content: ""; display: block; position: absolute; left: 38%; top: 38%; background: #000 }
.ScrollUp:before { width: 6%; height: 36%; }
.ScrollUp:after { width: 36%; height: 6%; }

.Gallery > .Detail > .Wrapper .Item { display: inline-block; width: 18.4%; margin-left: 2%; vertical-align: top; cursor: pointer  }
.Gallery > .Detail > .Wrapper .Item:nth-of-type(5n+1) { margin-left: 0px }
.Gallery > .Detail > .Wrapper .Item:nth-of-type(n+6) { margin-top: 2% }
.Gallery > .Detail > .Wrapper .Item .Image { padding-top: 100%; position: relative; overflow: hidden }
.Gallery > .Detail > .Wrapper .Item .Image img { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.Gallery > .Detail > .Wrapper .Item .Image img.Hor { position: absolute; max-width: none; max-height: 100%; top: 0px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%) }

.Thumbs .Item { display: inline-block; width: 18.4%; margin-right: 2%; vertical-align: top; cursor: pointer  }
.Thumbs .Item:nth-of-type(5n+0) { margin-right: 0 }
.Thumbs .Item:nth-of-type(n+6) { margin-top: 2% }
.Thumbs img { max-width: 100% }

.r1-1 img[data-hor*="r1-1"],
.r4-3 img[data-hor*="r4-3"],
.r16-9 img[data-hor*="r16-9"],
.r16-10 img[data-hor*="r16-10"] { max-width: none; height: 100%; top: 0px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%) }

.r4-3 .Crop { padding-top: 75% }
.r16-9 .Crop { padding-top: 56.25% }
.r16-10 .Crop { padding-top: 62.5% }

body.Popup { overflow: hidden }
body > .Popup { position: fixed; width: 100%; height: 100%; z-index: 100; top: 0px; opacity: 0 }
body > .Popup .Detail { position: absolute;
top: 50%; 
left: 50%;
width: 100%;
height: 100%;
transform: translate(-50%,-50%);
}
body > .Popup .Content img { position: absolute;
top: 50%; 
left: 50%;
max-width: calc(100% - 30px);
max-height: calc(100% - 30px);
transform: translate(-50%,-50%); }
body > .Popup .Background { background: rgba(0,0,0,0.8); height: 100%; width: 100% }
body > .Popup .Close { position: absolute; top: 15px; right: 15px; z-index: 1; width: 28px; height: 28px; cursor: pointer }



body > .Popup .Close:before,
body > .Popup .Close:after { 
    content: "";
	margin: auto;
	width: 100%;
	height: 2px;
	border-radius: 1px;
	left: 0px;
	right: 0px;
	top: 0px;
	background: #fff;
	display: block;
	bottom: 0px;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	position: absolute;
	transition: all 0.2s;
	top: 0px
}

body > .Popup .Close:before { -webkit-transform: rotate(45deg); transform: rotate(45deg) }
body > .Popup .Close:after { -webkit-transform: rotate(45deg); transform: rotate(-45deg) }

body > .Popup .Close:hover:before,
body > .Popup .Close:hover:after { background: #aaa }

@media only screen and (max-width: 767px) {
.Thumbs { display: flex; flex-wrap: wrap; justify-content: space-between; align-items:  start }
	.Thumbs .Item { width: 49%; margin: 0 0 10px; cursor: pointer  }
.Thumbs .Item:nth-of-type(5n+0) { margin-right: 0 }
.Thumbs .Item:nth-of-type(n+6) { margin-top: 0% }
}