@charset "utf-8";

/*

Theme Name: Vantage

*/
@font-face { font-family: Gilroy; src: url(../../font/Gilroy-Regular_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-Regular.woff) format('woff2'), url(../../font/Gilroy-Regular.woff) format('woff'), url(../../font/Gilroy-Regular.ttf) format('truetype'), url(../../font/Gilroy-Regular.svg) format('svg'); font-display: swap; font-style: normal; font-weight: 400; }

@font-face { font-family: Gilroy; src: url(../../font/Gilroy-RegularItalic_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-RegularItalic.woff) format('woff2'), url(../../font/Gilroy-RegularItalic.woff) format('woff'), url(../../font/Gilroy-RegularItalic.ttf) format('truetype'), url(../../font/Gilroy-RegularItalic.svg) format('svg'); font-display: swap; font-style: italic; font-weight: 400; }

@font-face { font-family: Gilroy; src: url(../../font/Gilroy-Medium_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-Medium.woff) format('woff2'), url(../../font/Gilroy-Medium.woff) format('woff'), url(../../font/Gilroy-Medium.ttf) format('truetype'), url(../../font/Gilroy-Medium.svg) format('svg'); font-display: swap; font-style: normal; font-weight: 500; }

@font-face { font-family: Gilroy; src: url(../../font/Gilroy-MediumItalic_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-MediumItalic.woff) format('woff2'), url(../../font/Gilroy-MediumItalic.woff) format('woff'), url(../../font/Gilroy-MediumItalic.ttf) format('truetype'), url(../../font/Gilroy-MediumItalic.svg) format('svg'); font-display: swap; font-style: italic; font-weight: 500; }


@font-face { font-family: Gilroy; src: url(../../font/Gilroy-SemiBold_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-SemiBold.woff) format('woff2'), url(../../font/Gilroy-SemiBold.woff) format('woff'), url(../../font/Gilroy-SemiBold.ttf) format('truetype'), url(../../font/Gilroy-SemiBold.svg) format('svg'); font-display: swap; font-style: normal; font-weight: 600; }


@font-face { font-family: Gilroy; src: url(../../font/Gilroy-SemiBoldItalic_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-SemiBoldItalic.woff) format('woff2'), url(../../font/Gilroy-SemiBoldItalic.woff) format('woff'), url(../../font/Gilroy-SemiBoldItalic.ttf) format('truetype'), url(../../font/Gilroy-SemiBoldItalic.svg) format('svg'); font-display: swap; font-style: italic; font-weight: 600; }

@font-face { font-family: Gilroy; src: url(../../font/Gilroy-Bold_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-Bold.woff) format('woff2'), url(../../font/Gilroy-Bold.woff) format('woff'), url(../../font/Gilroy-Bold.ttf) format('truetype'), url(../../font/Gilroy-Bold.svg) format('svg'); font-display: swap; font-style: normal; font-weight: 700; }

@font-face { font-family: Gilroy; src: url(../../font/Gilroy-BoldItalic_-iefix.eot) format('embedded-opentype'), url(../../font/Gilroy-BoldItalic.woff) format('woff2'), url(../../font/Gilroy-BoldItalic.woff) format('woff'), url(../../font/Gilroy-BoldItalic.ttf) format('truetype'), url(../../font/Gilroy-BoldItalic.svg) format('svg'); font-display: swap; font-style: italic; font-weight: 700; }

@font-face { font-family: 'Noto Sans Thai'; src: url(fonts/NotoSansThai-Regular.eot?#iefix) format('embedded-opentype'), url(fonts/NotoSansThai-Regular.woff2) format('woff2'), url(fonts/NotoSansThai-Regular.woff) format('woff'), url(fonts/NotoSansThai-Regular.ttf) format('truetype'), url(fonts/NotoSansThai-Regular.svg#NotoSansThai-Regular) format('svg'); font-display: swap; font-style: normal; font-weight: 400; }


@font-face { font-family: 'Noto Sans Thai'; src: url(fonts/NotoSansThai-Medium.eot?#iefix) format('embedded-opentype'), url(fonts/NotoSansThai-Medium.woff2) format('woff2'), url(fonts/NotoSansThai-Medium.woff) format('woff'), url(fonts/NotoSansThai-Medium.ttf) format('truetype'), url(fonts/NotoSansThai-Medium.svg#NotoSansThai-Medium) format('svg'); font-display: swap; font-style: normal; font-weight: 500; }


@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Regular_-iefix.eot) format('embedded-opentype'), url(../../font/NotoSansJP-Regular.woff) format('woff2'), url(../../font/NotoSansJP-Regular.woff) format('woff'), url(../../font/NotoSansJP-Regular.ttf) format('truetype'), url(../../font/NotoSansJP-Regular.svg) format('svg'); font-display: swap; font-style: normal; font-weight: 400; }


@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Black.eot); src: url(../../font/NotoSansJP-Black.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-Black.woff) format('woff2'), url(../../font/NotoSansJP-Black.woff) format('woff'), url(../../font/NotoSansJP-Black.ttf) format('truetype'), url(../../font/NotoSansJP-Black.svg) format('svg'); font-weight: 900; font-style: normal; font-display: swap; }


@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-ExtraBold.eot); src: url(../../font/NotoSansJP-ExtraBold.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-ExtraBold.woff) format('woff2'), url(../../font/NotoSansJP-ExtraBold.woff) format('woff'), url(../../font/NotoSansJP-ExtraBold.ttf) format('truetype'), url(../../font/NotoSansJP-ExtraBold.svg) format('svg'); font-weight: bold; font-style: normal; font-display: swap; }

@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Bold.eot); src: url(../../font/NotoSansJP-Bold.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-Bold.woff) format('woff2'), url(../../font/NotoSansJP-Bold.woff) format('woff'), url(../../font/NotoSansJP-Bold.ttf) format('truetype'), url(../../font/NotoSansJP-Bold.svg) format('svg'); font-weight: bold; font-style: normal; font-display: swap; }


@font-face { font-family: 'Noto Sans JP'; src: url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.eot); src: url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.eot?#iefix) format('embedded-opentype'), url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.woff2) format('woff2'), url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.woff) format('woff'), url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.ttf) format('truetype'), url(https://d21u74ttq7jqzf.cloudfront.net/vjp/font/-ExtraLight.svg#NotoSansJP-ExtraLight) format('svg'); font-weight: 200; font-style: normal; font-display: swap; }


@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Light.eot); src: url(../../font/NotoSansJP-Light.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-Light.woff) format('woff2'), url(../../font/NotoSansJP-Light.woff) format('woff'), url(../../font/NotoSansJP-Light.ttf) format('truetype'), url(../../font/NotoSansJP-Light.svg) format('svg'); font-weight: 300; font-style: normal; font-display: swap; }


@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Medium.eot); src: url(../../font/NotoSansJP-Medium.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-Medium.woff) format('woff2'), url(../../font/NotoSansJP-Medium.woff) format('woff'), url(../../font/NotoSansJP-Medium.ttf) format('truetype'), url(../../font/NotoSansJP-Medium.svg) format('svg'); font-weight: 500; font-style: normal; font-display: swap; }

@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-SemiBold.eot); src: url(../../font/NotoSansJP-SemiBold.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-SemiBold.woff) format('woff2'), url(../../font/NotoSansJP-SemiBold.woff) format('woff'), url(../../font/NotoSansJP-SemiBold.ttf) format('truetype'), url(../../font/NotoSansJP-SemiBold.svg) format('svg'); font-weight: 600; font-style: normal; font-display: swap; }

@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Thin.eot); src: url(../../font/NotoSansJP-Thin.eot?#iefix) format('embedded-opentype'), url(../../font/NotoSansJP-Thin.woff) format('woff2'), url(../../font/NotoSansJP-Thin.woff) format('woff'), url(../../font/NotoSansJP-Thin.ttf) format('truetype'), url(../../font/NotoSansJP-Thin.svg) format('svg'); font-weight: 100; font-style: normal; font-display: swap; }

@font-face { font-family: 'Noto Sans JP'; src: url(../../font/NotoSansJP-Regular.eot); src: url(../../font/NotoSansJP-Regular_-iefix.eot) format('embedded-opentype'), url(../../font/NotoSansJP-Regular.woff) format('woff2'), url(../../font/NotoSansJP-Regular.woff) format('woff'), url(../../font/NotoSansJP-Regular.ttf) format('truetype'), url(../../font/NotoSansJP-Regular.svg) format('svg'); font-weight: normal; font-style: normal; font-display: swap; }

:root{

    /* base colors */

    --v-white: #FFFFFF;

    --v-grey: #818181;

    --v-grey-light1: #E8E9ED;

    --v-grey-light2: #F5F5F5;

    --v-grey-light3: #F8F8F9;

    --v-grey-light4: #E2E2E2;

    --v-grey-dark: #C6C6C6;

    --v-grey-darker: #616161;

    --v-orange: #E35728;

    --v-orange-light: #FF8E5C;

    --v-pink: #FF3C70;

    --v-pink-light: #E87B6D;

    --v-red: #F44040;

    --v-red-dark: #C62400;

    --v-blue: #007FFF;

    --v-blue-dark: #0900FF;

    --v-green: #147875;

    --v-green-soft: #00DDCE;

    --v-green-mute: #14AEA9;

    --v-green-light: #00C79C;

    --v-green-lighter: #00AB86;

    --v-green-darker: #034854;

    --v-black: #000000;

    --v-black-light: #002329;



    /* Public font size */

    --fs-84:84px;

    --fs-70:70px;

    --fs-60:60px;

    --fs-56:56px;

    --fs-50:50px;

    --fs-40:40px;

    --fs-38:38px;

    --fs-36:36px;

    --fs-34:34px;

    --fs-32:32px;

    --fs-30:30px;

    --fs-26:26px;

    --fs-24:24px;

    --fs-22:22px;

    --fs-20:20px;

    --fs-18:18px;

    --fs-16:16px;

    --fs-14:14px;

    --fs-13:13px;

    --fs-12:12px;



    /* 暂定页面大小 */

    --page-h1:var(--fs-56);

    --page-h2:var(--fs-50);

    --page-h3:var(--fs-38);

    --page-h4:var(--fs-22);

    --page-h5:var(--fs-20);

    --page-h6:var(--fs-18);

    --page-h7:var(--fs-16);



    --hm-fs-84:84px;

    --hm-fs-74:74px;

    --hm-fs-70:70px;

    --hm-fs-60:60px;

    --hm-fs-50:50px;

    --hm-fs-40:40px;

    --hm-fs-34:34px;

    --hm-fs-34-sm:34px;

    --hm-fs-26:26px;

    --hm-fs-24:24px;

    --hm-fs-22:22px;

}

::selection{background: var(--v-green-darker);color: var(--v-white);}

*,

*:before,

*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding: 0;margin: 0;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);}

html{background:none;-webkit-text-size-adjust:100%;height:100%;}

body{font-family: 'Noto Sans JP',Gilroy, Arial, Helvetica, sans-serif;font-size: var(--fs-16);font-weight: 400; margin: 0px;line-height: 1.5;color: var(--v-grey);text-align: left;background-color: #fff;}
html[lang='en-US'] body,
html[lang='ms-MY'] body,
html[lang='id-ID'] body{font-family: Gilroy,'Noto Sans JP', Arial, Helvetica, sans-serif;}

hr{box-sizing: content-box;height: 0;overflow: visible}

b,strong{font-weight:800;}

button, input, optgroup, select, textarea {margin: 0; font-family: inherit;font-size: inherit;line-height: inherit;-webkit-appearance: none; -moz-appearance: none; appearance: none;outline: none;}

/* 字体大小未定义 */

h1{font-weight:700;font-size:var(--fs-50);line-height: 1.05;}
h2{font-weight:700;font-size:var(--fs-40);line-height: 1.22;}
h3{font-weight:600;font-size:var(--fs-38);line-height: 1.22;}
h4{font-weight:600;font-size:var(--fs-22);line-height: 1.22;}
h5{font-weight:500;font-size:var(--fs-20);line-height: 1.22;}
h6{font-weight:500;font-size:var(--fs-18);line-height: 1.22;}

a{color: inherit;}

a, a:hover {text-decoration: none;}

a.underline, a.underline:hover {text-decoration: underline;}

p{margin: 0 0 20px;font-weight: 400;}

img{max-width: 100%;height: auto;border-style: none;vertical-align: middle;}

li{list-style: none;}

sub,sup {position: relative;font-size: 75%;line-height: 0;vertical-align: baseline;}

sub{bottom: -.25em;}

sup{top: -.5em;}

svg{overflow: hidden;vertical-align: middle;}

table{border-collapse: collapse}

th{text-align: inherit;text-align: -webkit-match-parent;}



label{display: inline-block;}

button{border-radius: 0;}

button:focus:not(:focus-visible){outline: 0;}

button,input,optgroup,select,textarea{margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;}

button,input{overflow: visible;}

button,select{text-transform: none;}

[role=button]{cursor: pointer;}

select{word-wrap: normal;}

[type=button],[type=reset],[type=submit],button{-webkit-appearance: button;}

[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor: pointer;}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding: 0;border-style: none;}

input[type=checkbox],input[type=radio]{box-sizing: border-box;padding: 0;}

textarea{overflow: auto;resize: vertical;}



.cover { position: absolute; bottom: 0;left:0; height: 100%; width: 100%;}
.to-top { background: linear-gradient(to top,rgba(255, 255, 255, 0), rgba(255, 255, 255, 0),#000000);}
.to-bottom { background: linear-gradient(to bottom,rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), #000000);}
.to-left { background: linear-gradient(to left,rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), #000000);}
.to-right { background: linear-gradient(to right,rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), #000000);}



.inner{max-width: 1640px; padding:0 100px; margin:0 auto;}

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

.flex.justify-center{justify-content: center; }

.flex.justify-end{justify-content: flex-end;}

.flex.justify-start{justify-content: flex-start; }

.flex.align-center{align-items: center;}

.flex.align-end{align-items: flex-end;}

.flex.align-start{align-items: flex-start;}



.col-1{flex:0 0 100%;}

.col-2{flex:0 0 50%;}

.col-3{flex:0 0 33.3%;}

.col-4{flex:0 0 25%;}

.col-5{flex:0 0 20%;}

.col-6{flex:0 0 16.7%;}

.col-7{flex:0 0 14.3%;}



.fw-800 {font-weight: 700;}

.fw-600 {font-weight: 600;}

.fw-500 {font-weight: 500;}

.fw-400 {font-weight: 400;}



.home-h2-title{font-size: var(--hm-fs-70);font-weight: 600;color: var(--v-black-light);margin-bottom: 30px;text-align: center;}

.home-h2-title span{color: var(--v-orange);}



.hover-orange:hover{color:var(--v-orange);}



/*Button Css Start*/

.orange-button{ padding:16px 42px; width:max-content; font-size:var(--fs-18); font-weight:500; line-height:1.1; background-color: var(--v-orange);border-radius: 35px;color: var(--v-white); text-align: center; text-decoration: none; position: relative; overflow: hidden; display: inline-block; transition: all .2s linear; z-index: 1; box-shadow:0px 0px 25px rgba(212,61,20,0.15);}

.orange-button::after{z-index: -1;content: "";position: absolute;top: 50%;left: 50%;width: 1.4em;height: 1.4em;border-radius: 50%;background-color: #d43d14;transform-origin: center;transform: translate3d(-50%, -50%, 0) scale(0, 0);transition: transform 0.45s ease-in-out;}

.orange-button span{z-index: 9;position: relative;}

.orange-button:hover::after{transform: translate3d(-50%, -50%, 0) scale(15, 15);}

.orange-button.p22{padding:20px 48px 17px; font-size:var(--fs-22);}

.orange-button.p18{padding:16px 42px; font-size:var(--fs-18);}

.orange-button.p16{padding:17px 38px 15px; font-size:var(--fs-16);}

/* -----JP Start----- */

.orange-button-jp {cursor: pointer;;display: flex;color: #ffff;font-size: var(--fs-24);font-weight: 600;line-height: 1.2;width: max-content;box-shadow: 0px 0px 0.2rem #00000029;background: linear-gradient(to right, #F08461, #DE3600);border-radius: 44px;padding: 15px 80px 14px 46px;transition: .3s all;flex-direction: column;align-items: center;justify-content: center;position: relative;z-index: 1;overflow: hidden;font-size: 44px;}
.orange-button-jp:before { z-index: -1; content: ""; position: absolute; top: 50%; left: 50%; width: 1.4em; height: 1.4em; border-radius: 50%; background-color: #d43d14; transform-origin: center; transform: translate3d(-50%, -50%, 0) scale(0, 0); transition: transform 0.45s ease-in-out; -webkit-transition: transform 0.45s ease-in-out; -moz-transition: transform 0.45s ease-in-out; -ms-transition: transform 0.45s ease-in-out; -o-transition: transform 0.45s ease-in-out; }
.orange-button-jp:after { content: ''; position: absolute; right: 16px; width: 22px; height: 38px; background: url(/wp-content/themes/vantage/images/btm-arrow-right.svg) no-repeat; background-size: cover; }
.orange-button-jp:hover::before{ transform: translate3d(-50%, -50%, 0) scale(15, 15); -webkit-transform: translate3d(-50%, -50%, 0) scale(15, 15); -moz-transform: translate3d(-50%, -50%, 0) scale(15, 15); -ms-transform: translate3d(-50%, -50%, 0) scale(15, 15); -o-transform: translate3d(-50%, -50%, 0) scale(15, 15); }
.orange-button-jp span { font-size: var(--fs-30); font-weight: 400;}
html[lang='en-US'] .orange-button-jp {font-size: var(--fs-34);}
html[lang='en-US'] .orange-button-jp span {font-size: var(--fs-22);}

html[lang='ms-MY'] .orange-button-jp {font-size: var(--fs-26);}
html[lang='ms-MY'] .orange-button-jp span {font-size: var(--fs-22);}

html[lang='id-ID'] .orange-button-jp {font-size: var(--fs-30);}
html[lang='id-ID'] .orange-button-jp span {font-size: var(--fs-20);}

html[lang='th-TH'] .orange-button-jp {font-size: var(--fs-30);}
html[lang='th-TH'] .orange-button-jp span {font-size: var(--fs-20);}

html[lang='ms-MY'] .orange-button-jp:before,
html[lang='id-ID'] .orange-button-jp:before{width: 1.8em;}

.faq li .icon { position: absolute; width: 32px; height:32px; border-radius: 50%; background-color: #e5572a; top: 50%; right: .1rem; transform: translate(-50%, -50%); }
.faq li .icon:before,
.faq li .icon:after { content:'';position: absolute; left: calc(50% - 9.5px); top: calc(50% - 1.5px); width:19px;height:3px;background-color:#ffffff;transition:.2s all; }
.faq li .icon:before { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }
.faq .active .icon:before{ transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); }


.markets-banner-bottom{width: 100%;position: absolute;bottom: 0;left: 0;padding: 18px 0px;background-color: #082D33; z-index: 1;}
.markets-banner-bottom .markets-banner-bottom-inner{display: flex;justify-content: space-between;align-items: center;max-width: 1640px;margin: 0 auto;padding: 0px 100px;}
.markets-banner-bottom .small-btn{display: block;position: relative;background: #E55728;box-shadow: 0px 3px 6px #00000029;border-radius: 10px;max-width: 100%;font-size: var(--fs-22);line-height: 1;color: var(--v-white);padding: 14px 33px 14px 26px;z-index: 1;overflow: hidden;}
.markets-banner-bottom .small-btn::after{content: '';position: absolute;right: 11px;width: 9px;height: 15px;background: url(/wp-content/themes/vantage/images/btm-arrow-right.svg) no-repeat;background-size: cover;top: 50%;transform: translateY(-40%);}
.markets-banner-bottom .small-btn::before{z-index: -1;content: "";position: absolute;top: 50%;left: 50%;width: 1.4em;height: 1.4em;border-radius: 50%;background-color: #d43d14;transform-origin: center;transform: translate3d(-50%, -50%, 0) scale(0, 0);transition: transform 0.45s ease-in-out;}
.markets-banner-bottom .small-btn:hover::before { transform: translate3d(-50%, -50%, 0) scale(15, 15); }
.markets-banner-bottom .bottom-right{display: flex;align-items: center;column-gap: 10px;}
.markets-banner-bottom .bottom-right p{color: var(--v-white);font-size: var(--fs-18);font-weight: 400;margin-bottom:0;}
.markets-banner-bottom .bottom-right .download{display: flex;}
.markets-banner-bottom .bottom-right .download img:nth-of-type(1){margin-right: 20px;}
@media (max-width: 1640px) {
    .markets-banner-bottom .markets-banner-bottom-inner{max-width: 1480px;padding: 0px 20px;}
}
@media (max-width:1300px){
    .markets-banner-bottom .bottom-right{flex-direction: column;gap: 10px;}
    .markets-banner-bottom .bottom-right p{margin-bottom: 10px;}
}
@media (max-width:1024px){
}
@media (max-width:800px){
    .markets-banner-bottom .markets-banner-bottom-inner{flex-direction: column;}
    .markets-banner-bottom .bottom-right{margin-top: 15px;}
}
@media (max-width:510px){
    .markets-banner-bottom .bottom-right .download img{max-width: 44%;}
}

/* -----JP End----- */

.green-button{ padding:16px 42px 15px; width:max-content; font-size:var(--fs-18); font-weight:500; line-height:1.1; background-color: var(--v-green-darker);border-radius: 35px;color: var(--v-white); text-align: center; text-decoration: none; position: relative; overflow: hidden; display: inline-block; transition: all .2s linear; z-index: 1; box-shadow:0px 0px 25px rgba(3,72,84,0.15);}

.green-button::after{z-index: -1;content: "";position: absolute;top: 50%;left: 50%;width: 1.2em;height: 1.2em;border-radius: 50%;background-color: #013038;transform-origin: center;transform: translate3d(-50%, -50%, 0) scale(0, 0);transition: transform 0.45s ease-in-out;}

.green-button span{z-index: 9;position: relative;}

.green-button:hover::after{transform: translate3d(-50%, -50%, 0) scale(15, 15);}

.green-button.p22{padding:20px 48px 17px; font-size:var(--fs-22);}

.green-button.p18{padding:16px 42px; font-size:var(--fs-18);}

.green-button.p16{padding:17px 38px 15px; font-size:var(--fs-16);}



.live-button{ padding:20px 45px; width:max-content; font-size:var(--fs-18); font-weight:500; line-height:1.1; background-color: var(--v-orange);border-radius: 35px;color: var(--v-white); text-align: center; text-decoration: none; position: relative; overflow: hidden; display: inline-block; transition: all .2s linear; z-index: 1; box-shadow:0px 0px 25px rgba(212,61,20,0.15); letter-spacing:0.5px;}

.live-button::after{z-index: -1;content: "";position: absolute;top: 50%;left: 50%;width: 2.5em;height: 2.5em;border-radius: 50%;background-color: #d43d14;transform-origin: center;transform: translate3d(-50%, -50%, 0) scale(0, 0);transition: transform 0.45s ease-in-out;}

.live-button > span{z-index: 9;position: relative;}

.live-button > span span{ color:#fce055;}

.live-button:hover::after{transform: translate3d(-50%, -50%, 0) scale(15, 15);}

.live-button.p16{padding:17px 32px; font-size:var(--fs-16); letter-spacing:normal;}



.live-language-bar { width: 180px; height: 486px; position: absolute; top: 45px; right: 0; background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 10px 14px #0000005E; border-radius: 8px; overflow-y: auto; display: none;}



.demo-button{ padding:20px 45px; width:max-content; font-size:var(--fs-18); font-weight:500; line-height:1.1; background-color: var(--v-green-darker);border-radius: 35px;color: var(--v-white); text-align: center; text-decoration: none; position: relative; overflow: hidden; display: inline-block; transition: all .2s linear; z-index: 1; box-shadow:0px 0px 25px rgba(212,61,20,0.15); letter-spacing:0.5px;}

.demo-button::after{z-index: -1;content: "";position: absolute;top: 50%;left: 50%;width: 1.2em;height: 1.2em;border-radius: 50%;background-color: #013038;transform-origin: center;transform: translate3d(-50%, -50%, 0) scale(0, 0);transition: transform 0.45s ease-in-out;}

.demo-button > span{z-index: 9;position: relative;}

.demo-button > span span{ color:#abe6e0;}

.demo-button:hover::after{transform: translate3d(-50%, -50%, 0) scale(15, 15);}

.demo-button.p16{padding:17px 32px; font-size:var(--fs-16); letter-spacing:normal;}







.orange-arrow-button {text-decoration: none; display:inline-block; background-color: var(--v-orange); padding: 21px 78px 19px 28px; border-radius: 100px; color: var(--v-white); font-weight: 500; line-height:1.1; position: relative; z-index: 1; overflow: hidden; transition: .3s; margin: 0 auto; text-transform: uppercase; font-size: var(--fs-22);}

.orange-arrow-button .btn-icon{ display:flex; width: 56px; height: 48px; border-radius:30px; background:var(--v-white); position: absolute;right: 8px; top:50%; transform: translateY(-50%) translateZ(0px); transition:.3s; justify-content: center; align-items: center;}

.orange-arrow-button .btn-icon img{width: 60%; transition:.3s;}

.orange-arrow-button::before {content: '';display: block;width: 120px;height: 150px;background-color: #d43d14;position: absolute;top:0%;left:0%;border-radius: 50%;transition:.4s;z-index: -1;transform: translate(-100%, 100%);}

.orange-arrow-button .btn-text{transition: .3s;}

.orange-arrow-button .btn-text span{ color:#fce055;}

.orange-arrow-button:hover{ padding-right:82px;}

.orange-arrow-button:hover .btn-text{transform: translateX(4px);}

.orange-arrow-button:hover::before {transform: translate(50%, 50%) scale(4);}

.orange-arrow-button:hover .btn-icon{transform: translate(4px,-50%) translateZ(0px); right:12px;}

.orange-arrow-button:hover .btn-icon img{transform: translateX(0px) rotate(45deg);}



.orange-arrow-button.p22{padding: 21px 72px 19px 28px; font-size:var(--fs-22);}

.orange-arrow-button.p22 .btn-icon{ width:56px; height:48px; border-radius:30px;}

.orange-arrow-button.p22:hover{ padding-right:76px;}



.orange-arrow-button.p18{padding:20px 62px 18px 28px; font-size:var(--fs-18);}

.orange-arrow-button.p18 .btn-icon{ width:46px; height:42px; border-radius:20px;}

.orange-arrow-button.p18:hover{ padding-right:66px;}



.orange-arrow-button.p16{padding:18px 56px 17px 24px; font-size:var(--fs-16);}

.orange-arrow-button.p16 .btn-icon{ width:40px; height:36px; border-radius:20px;}

.orange-arrow-button.p16:hover{ padding-right:60px;}



.orange-arrow-button.p14{padding:17px 52px 15px 20px; font-size:var(--fs-14);}

.orange-arrow-button.p14 .btn-icon{ width:36px; height:32px; border-radius:20px;}

.orange-arrow-button.p14:hover{ padding-right:56px;}





.green-arrow-button {text-decoration: none; display:inline-block; background-color: var(--v-green-darker); padding: 21px 78px 19px 28px; border-radius: 100px; color: var(--v-white); font-weight: 500; line-height:1.1; position: relative; z-index: 1; overflow: hidden; transition: .3s; margin: 0 auto; text-transform: uppercase; font-size: var(--fs-22);}

.green-arrow-button .btn-icon{ display:flex; width: 56px; height: 48px; border-radius:30px; background:var(--v-white); position: absolute;right: 8px; top:50%; transform: translateY(-50%) translateZ(0px); transition:.3s; justify-content: center; align-items: center;}

.green-arrow-button .btn-icon img{width: 60%; transition:.3s;}

.green-arrow-button::before {content: '';display: block;width: 120px;height: 150px;background-color: #013038;position: absolute;top:0%;left:0%;border-radius: 50%;transition:.4s;z-index: -1;transform: translate(-100%, 100%);}

.green-arrow-button .btn-text{transition: .3s;}

.green-arrow-button .btn-text span{ color:#abe6e0;}

.green-arrow-button:hover{ padding-right:82px;}

.green-arrow-button:hover .btn-text{transform: translateX(4px);}

.green-arrow-button:hover::before {transform: translate(50%, 50%) scale(4);}

.green-arrow-button:hover .btn-icon{transform: translate(4px,-50%) translateZ(0px); right:12px;}

.green-arrow-button:hover .btn-icon img{transform: translateX(0px) rotate(45deg);}



.green-arrow-button.p22{padding: 21px 72px 19px 28px; font-size:var(--fs-22);}

.green-arrow-button.p22 .btn-icon{ width:56px; height:48px; border-radius:30px;}

.green-arrow-button.p22:hover{ padding-right:76px;}



.green-arrow-button.p18{padding:20px 62px 18px 28px; font-size:var(--fs-18);}

.green-arrow-button.p18 .btn-icon{ width:46px; height:42px; border-radius:20px;}

.green-arrow-button.p18:hover{ padding-right:66px;}



.green-arrow-button.p16{padding:18px 56px 17px 24px; font-size:var(--fs-16);}

.green-arrow-button.p16 .btn-icon{ width:40px; height:36px; border-radius:20px;}

.green-arrow-button.p16:hover{ padding-right:60px;}



.green-arrow-button.p14{padding:17px 52px 15px 20px; font-size:var(--fs-14);}

.green-arrow-button.p14 .btn-icon{ width:36px; height:32px; border-radius:20px;}

.green-arrow-button.p14:hover{ padding-right:56px;}



/*Old*/

.open-account-btn {text-decoration: none; display:inline-block; background-color: var(--v-orange); padding: 21px 78px 19px 28px; border-radius: 100px; color: var(--v-white); font-weight: 500; line-height:1.1; position: relative; z-index: 1; overflow: hidden; transition: .3s; margin: 0 auto; text-transform: uppercase; font-size: var(--fs-22);}

.open-account-btn .btn-icon{ display:flex; width: 56px; height: 48px; border-radius:30px; background:var(--v-white); position: absolute; right: 8px; top:50%; transform: translateY(-50%) translateZ(0px); transition:.3s; justify-content: center; align-items: center;}

.open-account-btn .btn-icon img{width: 60%; transition:.3s;}

.open-account-btn::before {content: '';display: block;width: 175px;height: 150px;background-color: #d43d14;position: absolute;top:0%;left:0%;border-radius: 50%;transition:.4s;z-index: -1;transform: translate(-100%, 100%);}

.open-account-btn .btn-text{transition: .3s;}

.open-account-btn:hover{ padding-right:82px;}

.open-account-btn:hover .btn-text{transform: translateX(4px);}

.open-account-btn:hover::before {transform: translate(50%, 50%) scale(4);}

.open-account-btn:hover .btn-icon{transform: translate(4px,-50%) translateZ(0px); right:12px;}

.open-account-btn:hover .btn-icon img{transform: translateX(0px) rotate(45deg);}

.open-account-btn .dim-text {color: #FFD5C2;}





.open-account-btn.p22{padding: 21px 72px 19px 28px; font-size:var(--fs-22);}

.open-account-btn.p22 .btn-icon{ width:56px; height:48px; border-radius:30px;}

.open-account-btn.p22:hover{ padding-right:76px;}



.open-account-btn.p18{padding:20px 62px 18px 28px; font-size:var(--fs-18);}

.open-account-btn.p18 .btn-icon{ width:46px; height:42px; border-radius:20px;}

.open-account-btn.p18:hover{ padding-right:66px;}



.open-account-btn.p16{padding:18px 56px 17px 24px; font-size:var(--fs-16);}

.open-account-btn.p16 .btn-icon{ width:40px; height:36px; border-radius:20px;}

.open-account-btn.p16:hover{ padding-right:60px;}



.open-account-btn.p14{padding:17px 52px 15px 20px; font-size:var(--fs-14);}

.open-account-btn.p14 .btn-icon{ width:36px; height:32px; border-radius:20px;}

.open-account-btn.p14:hover{ padding-right:56px;}





/*Button Css End*/



/* protected Css Start */

.ppw-post-password-container{width: 100%;max-width: 500px;margin: 200px auto;padding: 20px;}

.ppw-ppf-desc{font-size: 22px;color: var(--v-black);margin-bottom: 30px;}

.ppw-ppf-field-container{display: flex;justify-content: space-between;align-items: center;}

.ppw-ppf-input-container label.ppw-pwd-label{width: 100%;color: var(--v-black);}

.ppw-ppf-input-container label.ppw-pwd-label input{width: 70%;margin-left: 10px;border: 1px solid var(--v-black);padding: 4px 10px;}

.ppw-pwd-submit-btn{width: 120px;height: 36px;background: var(--v-orange);border: 0px;border-radius: 18px;color: var(--v-white);}



/* protected Css End*/



.icon-title{font-size:var(--fs-22);color:var(--v-black); font-weight:600; padding-left:20px;position:relative;margin-bottom:15px;text-transform:uppercase}

.icon-title::after{content:'';display:block;top:50%;transform:translateY(-60%);left:0px;width:17px;height:17px;position:absolute;background:url(/wp-content/themes/vantage/images/forex-trading-icon3.svg)center center no-repeat}





#adroll_consent_container{ display:none !important;}


/* logo title start */
.logo-box{display: flex; gap: 14px; align-items: center; margin-bottom: 30px;}
.logo-box .text-box p{font-size: var(--fs-18); line-height: 1.33; color: #000000; margin-bottom: 0px;text-align: left;}
.logo-box .text-box h2{font-size: var(--fs-34); line-height: 1.35; color: #000000; margin: 0;}
/* logo title end */


@media (min-width: 768px) {

    /* Chrome */

    ::-webkit-scrollbar { width: 6px;height: 8px;}

    ::-webkit-scrollbar-track {border-radius: 10px;background-color: transparent;}

    ::-webkit-scrollbar-thumb {background-color: rgba(144, 147, 153, 0.3);transition: background-color 0.3s;border-radius: 10px;}

    ::-webkit-scrollbar-thumb:hover {background-color: rgba(144, 147, 153, 0.3);transition: background-color 0.3s;}

    /* Firefox */

    *{

        scrollbar-color:rgba(144, 147, 153, 0.3) rgba(255,255,255,0) ;

        scrollbar-width: thin;

    }

}

@media (max-width:1600px){

    :root{

        --fs-84:60px;

        --fs-70:60px;

        --fs-60:60px;

        --fs-56:50px;

        --fs-50:46px;

        --fs-40:36px;



        --hm-fs-84:50px;

        --hm-fs-74:50px;

        --hm-fs-70:50px;

        --hm-fs-60:50px;

        --hm-fs-50:40px;

        --hm-fs-40:36px;

        --hm-fs-34:26px;

        --hm-fs-34-sm:22px;

        --hm-fs-26:22px;

        --hm-fs-24:22px;

        --hm-fs-22:20px;

    }

}

@media (max-width:1440px){

    :root{

        --fs-84:50px;

        --fs-70:50px;

        --fs-60:50px;

        --fs-56:45px;

        --fs-50:45px;

        --fs-40:35px;

        --fs-38:35px;

        --fs-36:30px;

        --fs-34:30px;

        --fs-32:30px;

        --fs-30:28px;

        --fs-26:24px;

        --fs-24:22px;

        --fs-22:18px;



        --hm-fs-84:40px;

        --hm-fs-74:40px;

        --hm-fs-70:40px;

        --hm-fs-60:40px;

        --hm-fs-50:30px;

        --hm-fs-40:26px;

        --hm-fs-34:24px;

        --hm-fs-34-sm:20px;

        --hm-fs-26:20px;

        --hm-fs-24:20px;

        --hm-fs-22:18px;

    }

	

	

	/*Button Css Start*/

	.orange-button.p22,

	.green-button.p22{ padding:17px 45px;}

	

	.live-button,

	.demo-button{ padding-left:40px; padding-right:40px;}

	.live-button.p16,

	.demo-button.p16{ padding-left:30px; padding-right:30px;}

	

	.orange-arrow-button,

	.green-arrow-button,

	.orange-arrow-button.p22,

	.green-arrow-button.p22,

	.open-account-btn,

	.open-account-btn.p22{ font-size:20px; padding:19px 62px 17px 28px;}

	

	.orange-arrow-button .btn-icon,

	.green-arrow-button .btn-icon,	

	.orange-arrow-button.p22 .btn-icon,

	.green-arrow-button.p22 .btn-icon,

	.open-account-btn .btn-icon,

	.open-account-btn.p22 .btn-icon{ width:46px; height:42px;border-radius:20px;}

	

	.orange-arrow-button:hover,

	.green-arrow-button:hover,	

	.orange-arrow-button.p22:hover,

	.green-arrow-button.p22:hover,

	.open-account-btn:hover,

	.open-account-btn.p22:hover{ padding-right:66px;}

	/*Button Css End*/

    .orange-button-jp{font-size: var(--fs-38);}
    .orange-button-jp span {font-size: var(--fs-26);}

    html[lang='th-TH'] .orange-button-jp {font-size: var(--fs-30);}
    html[lang='th-TH'] .orange-button-jp span {font-size: var(--fs-20);}

}
@media (max-width:1640px){
	.inner{ max-width: 1480px; padding-left:20px; padding-right:20px;}
	/* .inner{ padding-left:65px; padding-right:65px;} */
}


@media (max-width:1400px){
	/* .inner{ padding-left:65px; padding-right:65px;} */
}



@media (max-width:1240px){

    .col-7{flex:0 0 25%;}

}

@media (max-width:1024px){

    .col-4{flex:0 0 50%;}

    .col-2{flex:0 0 100%;}



    :root{

        --fs-84:60px;

        --fs-70:56px;

        --fs-60:50px;

        --fs-56:48px;

        --fs-50:42px;

        --fs-32:28px;

        --fs-30:26px;

    }



    /* .inner{ padding-left:20px; padding-right:20px;} */



    .pc-br-css{display: none;}

}

@media (max-width:992px){

    .col-6{flex:0 0 33.3%;}



    .orange-button{padding: 15px 30px;}

}

@media (max-width:980px){
    .faq li .icon{width: 28px;height: 28px;right: 5px;}
    .faq li .icon:before, 
    .faq li .icon:after{height: 2px;width: 18px;left: calc(50% - 9px);top: calc(50% - 1px);}
}

@media (max-width:768px){

    .col-4{flex:0 0 100%;}

    .col-3{flex:0 0 50%;}



    :root{

        --fs-84:36px;

        --fs-70:36px;

        --fs-60:36px;

        --fs-56:36px;

        --fs-50:36px;

        --fs-40:32px;

        --fs-38:30px;

        --fs-36:30px;

        --fs-34:30px;

        --fs-32:28px;

        --fs-30:26px;

        --fs-26:24px;

        --fs-24:22px;

        --fs-22:20px;

        --fs-20:18px;

        --fs-18:16px;

    }	

	/*Button Css Start*/

	.orange-button.p22,
	.green-button.p22{ font-size:18px; padding:16px 42px 15px;}	
	.orange-button,
	.green-button,
	.orange-button.p18,
	.green-button.p18{ padding-left:38px; padding-right:38px; padding-top:16px; padding-bottom:16px;}	


	.live-button,
	.demo-button{ padding:18px 36px 16px;}
	.live-button.p16,

	.demo-button.p16{ padding:14px 24px 13px;}

	

	

	.orange-arrow-button,

	.green-arrow-button,

	.orange-arrow-button.p22,

	.green-arrow-button.p22,

	.open-account-btn,

	.open-account-btn.p22{ font-size:18px; padding:20px 62px 18px 28px;}	

	.orange-arrow-button .btn-icon,

	.green-arrow-button .btn-icon,

	.orange-arrow-button.p22 .btn-icon,

	.green-arrow-button.p22 .btn-icon,

	.open-account-btn .btn-icon,

	.open-account-btn.p22 .btn-icon{ width:46px; height:42px;border-radius:20px;}	

	.orange-arrow-button:hover,

	.green-arrow-button:hover,

	.orange-arrow-button.p22:hover,

	.green-arrow-button.p22:hover,

	.open-account-btn:hover,

	.open-account-btn.p22:hover{ padding-right:66px;}

	

	.orange-arrow-button.p18,

	.green-arrow-button.p18,

	.open-account-btn.p18{ font-size:16px; padding:19px 56px 16px 24px;}

	.orange-arrow-button.p18 .btn-icon,

	.green-arrow-button.p18 .btn-icon,

	.open-account-btn.p18 .btn-icon{ width:40px; height:36px;border-radius:20px;}

	.orange-arrow-button.p18:hover,

	.green-arrow-button.p18:hover,

	.open-account-btn.p18:hover{ padding-right:60px;}	

	/*Button Css End*/



    .home-h2-title span.isblock{display: block;}

    .logo-box{margin-bottom: 20px;}
    .logo-box .img-box{width: 66px;}

}

@media (max-width:600px){



}

@media (max-width:510px){

    :root{

        --hm-fs-84:24px;

        --hm-fs-74:24px;

        --hm-fs-70:24px;

        --hm-fs-60:24px;

        --hm-fs-50:20px;

        --hm-fs-40:20px;

        --hm-fs-34:18px;

        --hm-fs-34-sm:14px;

        --hm-fs-26:20px;

        --hm-fs-24:16px;

        --hm-fs-22:16px;



        --fs-84:24px;

        --fs-70:24px;

        --fs-60:24px;

        --fs-56:24px;

        --fs-50:20px;

        --fs-40:19px;

        --fs-38:18px;

        --fs-36:18px;

        --fs-34:18px;

        --fs-32:18px;

        --fs-30:18px;

        --fs-26:16px;

        --fs-24:16px;

        --fs-22:16px;

        --fs-20:16px;

        --fs-18:14px;

        --fs-16:14px;

        --fs-14:12px;

        --fs-13:12px;

    }

    /* .inner{ padding-left:20px; padding-right:20px;} */

	

	/*Button Css Start*/	

	.orange-button,

	.green-button,

	.orange-button.p18,

	.green-button.p18{ padding:15px 32px 14px;}	

	.orange-button.p16,

	.green-button.p16{ padding:14px 28px 13px;}

	.orange-button.p22,

	.green-button.p22{ font-size:16px; padding:16px 38px 15px;}	

	

	.live-button,

	.demo-button{ padding:16px 30px 15px;}

	.live-button.p16,

	.demo-button.p16{ padding-left:20px; padding-right:20px;}	

	

	.orange-arrow-button,

	.green-arrow-button,

	.orange-arrow-button.p22,

	.green-arrow-button.p22,

	.open-account-btn,

	.open-account-btn.p22{ font-size:16px; padding:19px 58px 18px 20px;}	

	.orange-arrow-button .btn-icon,

	.green-arrow-button .btn-icon,

	.orange-arrow-button.p22 .btn-icon,

	.green-arrow-button.p22 .btn-icon,

	.open-account-btn .btn-icon,

	.open-account-btn.p22 .btn-icon{ width:42px; height:38px;}	

	.orange-arrow-button:hover,

	.green-arrow-button:hover,

	.orange-arrow-button.p22:hover,

	.green-arrow-button.p22:hover,

	.open-account-btn:hover,

	.open-account-btn.p22:hover{ padding-right:62px;}

	

	.orange-arrow-button.p18,

	.green-arrow-button.p18,

	.open-account-btn.p18{ font-size:16px; padding:18px 54px 15px 24px;}

	.orange-arrow-button.p18 .btn-icon,

	.green-arrow-button.p18 .btn-icon,

	.open-account-btn.p18 .btn-icon{ width:38px; height:34px;}

	.orange-arrow-button.p18:hover,

	.green-arrow-button.p18:hover,

	.open-account-btn.p18:hover{ padding-right:58px;}

		

	.orange-arrow-button.p16,

	.green-arrow-button.p16,

	.open-account-btn.p16{ font-size:14px; padding:16px 52px 14px 20px;}

	.orange-arrow-button.p16 .btn-icon,

	.green-arrow-button.p16 .btn-icon,

	.open-account-btn.p16 .btn-icon{ width:36px; height:32px;}

	.orange-arrow-button.p16:hover,

	.green-arrow-button.p16:hover,

	.open-account-btn.p16:hover{ padding-right:56px;}	

	

	.orange-arrow-button.p14,

	.green-arrow-button.p14,

	.open-account-btn.p14{ font-size:12px; padding:17px 48px 14px 20px;}

	.orange-arrow-button.p14 .btn-icon,

	.green-arrow-button.p14 .btn-icon,

	.open-account-btn.p14 .btn-icon{ width:32px; height:28px;}

	.orange-arrow-button.p14:hover,

	.green-arrow-button.p14:hover,

	.open-account-btn.p14:hover{ padding-right:52px;}

	/*Button Css End*/



    .home-h2-title{margin: 0 0 20px;}

    .orange-button-jp{width: fit-content;}
    .orange-button-jp:after{width: 14px;height: 23px;}

    .logo-box{gap: 7px;}
    .logo-box .img-box{width: 55px;}

}





@media (max-width:480px){

    .col-6{flex: 0 0 50%;}

}

@media (max-width:375px){

    .orange-button-jp{padding: 9px 36px 10.5px 12px;}

}