@charset 'UTF-8';
@font-face {
  font-family: "Kanit";
  src: url('fonts/Kanit/Kanit-Regular.ttf') format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Sarabun";
  src: url('fonts/Sarabun/Sarabun-Regular.ttf') format("truetype");
  font-weight: 300;
  font-style: normal; }
  
@font-face {
    font-family: 'supermarket';
    src: url('font/supermarket_0-webfont.eot');
    src: url('font/supermarket_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/supermarket_0-webfont.woff') format('woff'),
         url('font/supermarket_0-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
* { margin: 0;padding: 0;box-sizing: border-box;}

html { height: 100%; max-width: 100%; }
body{
    font-size: 14px;
    height: 100%;
    width: 100%;
    max-width: 100%;
    font-family: sans-serif;
   /* overflow: hidden;
    position: fixed;*/
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
div , section {display: block;/* position: relative */}
button {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border:none;
}
ul, ol {
    display: block;
    list-style: none;
}
a { text-decoration: none;color: inherit;cursor: pointer; }
img { font-size: 0.6em; color: #aaa; }
iframe{border: none; overflow: hidden;}
/*a:hover{text-decoration: underline;}*/
label[for]{cursor: pointer;}
/************************************/
input[type="text"] , input[type="number"], input[type="password"], .form-input-text {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    padding: 0.5em 1em;
    border-radius: 4px;
    border: 1px solid #dadada;
    font-size: 1em;
    text-decoration: none;
    color: #555;
}
/*
input[type="checkbox"], input[type="radio"]{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity:0;
}
input[type="checkbox"] + label, input[type="radio"] + label {
    height: 20px;
    display: inline-block;
    line-height: 24px;
    color: #999;
    margin-left: 0.5em;
    font-size: 0.8em;
}
*/
input[disabled], input[readonly] {color:#aaa; outline-color: #eee;}

::-webkit-input-placeholder { 
    color:    #aaa;
    opacity:  1;
    font-size: 0.8em;
    font-style: italic;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #ccc;
  font-style: italic;
  font-size: 0.9em;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #ccc;
  font-style: italic;
  font-size: 0.9em;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #ccc;
  font-style: italic;
  font-size: 0.9em;
}
:-moz-placeholder { /* Firefox 18- */
  color: #ccc;
  font-style: italic;
  font-size: 0.9em;
}
/********   Form   *********/
.item-name {
    display: block;
    font-size: 12px;
    font-family: sans-serif;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    color: #555;
    margin-top: 10px;
}
.item-name.need:after {
    content:"";
    display: inline-block;
    width:6px;height:6px;
    background-color: orange;
    border-radius: 3px;
    margin: 0px 0 1px 4px;
}
.form-footer {
     padding:10px;
     background-color: white;
     border-top:2px solid orange;
}
/******** Container & Flex *********/
.flex-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: stretch;
    flex-direction: row;
}
.flex-col {
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex-1 {
  flex: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1;
}
.flex-wrap {flex-wrap:wrap}
.space-evently { justify-content: space-evenly;}
.justify-center { justify-content: center;}
.align-center {
    align-items:center;
    justify-content: center;
}
.align-right-center { align-items:center;justify-content:end;}
.align-start{align-items:start;}
.scroll-container {
    overflow: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.scrollable {
    overflow: auto;
}
.content {
    flex:1;
    position: relative;
}

.wrapper {
    margin: 0 auto;
    max-width: 1440px;
}
.quote {
    margin: 2em;
    font-size: 1.2em;
    font-style: italic;
    color: #555;
    letter-spacing: 0.5px;
    line-height: 1.7em;

}
.quote q {margin:1em;}
/**************************/
.h-100 { height:100%;}
.w-100 { width:100%;}
.mar-0{margin:0 !important;}
.mar-10 {margin:10px;}
.mar-10-0 { margin: 10px 0}
.mar-0-10 {margin: 0 10px}
.mar-5 {margin:5px;}
.mar-5-0 { margin: 5px 0}
.mar-0-5 {margin: 0 5px}
.mar-15 {margin:15px;}
.mar-15-0 { margin: 15px 0}
.mar-0-15 {margin: 0 15px}
.pad-10 {padding:10px;}
.pad-10-0 {padding:10px 0;}
.pad-0-10 {padding:0 10px;}
.pad-5 {padding:5px;}
.pad-5-0 {padding:5px 0;}
.pad-0-5 {padding:0 5px;}
.pad-15 {padding:15px;}
.pad-15-0 {padding:15px 0;}
.pad-0-15 {padding:0 15px;}
.gap-10 {gap:10px}
.center {text-align: center;}
.vspacer {
    display: block;
    height: 1em;
}
.circle {border-radius: 50%;}
.bg-white {background-color: #fff;}
.bg-gray {background-color: #888;}
.bg-soft-gray {background-color: #eeeeee;}
.bg-soft-white {background-color: #fafafa;}
.bg-black {background-color: #000000;}
.bg-soft-black {background-color: #404040;}
.bg-dark-blue {background-color: #08526c;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.no-wrap {white-space: nowrap;}
.hide {display: none}
.big-dim {
    color: #9E9E9E;
    font-size: 1.2em;
}
.text-color-light {color:#888}
.teal {color:#019291}
.orange {color:#f5960b;}
.red {color:#ff0000;}
.white {color:#ffffff;}
/*************************************************************/


/******** SVG icons ********/
.ico-menu, .ico-menu-dots, .ico-left, .ico-right, .ico-home, .ico-facebook, .ico-messenger, .ico-line-app, .ico-instagram, .ico-tiktok,
.ico-phone, .ico-mail, .ico-down, .ico-file-text, .ico-file-xls, .ico-file-pdf, .ico-file-image, .ico-file-word, .ico-education,
.ico-achievement, .ico-introduce, .ico-briefcase, .ico-clip
{
  display: inline-block;
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;  
}
.ico-menu {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1m0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1M3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1'/%3E%3C/svg%3E");
}
.ico-menu-dots {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 12a2 2 0 1 1-4 0a2 2 0 0 1 4 0m7 0a2 2 0 1 1-4 0a2 2 0 0 1 4 0m7 0a2 2 0 1 1-4 0a2 2 0 0 1 4 0'/%3E%3C/svg%3E");
}
.ico-left {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M14.601 4.47a.75.75 0 0 1 0 1.06l-6.364 6.364a.25.25 0 0 0 0 .354l6.364 6.364a.75.75 0 0 1-1.06 1.06L7.177 13.31a1.75 1.75 0 0 1 0-2.475L13.54 4.47a.75.75 0 0 1 1.06 0' clip-rule='evenodd'/%3E%3C/svg%3E");
}
.ico-right {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M9.399 4.328a.75.75 0 0 1 1.06 0l6.364 6.363a1.75 1.75 0 0 1 0 2.475L10.46 19.53a.75.75 0 0 1-1.06-1.06l6.364-6.364a.25.25 0 0 0 0-.354L9.399 5.388a.75.75 0 0 1 0-1.06' clip-rule='evenodd'/%3E%3C/svg%3E");
}
.ico-home {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 21'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1.5 10.5l9-9l9 9'/%3E%3Cpath d='M3.5 8.5v8a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v4a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-8'/%3E%3C/g%3E%3C/svg%3E");
}
.ico-facebook {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12c0 4.84 3.44 8.87 8 9.8V15H8v-3h2V9.5C10 7.57 11.57 6 13.5 6H16v3h-2c-.55 0-1 .45-1 1v2h3v3h-3v6.95c5.05-.5 9-4.76 9-9.95'/%3E%3C/svg%3E");
}
.ico-messenger {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12.001 2c5.634 0 10 4.127 10 9.7s-4.367 9.7-10 9.7a11 11 0 0 1-2.895-.384a.8.8 0 0 0-.534.039l-1.985.876a.8.8 0 0 1-1.123-.707l-.054-1.78a.8.8 0 0 0-.269-.57c-1.945-1.74-3.14-4.258-3.14-7.174c0-5.573 4.366-9.7 10-9.7M5.996 14.537c-.282.447.268.951.689.631l3.155-2.394a.6.6 0 0 1 .723 0l2.336 1.75a1.5 1.5 0 0 0 2.17-.4l2.937-4.66c.282-.448-.268-.952-.689-.633l-3.155 2.396a.6.6 0 0 1-.723 0l-2.337-1.75a1.5 1.5 0 0 0-2.169.4z'/%3E%3C/svg%3E");
}
.ico-line-app {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M13.78 9.46a.38.38 0 0 0-.38.38v1.67L12 9.65a.4.4 0 0 0-.33-.19a.38.38 0 0 0-.38.38v2.84a.38.38 0 0 0 .38.38a.38.38 0 0 0 .38-.38V11l1.39 1.91a.27.27 0 0 0 .15.11a.3.3 0 0 0 .14 0A.33.33 0 0 0 14 13l.1-.07a.4.4 0 0 0 .11-.27V9.84a.38.38 0 0 0-.43-.38M9.2 12.27H8.14V9.84a.38.38 0 0 0-.38-.38a.38.38 0 0 0-.38.38v2.84a.38.38 0 0 0 .38.38H9.2a.39.39 0 0 0 .39-.38a.39.39 0 0 0-.39-.41m1.11-2.81a.39.39 0 0 0-.39.38v2.84a.39.39 0 0 0 .39.38a.38.38 0 0 0 .38-.38V9.84a.38.38 0 0 0-.38-.38M17.91 2H6.09A4.1 4.1 0 0 0 2 6.09v11.82A4.1 4.1 0 0 0 6.09 22h11.82A4.1 4.1 0 0 0 22 17.91V6.09A4.1 4.1 0 0 0 17.91 2m.31 12.28a2 2 0 0 1-.13.17a5.5 5.5 0 0 1-.8.8c-2 1.87-5.36 4.11-5.81 3.76s.64-1.76-.53-2a1 1 0 0 1-.25 0c-3.44-.48-6-2.89-6-5.78c0-3.25 3.29-5.88 7.34-5.88s7.34 2.63 7.34 5.88a5 5 0 0 1-1.16 3.05m-1.71-4.81H15a.38.38 0 0 0-.38.38v2.84a.38.38 0 0 0 .38.38h1.48a.38.38 0 0 0 .38-.38a.38.38 0 0 0-.38-.38h-1.03v-.6h1.06a.39.39 0 0 0 .38-.39a.38.38 0 0 0-.38-.38h-1.06v-.61h1.06a.38.38 0 0 0 .38-.38a.38.38 0 0 0-.38-.48'/%3E%3C/svg%3E");
}
.ico-instagram {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M13.028 2c1.125.003 1.696.009 2.189.023l.194.007c.224.008.445.018.712.03c1.064.05 1.79.218 2.427.465c.66.254 1.216.598 1.772 1.153a4.9 4.9 0 0 1 1.153 1.772c.247.637.415 1.363.465 2.428c.012.266.022.487.03.712l.006.194c.015.492.021 1.063.023 2.188l.001.746v1.31a79 79 0 0 1-.023 2.188l-.006.194c-.008.225-.018.446-.03.712c-.05 1.065-.22 1.79-.466 2.428a4.9 4.9 0 0 1-1.153 1.772a4.9 4.9 0 0 1-1.772 1.153c-.637.247-1.363.415-2.427.465l-.712.03l-.194.006c-.493.014-1.064.021-2.189.023l-.746.001h-1.309a78 78 0 0 1-2.189-.023l-.194-.006a63 63 0 0 1-.712-.031c-1.064-.05-1.79-.218-2.428-.465a4.9 4.9 0 0 1-1.771-1.153a4.9 4.9 0 0 1-1.154-1.772c-.247-.637-.415-1.363-.465-2.428l-.03-.712l-.005-.194A79 79 0 0 1 2 13.028v-2.056a79 79 0 0 1 .022-2.188l.007-.194c.008-.225.018-.446.03-.712c.05-1.065.218-1.79.465-2.428A4.9 4.9 0 0 1 3.68 3.678a4.9 4.9 0 0 1 1.77-1.153c.638-.247 1.363-.415 2.428-.465c.266-.012.488-.022.712-.03l.194-.006a79 79 0 0 1 2.188-.023zM12 7a5 5 0 1 0 0 10a5 5 0 0 0 0-10m0 2a3 3 0 1 1 .001 6a3 3 0 0 1 0-6m5.25-3.5a1.25 1.25 0 0 0 0 2.5a1.25 1.25 0 0 0 0-2.5'/%3E%3C/svg%3E");
}
.ico-tiktok {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 10 10A10.01 10.01 0 0 0 12 2m5.939 7.713v.646a.37.37 0 0 1-.38.37a5.36 5.36 0 0 1-2.903-1.108v4.728a3.94 3.94 0 0 1-1.18 2.81a4 4 0 0 1-2.87 1.17a4.1 4.1 0 0 1-2.862-1.17a3.98 3.98 0 0 1-1.026-3.805c.159-.642.48-1.232.933-1.713a3.58 3.58 0 0 1 2.79-1.313h.82v1.703a.348.348 0 0 1-.39.348a1.918 1.918 0 0 0-1.23 3.631c.27.155.572.246.882.267c.24.01.48-.02.708-.092a1.93 1.93 0 0 0 1.313-1.816V5.754a.36.36 0 0 1 .359-.36h1.415a.36.36 0 0 1 .359.34a3.3 3.3 0 0 0 1.282 2.245a3.25 3.25 0 0 0 1.641.636a.37.37 0 0 1 .338.35z'/%3E%3C/svg%3E");
}
.ico-phone {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24c1.12.37 2.33.57 3.57.57c.55 0 1 .45 1 1V20c0 .55-.45 1-1 1c-9.39 0-17-7.61-17-17c0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1c0 1.25.2 2.45.57 3.57c.11.35.03.74-.25 1.02z'/%3E%3C/svg%3E");  
}
.ico-mail {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M14.95 3.684L8.637 8.912a1 1 0 0 1-1.276 0l-6.31-5.228A1 1 0 0 0 1 4v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4a1 1 0 0 0-.05-.316M2 2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2m-.21 1l5.576 4.603a1 1 0 0 0 1.27.003L14.268 3z'/%3E%3C/svg%3E");
}
.ico-down {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='M36 18L24 30L12 18'/%3E%3C/svg%3E");  
}
.ico-file-text{
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23000' d='M48 120a8 8 0 0 0 8-8V40h88v48a8 8 0 0 0 8 8h48v16a8 8 0 0 0 16 0V88a8 8 0 0 0-2.34-5.66l-56-56A8 8 0 0 0 152 24H56a16 16 0 0 0-16 16v72a8 8 0 0 0 8 8m112-68.69L188.69 80H160Zm-5.49 105.34L137.83 180l16.68 23.35a8 8 0 0 1-13 9.3L128 193.76l-13.49 18.89a8 8 0 1 1-13-9.3L118.17 180l-16.68-23.35a8 8 0 1 1 13-9.3L128 166.24l13.49-18.89a8 8 0 0 1 13 9.3ZM92 152a8 8 0 0 1-8 8H72v48a8 8 0 0 1-16 0v-48H44a8 8 0 0 1 0-16h40a8 8 0 0 1 8 8m128 0a8 8 0 0 1-8 8h-12v48a8 8 0 0 1-16 0v-48h-12a8 8 0 0 1 0-16h40a8 8 0 0 1 8 8'/%3E%3C/svg%3E");
}
.ico-file-xls {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M28 23h-6v-2h6v-4h-4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h6v2h-6v4h4a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2m-14-2V9h-2v14h8v-2zM10 9H8l-2 6l-2-6H2l2.752 7L2 23h2l2-6l2 6h2l-2.755-7z'/%3E%3C/svg%3E");
}
.ico-file-image {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cg fill='%23000'%3E%3Cpath d='m104 152l48 72H24l36-56l16.36 25.45Zm48-120v56h56Z' opacity='0.2'/%3E%3Cpath d='M110.66 147.56a8 8 0 0 0-13.32 0l-20.85 31.29l-9.76-15.18a8 8 0 0 0-13.46 0l-36 56A8 8 0 0 0 24 232h128a8 8 0 0 0 6.66-12.44ZM38.65 216L60 182.79l9.63 15a8 8 0 0 0 13.39.11l21-31.47L137.05 216Zm175-133.66l-56-56A8 8 0 0 0 152 24H56a16 16 0 0 0-16 16v88a8 8 0 0 0 16 0V40h88v48a8 8 0 0 0 8 8h48v120h-8a8 8 0 0 0 0 16h8a16 16 0 0 0 16-16V88a8 8 0 0 0-2.34-5.66ZM160 51.31L188.69 80H160Z'/%3E%3C/g%3E%3C/svg%3E");
}
.ico-file-pdf{
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M30 11V9h-8v14h2v-6h5v-2h-5v-4zM8 9H2v14h2v-5h4a2 2 0 0 0 2-2v-5a2 2 0 0 0-2-2m0 7H4v-5h4zm8 7h-4V9h4a4 4 0 0 1 4 4v6a4 4 0 0 1-4 4m-2-2h2a2 2 0 0 0 2-2v-6a2 2 0 0 0-2-2h-2z'/%3E%3C/svg%3E");
}
.ico-file-word {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M30 23h-6a2 2 0 0 1-2-2V11a2 2 0 0 1 2-2h6v2h-6v10h6zm-12 0h-4a2 2 0 0 1-2-2V11a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2m-4-12v10h4V11zM6 23H2V9h4a4.005 4.005 0 0 1 4 4v6a4.005 4.005 0 0 1-4 4m-2-2h2a2 2 0 0 0 2-2v-6a2 2 0 0 0-2-2H4z'/%3E%3C/svg%3E");
}
.ico-education {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M.573 4.1a.999.999 0 0 0 0 1.808l1.43.675v3.92c0 .742.241 1.57.944 2.08c.886.64 2.5 1.42 5.06 1.42s4.17-.785 5.06-1.42c.703-.508.944-1.33.944-2.08v-3.92l1-.473v4.39a.5.5 0 0 0 1 0V5a1 1 0 0 0-.572-.904l-5.72-2.7a4 4 0 0 0-3.42 0l-5.72 2.7zm2.43 6.4V7.05l3.29 1.56a4 4 0 0 0 3.42 0l3.29-1.56v3.45c0 .556-.18 1.01-.53 1.26c-.724.523-2.13 1.24-4.47 1.24s-3.75-.712-4.47-1.24c-.349-.252-.529-.709-.529-1.26zm3.72-8.2a2.99 2.99 0 0 1 2.56 0l5.72 2.7l-5.72 2.7a2.99 2.99 0 0 1-2.56 0L1.003 5z' clip-rule='evenodd'/%3E%3C/svg%3E");
}
.ico-achievement {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23000' d='m305.975 298.814l22.704 2.383V486l-62.712-66.965V312.499l18.214 8.895zm-99.95 0l-22.716 2.383V486l62.711-66.965V312.499l-18.213 8.895zm171.98-115.78l7.347 25.574l-22.055 14.87l-1.847 26.571l-25.81 6.425l-10.803 24.314l-26.46-2.795l-18.475 19.087L256 285.403l-23.902 11.677l-18.475-19.15l-26.46 2.795l-10.803-24.313l-25.81-6.363l-1.847-26.534l-22.118-14.92l7.348-25.573l-15.594-21.544l15.644-21.52l-7.398-25.523l22.068-14.87L150.5 73.03l25.86-6.362l10.803-24.313l26.46 2.794L232.098 26L256 37.677L279.902 26l18.475 19.149l26.46-2.794l10.803 24.313l25.81 6.425l1.847 26.534l22.055 14.87l-7.347 25.574l15.656 21.407zm-49.214-21.556a72.242 72.242 0 1 0-72.242 72.242a72.355 72.355 0 0 0 72.242-72.242m-72.242-52.283a52.282 52.282 0 1 0 52.282 52.283a52.395 52.395 0 0 0-52.282-52.245z'/%3E%3C/svg%3E");
}
.ico-introduce {
  --svg: url("../images/introduction.svg");
}
.ico-briefcase {
  --svg: url("../images/briefcase.svg");
}
.ico-clip {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23000' d='M10.25 8A6.25 6.25 0 0 0 4 14.25v19.5A6.25 6.25 0 0 0 10.25 40h27.5A6.25 6.25 0 0 0 44 33.75v-19.5A6.25 6.25 0 0 0 37.75 8zM6.5 14.25a3.75 3.75 0 0 1 3.75-3.75h27.5a3.75 3.75 0 0 1 3.75 3.75v19.5a3.75 3.75 0 0 1-3.75 3.75h-27.5a3.75 3.75 0 0 1-3.75-3.75zM18 18v12a1.5 1.5 0 0 0 2.218 1.317l11-6a1.5 1.5 0 0 0 0-2.634l-11-6A1.5 1.5 0 0 0 18 18'/%3E%3C/svg%3E");
}
.logo-messenger {
  display: inline-block;
  width: 256px;
  height: 256px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cdefs%3E%3CradialGradient id='logosMessenger0' cx='19.247%25' cy='99.465%25' r='108.96%25' fx='19.247%25' fy='99.465%25'%3E%3Cstop offset='0%25' stop-color='%2309f'/%3E%3Cstop offset='60.975%25' stop-color='%23a033ff'/%3E%3Cstop offset='93.482%25' stop-color='%23ff5280'/%3E%3Cstop offset='100%25' stop-color='%23ff7061'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath fill='url(%23logosMessenger0)' d='M128 0C55.894 0 0 52.818 0 124.16c0 37.317 15.293 69.562 40.2 91.835c2.09 1.871 3.352 4.493 3.438 7.298l.697 22.77c.223 7.262 7.724 11.988 14.37 9.054L84.111 243.9a10.22 10.22 0 0 1 6.837-.501c11.675 3.21 24.1 4.92 37.052 4.92c72.106 0 128-52.818 128-124.16S200.106 0 128 0'/%3E%3Cpath fill='%23fff' d='m51.137 160.47l37.6-59.653c5.98-9.49 18.788-11.853 27.762-5.123l29.905 22.43a7.68 7.68 0 0 0 9.252-.027l40.388-30.652c5.39-4.091 12.428 2.36 8.82 8.085l-37.6 59.654c-5.981 9.489-18.79 11.852-27.763 5.122l-29.906-22.43a7.68 7.68 0 0 0-9.25.027l-40.39 30.652c-5.39 4.09-12.427-2.36-8.818-8.085'/%3E%3C/svg%3E");
}
/*
.logos--messenger {
  display: inline-block;
  width: 256px;
  height: 256px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cdefs%3E%3CradialGradient id='logosMessenger0' cx='19.247%25' cy='99.465%25' r='108.96%25' fx='19.247%25' fy='99.465%25'%3E%3Cstop offset='0%25' stop-color='%2309f'/%3E%3Cstop offset='60.975%25' stop-color='%23a033ff'/%3E%3Cstop offset='93.482%25' stop-color='%23ff5280'/%3E%3Cstop offset='100%25' stop-color='%23ff7061'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath fill='url(%23logosMessenger0)' d='M128 0C55.894 0 0 52.818 0 124.16c0 37.317 15.293 69.562 40.2 91.835c2.09 1.871 3.352 4.493 3.438 7.298l.697 22.77c.223 7.262 7.724 11.988 14.37 9.054L84.111 243.9a10.22 10.22 0 0 1 6.837-.501c11.675 3.21 24.1 4.92 37.052 4.92c72.106 0 128-52.818 128-124.16S200.106 0 128 0'/%3E%3Cpath fill='%23fff' d='m51.137 160.47l37.6-59.653c5.98-9.49 18.788-11.853 27.762-5.123l29.905 22.43a7.68 7.68 0 0 0 9.252-.027l40.388-30.652c5.39-4.091 12.428 2.36 8.82 8.085l-37.6 59.654c-5.981 9.489-18.79 11.852-27.763 5.122l-29.906-22.43a7.68 7.68 0 0 0-9.25.027l-40.39 30.652c-5.39 4.09-12.427-2.36-8.818-8.085'/%3E%3C/svg%3E");
}
 */
.ico-facebook {color:#2173f3;}
.ico-line-app {color:#12b400;}
.ico-instagram {color:#e18600;}
.ico-tiktok {color:#000;}
.separator-h {
  width:1px;
  border-left: 1px solid #cfcfcf;
  margin: 0 10px !important;
  height: 100%;
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (min-width: 480px) {
    body { font-size: 12px;}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 640px) {
    body { font-size: 13px;}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
   body { font-size: 14px;}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
   body { font-size: 14px;}
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    body { font-size: 14px;}
}

