@import"https://fonts.googleapis.com/css2?family=Sarabun:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap";@import"https://fonts.googleapis.com/css2?family=Taviraj:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Mukta&family=Noto+Sans+Thai:wght@400;600&display=swap";:root{--pad-n: 7px;--pad-l: 10px;--main-color: #454f5b;--main-mid: #374655;--main-dark: #2a3541;--main-dark-color: #2a3541;--main-darker: #1b222a;--main-darkest: #0d1014;--br-top: 5px 5px 0 0;--br-bottom: 0 0 5px 5px;--br-main: 5px;--font-topic: #71c0f0;--font-logo: lightblue;--lh-tb: 1.75rem;--lh-label: 2rem;--red: rgb(255, 130, 130)}*{text-decoration:none;box-sizing:border-box;padding:0;margin:0;font-family:Sarabun,"sans-serif"}html{font-size:16px;color:#f5f5f5}body{background-color:#222;margin:auto}::placeholder{color:#789;font-weight:400;font-size:.9rem;padding:3px 0}.fs-s{font-size:.7rem}.fs-xm{font-size:.8rem}.fs-m{font-size:.85rem}.fs-ns{font-size:.9rem}.fs-n{font-size:.95rem}.fs-l{font-size:1.15rem}.fs-x{font-size:1.25rem}.fs-xl{font-size:1.3rem}.fs-xxl{font-size:1.75rem}.fs-3xl{font-size:2rem}.al-r{text-align:right}.al-l{text-align:left}.al-c{text-align:center}.mg-s{margin:3px!important}.mg-m{margin:5px!important}.mg-l{margin:7px!important}.mg-xl{margin:12px!important}.mg-xxl{margin:20px!important}.mg-t-s{margin-top:3px!important}.mg-t-m{margin-top:5px!important}.mg-t-l{margin-top:7px!important}.mg-t-xl{margin-top:12px!important}.mg-t-xxl{margin-top:20px!important}.mg-r-s{margin-right:3px!important}.mg-r-m{margin-right:5px!important}.mg-r-l{margin-right:7px!important}.mg-r-xl{margin-right:12px!important}.mg-r-xxl{margin-right:20px!important}.mg-l-s{margin-left:3px!important}.mg-l-m{margin-left:5px!important}.mg-l-l{margin-left:7px!important}.mg-l-xl{margin-left:12px!important}.mg-l-xxl{margin-left:20px!important}.mg-b-s{margin-bottom:3px!important}.mg-b-m{margin-bottom:5px!important}.mg-b-l{margin-bottom:7px!important}.mg-b-xl{margin-bottom:12px!important}.mg-b-xxl{margin-bottom:20px!important}.pd-s{padding:3px!important}.pd-m{padding:5px!important}.pd-l{padding:7px!important}.pd-xl{padding:10px!important}.pd-t-s{padding-top:3px!important}.pd-t-m{padding-top:5px!important}.pd-t-l{padding-top:7px!important}.pd-t-xl{padding-top:10px!important}.pd-l-s{padding-left:3px!important}.pd-l-m{padding-left:5px!important}.pd-l-l{padding-left:7px!important}.pd-l-xl{padding-left:10px!important}.pd-r-s{padding-right:3px!important}.pd-r-m{padding-right:5px!important}.pd-r-l{padding-right:7px!important}.pd-r-xl{padding-right:10px!important}.pd-b-s{padding-bottom:3px!important}.pd-b-m{padding-bottom:5px!important}.pd-b-l{padding-bottom:7px!important}.pd-b-xl{padding-bottom:10px!important}.bl{border-left:1px solid black!important}.br{border-right:1px solid black!important}.bt{border-top:1px solid black!important}.bb{border-bottom:1px solid black!important}.ba{border:1px solid black!important}.bn{border:none}.bl2{border-left:1px solid #888!important}.br2{border-right:1px solid #888!important}.bt2{border-top:1px solid #888!important}.bb2{border-bottom:1px solid #888!important}.ba2{border:1px solid #888!important}.bl3{border-left:3px solid #111!important}.br3{border-right:3px solid #111!important}.bt3{border-top:3px solid #111!important}.bb3{border-bottom:3px solid #111!important}.ba3{border:3px solid #111!important}.bl4{border-left:2px solid gold!important}.br4{border-right:2px solid gold!important}.bt4{border-top:2px solid gold!important}.ba4{border-image:linear-gradient(45deg,gold,#b8860b) 1!important;border-radius:5px!important;border-width:3px!important;border-style:solid!important;margin-top:1px}.bl-g{border-left:1px dashed gray!important}.br-g{border-right:1px dashed gray!important}.bt-g{border-top:1px dashed gray!important}.bb-g{border-bottom:1px dashed gray!important}.ba-g{border:1px dashed gray!important}.bl-d{border-left:1px dotted lightgray!important}.br-d{border-right:1px dotted lightgray!important}.bt-d{border-top:1px dotted lightgray!important}.bb-d{border-bottom:1px dotted lightgray!important}.ba-d{border:1px dotted lightgray!important}.bl-m{border-left:1px solid #454f5b!important}.br-m{border-right:1px solid #454f5b!important}.bt-m{border-top:1px solid #454f5b!important}.bb-m{border-bottom:1px solid #454f5b!important}.ba-m{border:1px solid #454f5b!important}.bg-texture{background:repeating-linear-gradient(45deg,var(--main-darker),var(--main-darker) 10px,var(--main-darkest) 10px,var(--main-darkest) 20px)}.bg-line-swap2{background-color:#2a3541}.bdr3{border-radius:3px}.bdr5{border-radius:5px}.bdr3-top{border-radius:3px 3px 0 0}.bdr3-bottom{border-radius:0 0 3px 3px}.bg-line-swap{background-color:#49596c}.bg-line-swap-main{background-color:var(--main-color)}.bg-line-swap-dark{background-color:var(--main-dark)}.bg-red{background-color:red}.bg-black{background-color:#000}.bg-111{background-color:#111}.bg-222{background-color:#222}.bg-333{background-color:#333}.bg-444{background-color:#444}.bg-555{background-color:#555}.bg-666{background-color:#666}.bg-777{background-color:#777}.bg-888{background-color:#888}.bg-999{background-color:#999}.bg-aaa{background-color:#aaa}.bg-bbb{background-color:#bbb}.bg-ccc{background-color:#ccc}.bg-ddd{background-color:#ddd}.bg-eee{background-color:#eee}.bg-blue{background-color:#00f}.bg-yellow{background-color:#ff0}.bg-orange{background-color:orange}.bg-dkorange{background-color:#ff8c00}.bg-khaki{background-color:khaki}.bg-greenyellow{background-color:#adff2f}.bg-green{background-color:green}.bg-pink{background-color:pink}.bg-magenta{background-color:#f0f}.bg-white{background-color:#fff}.bg-lightgray{background-color:#d3d3d3}.bg-grey{background-color:gray}.bg-lightslategrey{background-color:#789}.bg-aquamarine{background-color:#7fffd4}.bg-aqua{background-color:#0ff}.bg-deepskyblue{background-color:#00bfff}.bg-cornflowerblue{background-color:#6495ed}.bg-mediumspringgreen{background-color:#00fa9a}.bg-mediumseagreen{background-color:#3cb371}.bg-dodgerblue{background-color:#1e90ff}.main-color,.bg-main-color{background-color:var(--main-color)}.bg-main-mid{background-color:var(--main-mid)}.bg-main-dark{background-color:var(--main-dark)}.bg-main-darker{background-color:var(--main-darker)}.bg-comment{background-image:linear-gradient(#6495ed,#4169e1)}.bg-reply{background-image:linear-gradient(#008b8b,#005050)}.bg-reset{background-image:linear-gradient(#b900b9,#590059);color:#fff}.bg-submit{background-image:linear-gradient(#008b8b,#005050)}.bg-get{background-image:linear-gradient(#b8860b,#543c00);color:#fff}.bg-rename{background-image:linear-gradient(#008b8b,#005050)}.bg-move{background-image:linear-gradient(#ff8c00,#864900)}.bg-list{background-image:linear-gradient(#ff69b4,#8c1e55)}.bg-preview{background-image:linear-gradient(#bdb76b,#56532a)}.bg-link{background-image:linear-gradient(#008b8b,#005050)}.bg-login,.bg-load{background-image:linear-gradient(#6495ed,#4169e1)}.bg-load-active{background-image:linear-gradient(#00f,#00008b)}.bg-reload{background-image:linear-gradient(orchid,#8b008b)}.bg-save{background-image:linear-gradient(#73bb73,#006400)}.bg-add{background-image:linear-gradient(#4169e1,#2a457f)}.bg-new,.bg-update{background-image:linear-gradient(#4169e1,#00008b)}.bg-register{background-image:linear-gradient(#73bb73,#006400)}.bg-copy{background-image:linear-gradient(#76bfc2,#4682b4)}.bg-edit{background-image:linear-gradient(orange,#ff4500)}.bg-edit-active{background-image:linear-gradient(#21c3a5,#157d6a)}.bg-delete{background-image:linear-gradient(red,#8b0000)}.bg-print{background-image:linear-gradient(#719726,#445526);color:#fff}.bg-change{background-image:linear-gradient(#f0f,#890089)}.bg-search{background-image:linear-gradient(#0ff,#008b8b)}.bg-fs{background-color:#263f3f}.bg-remove,.bg-check,.bg-cancel{background-image:linear-gradient(orange,#b8860b)}.bg-clear{background-image:linear-gradient(#ff8c00,#ff4500);color:#fff}.bg-clear-emoji{background-image:linear-gradient(#ffe7bb,#ffb65c);color:#fff}.bg-report{background-image:linear-gradient(#ff69b4,#8c1e55)}.bg-report2{background-image:linear-gradient(#3cb371,green)}.bg-report3{background-image:linear-gradient(#4169e1,#1e90ff)}.bg-view{background-image:linear-gradient(#00c8a7,#008770);color:#fff}.bg-create{background-image:linear-gradient(#ebb325,#82600a);color:#fff}.bg-send{background-image:linear-gradient(#a781f3,#58447f);color:#fff}.bg-close{background-image:linear-gradient(#d18c2c,#906219);color:#fff}.bg-finish{background-image:linear-gradient(#ff8c00,#8b0000);color:#fff}.bg-open,.bg-borrow{background-color:#4169e1}.bg-locate{background-image:linear-gradient(#00a075,#55751d);color:#fff}.bg-scan{background-color:orchid;color:#fff}.bg-minus{background-image:linear-gradient(#d12c2c,#901919);color:#fff}.bg-undo{background-image:linear-gradient(#008b8b,#004443);color:#fff}.bg-dn{background-image:linear-gradient(violet,#9735c1);color:#fff}.bg-up,.bg-play,.bg-upload{background-image:linear-gradient(#2abce8,#265f79);color:#fff}.bg-width{background-color:var(--main-dark)}.bg-database{background-image:linear-gradient(#008b8b,#004443);color:#fff}.bg-prev,.bg-next{background-color:orchid;color:#000}.bg-1month{background-image:linear-gradient(#00bfff,#6495ed);color:#fff}.bg-1month-ago{background-image:linear-gradient(orchid,#ff69b4);color:#fff}.bg-calendar{background-image:linear-gradient(#6495ed,#1e90ff);color:#fff}.fc-red{color:#ff8282!important;font-weight:400}.fc-red2{color:red!important}.fc-white{color:#fff}.fc-lavender{color:#e6e6fa}.fc-black{color:#000}.fc-grey{color:gray}.fc-gray,.fc-ligray{color:#d3d3d3}.fc-dkgrey{color:#a9a9a9}.fc-dimgray{color:#696969}.fc-silver{color:silver}.fc-deepskyblue{color:#00bfff}.fc-steelblue{color:#4682b4}.fc-cornblue{color:#6495ed}.fc-cadetblue{color:#5f9ea0}.fc-dodgerblue{color:#1e90ff!important}.fc-cyan{color:#0ff}.fc-licyan{color:#e0ffff}.fc-dkcyan{color:#008b8b}.fc-dkturquoise{color:#00ced1}.fc-blue{color:#00f}.fc-liblue{color:#add8e6}.fc-liskyblue{color:#87cefa!important}.fc-skyblue{color:#87ceeb}.fc-khaki{color:khaki}.fc-yellow{color:#ff0}.fc-goldrod{color:#daa520}.fc-yg{color:#9acd32}.fc-gy{color:#adff2f}.fc-lawngreen{color:#7cfc00}.fc-lime{color:#0f0!important}.fc-limegreen{color:#32cd32}.fc-palegreen{color:#98fb98}.fc-ligreen{color:#90ee90}.fc-lired{color:var(--red);font-weight:400}.fc-gold{color:gold!important}.fc-pink{color:pink}.fc-plum{color:plum}.fc-hotpink{color:#ff69b4!important}.fc-orchid{color:orchid}.fc-magenta{color:#f0f!important}.fc-green{color:green}.fc-msg{color:#3cb371}.fc-orange{color:orange}.fc-orangered{color:#ff4500}.fc-888{color:#888}.fc-999{color:#999}.fc-aaa{color:#aaa}.fc-bbb{color:#bbb}.fc-ccc{color:#ccc}.fc-ddd{color:#ddd}.fc-eee{color:#eee}.fc-revoked{color:gray!important;text-decoration:line-through}.fc-transfer{color:#0ff}.fc-receive{color:#00bfff}.fc-buy{color:#32cd32}.fc-sell{color:pink}.fc-type-common{color:#add8e6}.fc-type-ssf{color:pink}.fc-type-dw{color:#ffa07a}.fc-type-nvdr{color:#0ff}.fc-type-warrant{color:orange}.fc-type-trust{color:#ffffe0}.fw-b{font-weight:700}.fx-x{text-decoration:line-through}u{text-decoration:underline}s,del{text-decoration:line-through!important;color:#d3d3d3}.box-symbol-main{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:var(--main-color)}.box-symbol-mid{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:var(--main-mid)}.box-symbol-dark{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:var(--main-dark)}.box-symbol-darker{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:var(--main-darker)}.box-symbol-darkest{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:var(--main-darkest)}.box-white{color:#fff!important;padding:0 3px;border:1px solid white;border-radius:3px}.box-lime{color:#0f0!important;padding:0 3px;border:1px solid lime;border-radius:3px}.box-lime:hover{background-color:#006400}.box-lime-s{color:#000!important;padding:0 3px;border:1px solid lime;border-radius:3px;background-color:#0f0}.box-lime-s:hover{background-color:#006400}.box-yellow{color:#ff0!important;padding:0 3px;border:1px solid yellow;border-radius:3px}.box-yellow:hover{background-color:#482800}.box-liblue{color:#add8e6!important;padding:0 3px;border:1px solid lightblue;border-radius:3px}.box-liblue:hover{background-color:#00008b}.box-red{color:var(--red)!important;padding:0 3px;border:1px solid var(--red);border-radius:3px}.box-red:hover{background-color:#8b0000}.box-download{color:#32cd32!important;padding:3px 12px;border:1px solid green;border-radius:30px;background-color:var(--main-darker)}.box-download:hover{filter:brightness(150%)}.box-button{background-color:#444;text-align:center;border:none;border:1px solid black;border-radius:3px;padding:0 5px;cursor:pointer}.box-button:hover{filter:brightness(130%)}.lh-7xs{line-height:.6rem}.lh-6xs{line-height:.7rem}.lh-5xs{line-height:.8rem}.lh-4xs{line-height:.9rem}.lh-3xs{line-height:1rem}.lh-2xs{line-height:1.15rem}.lh-xs{line-height:1.25rem}.lh-s{line-height:1.5rem}.lh-n{line-height:1.75rem}.lh-m{line-height:2rem}.lh-l{line-height:2.5rem}.lh-xl{line-height:3rem}.lh-tb{line-height:var(--lh-tb)}.lh-label{line-height:var(--lh-label)}.lh-p{line-height:1.75rem}.clickable{cursor:pointer}.clickable:hover{filter:brightness(120%)}a:link,a:visited{color:#fff}a:hover{color:#90ee90}a:active{color:#fff}.dp-n{display:none!important}.vd-n{background-color:#ff0!important;border:1px solid red!important}.green{border-top:3px solid lime;border-bottom:3px solid lime;background-color:#006400;color:#fff!important;font-weight:700}.yellow{border-top:3px solid darkgoldenrod;border-bottom:3px solid darkgoldenrod;background-color:#ff0;color:#000!important;font-weight:700}.blue{border-top:3px solid Navy;border-bottom:3px solid Navy;background-color:#1e90ff;color:#fff!important;font-weight:700}.red{border-top:3px solid red;border-bottom:3px solid red;background-color:#8b0000!important;color:#fff!important;font-weight:700}@keyframes fadein{0%{bottom:0;opacity:0}to{bottom:90px;opacity:1}}@keyframes fadeout{0%{bottom:90px;opacity:1}to{bottom:0;opacity:0}}@-webkit-keyframes fadein{0%{bottom:0;opacity:0}to{bottom:90px;opacity:1}}@-webkit-keyframes fadeout{0%{bottom:90px;opacity:1}to{bottom:0;opacity:0}}#notify{text-align:center;position:absolute;z-index:999;left:0;bottom:90px;width:100%;padding:15px 5px;line-height:1.75rem;animation:none;visibility:"visible";animation:fadeNotifyIn .5s,fadeNotifyOut .5s 4s}@keyframes fadeNotifyIn{0%{bottom:0;opacity:0}to{bottom:90px;opacity:1}}@keyframes fadeNotifyOut{0%{bottom:90px;opacity:1}to{bottom:0;opacity:0}}@-webkit-keyframes fadeNotifyIn{0%{bottom:0;opacity:0}to{bottom:90px;opacity:1}}@-webkit-keyframes fadeNotifyOut{0%{bottom:90px;opacity:1}to{bottom:0;opacity:0}}header{display:flex;align-items:center}header .header-image{flex-basis:75%;width:100%;height:auto}header .header-image picture{margin-bottom:-3px}header .header-titles{flex-basis:25%}@media screen and (max-width: 768px){header .header-image{flex-basis:70%}header .header-image picture{margin-bottom:-3px}header .header-titles{flex-basis:30%}}@media screen and (max-width: 480px){header{flex-wrap:wrap}header .header-image{flex-basis:100%}header .header-image img{width:100%}header .header-titles{flex-basis:50%;text-align:center;margin:auto}}footer{background-color:var(--main-dark-color);border-radius:var(--br-bottom);display:flex;flex-wrap:wrap;flex-direction:column;justify-content:center}footer section{text-align:center}footer section img.icon{height:30px}footer section img.qr{height:100px}footer section.ft-row-1{display:flex;justify-content:center}footer section.ft-row-1 div{min-width:12%;background-color:var(--main-color);margin:10px 2px;padding:5px;border-radius:5px}footer section.ft-row-2{display:flex;justify-content:center}footer section.ft-row-2 div{min-width:17%;line-height:1.75rem;margin:0 2px;padding:15px 0 7px;border-radius:5px;background-color:var(--main-color)}footer section.ft-row-3{padding:0 5px 5px 0}@media screen and (max-width: 768px){footer section.ft-row-1{margin-top:7px;flex-wrap:wrap}footer section.ft-row-1 div{min-width:22%;max-width:22.5%;margin:3px 1px 0}footer section.ft-row-2{margin-bottom:0}footer section.ft-row-2 div{min-width:32%;padding:5px 0 2px;margin:3px 1px;line-height:1.55rem}footer section img.icon{height:25px}.modal .modal-image{height:auto;max-width:85vw;max-height:85vh}}@media screen and (max-width: 480px){footer section.ft-row-1{margin-top:0}footer section.ft-row-1 div{min-width:15%;max-width:19%}footer section.ft-row-1 div:last-child{max-width:30%}}main label{line-height:var(--lh-label)}main button,main input[type=button],main input[type=submit]{color:#fff!important;border-radius:3px;border:1px solid black}main button:hover,main input[type=file]:hover,main input[type=button]:hover,main input[type=submit]:hover{filter:brightness(130%);cursor:pointer}main select,main img,main textarea,main input[type=date],main input[type=datetime-local],main input[type=url],main input[type=number],main input[type=search],main input[type=password],main input[type=text],main input[type=email]{color:#00f!important;border:1px solid black;border-radius:3px;background-color:#fff;line-height:var(--lh-tb)}main input[type=file]{color:#add8e6!important;border:none!important;line-height:var(--lh-tb);cursor:pointer}main select:focus,main textarea:focus,main input[type=date]:focus,main input[type=datetime-local]:focus,main input[type=url]:focus,main input[type=number]:focus,main input[type=search]:focus,main input[type=password]:focus,main input[type=text]:focus,main input[type=email]:focus{outline:none;background-color:#add8e6}main input[type=file]:focus{outline:none;background-image:none;background-color:none}main img:read-only,main input[type=file]:read-only,main select:read-only{background-image:none;background-color:none}main img:read-only,main textarea:read-only,main input[type=date]:read-only,main input[type=datetime-local]:read-only,main input[type=url]:read-only,main input[type=number]:read-only,main input[type=text]:read-only,main input[type=search]:read-only,main input[type=password]:read-only,main input[type=email]:read-only{background-color:#bbb;color:#00008b!important}main img:disabled,main button:disabled,main select:disabled,main textarea:disabled,main input[type=date]:disabled,main input[type=datetime-local]:disabled,main input[type=file]:disabled,main input[type=url]:disabled,main input[type=number]:disabled,main input[type=text]:disabled,main input[type=button]:disabled,main input[type=submit]:disabled,main input[type=search]:disabled,main input[type=email]:disabled{background-image:none;background-color:#777!important;border-radius:3px;color:#add8e6!important}.btn-group{display:grid;grid-template-columns:25% 25% 25% 25%}.btn-show{grid-column:1/5;border:none;border:1px solid black;display:inline-block;color:#fff;border-radius:3px}.btn-confirm{grid-column:1/3;background-image:linear-gradient(#6eb56e,#006400);border:none;border:1px solid black!important;border-radius:3px 0 0 3px!important;color:#fff;display:none}.btn-cancel{grid-column:3/5;background-image:linear-gradient(#f52c2c,#8b0000);border:none;border-top:1px solid black!important;border-right:1px solid black!important;border-bottom:1px solid black!important;border-left:none;border-radius:0 3px 3px 0!important;color:#fff;display:none}nav{display:grid;padding:3px 0}.nav-user{grid-area:1/1/2/2}.nav-admin{grid-area:1/2/2/3;display:flex;margin-left:auto}.nav-login{grid-area:1/3/2/4;display:flex;margin-left:auto}.nav-user .dropdown-button{display:none}.nav-user .dropdown-button:hover{background-color:#3e8e41}.nav-user .user-dropdown-ctn{display:flex;flex-direction:row}.nav-user p{padding:0 5px;margin:0 1px;border-radius:3px;border:1px solid darkslategray;background-color:#2f4f4f}.nav-admin p{background-color:var(--main-dark-color);border:1px solid var(--main-color);padding:3px 4px;border-radius:3px}.nav-admin p.active{background-color:#000}.nav-admin p a{color:#90ee90!important}.nav-admin p.active a{color:#0f0!important;background-color:#000}.nav-admin .dropdown{position:relative;display:inline-block}.nav-admin .dropdown-button{background-color:var(--main-color);color:#fff;padding:0 7px;border:1px solid black;border-radius:3px;cursor:pointer;font-size:15px}.nav-admin .dropdown-button:hover{background-color:#3e8e41}.nav-admin .dropdown-menu{display:none;position:absolute;min-width:160px;z-index:99}.nav-admin .dropdown-menu p:hover{cursor:pointer;filter:brightness(120%)}.nav-login>form input[type=submit]{border:none;color:var(--red);background-color:#0000;cursor:pointer}.nav-login form input[type=submit]:hover{color:#f08080}.nav-login .user-img{width:20px;height:auto}nav a.lime-disabled-click{pointer-events:none;color:#0f0!important}nav a.gray-disabled-click{pointer-events:none;color:gray!important}nav .nav-user,nav .nav-admin{font-size:14px}@media screen and (max-width: 768px){nav{padding:3px 0}.nav-user .dropdown-button{display:inline-block;position:relative;background-color:var(--main-color);color:#fff;padding:0 7px;border:1px solid black;border-radius:3px;cursor:pointer;font-size:15px}.nav-user .user-dropdown-ctn{flex-direction:column;display:none;position:absolute;min-width:160px;z-index:99}.nav-user p{background-color:var(--main-dark-color);border:1px solid var(--main-color);padding:3px 4px;border-radius:3px}.nav-user p:hover{cursor:pointer;filter:brightness(120%)!important}.nav-users p.active{background-color:#000}.nav-admin{margin-left:0%}nav .nav-user,nav .nav-admin{font-size:15px}}:root{--pad-n: 7px;--pad-l: 10px;--main-color: #454f5b;--main-dark-color: #2a3541;--br-top: 5px 5px 0 0;--br-bottom: 0 0 5px 5px;--br-main: 5px;--font-topic: #71c0f0;--font-logo: lightblue}html{font-size:13px}body{max-width:1100px;background-color:#111;color:#fff;font-weight:200}h3{font-weight:400;color:#90ee90;line-height:2.5rem;font-family:Noto Sans Thai,Sarabun,"sans-serif"}main{background-color:var(--main-color);border-radius:var(--br-top);min-height:50vh}@media screen and (max-width: 768px){body{font-size:13px}main{min-height:50vh}h3{line-height:2rem}}@media screen and (max-width: 480px){body{font-size:12px}h3{line-height:2rem;font-size:14px}}.splash{position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center}.splash .splash-close{font-size:4rem;font-weight:700;position:absolute;top:30px;right:30px;cursor:pointer;color:red}.splash .splash-image{display:block;margin:auto;max-width:85vw;max-height:85vh}@keyframes zoomIn{0%{opacity:0}to{opacity:1}}@media screen and (max-width: 768px){.splash .splash-image{height:auto;max-width:85vw;max-height:85vh}}@media screen and (max-width: 480px){.splash .splash-image{height:auto;max-width:95vw;max-height:95vh}}#toolbarCtn{padding:10px 10px 5px}#toolbarCtn label{line-height:1.9rem}#toolbarCtn input[type=date],#toolbarCtn input[type=text]{height:100%;width:100%;border:1px solid black}#toolbarCtn input[type=date]:disabled,#toolbarCtn input[type=text]:disabled{background-color:gray}#toolbarCtn input[type=date]:hover,#toolbarCtn input[type=text]:hover{outline:1px solid black;border:1px solid black;border-radius:0}#toolbarCtn input[type=date]:focus,#toolbarCtn input[type=text]:focus{outline:1px solid black;border:1px solid black;border-radius:0}#toolbarCtn input[type=search]{outline:none}#toolbarCtn input[type=search]:hover{border:1px solid black}#toolbarCtn input[type=search]:focus{outline:none;background-color:#add8e6;border:1px solid black}.main-ctn .btn{border:none;border:1px solid black;border-radius:3px;color:#fff!important;line-height:1.9rem}.main-ctn .btn[disabled]{color:#add8e6!important;background-color:#484848!important}#amonth{background-image:linear-gradient(#73bb73,#006400)}.row{display:grid;grid-template-columns:18% 5% 15% 5% 13% 13% 10% 12% 9%}.tool-1{grid-area:1/1/2/2}.tool-2{grid-area:1/2/2/3}.tool-3{grid-area:1/3/2/4}.tool-4{grid-area:1/4/2/5}.tool-5{grid-area:1/5/2/6}.tool-6{grid-area:1/6/2/7}.tool-7{grid-area:1/7/2/8}.tool-8{grid-area:1/8/2/9}.tool-9{grid-area:1/9/2/10}.tableRowHeader{padding:7px 0;border-top:1px dotted white;border-bottom:1px dotted white;text-align:center;line-height:1.35rem;background-color:var(--main-dark-color)}.table-ctn{overflow-x:auto;overflow-y:auto;max-height:90vh}table{width:100%;border-spacing:1px;border-collapse:separate;font-size:.95rem}table th,table td{border:1px solid gray;padding:1px;white-space:nowrap;outline:1px solid gray}thead th{position:sticky;top:0;font-weight:400;z-index:11;background-color:inherit;line-height:2rem}thead tr:first-child th:first-child,thead tr:first-child th:nth-child(2){background-color:var(--main-dark)}thead th:first-child,tbody td:first-child,thead th:nth-child(2),tbody td:nth-child(2){position:sticky;z-index:10;background-color:inherit;overflow:hidden;white-space:nowrap}thead th:first-child,tbody td:first-child{left:0}thead th:nth-child(2),tbody td:nth-child(2){left:20px}thead th:first-child,thead th:nth-child(2){z-index:12}tr:hover{background-color:#000!important}.pg-main-ctn{display:grid;grid-template-columns:3% 97%}.pg-page-label{line-height:1.75rem;font-size:.8rem;text-align:center}.pg-ctn{display:flex;width:100%;height:100%;flex-direction:row;flex-wrap:wrap}.col-pg{flex-basis:3.33%;overflow:hidden;white-space:nowrap;width:100%}.col-pg input[type=button]{border:1px solid black;border-radius:3px}.pg-active{background-color:#008b8b;margin:0;text-align:center;border-radius:3px;color:#fff;font-weight:1000!important;line-height:1.75rem}.pg{background-color:var(--main-dark-color);margin:0;text-align:center;border-radius:3px;line-height:1.75rem;color:#fff}.pg:hover,.pg-active:hover{cursor:pointer;filter:brightness(130%)!important}@media screen and (max-width: 768px){body{font-size:12px}.main-ctn{grid-template-columns:100%}.main-ctn .main-left,.main-ctn .main-right{padding:5px 3px}h3{line-height:2rem}#toolbarCtn{padding:7px 3px 3px}#toolbarCtn label{line-height:1.75rem}.row{grid-template-columns:13% 9% 10% 25% 25% 18%}.tool-1{grid-area:1/1/2/4}.tool-2{grid-area:1/4/2/5}.tool-8{grid-area:1/5/2/6}.tool-9{grid-area:1/6/2/7}.tool-3{grid-area:2/1/3/3;margin-top:7px}.tool-4{grid-area:2/3/3/4;margin-top:7px}.tool-5{grid-area:2/4/3/5;margin-top:7px}.tool-6{grid-area:2/5/3/6;margin-top:7px}.tool-7{grid-area:2/6/3/7;margin-top:7px}.pg-main-ctn{display:grid;grid-template-columns:9% 91%}.col-pg{flex-basis:10%;overflow:hidden;white-space:nowrap}}@media screen and (max-width: 480px){body{font-size:11px}#toolbarCtn label{line-height:1.9rem}#toolbarCtn input[type=date],#toolbarCtn input[type=text]{font-size:.9rem}}