body{--font-header: "Noto Sans Thai";--font-body: "Noto Sans Thai Looped";--color-body: #212E3E;--color-background: #FFFFFF;--color-subheader: lightgray;--color-footer: #F5F7FA;--color-focus: #e0e2e5;--color-disabled: gray;--color-link: #FFCE54;--color-community: #AB91EB;--color-company: #58C0E8;--color-service: #8CC152;--color-alert: #b94a48}body{--nav-height: 44px;--nav-padding: 12px;--subnav-height: 48px;--pagenav-height: calc( var(--nav-height) / 2 )}body.nav-mobile-active{overflow:hidden}body.nav-mobile-active nav nav-toggler [data-nav-action=toggler] i{transform:rotate(180deg)}body nav{position:fixed;top:0;width:100%;height:var(--nav-height);padding:var(--nav-padding);font-family:var(--font-header),sans-serif;font-weight:bold;display:flex;align-items:center;z-index:2000;-webkit-transition:background-color .2s;-ms-transition:background-color .2s;transition:background-color .2s}body nav.nav-bg{background-color:var(--color-background)}body nav nav-logo{min-width:84px;height:100%;transform:scale(1.5);transform-origin:left;z-index:2001}body nav nav-logo a{width:fit-content;min-width:fit-content;height:100%;display:block}body nav nav-logo a img{height:100%}body nav nav-menu{height:100%;text-align:center;display:flex;flex:1;align-items:center;justify-content:center}body nav nav-menu nav-menu-normal{display:none}body nav nav-menu nav-menu-dropdown{display:contents}body nav nav-menu .dropdown{font-family:var(--font-body),sans-serif;display:flex;justify-content:center}body nav nav-menu .dropdown .dropdown-toggle{width:calc(100vw - 192px)}body nav nav-menu .dropdown .btn{border:unset}body nav nav-menu .dropdown a.nav-link i{font-size:1.2em;margin-top:3px}body nav nav-static{min-width:84px;z-index:2001}body nav nav-static a i{padding-left:1.2em}body nav nav-static a:last-child{padding-right:0}body nav nav-static #user{width:160px;display:flex;justify-content:end}body nav nav-static #user #user-toggle{width:100%;margin:unset}body nav nav-static #user #user-form{width:320px;background-color:var(--color-background);font-family:var(--font-body),sans-serif;color:var(--color-body);border:solid 1px var(--color-body);border-radius:24px;box-shadow:0px 4px 6px 0px rgba(0,0,0,.5)}body nav nav-static #user #user-form input{font-size:1.6rem;font-weight:bold;font-kerning:17px;letter-spacing:.1rem;background-color:var(--color-footer);border:none}body nav nav-static #user #user-form input:focus{box-shadow:none;border:none;outline:none}body nav nav-static #user #user-form .caption{font-weight:normal}body nav nav-static #user #user-form #user-input-container #user-image{width:72px;height:72px;border-radius:100%;background-color:var(--color-footer);font-size:2rem;color:var(--color-background);display:flex;align-items:center;justify-content:center;background-size:cover;background-repeat:no-repeat;background-position:center}body nav nav-static #user #user-form #user-button-container{display:flex}body nav nav-static #user #user-form #user-button-container .btn{flex-grow:1;margin-right:12px}body nav nav-static #user #user-form #user-button-container .btn:last-child{margin-right:unset}body nav nav-static #user #user-form #user-error{display:flex}body subnav{position:sticky;top:var(--nav-height);width:100%;height:var(--subnav-height);background-color:var(--color-background);font-family:var(--font-header),sans-serif;font-weight:bold;font-weight:500;display:flex;align-items:center;z-index:900;justify-content:center}body subnav button{width:var(--subnav-height);height:var(--subnav-height);display:flex;align-items:center;justify-content:center}body subnav button[data-Subnav-action=scroll-left]{left:0}body subnav button[data-Subnav-action=scroll-right]{right:0}body subnav button:focus,body subnav button:hover{text-decoration:unset !important}body subnav button i{padding:0}body subnav subnav-container{position:relative;height:var(--subnav-height);overflow-y:hidden;overflow-x:auto;display:flex;justify-content:center}body subnav subnav-container::-webkit-scrollbar{width:0;height:0;background:transparent}body subnav subnav-container subnav-content{width:fit-content;height:100%;padding:6px 0;display:flex;justify-content:center;align-items:center}body subnav subnav-container subnav-content a.nav-link{width:max-content;padding:0 .75em;text-align:center}body pagenav{position:fixed;bottom:0;width:100%;height:var(--pagenav-height);padding:24px;background-color:var(--color-background);font-family:var(--font-header),sans-serif;font-weight:bold;font-weight:500;display:flex;align-items:center;justify-content:space-between;z-index:900}body pagenav a.nav-link{font-family:var(--font-header),sans-serif;font-weight:bold}body pagenav a.nav-link:first-child i{padding-right:.5em}body pagenav a.nav-link:last-child i{padding-left:.5em}@media only screen and (min-width: 768px){body{--nav-height: 80px;--nav-padding: 24px}body nav nav-logo{width:160px;height:100%}body nav nav-menu nav-menu-normal{display:contents}body nav nav-menu nav-menu-dropdown{display:none}body nav nav-menu a.nav-link{padding:0 .75em}body nav nav-menu .dropdown{width:240px}body nav nav-static{width:unset}body nav nav-static #user #user-toggle span{width:84px}body subnav{padding-right:unset}body subnav subnav-container subnav-content a.nav-link{padding:0 .75em}}@media only screen and (min-width: 992px){body nav nav-menu a.nav-link{padding:0 1.25em}body nav nav-static #user #user-toggle span{width:120px}body subnav subnav-container subnav-content a.nav-link{padding:0 1.25em}}