@charset "utf-8";

/* CSS Document */
body { padding:0px; margin:0px; background:#FFFFFF; font-size:16px; color:#000000; line-height:20px; font-family: 'Kanit-Regular'; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, main, nav, section, audio, video, source { display: block; margin: 0; padding: 0; }
a, img { border: medium none; }
a { color: #000000; text-decoration: none;  }
div { margin: 0; padding: 0; }
p { font-size:16px; line-height:24px; padding:0px; margin:0px; color:#000000;} 
h1, h2, h3, h4, h5, h6 { font-weight:normal; padding:0px; margin:0px;  line-height: 30px; }
a{ color: #000000; outline:none; }
ul, li { list-style:none;}
a:focus, :focus{ outline:none; }
ul,ol { list-style-type:none; padding:0px; margin:0px; }
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } 
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; } 
* html .clearfix { height: 1%; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.clear { clear: both; line-height: 1px; padding:0px; height:0px; font-size:1px; }
.left { float:left; }
.right { float:right; }
.anim { transition:all 1s ease; -moz-transition:all 1s ease; -webkit-transition:all 1s ease; -o-transition:all 1s ease; }
.anim2 { transition:all .5s ease; -moz-transition:all .5s ease; -webkit-transition:all .5s ease; -o-transition:all .5s ease; }
.row {width: 1300px;margin:auto;padding:0px;}
img { border: 0; height: auto; max-width: 100%; vertical-align: middle;  width: 100%; }
 

.d-flex { display: flex; flex-wrap: wrap; }
.justify-space-between { justify-content: space-between;}
.align-center { align-items: center;}
.div-center { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}

/* header css */
header {float: left;width: 100%;position: relative;z-index: 9; background: #4211A3;}
.logo {flex: 0 1 23%;justify-content: end;}
.logo img { width: 207px;}
.logo .stick-logo { display: none;}

.btn-list ul {display: flex;flex-wrap: wrap;column-gap: 20px;justify-content: end;}
.btn-list ul li { flex: 0 1 auto;}
.btn-list ul li a {transition: all 0.4s ease;border: 1px solid #fff;color: #fff;font-size: 18px;font-family: 'Rubik-Medium';padding: 0px 30px;border-radius: 50px;height: 54px;line-height: 54px;display: inline-block;}
.btn-list ul li a:hover {background: #DA4AD0;border: 1px solid #DA4AD0; color: #fff;}

.is-sticky header {   box-shadow: 0 0 4px rgba(0,0,0,0.1);} 

.home-banner .swiper-container { padding: 60px 0;}
.home-banner .swiper-slide .ban-div {flex: 0 1 40%;order: 2;position: relative;}
.home-banner .swiper-slide .ban-img {display: block;}
.home-banner .swiper-slide .ban-caption { flex: 0 1 50%; order: 1;}
.home-banner .swiper-slide .ban-caption h1 {font-family: 'Kanit-Bold';font-size: 64px;font-weight: 600;line-height: 76px;margin-bottom: 20px;text-align: left;}
.home-banner .swiper-slide .ban-caption a {transition: all 0.5s ease;color: #fff;font-size: 18px;margin-top: 0;font-family: 'Rubik-Medium';padding: 18px 30px;border-radius: 30px;display: inline-block;background: #4211A3;}
.home-banner .swiper-slide .ban-caption a:hover {background: #DA4AD0;}

/*****menu css*******/
.megamenu-sec {  float: left; }
.megamenu-sec ul { margin: 0; padding: 0; display: flex; column-gap: 40px; flex-wrap: wrap; align-items: center;}
.megamenu-sec ul li { display: inline-block; margin-right: 0; /*position: relative;*/ }
.megamenu-sec ul li a {transition: 0.4s ease;position: relative;padding: 35px 0;display: flex;text-decoration: none;position: relative;font-family: 'Rubik-Regular';font-size: 18px;line-height: 27px;text-align: left;color: #fff;}
.megamenu-sec ul li a i { margin-left: 0px; font-size: 18px; transform: translateY(2px); transition: 0.4s; position: relative; top: 2px;}
.megamenu-sec ul li a:hover {color: #ffc82e;}
.megamenu-sec ul li a:hover span:after { color: var(--txt-orange);}
/* .megamenu-sec ul li a::after { position: absolute; bottom: 30px; left: 0; width: 0%; display: block; content: ""; height: 2px; background: var(--white); transition: all 0.4s ease; } */

.megamenu-sec ul li a:hover::after { width: 100%;}
/* .megamenu-sec ul li:hover a::after { position: absolute; bottom: 30px; left: 0; width: 100%; display: block; content: ""; height: 2px; background: var(--white); transition: all 0.4s ease; } */
.megamenu-sec ul li a.active { color:#FFC82E ; }
.megamenu-sec ul li a.active span::after { color: var(--txt-orange);}
.megamenu-sec ul li ul.submenu { transition: 0.4s ease; position: absolute; background-color: var(--white); padding: 40px 30px; transition: 0.3s; top: 130%; opacity: 0; visibility: hidden;  box-shadow: 3px 10px 30px rgba(0,0,0,0.1);}
.megamenu-sec ul li ul.submenu li { margin: 0; margin-bottom: 0px; display: block; width: 100%;}
/* .megamenu-sec ul li ul.submenu li a { line-height: 24px; transition: all 0.4s ease; font-size: 16px; color: var(--black); display: block; padding: 0 0 0 16px; text-transform: none; font-family: var(--ff-Regular);} */
/* .megamenu-sec ul li ul.submenu li a::before { transition: all 0.4s ease; position: absolute; left: 0; top: 0; content: "\f0da"; font-family: "FontAwesome"; color: var(--txt-dark-blue); font-size: 15px; transition: all 0.4s ease; }
.megamenu-sec ul li ul.submenu li a:hover { color: var(--txt-red); } */
/* .megamenu-sec ul li ul.submenu li a:hover::before  { color: var(--txt-red); } */
.megamenu-sec ul li:hover ul.submenu { opacity: 1; visibility: visible; top: 100%;}

.megamenu-sec ul li.has-mega-menu ul.submenu { left: 0%; right: 0; margin: 0 auto; width: 700px; background: var(--bg-white); margin: 0 auto; display: flex; flex-wrap: wrap; column-gap:2%; /* border: 1px solid #A91279; */ }
/* .megamenu-sec ul li.has-mega-menu ul.submenu li { width: 33.33%; flex: 1 1 70%; display: flex; flex-wrap: wrap; column-gap: 5%; padding-top: 15px;} */
/* .megamenu-sec ul li.has-mega-menu ul.submenu li:last-child { flex: 1 1 28%; padding-top: 0px;} */
.megamenu-sec ul li.has-mega-menu ul.submenu ul { display: flex; flex-wrap: wrap; /*flex-direction: column;*/ column-gap: 20px; justify-content: space-between; align-items: center;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li { flex: 0 1 100%; margin: 0 0 32px; padding: 0 0 22px 0; border-bottom: 0px solid #e5e5e5; position: relative; border-bottom: 1px solid rgba(0,0,0,0.1);}
/* .megamenu-sec ul li.has-mega-menu ul.submenu ul li::after { background: var(--bg-black); position: absolute; display: block; content: ""; width: 80%; bottom: 0; left: 0; height: 1px;} */
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a::after { transition: all 0.4s ease; position: absolute; display: block; content: ""; background: url(../images/org-arrow.svg) no-repeat 0 0; width: 35px; height: 27px; position: absolute; left: auto; right: 0; }
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a {  display: flex; align-items: center; padding: 0; box-shadow: none; column-gap: 50px;} 
.megamenu-sec ul li.has-mega-menu ul.submenu ul li:last-child a { border: none;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a:hover h2 { color: var(--txt-orange); }
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a:hover::after { right: 10px;}

.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-img { flex: 0 1 19%; position: relative; z-index: 1;} 
.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-img img { border-radius: 50%;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-img::after { width: 130px; height: 130px; border-radius: 50%; border: 1px solid var(--bg-lblue); display: block; content: ""; position: absolute; top: -12px; right: -20px; z-index: -1;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-img::before { width: 14px; height: 14px; border-radius: 50%; background: var(--bg-orange); display: block; content: ""; position: absolute; top: -6px; right: -1px; z-index: 0;}

.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-txt { flex: 0 1 60%; display: flex; flex-wrap: wrap; row-gap: 10px}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-txt h2 { transition:all .5s ease; font-size: 30px; color: var(--txt-blue); line-height: 32px; margin-bottom: 0px;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li .menu-txt p { font-size: 16px; line-height: 24px; color: var(--txt-black);}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li:last-child { margin: 0; padding: 0; border: none;}
.megamenu-sec ul li.has-mega-menu span { margin-left: 4px;}
.megamenu-sec ul li.has-mega-menu span::after { position: relative; display: block; content: "\e842"; font-family: "feather"; color: var(--txt-black); font-size: 20px; color: var(--txt-white);}
.megamenu-sec ul li.has-mega-menu.selected span::after { content: "\e845"; }
/* .megamenu-sec ul li.has-mega-menu ul.submenu ul li a:hover  { background: none;}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a:hover .menu-txt h2 { color: var(--orange);}
.megamenu-sec ul li.has-mega-menu ul.submenu ul li a:hover .menu-img img { transform: scale(1.05);} */

.megamenu-sec ul li a::after{position: absolute;display: block;content: "";left: 0;width: 0;height: 3px;bottom: 25px;background: #FFC82E;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;right: 0;margin: 0 auto;}
.megamenu-sec ul li:hover a::after, .megamenu-sec ul li a.selected::after, .megamenu-sec ul li a.active::after {width: 100%;}

.overlay { float: left; width: 100%; position: relative; }
.overlay::after { transition: all 2s ease-in-out; animation: overlay-fade 1s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: 99; display: block; content: ""; z-index: 1;}
@keyframes overlay-fade { 
    0% { opacity: 0;}
    100% { opacity: 1;}
}
 
/**************   mobilemenu css  **************/
.m-menu { position: relative; left:auto; display: none; z-index:9; } 
.m-menu img { width: 20px;}
.mobile-menu{ padding: 15px 15px; position:fixed; top:65px; bottom: 0; width:100%; height: calc(100vh - 65px); z-index: 99999; overflow-y:auto; overflow-x:hidden; opacity: 0; visibility: hidden; transition: all 0.4s ease; background: #fff; border-top: 1px solid #dadada;}
.mobile-menu.slow { opacity: 1; visibility: visible; }
body.over { overflow: hidden;}
.mobile-menu .nav { width: 100%;  background: var(--bg-white); float: left;  padding: 0px 0;}
.m-menu { width: 27px; height: 22px;  margin: 0px 0px 0 0;  -webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; float: right;  }
.m-menu a { display: block;}
.m-menu span { display: block; position: absolute; height: 2px; width: 100%; background: #fff; border-radius: 0px; opacity: 1;
left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);  -webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }  
/* Icon 4 */
.m-menu span:nth-child(1) { top: 0px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu span:nth-child(2) { top: 8px; width: 18px; right: 0; left: auto; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu span:nth-child(3) { top: 16px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; }
.m-menu.open span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: -1px; left: 4px;  background: #DA4AD0;}
.m-menu.open span:nth-child(2) { width: 0%; opacity: 0;}
.m-menu.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 18px; left: 4px; background: #DA4AD0; }
.m-menu:hover span { background:#DA4AD0;}

#accordian { width: 100%; margin:0; color: var(--txt-black); }
/* #accordian h3 {  } */
#accordian ul li a { padding: 0 0px; font-size: 20px; line-height: 24px; display: block; color: #000; font-family: 'Kanit-Medium'; text-decoration: none; position: relative;transition: 0.4s ease;}
#accordian ul li span { width: 100%; display: flex; justify-content: space-between; align-items: center; position: relative; padding: 0px 0;}
#accordian ul li ul li span  { padding: 0;}
#accordian ul li i { float: right; margin: 0; position: absolute; right: 0; font-size: 24px; cursor: pointer;}
#accordian h3:hover { text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);}
#accordian ul li a:hover { color: #DA4AD0;}
/* i { margin-right: 10px;} */
#accordian li { list-style-type: none; border-bottom: 1px solid #dadada; padding: 12px 0; }
#accordian ul ul li a, #accordian h4 { color: #000; text-decoration: none; font-size: 17px; line-height: 24px; display: block; padding: 0px 0; transition: all 0.15s;
position: relative; font-family: 'Kanit-Regular';}
#accordian ul ul li { border: none; padding: 8px 0;}
/* #accordian ul li ul li i {  position: absolute; } */
/* #accordian ul ul li a:hover { background: #003545; border-left: 5px solid lightgreen;} */
#accordian ul ul { display: none; padding-left: 10px; padding-top: 10px;} 
#accordian li.active > ul { display: block;}
#accordian ul ul ul { padding-left: 10px;}
#accordian ul ul ul li { padding: 5px 0;}
#accordian ul ul ul li a { font-size: 16px;}
#accordian li.active > span a { color: #DA4AD0;}
#accordian li.active > span i { transform: rotate(180deg); color: #DA4AD0;}
/* #accordian a:not(:only-child):after { content: "\f104"; font-family: fontawesome; position: absolute; right: 10px; top: 0; font-size: 14px;}
#accordian .active>a:not(:only-child):after { content: "\f107"; } */

.mobile-btns { float: left; width: 100%; margin-top: 30px;}
.mobile-btns ul{ float: left; width: 100%; display: flex; flex-wrap: wrap; justify-content: center;}
.mobile-btns ul li { flex: 0 1 auto;}

.home-banner .swiper-slide .ban-caption h1 span{ color: #DA4AD0;}
.home-banner .swiper-slide .ban-caption p{  font-family: 'Rubik-Regular';  font-size: 18px;  line-height: 27px;  text-align: left;  margin-bottom: 40px;  }
.home-banner .swiper-slide .ban-img span{ box-shadow: 0px 25px 100px 0px #00000026;    height: 72px;    display: inline-flex;    border: 1px solid #C4C3C3; justify-content: center;align-items: center;position: absolute;border-radius: 12px; padding: 0 40px 0 70px;    right: 0;    bottom: 30px;    background: #fff url(../images/technology.svg) no-repeat left 15px center;}
.home-banner .swiper-slide .ban-img span.bt-2{background: #fff url(../images/market-making.svg) no-repeat left 15px center;left: -70px;right: auto;}
.home-banner .swiper-slide .ban-img span.bt-3{background: #fff url(../images/talent.svg) no-repeat left 15px center;left: -70px;right: auto;top: 20px;}

.home-banner .swiper-container-horizontal > .swiper-pagination-bullets { right: 0px; width: 1300px; margin: 0px auto;}

.deliv-pad {float: left;width: 100%;padding: 120px 0 190px 0;}
.deliv-pad h2 {font-family: 'Kanit-Regular';font-size: 40px;line-height: 52px;text-align: center;padding: 0 105px;margin-bottom: 95px;color: #000;}
.deliv-pad h2 span {color: #DA4AD0;}
.deliv-pad ul {display: flex;flex-wrap: wrap;}
.deliv-pad ul li {flex: 0 1 33.33%;text-align: center;}
.deliv-pad ul li .deli-img {width: 100px;margin: 0 auto;padding-bottom: 32px;display: inline-flex;}
.deliv-pad ul li .deli-img img {float: left;width: 100%;}
.deliv-pad ul li p {float: left;width: 100%;font-family: 'Kanit-Medium';font-size: 32px;line-height: 39px;text-align: center;padding: 0 30px;}

.industry-sec { float: left;width: 100%;background: #F8F8F8;padding: 85px 0px 95px;}
#tab-container{float: left;width: 100%;overflow: hidden;padding: 85px 0 0px 0;}
ul.tabs {display: flex;flex-wrap: wrap;column-gap: 24px;row-gap: 24px;}
ul.tabs li.tab-link {position: relative;font-family: 'Rubik-Regular';font-size: 20px;line-height: 24px;border: 1px solid #3F3B45;text-align: center;border-radius: 32px;display: inline-flex;justify-content: center;align-items: center;cursor: pointer;padding: 11px 20px;transition: 0.4s ease;}
ul.tabs li.tab-link.current {font-family: 'Rubik-Bold';background: #ECE7F6;border-color: #ECE7F6;}
ul.tabs li.tab-link:hover { background: #ECE7F6;border-color: #ECE7F6;}
ul.tabs li.tab-link::before { position: absolute; display: block; content: attr(title); font-family: 'Rubik-Bold';height: 1px;color: transparent;overflow: hidden;visibility: hidden;}
.tab-content.current {display: block;}
.tab-content .indust-pad {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;padding-top: 82px;}
.tab-content .indust-pad .indust-lft {flex: 0 1 50%;}
.tab-content .indust-pad .indust-lft img {float: left;width: 100%;border-radius: 12px;}
.tab-content .indust-pad .indust-rgt {flex: 0 1 50%;padding-left: 90px;}
.tab-content .indust-pad .indust-rgt h2 {font-family: 'Kanit-Regular';font-size: 40px;line-height: 48px;text-align: left;margin-bottom: 32px;}
.tab-content {float: left;width: 100%;display: none;}

.industry {float: left;width: 100%;text-align: center;padding: 85px 0;background: #280A63; position: relative;}
.industry::before { content: ""; position: absolute; right: 0px; bottom: 0px; background: url(../images/y-arr.svg) no-repeat right bottom; width: 460px; height: 196px; }
.industry-cont { float: left; width: 100%; position: relative;}
.industry h2 {font-family: 'Kanit-Light';font-size: 40px;line-height: 40px;letter-spacing: 0.05em;margin-bottom: 42px;text-align: center;color: #fff;}
.industry a {font-family: 'Rubik-Medium';font-size: 18px;line-height: 27px;text-align: left;transition: 0.4s ease;color: #fff;height: 59px;display: inline-flex;justify-content: center;align-items: center;border: 1px solid #fff;border-radius: 50px;padding: 0 30px 0 40px;}
.acheive {float: left;width: 100%;padding: 72px 0;}
.acheive h4 {font-family: 'Kanit-Light';font-size: 20px;line-height: 32px;color: #504B4B;letter-spacing: 0.05em;text-align: left;margin-bottom: 15px;text-transform: uppercase;}
.acheive h2 {font-family: 'Kanit-Regular';font-size: 40px;font-weight: 400;line-height: 48px;text-align: left;margin-bottom: 48px;color: #000000;}
.acheive ul {display: flex;flex-wrap: wrap;}
.acheive ul li {flex: 0 1 33.33%;text-align: center;}
.acheive ul li img {width: auto;}

.partner-with {float: left;width: 100%;background: #F6F2FE;padding: 70px 0;}
.partner-with h2 {font-family: 'Kanit-Bold';font-size: 40px;line-height: 48px;margin-bottom: 50px;color: #4211A3;text-align: left;}
.partner-with ul {display: flex;flex-wrap: wrap;column-gap: 2%;}
.partner-with ul li {flex: 0 1 32%;position: relative;}
.partner-with ul li .part-img {float: left;width: 100%;}
.partner-with ul li .part-img img {float: left;width: 100%;border-radius: 14px;}
.partner-with ul li .part-cnt {float: left;padding-left: 30px;padding-right: 135px;width: 100%;position: absolute;left: 0px;bottom: 30px;}
.partner-with ul li .part-cnt h1 {font-family: 'Kanit-Bold';font-size: 28px;line-height: 30.8px;text-align: left;margin-bottom: 20px;color: #fff;}
.partner-with ul li .part-cnt p {font-family: 'Kanit-Regular';font-size: 16px;line-height: 24px;text-align: left;color: #fff;}
.partner-with ul li.top-po .part-cnt {top: 30px;bottom: auto;padding-right: 105px;}

.choice {float: left;width: 100%;padding: 72px 0;}
.choice .your-choice {background: #4211A3;float: left;width: 100%;min-height: 389px;border-radius: 32px;position: relative;overflow: hidden;}
.choice .your-choice .cho-cnt {position: absolute;transform: translate(0, -50%);top: 50%;padding-left: 72px; z-index: 2;}
.choice .your-choice .cho-cnt h2 {font-family: 'Kanit-Bold';font-size: 40px;line-height: 48px;text-align: left;color: #fff;margin-bottom: 40px;}
.choice .your-choice .cho-cnt a {font-family: 'Rubik-Medium';font-size: 18px;line-height: 27px;text-align: left;transition: 0.4s ease;color: #fff;height: 59px;display: inline-flex;justify-content: center;align-items: center;border: 1px solid #fff;border-radius: 50px;padding: 0 30px 0 40px;}
.choice .your-choice .cho-cnt a span {margin-left: 15px;}
.choice .your-choice img {width: auto;position: absolute;right: 0;bottom: 0; z-index: 2;}
.choice .your-choice::after { content: ""; position: absolute; right: 0px; top:0px; background: url(../images/pink-shape.svg) no-repeat right bottom; width: 386px; height: 375px; }
.choice .your-choice::before { content: ""; position: absolute; right: 170px; bottom:0px; background: url(../images/yellow-shape.svg) no-repeat center center; width: 515px; height: 215px; background-size: cover; }

footer {float: left;width: 100%;background: #F8F8F8;padding: 30px 0 70px 0;border-top: 0.3px solid #D1D1D1;}
footer ul.f-top {display: flex;justify-content: space-between;align-items: center;}
footer ul.f-top li ul {display: flex;column-gap: 42px; flex-wrap: wrap;}
footer ul.f-top li ul li a {font-family: 'Rubik-Regular';font-size: 18px;line-height: 32px;transition: 0.4s ease;text-align: left;}
footer .foot-btm {border-top: 1px solid #EAEAEA;float: left;width: 100%;padding: 20px 0 0 0;}
footer .foot-btm ul {display: flex;flex-wrap: wrap;}
footer .foot-btm ul li {flex: 0 1 33.33%;text-align: center;}
footer .foot-btm ul li p {text-align: left;font-family: 'Rubik-Light';font-size: 14px;line-height: 22.4px;}
footer .foot-btm ul li a {font-family: 'Rubik-Light';font-size: 14px;line-height: 22.4px;text-align: left;transition: 0.4s ease;}
.industry a span{margin-left: 20px;}
.acheive-pad{background: #F8F8F8;float: left;width: 100%;padding: 65px;border-radius: 32px;}
footer .foot-btm ul li:last-child{text-align: right;}
.tech-sec{float: left;width: 100%;}
.tech-sec .swiper-slide {display: flex;flex-wrap: wrap;align-items: center;justify-content: center;transition: all 200ms linear;transform: scale(0.8);}
.tech-sec .swiper-slide {box-shadow: 0 3px 6px rgba(0, 0, 0, 0.11);opacity: 1;transition: all 0.4s ease;}
#tech-sec {float: left;width: 100%;margin-top: 100px;}
.plat-form-cnt {float: left;width: 100%;padding: 22px;background: #F8F8F8;border-radius: 32px;min-height: 330px;}
.plat-form-cnt h2 {font-family: 'Kanit-Regular';font-size: 28px;font-weight: 400;line-height: 34px;text-align: left;min-height: 60px;margin-bottom: 16px;}
.plat-form-cnt ul {width: 100%;display: flex;flex-wrap: wrap;column-gap: 8px;row-gap: 12px;}
.plat-form-cnt ul li {font-family: 'Rubik-Medium';font-size: 17px;line-height: 20.4px;color: #4211A3;border: 1px solid #B29DD9;text-align: left;padding: 11px 24px;justify-content: center;align-items: center;border-radius: 12px;display: inline-flex;}

/* services section */
.services-sec { float: left; width: 100%; background: #F8F8F8; padding: 60px 0px 50px; }
.sec-title-div { float: left; width: 100%; display: flex; flex-wrap: wrap; }
.sec-title-lft { flex: 0 1 50%; padding-right: 50px;}
.sec-title-lft h4 { color: #05010E; font-size: 20px; line-height: 32px; font-family: 'Kanit-Light'; text-transform: uppercase; margin-bottom: 15px; letter-spacing: 1px; }
.sec-title-lft h2 { color: #05010E; font-size: 40px; line-height: 48px; font-family: 'Kanit-Regular'; }
.sec-title-lft h2 span { color: #DA4AD0; font-family: 'Kanit-Medium'; }
.sec-title-rgt { flex: 0 1 50%; padding-top: 50px;}
.sec-title-rgt p {color: #05010E;font-size: 18px;line-height: 27px;font-family: 'Rubik-Regular';margin-bottom: 32px;text-align: left;}
.sec-title-rgt p:last-child { margin-bottom: 0px;}

a.more-btn { display: flex; align-items: center; justify-content: center; width: 187px; height: 60px; border-radius: 32px; background: #4211A3; font-size: 18px; color: #fff;font-family: 'Rubik-Medium'; 
padding: 0px 10px; column-gap: 15px; transition:all .5s ease; }
a.more-btn span i { font-size: 22px;}
a.more-btn:hover { background: #DA4AD0;}

.service-slider { float: left; width: 100%; margin-top: 80px;}
.service-slider .swiper-container .swiper-slide{width: 410px;} 
.service-out { float: left; width: 100%; border: 1px solid #D0D0D0; border-radius: 16px; overflow: hidden; background: #fff; }
.service-img { float: left; width: 100%; position: relative;}
.service-img span.icon { position: absolute; left: 20px; bottom: -13px; border-radius: 4px; transition:all .5s ease;}
.service-img img{ float: left; width: 100%; }
.service-txt { float: left; width: 100%; padding: 35px 20px; min-height: 132px;}
.service-txt h3 { color: #05010E; font-size: 28px; line-height: 31px; font-family: 'Kanit-Medium'; }
.service-out:hover .service-img span.icon { bottom: -3px; box-shadow: 0px 4px 4px rgba(0,0,0,0.25); }

.service-slider .swiper-container-horizontal > .swiper-scrollbar { position: relative; left: auto; bottom: auto; width: 100%; margin-top: 70px; background: #ECE7F6; }
.service-slider .swiper-container-horizontal > .swiper-scrollbar .swiper-scrollbar-drag { background: #4211A3; }

.services-sec.w-bg{background: #fff; padding: 120px 0px 105px;}
.industry a:hover, .choice .your-choice .cho-cnt a:hover{background: #fff; color: #000;}
footer ul.f-top li ul li a:hover, footer .foot-btm ul li a:hover{color: #DA4AD0;}


.inner-banner {float: left;width: 100%;background: #ECE7F6 url(../images/banner-shp.svg) no-repeat right bottom;position: relative;min-height: 500px;}
.inner-banner .in-ban-cnt {position: absolute;transform: translate(0, -50%);top: 50%;max-width: 600px;}
.inner-banner .in-ban-cnt h2 {font-family: 'Kanit-Bold';font-size: 64px;line-height: 76.8px;color: #05010E;margin-bottom: 15px;text-align: left;}
.inner-banner .in-ban-cnt p {font-family: 'Rubik-Regular';font-size: 18px;line-height: 27px;text-align: left;color: #05010E;margin-bottom: 40px;}
.inner-banner .in-ban-cnt a {transition: all 0.5s ease;color: #fff;font-size: 18px;margin-top: 0;font-family: 'Rubik-Medium';padding: 18px 30px;border-radius: 30px;display: inline-block;background: #4211A3;}
.servi-pad {float: left;padding: 96px 0;width: 100%;overflow: hidden;}
.servi-pad ul {display: flex;flex-wrap: wrap;row-gap: 108px;}
.servi-pad ul li {flex: 0 1 100%;overflow: hidden;}
.servi-pad ul li .ser-pa {display: flex;justify-content: space-between;flex-wrap: wrap;overflow: hidden;}
.servi-pad ul li .ser-pa .ser-lft {flex: 0 1 40%;}
.servi-pad ul li .ser-pa .ser-lft img {float: left;width: 100%;}
.servi-pad ul li .ser-pa .ser-rgt {flex: 0 1 48%;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico img {width: auto;margin-bottom: 20px;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico h2 {font-family: 'Rubik-Medium';font-size: 32px;line-height: 38.4px;text-align: left;margin-bottom: 24px;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico h3 {font-family: 'Rubik-Medium';font-size: 20px;line-height: 24px;text-align: left;color: #211D29;margin-bottom: 20px;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico p {font-family: 'Rubik-Regular';font-size: 18px;font-weight: 400;line-height: 27px;text-align: left;margin-bottom: 36px;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico a {font-family: 'Rubik-Medium';font-size: 18px;line-height: 27px;text-align: left;transition: 0.4s ease;color: #4211A3;height: 59px;display: inline-flex;justify-content: center;align-items: center;border: 1px solid #4211A3;border-radius: 50px;padding: 0 30px 0 40px;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico a span {margin-left: 10px;}
.indust-serve {float: left;width: 100%;padding: 90px 0 80px 0;background: #F8F8F8;}
.indust-serve .inn-cnt h3 {font-family: 'Kanit-Light';font-size: 20px;font-weight: 300;line-height: 32px;margin-bottom: 16px;letter-spacing: 0.05em;text-align: left;text-transform: uppercase;}
.indust-serve .inn-cnt h2 {font-family: 'Kanit-Regular';font-size: 40px;line-height: 48px;max-width: 620px;margin-bottom: 96px;text-align: left;}
.indust-serve .inn-cnt h2 span {color: #DA4AD0;}
.indust-serve .inn-cnt .indust-list {float: left;width: 100%;}
.indust-serve .inn-cnt .indust-list ul {display: flex;flex-wrap: wrap;width: 100%;column-gap: 3%;margin-bottom: 48px;}
.indust-serve .inn-cnt .indust-list ul li.in-1 {flex: 0 1 65%;clip-path: polygon(100% 0, 100% 40%, 93% 100%, 0 100%, 0 1%);background: #fff;border-radius: 20px 0 0px 20px;}
.indust-serve .inn-cnt .indust-list ul li .ind-m-cnt {display: flex;flex-wrap: wrap;align-items: center;height: 100%;}
.indust-serve .inn-cnt .indust-list ul li .ind-m-cnt .ind-img {flex: 0 1 50%;display: flex;height: 100%;}
.indust-serve .inn-cnt .indust-list ul li.in-1 .ind-m-cnt .ind-img img {float: left;width: 100%;height: 100%;object-fit: cover;border-radius: 20px 0 0px 20px;}
.indust-serve .inn-cnt .indust-list ul li .ind-cnt {flex: 0 1 50%;background: #fff;padding: 32px;transition: all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;clip-path: polygon(100% 0, 100% 40%, 88% 100%, 0 100%, 0 1%);height: 100%;}
.indust-serve .inn-cnt .indust-list ul li .ind-cnt img {width: auto;margin-bottom: 16px;transition: all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;}
.indust-serve .inn-cnt .indust-list ul li .ind-cnt h2 {font-family: 'Kanit-Medium';font-size: 28px;font-weight: 500;line-height: 33.6px;transition: all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;margin: 0;margin-bottom: 16px;text-align: left;}
.indust-serve .inn-cnt .indust-list ul li .ind-cnt p {font-family: 'Kanit-Regular';font-size: 18px;transition: all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;line-height: 27px;text-align: left;padding-right: 40px;}
.indust-serve .inn-cnt .indust-list ul li.in-2 {flex: 0 1 32%;}
.indust-serve .fi-o {float: left;width: 100%;text-align: center;}
.indust-serve .fi-o h2 {font-family: 'Kanit-Medium';font-size: 40px;font-weight: 500;line-height: 60px;letter-spacing: 0.05em;text-align: center;margin-bottom: 32px;}
.indust-serve .fi-o a {display: inline-flex;align-items: center;justify-content: center;height: 60px;border-radius: 32px;background: #4211A3;font-size: 18px;color: #fff;font-family: 'Rubik-Medium';padding: 0px 10px;column-gap: 15px;transition:all .5s ease;padding: 0 40px 0 40px;}
.servi-pad ul li:nth-child(2n) .ser-pa .ser-lft{order: 1;}
.servi-pad ul li:nth-child(2n) .ser-pa .ser-rgt{order: 0;}
.indust-serve .inn-cnt .indust-list ul.li-cl li{flex: 0 1 31%;transition: all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;}
.indust-serve .inn-cnt .indust-list ul li:hover{background: #4211A3;}
.indust-serve .inn-cnt .indust-list ul li:hover .ind-cnt, .indust-serve .inn-cnt .indust-list ul li:hover .ind-cnt{background: #4211A3;}
.indust-serve .inn-cnt .indust-list ul li:hover .ind-cnt h2, .indust-serve .inn-cnt .indust-list ul li:hover .ind-cnt p{color: #fff;}
.indust-serve .inn-cnt .indust-list ul li:hover .ind-cnt img{filter: brightness(0) invert(1);}
.indust-serve .inn-cnt .indust-list ul li.in-2:hover{background: none;}
.indust-serve .inn-cnt .indust-list ul li.in-1 .ind-cnt{background: none;}
.megamenu-sec ul li a::after{position: absolute;display: block;content: "";left: 0;width: 0;height: 3px;bottom: 25px;background: #FFC82E;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;right: 0;margin: 0 auto;}
.megamenu-sec ul li:hover a::after, .megamenu-sec ul li a.selected::after {width: 100%;}
.indust-serve .fi-o a:hover, .inner-banner .in-ban-cnt a:hover{background: #DA4AD0;}
.servi-pad ul li .ser-pa .ser-rgt .se-ico a:hover{background: #4211A3;color: #fff;}



/*about-us-M*/
.abt-sec { width: 100%; float: left; margin: 0; padding:65px 0;}
.abt-cont { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.abt-cont-lft { flex: 0 1 47%;}
.abt-cont-lft h3 { font-size: 32px; line-height: 42px; color: #000; font-family: 'Kanit-Regular'; width: 100%;}
.abt-cont-lft h3 span { color: #DA4AD0; }
.abt-cont-rht { flex: 0 1 44%; }
.abt-cont-rht p { font-size: 18px; line-height: 27px; color: #000; font-family: 'Rubik-Regular'; width: 100%; padding-bottom: 24px;}

.abt-mis-vis-sec { width: 100%; float: left; margin: 0; padding: 0;}
.abt-mis-vis-cont { background: #F8F8F8; border-radius: 16px; padding:30px 63px 30px 39px; width: 100%;display: flex; flex-wrap: wrap; justify-content: space-between;}
.abt-mis-vis-cont-lft { flex: 0 1 48%;}
.abt-mis-vis-cont-lft img { float: left; width: 100%;height: 100%; object-fit: cover;}
.abt-mis-vis-cont-rht { flex: 0 1 49%;}
.mission-cont { background: #4211A3; padding: 30px 60px 40px 25px; width: 100%; margin-bottom: 30px; border-radius: 16px;}
.mission-cont h2 { font-size: 24px; line-height: 32px; color: #fff; font-family: 'Kanit-Medium'; width: 100%; margin: 10px 0;}
.mission-cont p { font-size: 18px; line-height: 27px; color: #fff; font-family: 'Rubik-Regular'; width: 100%; padding: 0;}
.abt-mis-vis-cont-rht img { width: 40px; height: 40px; }
.mission-cont.vision { background: #DA4AD0;margin-bottom: 0;}

.avya-sec {background: #F8F8F8;float: left;width: 100%;margin: 80px 0 0 0;padding: 60px 0;}
.avya-cont {width: 100%;float: left;margin: 0;padding: 0;}
.avya-cont h2 {font-size: 40px; line-height: 52px; color: #DA4AD0; font-family: 'Kanit-Medium'; width: 100%; margin: 0 0 20px 0;}
.avya-cont ul {display: flex;flex-wrap: wrap;width: 100%;column-gap: 2%;}
.avya-cont ul li {flex: 0 1 49%;}
.avya-cont ul li .adv-top-cont {width: 100%;float: left;background: #fff;padding: 30px;min-height: 186px; border-radius: 15px;}
.avya-cont ul li .adv-top-cont h3 {font-size: 32px; line-height: 42px; color: #211D29; font-family: 'Kanit-Medium'; width: 100%; margin-bottom: 5px;}
.avya-cont ul li .adv-top-cont p { font-size: 18px; line-height: 27px; color: #05010E; font-family: 'Rubik-Regular'; width: 100%; padding: 0;}
a.more-btn.adv-btn { margin: 0 auto; width: 220px; margin-top: 60px;}



/* contact-us */
.co-form {float: left;width: 100%;padding: 95px 0 120px;}
.co-form ul {display: flex;flex-wrap: wrap; box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.08); border-radius: 16px;margin: 0 50px;}
.co-form ul li {flex: 0 1 50%;}
.co-form ul li .form-lft {float: left;width: 100%;padding: 30px 48px;}
.co-form ul li .form-lft h3 { font-size: 32px; font-family: 'Kanit-Medium'; color: #000000; line-height: 38px;text-align: center;margin-bottom: 30px; }
.co-form ul li .form-lft ul {box-shadow: none;row-gap: 30px;margin: 0;}
.co-form ul li .form-lft ul li {flex: 0 1 100%;}
.co-form ul li .form-lft ul li label {width: 100%;float: left;font-size: 20px; color: #000000; font-family: 'Rubik-Medium';line-height: 24px;text-align: left;margin-bottom: 12px;}
.co-form ul li .form-lft ul li input[type="text"], .co-form ul li .form-lft ul li input[type="email"], .co-form ul li .form-lft ul li input[type="tel"] {background: #FFFFFF; height: 50px; border: 1px solid #858789; color: #858789; font-size: 18px; font-family: 'Rubik-Light';letter-spacing: 0em;text-align: left;float: left;width: 100%;padding: 12px 20px;border-radius: 8px;}
.co-form ul li .form-lft ul li textarea {background: #FFFFFF; border: 1px solid #858789; color: rgba(0, 0, 0, 0.45); font-size: 18px;font-family: 'Rubik-Light'; height: 90px; resize: none; text-align: left;float: left;width: 100%;padding: 12px 20px;border-radius: 8px;}
.co-form ul li .form-lft ul li .submit-btn {font-size: 20px;font-family: 'Rubik-Bold';line-height: 24px;text-align: center;color: #FFFFFF;width: 100%;box-shadow: 0px 44px 12px 0px #E64E2500;background: #4211A3;border-radius: 32px;padding: 16px 60px;margin: 0 auto;float: left;cursor: pointer; transition: all 0.4s ease;border: 1px solid #4211A3;}
.co-form ul li .form-lft ul li .submit-btn:hover { border: 1px solid #4211A3;color: #4211A3;background: none;}
.co-form ul li .form-rgt {float: left;width: 100%; height: 100%; text-align: center;border-radius: 0 16px 16px 0px;background: #F8F8F8;position: relative; z-index: 1;}
.co-form .contact-list {float: left;width: 100%;padding: 35px 50px; position: relative;}
.co-form .form-rgt::before{position: absolute;right: 0;bottom: 0;background: url(../images/Vector-sym.svg) no-repeat right bottom;width: 100%;height: 250px;content: '';background-size: auto 100%; z-index: 1;}
.co-form ul li .form-rgt .form-img{float: left; width: 100%;}
.co-form ul li .form-rgt .form-img img{float: left;width: 100%;border-radius: 8px;}
.co-form ul li .form-rgt ul {box-shadow: none;row-gap: 30px;margin: 0; position: relative; z-index: 10;}
.co-form ul li .form-rgt ul li {flex: 0 1 100%;text-align: left;}
.co-form ul li .form-rgt ul li i.fa.fa-phone {float: left;color: #4211A3;font-size: 24px;}
.co-form ul li .form-rgt ul li p {font-size: 20px;font-family:'Rubik-Regular';line-height: 24px;text-align: left;color: #000000;padding-left: 44px;}
.co-form ul li .form-rgt ul li i.fa.fa-envelope {float: left;font-size: 24px;color: #4211A3;}
.co-form ul li .form-rgt ul li a { transition: all 0.4s ease; font-size: 20px;font-family:'Rubik-Regular';line-height: 24px;letter-spacing: 0.2px;text-align: left;color:#000000;padding-left: 20px;}
.co-form ul li .form-rgt ul li i.fa.fa-map-marker {font-size: 27px;color: #4211A3;float: left;}
.co-form ul li .form-rgt .border {float: left;width: 100%;border-top: 1px solid #BFBEBE;margin-top: 0;}
.co-form ul li .form-rgt .scoci {float: left;width: 100%;text-align: left;padding-top: 25px; position: relative; z-index: 10;}
.co-form ul li .form-rgt .scoci p {font-size: 22px;font-family: 'Kanit-Regular';line-height: 30px;text-align: left;color: #000000;margin-bottom: 15px;}
.co-form ul li .form-rgt .scoci span {padding: 5px;float: left;text-align: center;}
.co-form ul li .form-rgt .scoci span i.fa.fa-linkedin-square {color: #D9AE74;font-size: 29px;}
.co-form ul li .form-rgt ul li a:hover { opacity: 0.7;}


.top-main {flex: 0 1 180px;}

.btn-list {
    flex: 0 1 23%;
}
.btn-list ul li a.active{    background: #DA4AD0;
    border: 1px solid #DA4AD0;
    color: #fff;}