@charset "UTF-8";
.section-top-banner { background-color: #EBF4FC; position: relative; }
.section-top-banner .card-content .card-image { text-align: right; }
.section-top-banner .card-content .card-text { left: 0; top: 0; width: 100%; height: 100%; padding: 0 100px; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (min-width: 768px) { .section-top-banner .card-content .card-text { position: absolute; } }
@media (max-width: 1580px) { .section-top-banner .card-content .card-text { padding: 0 50px; } }
@media (max-width: 767px) { .section-top-banner .card-content .card-text { padding: 50px; } }
@media (max-width: 575px) { .section-top-banner .card-content .card-text { padding: 30px; } }
@media (max-width: 1920px) { .section-top-banner .card-content .card-text > div { max-width: 650px; } }
.section-top-banner .card-content .card-text h1 { color: #84B1D5; font-size: 54px; letter-spacing: 1.17px; }
@media (max-width: 767px) { .section-top-banner .card-content .card-text h1 { font-size: 40px; }
  .section-top-banner .card-content .card-text h1 br { display: none; } }
@media (max-width: 575px) { .section-top-banner .card-content .card-text h1 { font-size: 30px; } }

.linear-gradient { background-image: linear-gradient(0deg, #FFFBF8 18%, #FFFAFA 57%, #FFFFFF 100%); overflow: hidden; }

.linear-gradient-2 { background-image: linear-gradient(0deg, #F7FBFF 29%, #F9FCF9 95%); box-shadow: inset 0 4px 23px 0 rgba(231, 231, 231, 0.13); overflow: hidden; }

.section-about { padding-top: 40px; margin-top: 90px; position: relative; }
@media (max-width: 767px) { .section-about { margin-top: 40px; padding-top: 0; } }
.section-about .col-text { position: relative; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (min-width: 992px) { .section-about .col-text { padding-left: 100px; } }
@media (min-width: 992px) and (max-width: 1480px) { .section-about .col-text { padding-left: 50px; } }
@media (min-width: 992px) { .section-about .col-text:before { content: ''; background-color: #F09483; height: 1px; width: 100%; position: absolute; top: -40px; left: 0; } }
.section-about .col-text > div { max-width: 550px; }
@media (max-width: 1024px) { .section-about .col-text > div { max-width: fit-content; } }
.section-about .col-image { position: relative; z-index: 1; display: flex; align-items: center; }
@media (min-width: 1480px) { .section-about .col-image { padding-left: 80px; } }
@media (min-width: 992px) { .section-about .col-image { padding-right: 0; } }
@media (min-width: 992px) { .section-about .page-wrapper { padding-right: 0; } }

.section-content-cols { padding: 200px 0 250px; position: relative; }
@media (max-width: 991px) { .section-content-cols { padding: 80px 0; } }
.section-content-cols:before { background-image: url(../images/graphic1.svg); position: absolute; right: 0; top: -80px; width: 30%; height: 100%; content: ''; background-position: right top; background-size: contain; background-repeat: no-repeat; }
.section-content-cols:after { background-image: url(../images/graphic2.svg); position: absolute; left: 0; bottom: 0; width: 30%; height: 100%; content: ''; background-position: left bottom; background-size: contain; background-repeat: no-repeat; }
.section-content-cols .content-inner { background-color: #fff; padding: 90px; position: relative; }
@media (max-width: 991px) { .section-content-cols .content-inner { padding: 40px 0; } }
@media (max-width: 767px) { .section-content-cols .content-inner { padding: 40px 0 0; } }
.no-edit .section-content-cols .content-inner { z-index: 1; }
.section-content-cols .list .col-item { display: flex; }
@media (max-width: 767px) { .section-content-cols .list .col-item { justify-content: center; margin-bottom: 40px; } }
.section-content-cols .list .col-item .col-image { margin-bottom: 50px; }
.section-content-cols .list .col-item .col-image img { height: 120px; width: auto; }
.section-content-cols .list .col-item .col-text { font-size: 20px; letter-spacing: 0.62px; }
.section-content-cols .list .col-item .col-text h3 { font-family: "latolight", "sarabun_lightregular", "cordiadseregular", Helvetica, Arial, sans-serif; font-size: 44px; letter-spacing: 1.38px; margin-bottom: 35px; }
@media (max-width: 1480px) { .section-content-cols .list .col-item .col-text h3 { font-size: 35px; } }
.section-content-cols .list .col-item .col-text ul { list-style: none; padding: 0; }
.section-content-cols .list .col-item .col-text ul li { padding-left: 20px; position: relative; margin-bottom: 15px; }
.section-content-cols .list .col-item .col-text ul li:before { font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; content: ""; display: inline-block; position: absolute; left: 0; top: 10px; font-size: 12px; }
.section-content-cols .list .col-item:nth-child(1) .col-text ul li:before { color: #D0DF90; }
@media (min-width: 768px) { .section-content-cols .list .col-item:nth-child(2) { justify-content: center; } }
.section-content-cols .list .col-item:nth-child(2) .col-text ul li:before { color: #F09483; }
@media (min-width: 768px) { .section-content-cols .list .col-item:nth-child(3) { justify-content: flex-end; } }
.section-content-cols .list .col-item:nth-child(3) .col-text ul li:before { color: #ACD0EC; }

.section-video { padding-bottom: 100px; }
@media (max-width: 767px) { .section-video { padding-bottom: 40px; } }
@media (min-width: 992px) { .section-video .page-wrapper { padding-left: 0; } }
.section-video .col-video { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (min-width: 992px) { .section-video .col-video { padding-left: 0; padding-right: 80px; } }
@media (min-width: 992px) and (max-width: 1480px) { .section-video .col-video { padding-right: 40px; } }

.section-video .col-video > div { position: relative; width: 100%; }
.section-video .col-video > div a { display: block; position: relative; }
.section-video .col-video > div a:before { content: ''; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.section-video .col-video > div a:hover:before { background-color: rgba(0, 0, 0, 0.2); }
.section-video .col-video > div .icon-play { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 100%; text-align: center; color: #fff; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.section-video .col-video > div .icon-play:before { content: ''; background-image: url(../images/play.svg); width: 53px; height: 53px; display: inline-block; background-position: center; background-size: contain; background-repeat: no-repeat; margin-right: 20px; }
.section-video .col-text { position: relative; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (min-width: 992px) { .section-video .col-text:before { content: ''; background-color: #709FC4; height: 1px; width: 100%; position: absolute; top: -50px; left: 0; } }
@media (min-width: 992px) { .section-video .col-text > div { max-width: 550px; } }

.section-program-list { padding: 60px 0 50px; position: relative; overflow: hidden; }
.section-program-list:before, .section-program-list:after { content: ''; position: absolute; }
.section-program-list:before { background-image: url(../images/graphic3.svg); height: 380px; width: 30%; right: -5%; top: 0; background-position: right; background-size: contain; background-repeat: no-repeat; }
.section-program-list:after { background-image: url(../images/graphic4.svg); height: 525px; width: 30%; left: -5%; bottom: 0; background-position: left; background-size: contain; background-repeat: no-repeat; }
.section-program-list .section-list { margin-top: 70px; position: relative; }
.no-edit .section-program-list .section-list { z-index: 1; }
.section-program-list .section-list .col-item { margin-bottom: 80px; }
@media (max-width: 767px) { .section-program-list .section-list .col-item { margin-bottom: 40px; } }
@media (max-width: 575px) { .section-program-list .section-list .col-item { margin-bottom: 20px; } }
.section-program-list .section-list .col-item .card-link { display: block; }
.section-program-list .section-list .col-item .card-link:hover .card-image > div { opacity: 0.5; -webkit-transform: scale(1.04); -moz-transform: scale(1.04); -o-transform: scale(1.04); -ms-transform: scale(1.04); transform: scale(1.04); }
.section-program-list .section-list .col-item .card-link:hover .card-title { color: #99AB4C; }
.section-program-list .section-list .col-item .card-link:hover .card-title span { border-color: #99AB4C; }
.section-program-list .section-list .col-item .card-image { margin-bottom: 24px; background-color: #000; overflow: hidden; }
.section-program-list .section-list .col-item .card-image > div { padding-top: 72%; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; background-position: center; background-size: cover; background-repeat: no-repeat; }
.section-program-list .section-list .col-item .card-title span { display: inline-block; border-bottom: 1px solid transparent; padding-bottom: 12px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }

.section-contact { padding-bottom: 100px; }
@media (min-width: 992px) { .section-contact { font-size: 22px; } }
@media (max-width: 767px) { .section-contact { padding-bottom: 50px; } }
@media (max-width: 575px) { .section-contact .container { padding: 0; } }
.section-contact .line-top-blue { border-top: 1px solid #ACD0EC; padding-top: 55px; }
.section-contact .col-map .link-arrow { margin-bottom: 40px; }
@media (min-width: 992px) { .section-contact .col-text > div { padding-left: 50px; } }
.section-contact .col-text .item { margin-bottom: 20px; }
@media (min-width: 576px) { .section-contact .col-text .item > div { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } }
.section-contact .col-text .item .title { font-family: "latobold", "sarabun_semiboldregular", "cordiadsebold", Helvetica, Arial, sans-serif; color: #84B1D5; }
@media (min-width: 576px) { .section-contact .col-text .item .title { -ms-flex: 0 0 100px; flex: 0 0 100px; max-width: 100px; } }
@media (min-width: 576px) { .section-contact .col-text .item .detail { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; padding-left: 25px; } }
.section-contact .col-text .item .social { list-style: none; padding: 0; margin: 0; }
@media (max-width: 575px) { .section-contact .col-text .item .social { margin: 10px 0; } }
.section-contact .col-text .item .social li { margin-bottom: 20px; }
.section-contact .col-text .item .social li a { display: flex; }
.section-contact .col-text .item .social li a .text { align-items: center; padding-right: 20px; }
.section-contact .col-text .item .social .icon { font-size: 35px; padding-right: 20px; }
.section-contact .col-text .item a:hover { color: #346f9e; }

/*# sourceMappingURL=homepage.css.map */