.optimizer-detail{color:#0e0b6d;font-size:var(--text-xl);text-align:center;margin-top:1rem}.process-detail{color:#0e0b6d;font-size:var(--text-xl);text-align:left;margin-top:1rem;padding:0 6.5rem}.text-bold{font-weight:700}.gradient-text-demand{font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-19));-webkit-text-fill-color:transparent;color:#000;text-rendering:optimizeLegibility;text-align:center;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(215deg,var(--color-start,#003d99)0%,var(--color-end,#2c8ff2)80%);font-weight:600}.gradient-text-demand-half{font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-19));-webkit-text-fill-color:transparent;color:#000;text-rendering:optimizeLegibility;text-align:center;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(215deg,var(--color-start,#36ded2)40%,var(--color-end,#06009e)75%);font-weight:600}.demand-supply-container{background-position:50%;background-repeat:no-repeat;background-size:100% 100%;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:100vw;height:100vh;line-height:1.25;display:flex;position:relative;overflow:hidden}.text-demand{color:#fff;font-size:clamp(var(--text-xl-5),4vw,var(--text-xl-10));font-weight:500}.text-demand-sub{color:#fff;font-size:clamp(var(--text-base),4vw,var(--text-xl));margin-bottom:5rem;font-weight:500}.production-box{gap:1rem;display:flex;position:absolute;top:23%;left:21%}.common-text{color:#fff;font-weight:700;font-size:var(--text-base);text-align:center}.num-barel{font-size:var(--text-xl-7);color:#fff;font-weight:500}.usage-box{gap:1rem;display:flex;position:absolute;top:23%;right:20%}.import-box{gap:1rem;display:flex;position:absolute;top:60%;left:22%}.import-right-box{gap:1rem;display:flex;position:absolute;top:60%;right:20%}.demand-text-box{flex-direction:column;gap:1rem;display:flex;position:absolute;top:10%;left:16%}.supply-text-box{text-align:right;flex-direction:column;gap:1rem;display:flex;position:absolute;top:10%;right:16%}.supply-text-box .header-text div{justify-content:flex-end}.header-text{color:#fff;font-weight:500;font-size:var(--text-xl-8);align-items:center;gap:.5rem;display:flex}.num-refinery{margin-right:0!important;font-weight:700!important}.dot-refinery{width:max-content!important;margin:0!important}.bar-chart-trading div div{top:-25%}.demand-supply-box-mobile{width:100%;padding:0 1rem;display:none}.production-box-mobile,.import-box-mobile,.import-right-box-mobile,.usage-box-mobile{border-radius:3rem;flex-direction:column;justify-content:center;align-items:center;width:95%;min-height:550px;display:flex;box-shadow:0 3px 8px #0000003d}.common-text-mobile{margin-top:-3rem}.supply-text-box-mobile{display:none}.trading-book-box{align-items:center;margin-top:2rem;margin-left:2rem;display:flex}.trading-book-box p{font-size:clamp(var(--text-base),4vw,var(--text-xl-5));margin-right:.75rem}.process-business-text{margin-bottom:1rem}.continue-application{--color:#fff;--background:#404660;--background-hover:#3a4059;--background-left:#2b3044;--folder:#f3e9cb;--folder-inner:#beb393;--paper:#fff;--paper-lines:#bbc1e1;--paper-behind:#e1e6f9;--shadow:#0d0f1933;cursor:pointer;appearance:none;-webkit-tap-highlight-color:transparent;color:var(--color);background:var(--bg,var(--background));border:none;border-radius:5px;outline:none;min-height:53px;margin:1rem 2.5rem;padding:17px 29px 17px 69px;font-size:14px;font-weight:500;line-height:19px;transition:background .3s;position:relative}.continue-application>div{background:var(--background-left);border-radius:5px 0 0 5px;width:53px;position:absolute;top:0;bottom:0;left:0;overflow:hidden}.continue-application>div .folder{width:23px;height:27px;position:absolute;top:13px;left:15px}.continue-application>div .folder .top{z-index:2;transform:translateX(var(--fx,0));transition:transform .4s ease var(--fd,.3s);position:absolute;top:0;left:0}.continue-application>div .folder .top svg{width:24px;height:27px;fill:var(--folder);transform-origin:0;transition:transform .3s ease var(--fds,.45s);transform:perspective(120px)rotateY(var(--fr,0deg));display:block}.continue-application>div .folder:before,.continue-application>div .folder:after,.continue-application>div .folder .paper{content:"";left:var(--l,0);top:var(--t,0);width:var(--w,100%);height:var(--h,100%);background:var(--b,var(--folder-inner));border-radius:1px;position:absolute}.continue-application>div .folder:before{box-shadow:0 1.5px 3px var(--shadow),0 2.5px 5px var(--shadow),0 3.5px 7px var(--shadow);transform:translateX(var(--fx,0));transition:transform .4s ease var(--fd,.3s)}.continue-application>div .folder:after,.continue-application>div .folder .paper{--l:1px;--t:1px;--w:21px;--h:25px;--b:var(--paper-behind)}.continue-application>div .folder:after{transform:translate(var(--pbx,0),var(--pby,0));transition:transform .4s ease var(--pbd,0s)}.continue-application>div .folder .paper{z-index:1;--b:var(--paper)}.continue-application>div .folder .paper:before,.continue-application>div .folder .paper:after{content:"";width:var(--wp,14px);height:2px;left:3px;top:var(--tp,3px);background:var(--paper-lines);box-shadow:0 12px 0 0 var(--paper-lines),0 24px 0 0 var(--paper-lines);border-radius:1px;position:absolute;transform:scaleY(.5)}.continue-application>div .folder .paper:after{--tp:6px;--wp:10px}.continue-application:before,.continue-application:after{content:"";background:var(--color);transform-origin:9px 1px;width:10px;height:2px;transform:translateX(var(--cx,0))scale(.5)rotate(var(--r,-45deg));border-radius:1px;transition:transform .3s;position:absolute;top:26px;right:16px}.continue-application:after{--r:45deg}.continue-application:hover{--cx:2px;--bg:var(--background-hover);--fx:-40px;--fr:-60deg;--fd:.15s;--fds:0s;--pbx:3px;--pby:-3px;--pbd:.15s;--pex:-24px}.demand-info{color:#fff;font-weight:500;font-size:var(--text-lg);position:absolute;bottom:7%;right:5%}@media (max-width:1600px){.production-box,.usage-box{top:24%}.demand-text-box,.supply-text-box{top:9%}.text-demand-sub{margin-bottom:4rem}}@media (max-width:1500px){.production-box,.usage-box{top:23%}.demand-text-box,.supply-text-box{top:6%}.bar-chart-trading{height:320px!important}.right-1,.right-2,.right-3{right:-190px!important}.right-4{right:-230px!important}.right-5{right:-255px!important}.right-6{right:-275px!important}.right-7{right:-295px!important}}@media (max-width:1400px){.demand-text-box,.supply-text-box{top:7%}.production-box{top:24%;left:20%}.import-box{top:61%;left:20%}}@media (max-width:1300px){.demand-text-box,.supply-text-box{top:7%}.bar-chart-trading{height:315px!important}.header-text{color:#fff;font-weight:500;font-size:var(--text-xl-2)}.common-text{color:#fff;font-weight:700;font-size:var(--text-xl-1);text-align:center}.text-demand{margin-top:.75rem}.num-barel{font-size:var(--text-xl-5);font-weight:500}.left-1,.left-2,.left-3{left:-180px!important}.left-4{left:-230px!important}.left-5{left:-260px!important}.left-6{left:-280px!important}.left-7{left:-300px!important}.right-1,.right-2,.right-3{right:-180px!important}.right-4{right:-230px!important}.right-5{right:-245px!important}.right-6{right:-265px!important}.right-7{right:-285px!important}}@media (max-height:610px){.demand-text-box,.supply-text-box{top:9%}.bar-chart-trading{height:260px!important}.header-text{color:#fff;font-weight:500;font-size:var(--text-xl-2)}.left-1,.left-2,.left-3{left:-180px!important}.left-4{left:-230px!important}.left-5{left:-260px!important}.left-6{left:-280px!important}.left-7{left:-300px!important}.right-1,.right-2,.right-3{right:-180px!important}.right-4{right:-230px!important}.right-5{right:-245px!important}.right-6{right:-265px!important}.right-7{right:-285px!important}}@media (max-width:1200px){.production-box{left:23%}.usage-box{right:23%}.import-box{left:28%}.import-right-box{right:25%}.process-detail{padding:0 2.5rem}}@media (max-width:1100px){.header-text{flex-direction:column}.demand-info{text-align:right;width:50%;right:3%}.demand-supply-container{background-size:cover}.production-box,.usage-box,.import-box,.import-right-box{display:none}.demand-text-box{top:50%;left:5%}.supply-text-box{top:50%;right:5%}.text-demand{font-size:var(--text-xl-15)}.text-demand-sub{font-size:var(--text-xl-3);margin-bottom:6rem}.process-detail{padding:0 2rem}.demand-supply-box-mobile{display:block}.supply-text-box-mobile,.demand-text-box-mobile{display:none}.optimizer-detail{font-size:var(--text-base)}}@media (max-width:970px){.text-demand{font-size:var(--text-xl-7)}.text-demand-sub{font-size:var(--text-lg);margin-bottom:3rem}}@media (max-width:900px){.demand-supply-container{background-size:cover}.process-detail{padding:0 1rem}}@media (max-width:600px){.demand-supply-container{background-size:cover;margin-top:0}.demand-info{text-align:right;width:40%;right:2%}.supply-text-box,.demand-text-box{display:none}.demand-text-box-mobile,.supply-text-box-mobile{margin:1rem 0;display:flex}.header-text-mobile{text-align:center;gap:.25rem;font-size:1.25rem;font-weight:700;display:flex;color:#252525!important}.text-demand{font-size:clamp(var(--text-xl-7),4vw,var(--text-xl-13))}.text-demand-sub{font-size:clamp(var(--text-xl),4vw,var(--text-xl-5));margin-bottom:3rem}.optimizer-detail{font-size:var(--text-sm)}.continue-application{margin:1rem;padding-left:1rem;font-size:.875rem}.continue-application>div{display:none}}@media screen and (min-device-width:450px) and (max-device-width:932px) and (orientation:landscape){.demand-supply-container{background-size:100% 100%;margin-top:0}.text-demand{font-size:var(--text-base)}.text-demand-sub{margin-bottom:2rem}}
body[data-vision=dark] .bg-trading-page{filter:brightness(.8)contrast(1.5);background-color:#0c0a09}body[data-vision=colorblind] .bg-trading-page{background-color:#2c5364}#volume-section{max-width:100vw;overflow:hidden}.gradient-text-volume{font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-19));-webkit-text-fill-color:transparent;color:#000;text-rendering:optimizeLegibility;text-align:center;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(215deg,var(--color-start,#003d99)0%,var(--color-end,#5eff6e)60%);font-weight:600}.gradient-text-coverage{color:#0000;font-size:clamp(var(--text-xl-9),4vw,var(--text-xl-17));letter-spacing:-.02em;text-transform:uppercase;text-align:center;-webkit-background-clip:text;width:100%;max-width:1200px;margin:0 auto;padding:0 40px;font-style:normal;font-weight:700;line-height:1.25;-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;background-clip:text!important}.gradient-text-coverage:before{content:attr(data-text);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;position:absolute}.trading-box{border-radius:9999px;flex-direction:column;width:1200px;height:350px;margin:2rem auto;display:flex;position:relative;box-shadow:0 3px 8px #0000003d}.trading-box .header-box{color:#001d8f;font-size:var(--text-xl-2);align-items:center;padding:2rem 8rem 0;font-weight:0;display:flex}.trading-box .header-box svg{width:26px;height:26px}.line-trading{opacity:.7;filter:drop-shadow(0 2px 3px #00000080);background-color:#e4e4e4ee;width:90%;height:1px;margin:10px auto}.detail-trading-box{justify-content:center;gap:2.5rem;margin-top:2rem;display:flex}.circle-trading{border-radius:50%;width:180px;height:180px;position:relative;overflow:hidden}.circle-trading:before{content:"";clip-path:polygon(0 0,50% 0,50% 100%,0 100%);background:linear-gradient(155deg,#2c8ff2 49%,#003d99 83%);position:absolute;inset:0}.circle-trading:after{content:"";clip-path:polygon(50% 0,100% 0,100% 100%,50% 100%);background:linear-gradient(155deg,#008f99 49%,#17ffbd 83%);position:absolute;inset:0}.circle-trading .center{z-index:2;background:#fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;margin:15px;display:flex;position:absolute;inset:0}.barel-text{color:#0000;font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-21));letter-spacing:-.02em;text-transform:uppercase;text-align:center;-webkit-background-clip:text;font-style:normal;font-weight:500;line-height:95%;-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;background-clip:text!important}.barel-text:before{content:"";-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;position:absolute}.barel-desc{font-size:var(--text-lg);color:#001d8f;line-height:1.25}.thailand-detail-box{width:300px;height:100%;font-size:var(--text-xl);flex-direction:column;align-items:flex-end;font-weight:700;line-height:1.35;display:flex}.detail-box-content-thailand{flex-direction:column;align-items:flex-end;display:flex}.thailand-text{color:#0000;font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-21));letter-spacing:-.02em;text-transform:uppercase;text-align:center;-webkit-background-clip:text;font-style:normal;font-weight:500;line-height:95%;-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;background-clip:text!important}.thailand-text:before{content:"";-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;position:absolute}.world-detail-box{width:300px;height:100%;font-size:var(--text-xl);flex-direction:column;align-items:flex-end;font-weight:700;line-height:1.35}.detail-box-content-world{flex-direction:column;align-items:flex-start;display:flex}.normal-text{font-weight:400}.world-text{color:#0000;font-size:clamp(var(--text-xl-11),4vw,var(--text-xl-21));letter-spacing:-.02em;text-transform:uppercase;text-align:center;-webkit-background-clip:text;font-style:normal;font-weight:500;line-height:95%;-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;background-clip:text!important}.world-text:before{content:"";-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;position:absolute}.tab-menu-trading{flex-direction:column;align-items:flex-end;gap:1rem;padding-right:1.5rem;display:flex}.tab-menu-trading .tab-button-trading{color:#252525;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;white-space:pre-line;will-change:box-shadow,transform;appearance:none;width:300px;font-weight:500;font-size:var(--text-base);background:#fff;border:none;border-radius:9999px;flex-direction:column;padding:1rem 2rem;text-decoration:none;list-style:none;transition:box-shadow .5s,transform .5s,background-image .5s;display:flex;overflow:hidden;box-shadow:0 2px 4px #2d234266,0 7px 13px -3px #2d23424d,inset 0 -3px #3a416f80}.tab-menu-trading .tab-button-trading:hover{background-image:radial-gradient(100% 100% at 100% 0,var(--color-screamin-green)0,var(--color-bright-cyan)100%);color:#fff;transform:translateY(-2px)}.tab-menu-trading .tab-button-trading.active{background-image:radial-gradient(100% 100% at 100% 0,var(--color-screamin-green)0,var(--color-bright-cyan)100%);color:#fff;transform:translateY(2px)}.donut-volume-chart{z-index:2;width:280px;height:280px}.donut-volume-box{width:280px;height:280px;margin-top:-3rem;position:relative}.donut-detail-box{text-align:center;z-index:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.char-num-refinery{width:2.5ch!important}.dot-refinery{width:max-content!important;margin:0!important}.hr-glow{filter:blur(3px);opacity:.8;background:linear-gradient(90deg,#f5f5f599,#ebebeb66,#f5f5f599);border:none;border-radius:999px;height:6px}.box-content-section{padding:0 8rem}.volume-info{font-weight:500;font-size:var(--text-lg);position:absolute;bottom:5%;right:15%}@media (max-width:1600px){.box-content-section{padding:0 5rem}}@media (max-width:1450px){.box-content-section{padding:0 3rem}}@media (max-width:1200px){.trading-box{width:1120px}.tab-menu-trading .tab-button-trading{width:100%}}@media (max-width:1100px){.trading-box{width:950px}.tab-menu-trading .tab-button-trading{width:250px}}@media (max-width:900px){.trading-box{border-radius:0;width:770px}.thailand-detail-box,.world-detail-box{font-size:1rem}.tab-menu-trading .tab-button-trading{width:100%}}@media (max-width:800px){.trading-box{width:700px}.donut-volume-chart{width:250px;height:250px}}@media (max-width:600px){.tab-menu-trading .tab-button-trading{width:100%}.trading-box{width:500px;height:auto}.detail-trading-box{flex-direction:column}.trading-box .header-box{justify-content:center;padding:1rem 0}.thailand-detail-box{justify-content:center;align-items:center;width:100%}.world-detail-box{justify-content:center;align-items:center;width:100%;display:flex}.donut-volume-box{justify-content:center;width:100%;display:flex}.donut-detail-box{top:44%}.gradient-text-coverage{font-size:clamp(2rem,4vw,2.75rem)}.box-content-section{padding:0 1rem}}@media (max-width:550px){.trading-box{width:370px;height:auto}}@media screen and (min-device-width:500px) and (max-device-width:1000px) and (orientation:landscape){.trading-box{border-radius:0;width:770px}.thailand-detail-box,.world-detail-box{font-size:1rem}.tab-menu-trading .tab-button-trading{width:200px}}
section .btnTopTitle{cursor:unset!important;pointer-events:none!important}.btnTopTitle{font-size:var(--text-sm);text-transform:capitalize;text-align:center;vertical-align:middle;-webkit-user-select:none;user-select:none;font-style:normal;font-weight:400;line-height:1.5;transition:all .3s ease-in-out;display:inline-block;color:#fff!important;background:#3867d6!important;border:none!important;border-radius:5px!important;padding:3px 10px!important}.mapSection{width:100%;min-height:90vh;padding:0;position:relative;overflow:hidden}.mapSection p{color:#57606f;margin:0}.mapSection .boxTitleTop{z-index:2;height:15vh;position:absolute;top:50px;left:0;right:0;margin:0 auto!important}.mapSection .boxTitleTop h2{color:#000;font-size:var(--text-xl-19);text-transform:capitalize}.mapSection .boxTitleTop h2 span{color:#3867d6}.mapSection .boxTitleTop p{font-size:var(--text-xl-3);color:#57606f}.mapSection .boxTitleTop .divider1,.mapSection .boxTitleTop .divider2{border-top:4px solid #3867d6;width:45px}.mapSection .boxTitleTop .divider1{position:absolute;bottom:15px;left:100px}.mapSection .boxTitleTop .divider2{position:absolute;top:65px;right:70px}.mapSection .boxTitleTop .boxWidth{width:610px;margin:0 auto;position:relative}.mapSection .boxMapImage{width:100%;height:95%;margin-left:auto;margin-right:auto;position:relative}.mapSection .boxMapImage img.img-fluid{object-fit:cover;width:90vw;height:80vh}.am5-html-container::-webkit-scrollbar{display:none!important}.am5-html-container div{overflow:hidden!important}.am5-tooltip{box-shadow:none!important;background:0 0!important;border:none!important;overflow:hidden!important}.tooltipContent{background:#fff0;border-radius:6px;height:350px;padding:8px;transition:all .3s ease-in-out;animation:1s ease-in-out infinite alternate odsoky;overflow:hidden}@keyframes odsoky{0%{transform:translateY(6px)}to{transform:translateY(1px)}}.contentHeader{font-size:var(--text-lg);text-align:center;font-weight:700;font-family:var(--font-ptt45pride);margin:5px 0;color:#3b50ce!important}.detailContent{background:#fff;border:1px solid #616161;border-top-right-radius:25px;flex-direction:column;justify-content:center;width:40em;display:flex;padding:1em!important}.detailContent .detailHead{flex-wrap:wrap;padding:0 5px;display:flex}.detailContent div.detailHead p{font-size:var(--text-base)!important}.title{color:gray;width:27%;font-family:var(--font-ptt45pride);margin:0;font-weight:700!important}.moreContent{flex-direction:column;width:70%;display:flex}.detail{color:#000;width:70%;font-family:var(--font-ptt45pride);flex-wrap:wrap;margin:0;display:flex}.detailCN{margin-left:11px!important}.moreContent .detail{width:100%}@media (max-width:1400px){.mapSection{min-height:max-content}.our-network-chart{height:800px!important}}@media (max-width:1100px){.mapSection{min-height:max-content}.our-network-chart{height:780px!important}}@media (max-width:600px){.tooltipContent{display:none}.mapSection .boxTitleTop .boxWidth{width:400px}.divider1,.divider2{display:none}.our-network-chart{height:550px!important}}
.coverage-box{color:#fff;width:100%;min-height:100px;font-weight:500;font-size:clamp(var(--text-xs),4vw,var(--text-base));will-change:box-shadow,color,transform,opacity,background;border:none;border-radius:9999px;flex-direction:column;justify-content:center;align-items:center;padding:1rem 2rem;transition:opacity .3s cubic-bezier(.2,0,.1,1),transform .3s cubic-bezier(.2,0,.1,1),box-shadow .5s,color .5s,background .5s;display:flex;overflow:hidden}.coverage-box:after,.coverage-box:before{content:"";z-index:-1;pointer-events:none;opacity:0;border-radius:39%;height:0;padding-bottom:200%;transition:transform 0s cubic-bezier(.2,0,.1,1) .5s,opacity .5s cubic-bezier(.2,0,.1,1);position:absolute;top:0;left:-50%;right:-50%}.coverage-box:before{background:linear-gradient(25deg,#0655b5,#6b38d800);transform:translate(-10%,4.8em)rotate(330deg)}.coverage-box:after{background:linear-gradient(70deg,#05e28a,#7638d800);transform:translate(10%,4.8em)rotate(0)}.coverage-box:hover{background:#0655b5;transition:opacity .3s cubic-bezier(.2,0,.1,1),transform .3s cubic-bezier(.2,0,.1,1),box-shadow 2s,color 1.5s,background 1s .75s;box-shadow:inset 0 0 0 .1em #0655b5,0 0 1.75em #05e28a}.coverage-box:hover.outlined{color:#fff}.coverage-box:hover:before,.coverage-box:hover:after{opacity:1;transition:transform 1.75s,opacity .2s}.coverage-box:hover:before{transform:translate(-10%,-2em)rotate(100deg)}.coverage-box:hover:after{transform:translate(10%,-2em)rotate(180deg)}@media (max-width:1300px){.coverage-box{font-size:clamp(var(--text-xs),4vw,var(--text-base))}}@media (max-width:600px){.coverage-box:hover:before{transform:translate(-10%,-3em)rotate(100deg)}.coverage-box:hover:after{transform:translate(10%,-3em)rotate(180deg)}}