@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTc2dphjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTcWdthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTch9thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTc2dthjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTc69thjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTcB9xhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTcPtxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTcWdxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnNqk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOKk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOCk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOak4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnOqk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPKk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCM3FwrK3iLTcvneQg7Ca725JhhKnPqk4j1ebLhAm8SrXTccNxhjQ.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuLyeMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuDyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuOKfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuDyYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50qjIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ojIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ujIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50ijIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp506jIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50yjIw2boKoduKmMEVuBWYMZg.ttf) format('truetype');
}
@font-face {
  font-display: auto;
  font-family: "icon";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/icon.eot?1730249551402");
  src: url("../fonts/icon.eot?#iefix") format("embedded-opentype"), url("../fonts/icon.woff2?1730249551402") format("woff2"), url("../fonts/icon.woff?1730249551402") format("woff"), url("../fonts/icon.ttf?1730249551402") format("truetype"), url("../fonts/icon.svg?1730249551402#Iconly") format("svg");
}
/* media screen */
/* color */
.color-primary-100 {
  color: #E9F3FC !important;
}
.color-primary-200 {
  color: #BBDAF6 !important;
}
.color-primary-300 {
  color: #8BBFEF !important;
}
.color-primary-400 {
  color: #5BA4E8 !important;
}
.color-primary-500 {
  color: #2B89E1 !important;
}
.color-primary-600 {
  color: #216AAF !important;
}
.color-primary-700 {
  color: #174B7C !important;
}
.color-primary-800 {
  color: #0D2C49 !important;
}
.color-primary-900 {
  color: #030D16 !important;
}
.color-secondary-100 {
  color: #FFF7E5 !important;
}
.color-secondary-200 {
  color: #FFEBC6 !important;
}
.color-secondary-300 {
  color: #FFE0A5 !important;
}
.color-secondary-400 {
  color: #FFD584 !important;
}
.color-secondary-500 {
  color: #FFCA63 !important;
}
.color-secondary-600 {
  color: #C59B4B !important;
}
.color-secondary-700 {
  color: #8C6D32 !important;
}
.color-secondary-800 {
  color: #533F19 !important;
}
.color-secondary-900 {
  color: #1A1100 !important;
}
.color-grayscale-white {
  color: #FFFFFF !important;
}
.color-grayscale-100 {
  color: #EEF2F6 !important;
}
.color-grayscale-200 {
  color: #E7ECF2 !important;
}
.color-grayscale-300 {
  color: #D5DDE5 !important;
}
.color-grayscale-400 {
  color: #B8C1CC !important;
}
.color-grayscale-500 {
  color: #ADB9C7 !important;
}
.color-grayscale-600 {
  color: #8F9CA9 !important;
}
.color-grayscale-700 {
  color: #66737F !important;
}
.color-grayscale-800 {
  color: #36414C !important;
}
.color-grayscale-900 {
  color: #272D37 !important;
}
.color-primary {
  color: #2B89E1;
}
.color-primary-05 {
  color: #2B89E1;
}
.color-primary-06 {
  color: #216AAF;
}
.color-primary-07 {
  color: #174B7C;
}
.color-primary-08 {
  color: #0D2C49;
}
.color-white {
  color: #FFFFFF;
}
.no-scroll {
  max-width: 100vw;
  max-height: 100vh;
  overflow: hidden;
}
/* icon */
[class="icon"],
[class^="icon-"],
[class*=" icon-"] {
  display: inline-block;
  width: 24px;
  height: 24px;
  vertical-align: middle;
  font-family: "icon" !important;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  color: inherit;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  transition: all 0.3s ease;
}
[class="icon"] img,
[class^="icon-"] img,
[class*=" icon-"] img {
  display: block;
  width: auto;
  height: 100%;
}
.icon-tukar-point:before {
  content: "\e000";
}
.icon-profile:before {
  content: "\e001";
}
.icon-notifikasi:before {
  content: "\e002";
}
.icon-twitter:before {
  content: "\e003";
}
.icon-upload:before {
  content: "\e004";
}
.icon-send:before {
  content: "\e005";
}
.icon-return:before {
  content: "\e006";
}
.icon-long-arrow-left:before {
  content: "\e007";
}
.icon-long-arrow-right:before {
  content: "\e008";
}
.icon-instagram:before {
  content: "\e009";
}
.icon-facebook:before {
  content: "\e00a";
}
.icon-date:before {
  content: "\e00b";
}
.icon-copy:before {
  content: "\e00c";
}
.icon-ask:before {
  content: "\e00d";
}
.icon-arrow-right:before {
  content: "\e00e";
}
.icon-arrow-left:before {
  content: "\e00f";
}
.icon-youtube:before {
  content: "\e010";
}
/* column */
.column-flex {
  display: flex;
  flex-wrap: wrap;
}
.column-flex > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
}
.column-grid {
  display: grid;
}
.align-start {
  align-items: flex-start;
}
.align-center {
  align-items: center;
}
.align-end {
  align-items: flex-end;
}
.align-stretch {
  align-items: stretch;
}
.justify-start {
  justify-content: flex-start;
}
.justify-center {
  justify-content: center;
}
.justify-end {
  justify-content: flex-end;
}
.justify-between {
  justify-content: space-between;
}
/* font */
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.font-heading {
  font-family: "Inter", sans-serif;
}
.font-body {
  font-family: "Inter", sans-serif;
}
.h1,
h1,
.h2,
h2,
.h3,
h3,
.h4,
h4,
.h5,
h5,
.h6,
h6,
.faq .faq-wrp .faq-title,
.popup .popup-header span,
.popup .popup-body .upload-success .upload-information span {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
}
.h1,
h1 {
  font-size: 40px;
  line-height: 64px;
}
.h2,
h2 {
  font-size: 32px;
  line-height: 48px;
}
.h3,
h3,
.popup .popup-header span,
.popup .popup-body .upload-success .upload-information span {
  font-size: 24px;
  line-height: 40px;
}
.h4,
h4,
.faq .faq-wrp .faq-title {
  font-size: 20px;
  line-height: 32px;
}
.h5,
h5 {
  font-size: 18px;
  line-height: 24px;
}
.h6,
h6 {
  font-size: 16px;
  line-height: 24px;
}
.btn {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 1px;
  text-decoration: none;
  text-transform: unset;
  text-align: unset;
  padding: 12px 16px ;
  background-color: #FFFFFF;
  border: 1px solid #2B89E1;
  border-radius: 10px;
  box-shadow: none;
  transition: all 0.3s ease;
}
.btn .btn-wrp {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  column-gap: 1rem;
  align-items: center;
}
.btn span {
  display: block;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  text-transform: inherit;
  margin: 0;
  transition: all 0.3s ease;
}
.btn [class="icon"],
.btn [class^="icon-"],
.btn [class*=" icon-"] {
  display: block;
  width: 24px;
  height: 24px;
  font-size: 24px;
  color: inherit;
}
.btn.btn--block {
  display: block;
  width: 100%;
}
.btn.btn--inline {
  display: inline-block;
  width: auto;
}
.btn.btn--rounded {
  border-radius: 9999px;
}
.btn.btn--white {
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #2B89E1;
}
.btn.btn--white:hover,
.btn.btn--white:active {
  border-color: #2B89E1;
  background-color: #FFFFFF;
  color: #2B89E1;
}
.btn.btn--primary {
  background-color: #2B89E1;
  border-color: #2B89E1;
  color: #FFFFFF;
}
.btn.btn--primary:hover,
.btn.btn--primary:active {
  background-color: #FFFFFF;
  border-color: #2B89E1;
  color: #2B89E1;
}
.btn.btn--icon-only {
  padding-left: 12px;
  padding-right: 12px;
}
.btn.btn--outline-black {
  background-color: #FFFFFF;
  border-color: #8F9CA9;
  color: #0D2C49;
}
.btn.btn--outline-black:hover,
.btn.btn--outline-black:active {
  background-color: #FFFFFF;
  border-color: #8F9CA9;
  color: #0D2C49;
}
.paragraph,
.paragraph-sm,
.paragraph-md,
.paragraph-sub {
  max-width: 100%;
}
.paragraph p,
.paragraph-sm p,
.paragraph-md p,
.paragraph-sub p {
  color: inherit;
  text-align: inherit;
  font-weight: inherit;
  letter-spacing: 0;
  margin-bottom: 16px;
}
.paragraph p b,
.paragraph-sm p b,
.paragraph-md p b,
.paragraph-sub p b,
.paragraph p strong,
.paragraph-sm p strong,
.paragraph-md p strong,
.paragraph-sub p strong {
  font-weight: 500;
}
.paragraph p i,
.paragraph-sm p i,
.paragraph-md p i,
.paragraph-sub p i {
  font-style: italic;
}
.paragraph p a,
.paragraph-sm p a,
.paragraph-md p a,
.paragraph-sub p a {
  font-weight: 500;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  color: #2B89E1;
  text-decoration: none;
}
.paragraph p a:hover,
.paragraph-sm p a:hover,
.paragraph-md p a:hover,
.paragraph-sub p a:hover {
  text-decoration: underline;
}
.paragraph p br,
.paragraph-sm p br,
.paragraph-md p br,
.paragraph-sub p br {
  display: none;
}
.paragraph p:last-of-type,
.paragraph-sm p:last-of-type,
.paragraph-md p:last-of-type,
.paragraph-sub p:last-of-type {
  margin-bottom: 0;
}
.paragraph ul,
.paragraph-sm ul,
.paragraph-md ul,
.paragraph-sub ul,
.paragraph ol,
.paragraph-sm ol,
.paragraph-md ol,
.paragraph-sub ol {
  margin-bottom: 16px;
  margin-left: 32px;
}
.paragraph ul li,
.paragraph-sm ul li,
.paragraph-md ul li,
.paragraph-sub ul li,
.paragraph ol li,
.paragraph-sm ol li,
.paragraph-md ol li,
.paragraph-sub ol li {
  margin-bottom: 8px;
  letter-spacing: 0;
}
.paragraph ul li::marker,
.paragraph-sm ul li::marker,
.paragraph-md ul li::marker,
.paragraph-sub ul li::marker,
.paragraph ol li::marker,
.paragraph-sm ol li::marker,
.paragraph-md ol li::marker,
.paragraph-sub ol li::marker {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  color: inherit;
}
.paragraph ul li:last-of-type,
.paragraph-sm ul li:last-of-type,
.paragraph-md ul li:last-of-type,
.paragraph-sub ul li:last-of-type,
.paragraph ol li:last-of-type,
.paragraph-sm ol li:last-of-type,
.paragraph-md ol li:last-of-type,
.paragraph-sub ol li:last-of-type {
  margin-bottom: 0;
}
.paragraph ul li > ul,
.paragraph-sm ul li > ul,
.paragraph-md ul li > ul,
.paragraph-sub ul li > ul,
.paragraph ul li > ol,
.paragraph-sm ul li > ol,
.paragraph-md ul li > ol,
.paragraph-sub ul li > ol,
.paragraph ol li > ul,
.paragraph-sm ol li > ul,
.paragraph-md ol li > ul,
.paragraph-sub ol li > ul,
.paragraph ol li > ol,
.paragraph-sm ol li > ol,
.paragraph-md ol li > ol,
.paragraph-sub ol li > ol {
  margin-top: 0;
  margin-bottom: 16px;
  margin-left: 24px;
}
.paragraph ol,
.paragraph-sm ol,
.paragraph-md ol,
.paragraph-sub ol {
  list-style: decimal;
}
.paragraph p,
.paragraph ul li,
.paragraph ol li {
  font-size: 16px;
  line-height: 24px;
}
.paragraph ul,
.paragraph ol {
  margin-left: 32px;
}
.paragraph-sm p,
.paragraph-sm ul li,
.paragraph-sm ol li {
  font-size: 14px;
  line-height: 20px;
}
.paragraph-md p,
.paragraph-md ul li,
.paragraph-md ol li {
  font-size: 18px;
  line-height: 27px;
}
.paragraph-sub p,
.paragraph-sub ul li,
.paragraph-sub ol li {
  font-size: 12px;
  line-height: 18px;
}
.the-title {
  display: block;
}
.the-title .title {
  font-size: 24px;
  line-height: 40px;
  color: #36414C;
  font-weight: 800;
  display: block;
  margin-bottom: 6px;
}
.text-base-lg,
.widget.widget--kupon .widget-wrp span.text-small,
.upload-struk .form .form-box .title,
.status-reward .reward .article-body p {
  font-size: 18px;
  line-height: 27px;
}
.text-base-md,
.form .form-check .form-check-wrp .form-check-label,
.form .form-control,
.form .form-control::placeholder,
.form .form-select .select2 .select2-selection .select2-selection__rendered,
.select2-dropdown .select2-search .select2-search__field,
.select2-dropdown .select2-results .select2-results__option,
body.tabung-point .nav-link .container a span,
.poin .tukar-poin .article-body .product p,
.faq .faq-wrp .faq-list .faq-single .faq-q {
  font-size: 16px;
  line-height: 24px;
}
.text-sub-lg,
.form .form-wrp .form-box .error,
.form .form-label span,
.upload-struk .form .form-box .title-sub,
.status-reward .reward .article-body .status,
.status-reward .reward .article-body .date span,
.status-reward .reward .article-body .information p,
.status-reward .reward.reward--notification p,
.poin .tukar-poin .article-body .product .count-poin,
.referal .widget.widget--referal .code,
.register .register-wrp .register-form .form-pic .pic-header span {
  font-size: 14px;
  line-height: 20px;
}
.text-sub-md {
  font-size: 12px;
  line-height: 18px;
}
.text-400 {
  font-weight: 400;
}
.text-500 {
  font-weight: 500;
}
.text-600 {
  font-weight: 600;
}
.text-700 {
  font-weight: 700;
}
.text-800 {
  font-weight: 800;
}
.text-900 {
  font-weight: 900;
}
.text-underline {
  text-decoration: underline !important;
}
.text-italic {
  font-style: italic;
}
.text-italic-underline {
  text-decoration: underline;
  font-style: italic;
}
@media screen and (min-width: 1170px) {
  .h1,
  h1 {
    font-size: 48px;
    line-height: 72px;
  }
  .h2,
  h2 {
    font-size: 36px;
    line-height: 54px;
  }
  .h3,
  h3,
  .popup .popup-header span,
  .popup .popup-body .upload-success .upload-information span {
    font-size: 28px;
    line-height: 40px;
  }
  .h4,
  h4,
  .faq .faq-wrp .faq-title {
    font-size: 24px;
    line-height: 40px;
  }
  .h5,
  h5 {
    font-size: 20px;
    line-height: 32px;
  }
  .h6,
  h6 {
    font-size: 18px;
    line-height: 24px;
  }
  .paragraph p,
  .paragraph ul li,
  .paragraph ol li {
    font-size: 18px;
    line-height: 27px;
  }
  .paragraph-sub p,
  .paragraph-sub ul li,
  .paragraph-sub ol li {
    font-size: 14px;
    line-height: 20px;
  }
}
.form {
  width: 100%;
  display: block;
}
.form .form-wrp {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.form .form-wrp > * {
  box-sizing: border-box;
  flex-shrink: 0;
}
.form .form-wrp .form-box {
  width: 100%;
}
.form .form-wrp .form-box .error {
  font-weight: 400;
  color: #D92632;
  margin-top: 20px;
  margin-bottom: 0;
  display: none;
}
.form .form-wrp .form-box.form-box--has-error .form-control {
  border-color: #D92632;
  color: #D92632;
}
.form .form-wrp .form-box.form-box--has-error .error {
  display: block;
}
.form .form-label {
  display: inline-block;
  width: 100%;
  text-align: left;
  margin-bottom: 8px;
}
.form .form-label span {
  font-weight: 600;
  color: #36414C;
}
.form .form-check .form-check-wrp {
  position: relative;
  padding-left: 24px;
  min-height: 24px;
}
.form .form-check .form-check-wrp .form-check-input {
  position: absolute;
  top: 4px;
  left: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  border-radius: 99999px;
  border: 1px solid #D9D9D9;
  background-color: #FFFFFF;
  color: transparent;
  outline: none;
  box-shadow: none;
  transition: all 0.3s ease;
}
.form .form-check .form-check-wrp .form-check-input[type="radio"] {
  width: 16px;
  height: 16px;
}
.form .form-check .form-check-wrp .form-check-input[type="radio"]:before {
  position: absolute;
  top: 4px;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  border-radius: 99999px;
  border: 1px solid #D9D9D9;
  background-color: #FFFFFF;
  content: '';
  transition: all 0.3s ease;
}
.form .form-check .form-check-wrp .form-check-input[type="radio"]:after {
  opacity: 0;
  display: block;
  position: absolute;
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  background-color: #2B89E1;
  border-radius: 9999px;
  content: '';
}
.form .form-check .form-check-wrp .form-check-input[type="radio"]:checked:before {
  border-color: #2B89E1;
}
.form .form-check .form-check-wrp .form-check-input[type="radio"]:checked:after {
  opacity: 1;
}
.form .form-check .form-check-wrp .form-check-input:checked + .form-check-label {
  color: #2B89E1;
}
.form .form-check .form-check-wrp .form-check-label {
  font-weight: 600;
  color: #36414C;
}
.form .form-control {
  width: 100%;
  display: block;
  font-weight: 400;
  color: #36414C;
  background-color: #FFFFFF;
  border: 1px solid #B8C1CC;
  border-radius: 4px;
  padding: 11px 16px;
  box-shadow: none;
}
.form .form-control:focus,
.form .form-control:active {
  color: #36414C;
  background-color: #FFFFFF;
  border-color: #B8C1CC;
  outline: 0;
  box-shadow: none;
}
.form .form-control::placeholder {
  color: #ADB9C7;
  font-weight: 400;
}
.form .form-control:disabled {
  background-color: #E7ECF2;
  color: #8F9CA9;
  border-color: #B8C1CC;
}
.form .form-control.form-control--visible {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.form .form-uploads {
  position: relative;
}
.form .form-select .select2 {
  border-radius: 4px;
  background-color: #EEF2F6;
  border: 1px solid #B8C1CC;
  color: #36414C;
  height: 48px;
  line-height: 48px;
}
.form .form-select .select2 .select2-selection {
  height: 100%;
}
.form .form-select .select2 .select2-selection .select2-selection__rendered {
  max-width: 100%;
  font-weight: 400;
  color: #36414C;
}
.form .form-select .select2 .select2-selection .select2-selection__arrow {
  width: 20px;
  height: 20px;
  top: 50%;
  right: 16px;
  margin-top: -10px;
  background: none;
  font-family: "icon" !important;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  transform: rotate(90deg);
  transition: all 0.3s;
}
.form .form-select .select2 .select2-selection .select2-selection__arrow:before {
  content: '\E00E';
}
.form .form-select .select2.select2-container--open .select2-selection .select2-selection__arrow {
  transform: rotate(-90deg);
}
.form .form-select .select2.select2-container--below {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form .form-select .select2.select2-container--above {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.form .form-control-with-icon {
  position: relative;
  display: block;
}
.form .form-control-with-icon .icon {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 20px;
  height: 20px;
}
.form .form-control-with-icon .form-control {
  padding-right: 42px;
}
.select2-dropdown {
  background-color: #EEF2F6;
  border-color: #B8C1CC;
  margin-bottom: 0;
}
.select2-dropdown .select2-search {
  padding: 16px 8px;
  margin-bottom: 0;
}
.select2-dropdown .select2-search .select2-search__field {
  font-weight: 400;
  color: #36414C;
  background-color: #FFFFFF;
  border: 1px solid #B8C1CC;
  border-radius: 4px;
  padding: 11px 16px;
  box-shadow: none;
}
.select2-dropdown .select2-results .select2-results__option {
  font-weight: 400;
  color: #36414C;
  padding: 10px 8px;
  margin-bottom: 0;
}
.select2-dropdown .select2-results .select2-results__option--highlighted.select2-results__option--selectable {
  color: #FFFFFF;
}
body.tabung-point {
  font-family: "Inter", sans-serif;
  position: relative;
  background-color: #F7F7FF;
}
body.tabung-point .container {
  max-width: 100%;
  width: 100%;
}
body.tabung-point header {
  background: #FFFFFF !important;
  padding-top: 2rem;
  padding-bottom: 2rem;
}
body.tabung-point header .header-top {
  display: none;
  background-color: #FFFFFF;
  border-bottom: 1px solid #D5DDE5;
}
body.tabung-point header .header-top .container ul {
  margin: 0 0;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
body.tabung-point header .header-top .container ul li {
  margin: 0 0;
}
body.tabung-point header .header-top .container ul li a {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
  padding: 12px;
  color: #000000;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}
body.tabung-point header .header-top .container ul li .icon {
  display: block;
  width: 20px;
  height: 20px;
}
body.tabung-point header .header-top .container ul li .icon img {
  display: block;
  height: 100%;
  width: auto;
}
body.tabung-point header #toggle {
  width: auto;
  height: 48px;
  background-color: #2B89E1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  column-gap: 0.75rem;
  padding: 0.5rem 1.5rem 0.5rem 1rem;
  border-radius: 1.5rem;
}
body.tabung-point header #toggle .btn-toggle {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
}
body.tabung-point header #toggle .btn-toggle span {
  width: 16px;
  height: 1.5px;
}
body.tabung-point header #toggle .btn-toggle span:before,
body.tabung-point header #toggle .btn-toggle span:after {
  width: 10px;
  height: 1.5px;
}
body.tabung-point header #toggle .btn-toggle span:before {
  right: 0;
  left: auto;
}
body.tabung-point header #toggle span.text {
  height: auto;
  background: unset !important;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.4px;
  font-weight: 600;
  color: #ffffff;
}
body.tabung-point header #toggle span.text:before,
body.tabung-point header #toggle span.text:after {
  display: none;
}
body.tabung-point header .nav-menu {
  margin-top: 2rem;
}
body.tabung-point header .nav-menu .nav-logout {
  display: flex;
}
body.tabung-point header .nav-menu .nav-button {
  display: none;
}
body.tabung-point #top-wrapper {
  padding-top: 104px;
}
body.tabung-point main {
  padding-top: 1.5rem;
}
body.tabung-point .footer {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
body.tabung-point .footer__wrp {
  background-color: #2B89E1;
  padding: 24px;
  border-radius: 24px;
}
body.tabung-point .footer .footer-action ul {
  padding: 0;
  margin: 0;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 10px;
}
body.tabung-point .footer .footer-action ul li {
  margin-bottom: 0;
}
body.tabung-point .footer .footer-action ul .btn {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  color: #FFFFFF;
}
body.tabung-point .footer .footer-bottom {
  margin-top: 24px;
  justify-content: space-between;
  align-items: center;
}
body.tabung-point .footer .footer-bottom p {
  margin-bottom: 0;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  font-style: normal;
  color: #FFFFFF;
  letter-spacing: 0.4px;
}
body.tabung-point .footer .footer-bottom ul {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: right;
}
body.tabung-point .footer .footer-bottom ul li {
  display: inline-block;
  margin-bottom: 0;
  margin-right: 4px;
}
body.tabung-point .footer .footer-bottom ul li:last-of-type {
  margin-right: 0;
}
body.tabung-point .footer .footer-bottom ul a {
  display: block;
  width: 32px;
  height: 32px;
  background-color: #FFFFFF;
  border-radius: 4px;
  color: #000000;
  text-align: center;
  padding: 4px;
  overflow: hidden;
}
body.tabung-point .footer .footer-bottom ul a [class="icon"],
body.tabung-point .footer .footer-bottom ul a [class^="icon-"],
body.tabung-point .footer .footer-bottom ul a [class*=" icon-"] {
  font-size: 18px;
  line-height: 24px;
}
body.tabung-point .footer .footer-bottom > * {
  width: auto;
  max-width: unset;
}
body.tabung-point .nav-link {
  display: block;
  padding-top: 8px;
  padding-bottom: 6px;
}
body.tabung-point .nav-link .container {
  text-align: left;
}
body.tabung-point .nav-link .container a {
  display: inline-block;
  padding-top: 8px;
  padding-bottom: 8px;
  text-decoration: none;
}
body.tabung-point .nav-link .container a [class^="icon-"],
body.tabung-point .nav-link .container a [class*=" icon-"] {
  display: inline-block;
  vertical-align: middle;
  width: 24px;
  height: 24px;
  font-size: 24px;
  line-height: 24px;
  color: #2B89E1;
}
body.tabung-point .nav-link .container a span {
  display: inline-block;
  vertical-align: middle;
  color: #2B89E1;
  margin-bottom: 0;
  margin-left: 12px;
}
@media screen and (min-width: 767px) {
  body.tabung-point .container {
    max-width: 640px;
  }
}
@media screen and (min-width: 1024px) {
  body.tabung-point #top-wrapper {
    padding-top: 149px;
  }
  body.tabung-point .container {
    max-width: 1000px;
  }
  body.tabung-point header {
    background: #F7F7FF !important;
    box-shadow: none;
    padding-top: 0;
    padding-bottom: 0;
  }
  body.tabung-point header .header-top {
    display: block;
  }
  body.tabung-point header .header-top .container {
    padding-top: 0;
    padding-bottom: 0;
  }
  body.tabung-point header #toggle {
    display: none;
  }
  body.tabung-point header .container {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  body.tabung-point header .nav-menu {
    background: transparent;
    border-radius: 0;
    margin-top: 0;
  }
  body.tabung-point header .nav-menu nav {
    padding: 0 0;
  }
  body.tabung-point header .nav-menu nav a {
    font-size: 14px;
    line-height: 24px;
    font-weight: 600;
    color: #000000;
  }
  body.tabung-point header .nav-menu nav .btn {
    padding-top: 11px;
    padding-bottom: 11px;
  }
  body.tabung-point header .nav-menu nav .btn span {
    background-color: transparent;
    padding: 0 0;
    border-radius: 0;
  }
  body.tabung-point header .nav-menu nav .nav-logout {
    display: none;
  }
  body.tabung-point header .nav-menu nav .nav-button {
    display: flex;
  }
  body.tabung-point .footer .footer-action ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }
}
body.tabung-point.login #top-wrapper {
  padding-top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.tabung-point.register #top-wrapper {
  padding-top: 0;
}
/* widget global */
.widget {
  position: relative;
}
.widget .widget-wrp {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.widget .text-sub,
.widget .text-big {
  display: block;
  width: 100%;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0px;
  text-transform: capitalize;
  margin-bottom: 0;
}
.widget .text-sub {
  font-size: 14px;
  line-height: 20px;
}
.widget .text-big {
  font-size: 24px;
  line-height: 40px;
}
.widget .user-pic {
  display: block;
  width: 56px;
  height: 56px;
  overflow: hidden;
  padding: 4px;
  border-radius: 50%;
  background-color: #FFFFFF;
}
.widget .user-pic img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.widget .btn-action {
  position: relative;
  display: block;
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 16px;
  background: #FFFFFF;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  margin-top: 1.5rem;
}
.widget .btn-action ul {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  column-gap: 10px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  padding: 0 1.5rem;
  margin: 0;
}
.widget .btn-action ul li {
  text-align: center;
  font-size: unset;
  min-height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}
.widget .btn-action ul li a {
  display: block;
  width: 100%;
  height: 100%;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #174B7C;
  text-decoration: none;
  outline: none;
}
.widget .btn-action ul li .icon {
  width: 24px;
  height: 24px;
  display: block;
  margin: 0 auto;
  color: inherit;
}
.widget .btn-action ul li .icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
.widget .btn-action ul li span {
  display: block;
  width: 100%;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  text-align: inherit;
  color: inherit;
  margin-top: 0.5rem;
  margin-bottom: 0;
}
/* widget profile */
.widget.widget--profile .widget-wrp {
  padding: 2rem 1.5rem 1.5rem 1.5rem;
  border-radius: 2rem;
  background: url('../img/tabung-point/bg-mural.png') no-repeat;
  background-size: cover;
}
.widget.widget--profile .widget-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem;
  padding-bottom: 1.5rem;
}
.widget.widget--profile .widget-header .message {
  display: block;
  width: auto;
}
.widget.widget--profile .widget-header .message .widget-wrp {
  display: block;
  width: 100%;
  height: 100%;
}
.widget.widget--profile .widget-body {
  padding-top: 1.5rem;
  display: block;
  width: 100%;
}
.widget.widget--profile .widget-footer {
  position: relative;
}
.widget.widget--profile .widget-footer:before {
  position: absolute;
  bottom: -1.5rem;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  background-color: #216AAF;
  opacity: 0.6;
  border-radius: 24px;
  filter: blur(25px);
}
@media screen and (min-width: 1024px) {
  .widget.widget--profile .widget-footer {
    display: none;
  }
}
/* widget profile */
.widget.widget--update .widget-wrp {
  padding: 2rem 1.5rem 1.5rem 1.5rem;
  border-radius: 2rem;
  background: url('../img/tabung-point/bg-mural.png') no-repeat;
  background-size: cover;
}
.widget.widget--update .widget-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem;
  padding-bottom: 1.5rem;
}
.widget.widget--update .widget-header .message {
  display: block;
  width: auto;
}
.widget.widget--update .widget-header .message .widget-wrp {
  display: block;
  width: 100%;
  height: 100%;
}
.widget.widget--update .widget-body {
  padding-top: 1.5rem;
  display: block;
  width: 100%;
}
.widget.widget--update .widget-footer {
  position: relative;
}
.widget.widget--update .widget-footer:before {
  position: absolute;
  bottom: -1.5rem;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  background-color: #216AAF;
  opacity: 0.6;
  border-radius: 24px;
  filter: blur(25px);
}
/* widget upload struk */
.widget.widget--bg-blue .widget-wrp {
  padding: 20px 16px;
  border-radius: 24px;
  background: #2B89E1;
  background: linear-gradient(180deg, #2B89E1 0%, #5BA4E8 100%);
}
.widget.widget--bg-blue .widget-body .h6 {
  display: block;
  width: 100%;
  margin-bottom: 8px;
}
.widget.widget--bg-blue .widget-body .widget-action {
  padding-top: 20px;
}
/* widget text */
.widget.widget--bg-grey .widget-wrp {
  padding: calc((20/16) * 1rem);
  border-radius: calc((24/16) * 1rem);
  background-color: #EEF2F6;
  border: 1px solid #D5DDE5;
}
.widget.widget--bg-grey .widget-body .h6 {
  display: block;
  width: 100%;
  margin-bottom: 8px;
}
.widget.widget--bg-grey .widget-body .h6 a {
  display: inline-block;
  vertical-align: middle;
  width: calc(100% - 40px);
  margin-right: calc((8/16) * 1rem);
}
.widget.widget--bg-grey .widget-body .h6 [class="icon"],
.widget.widget--bg-grey .widget-body .h6 [class^="icon-"],
.widget.widget--bg-grey .widget-body .h6 [class*=" icon-"] {
  font-size: calc((24/16) * 1rem);
}
/*widget kupon */
.widget.widget--kupon .widget-wrp {
  border-width: 2px;
}
.widget.widget--kupon .widget-wrp span.text-small {
  color: #36414C;
  font-weight: 700;
  display: block;
  width: 100%;
  margin-bottom: 4px;
}
.widget.widget--kupon .widget-wrp span.text-title {
  display: block;
  width: 100%;
  margin-bottom: 20px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  color: #36414C;
}
.widget.widget--kupon .widget-wrp .paragraph-with-icon {
  display: grid;
  grid-template-columns: 20px 1fr;
  column-gap: 8px;
}
.widget.widget--kupon .widget-wrp .paragraph-with-icon [class^="icon-"],
.widget.widget--kupon .widget-wrp .paragraph-with-icon [class*=" icon-"] {
  width: 20px;
  height: 20px;
  font-size: 20px;
  line-height: 20px;
}
.widget.widget--kupon .widget-wrp .btn-action {
  margin-top: 20px;
  background-color: transparent;
  box-shadow: none;
  display: grid;
  column-gap: 10px;
  grid-template-columns: calc(100% - 58px) 1fr;
}
.widget.widget--kupon .widget-wrp .btn-action .btn.btn--white {
  color: #36414C;
  width: 48px;
}
.widget.widget--kupon .widget-wrp .btn-action .btn.btn--white:hover {
  color: #FFFFFF;
}
/* widget group */
.widget-group {
  row-gap: 20px;
  column-gap: 16px;
}
.widget-group .widget.widget--profile {
  width: 100%;
}
.widget-group .widget.widget--update {
  width: 100%;
}
.widget-group .widget.widget--upload-struk {
  width: calc(50% - 8px);
}
.widget-group .widget.widget--upload-struk .widget-body {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.widget-group .widget-text {
  width: calc(50% - 8px);
}
.widget-group .widget-text .widget.widget--bg-grey {
  width: 100%;
  margin-bottom: calc((20/16) * 1rem);
}
.widget-group .widget-text .widget.widget--bg-grey:last-of-type {
  margin-bottom: 0;
}
@media screen and (min-width: 1024px) {
  .widget-group {
    column-gap: 2rem;
    row-gap: 2rem;
    justify-content: center;
  }
  .widget-group .widget.widget--profile,
  .widget-group .widget.widget--update,
  .widget-group .widget.widget--upload-struk,
  .widget-group .widget-text,
  .widget-group .widget.widget--bg-blue {
    width: calc(50% - 16px);
  }
  .widget-group .widget-text {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    column-gap: 2rem;
  }
  .widget-group .widget-text .widget.widget--bg-grey {
    width: calc(50% - 16px);
    margin-bottom: 0;
  }
  .widget-group .widget-text .widget.widget--bg-grey .widget-wrp {
    display: flex;
    align-items: center;
  }
}
.promo {
  margin-top: 32px;
}
.promo .the-title {
  margin-bottom: 14px;
}
.promo .promo-banner {
  position: relative;
  padding-top: calc((230/320) * 100%);
}
.promo .promo-banner a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  color: transparent;
  border: 0;
  outline: none;
  border-radius: 24px;
}
.promo .promo-banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.promo .carousel-promo {
  padding-right: 0;
}
.promo .carousel-promo .swiper {
  padding-right: 15%;
}
@media screen and (min-width: 480px) {
  .promo .carousel-promo .swiper {
    padding-right: 25%;
  }
}
.poin {
  display: block;
  width: 100%;
  margin-top: 32px;
}
.poin .poin-wrp {
  padding: 24px;
  border-radius: 24px;
  overflow: hidden;
  display: grid;
  grid-template-columns: calc(100% - 120px) 1fr;
  column-gap: 20px;
  align-items: center;
  background: url('../img/tabung-point/banner-stars-sm.jpg') no-repeat;
  background-size: cover;
  background-position: center;
}
.poin .content-left .title {
  font-weight: 700;
  font-size: 18px;
  line-height: 24px;
  color: #FFFFFF;
}
.poin .content-left .btn-action {
  margin-top: 16px;
}
.poin .content-right .icon-koin {
  display: block;
  width: 100px;
  height: 100px;
  background: url('../img/tabung-point/icons/i-stars.png') no-repeat;
  background-size: 100% 100%;
}
.poin .content-right .icon-wa {
  display: block;
  width: 100px;
  height: 100px;
  background: url('../img/tabung-point/icons/wa-ornament.png') no-repeat;
  background-size: 100% 100%;
}
.upload-struk {
  padding-top: 24px;
}
.upload-struk .the-title {
  margin-bottom: 24px;
}
.upload-struk .form .form-wrp {
  margin-top: -20px;
}
.upload-struk .form .form-box {
  margin-top: 20px;
  padding: 24px;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
}
.upload-struk .form .form-box .title {
  font-weight: 700;
  color: #36414C;
  text-align: left;
  display: block;
  width: 100%;
  margin-bottom: 4px;
}
.upload-struk .form .form-box .title-sub {
  font-weight: 400;
  color: #36414C;
  text-align: left;
  display: block;
  margin-bottom: 20px;
}
.upload-struk .form .form-box .form-check {
  padding-top: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #EEF2F6;
}
.upload-struk .form .form-box .form-check:last-of-type {
  border-bottom: 1px solid transparent;
}
.upload-struk .form .form-box .form-input-text,
.upload-struk .form .form-box .form-action {
  margin-top: 24px;
}
.status-reward {
  padding-top: 24px;
}
.status-reward .the-title {
  margin-bottom: 24px;
}
.status-reward .reward {
  display: block;
  margin-bottom: 20px;
}
.status-reward .reward .article-wrp {
  background-color: #FFFFFF;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
}
.status-reward .reward .article-body .status {
  margin-bottom: 8px;
}
.status-reward .reward .article-body p {
  margin-bottom: 12px;
}
.status-reward .reward .article-body .date {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  column-gap: 8px;
}
.status-reward .reward .article-body .date .icon-date {
  width: 20px;
  height: 20px;
  font-size: 20px;
  line-height: 20px;
  color: #36414C;
}
.status-reward .reward .article-body .date span {
  width: auto;
  margin-bottom: 0;
  color: #36414C;
}
.status-reward .reward .article-body .information {
  margin-top: 20px;
}
.status-reward .reward .article-body .information .information-wrp {
  padding-top: 12px;
  padding-bottom: 12px;
  border-top: 1px solid #EEF2F6;
}
.status-reward .reward .article-body .information .information-wrp p:last-of-type {
  margin-bottom: 0;
}
.status-reward .reward .article-body .information .information-wrp:first-of-type {
  border-top: 0;
}
.status-reward .reward .article-body .information p {
  color: #36414C;
  font-weight: 600;
  margin-bottom: 8px;
}
.status-reward .reward .article-body .information .copy {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.status-reward .reward .article-body .information .copy a {
  display: flex;
  align-items: center;
  flex-direction: row;
  column-gap: 8px;
  border-radius: 4px;
  border: 1px solid #36414C;
  padding: 4px;
}
.status-reward .reward .article-body .information .copy a span {
  margin-bottom: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
.status-reward .reward .article-footer {
  margin-top: 20px;
}
.status-reward .reward:last-of-type {
  margin-bottom: 0;
}
.status-reward .reward.reward--notification .article-wrp {
  border-radius: 16px;
  border: 1px solid #D5DDE5;
}
.status-reward .reward.reward--notification p {
  margin-bottom: 0;
  margin-top: 8px;
}
.status-reward .reward.reward--notification .date {
  margin-bottom: 8px;
}
.poin {
  padding-top: 24px;
}
.poin .the-title {
  margin-bottom: 24px;
}
.poin .tukar-poin {
  display: block;
  width: 100%;
  height: 100%;
}
.poin .tukar-poin .article-wrp {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 16px;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
}
.poin .tukar-poin .article-body .thumbs {
  position: relative;
  width: 100%;
  padding-top: calc((1/1) * 100%);
  border: 1px solid #EEF2F6;
  border-radius: 4px;
  overflow: hidden;
}
.poin .tukar-poin .article-body .thumbs img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
.poin .tukar-poin .article-body .product {
  padding-top: 20px;
}
.poin .tukar-poin .article-body .product p {
  display: block;
  color: #36414C;
  font-weight: 700;
  margin-bottom: 8px;
  height: 48px;
  max-height: 48px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.poin .tukar-poin .article-body .product .count-poin {
  font-weight: 600;
  color: #2B89E1;
  margin-bottom: 0;
}
.poin .tukar-poin .article-footer {
  padding-top: 20px;
}
.poin .grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: 16px;
}
@media screen and (min-width: 360px) {
  .poin .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 16px;
  }
}
.referal {
  padding-top: 24px;
}
.referal .the-title {
  margin-bottom: 24px;
}
.referal .widget.widget--referal .code {
  position: relative;
  padding-left: 28px;
  margin-bottom: 8px;
  color: #FFFFFF;
  font-weight: 600;
}
.referal .widget.widget--referal .code .icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
}
.referal .widget.widget--referal .text-big {
  display: block;
}
.referal .widget.widget--referal .text-big p {
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  color: #FFFFFF;
  text-transform: uppercase;
  margin-bottom: 0;
}
.profile .the-title {
  margin-bottom: 32px;
}
.profile .widget.widget--profile .widget-block {
  position: relative;
  padding-right: 116px;
}
.profile .widget.widget--profile .widget-block .widget-header {
  padding-bottom: 0;
}
.profile .widget.widget--profile .widget-block .user-pic {
  position: absolute;
  top: 50%;
  right: 0;
  width: 100px;
  height: 100px;
  transform: translateY(-50%);
}
.profile .widget.widget--profile .widget-footer .grid {
  padding-top: 24px;
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
}
.profile .widget.widget--profile .widget-footer .grid .btn--delete {
  color: #D92632;
}
.profile .widget.widget--update .widget-block {
  position: relative;
  padding-right: 116px;
}
.profile .widget.widget--update .widget-block .widget-header {
  padding-bottom: 0;
}
.profile .widget.widget--update .widget-block .user-pic {
  position: absolute;
  top: 50%;
  right: 0;
  width: 100px;
  height: 100px;
  transform: translateY(-50%);
}
.profile .widget.widget--update .widget-footer .grid {
  padding-top: 24px;
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
}
.profile .widget.widget--update .widget-footer .grid .btn--delete {
  color: #D92632;
}
.profile .profile-update {
  display: block;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 20px;
  margin-top: 32px;
}
.profile .profile-update .form .form-wrp {
  margin-top: -24px;
}
.profile .profile-update .form .form-wrp .form-box {
  margin-top: 24px;
}
.profile .profile-update .form .form-wrp .form-box .grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
}
.faq {
  padding-top: 24px;
}
.faq .the-title {
  margin-bottom: 24px;
}
.faq .faq-wrp {
  display: block;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 24px;
  margin-bottom: 24px;
}
.faq .faq-wrp .faq-title {
  display: block;
  color: #000000;
  margin-bottom: 20px;
}
.faq .faq-wrp .faq-list {
  display: block;
  margin-bottom: 0;
}
.faq .faq-wrp .faq-list .faq-single {
  margin-bottom: 0;
  padding-bottom: 0;
}
.faq .faq-wrp .faq-list .faq-single .faq-q {
  padding-top: 12px;
  padding-bottom: 12px;
  border-color: #EEF2F6;
  color: #0D2C49;
  font-weight: 600;
  text-align: left;
}
.faq .faq-wrp .faq-list .faq-single .faq-a {
  opacity: 1;
  margin: 0;
  padding-top: 16px;
  padding-bottom: 16px;
  border-top: 1px solid #EEF2F6;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #0D2C49;
  text-align: left;
}
.faq .faq-wrp .faq-list .faq-single:first-of-type {
  border-top: 1px solid #EEF2F6;
}
.faq .faq-wrp .faq-list .faq-single:last-of-type {
  margin-bottom: 0;
  border-color: transparent;
}
.faq .faq-wrp:last-of-type {
  margin-bottom: 0;
}
.faq .faq-wrp.faq-form .faq-title {
  margin-bottom: 8px;
}
.faq .faq-wrp.faq-form .form .form-box {
  margin-top: 20px;
}
.faq .poin {
  padding-top: 0;
  margin-top: 8px;
}
.login .login-wrp {
  display: block;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 24px;
}
.login .login-wrp .brand {
  display: block;
  text-align: left;
  padding-bottom: 24px;
  border-bottom: 1px solid #D5DDE5;
}
.login .login-wrp .brand a {
  display: inline-block;
  width: auto;
  color: transparent;
  border: 0;
  outline: none;
}
.login .login-wrp .brand a img {
  display: block;
  width: auto;
  height: 48px;
}
.login .login-wrp .heroes {
  display: block;
  margin-top: 24px;
}
.login .login-wrp .heroes .heroes-wrp {
  display: block;
}
.login .login-wrp .heroes .heroes-img {
  display: block;
  position: relative;
  padding-top: calc((12/16) * 100%);
  border-radius: 8px;
  overflow: hidden;
}
.login .login-wrp .heroes .heroes-img img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.login .login-wrp .the-title {
  margin-top: 40px;
  margin-bottom: 20px;
}
.login .login-wrp .form {
  margin-top: -20px;
}
.login .login-wrp .form .form-box {
  margin-top: 20px;
}
.login .login-wrp .form .form-box.form-action {
  padding-top: 16px;
  padding-bottom: 20px;
  text-align: left;
}
.login .login-wrp .form .form-box.form-action .btn {
  display: inline-block;
  width: calc(50% - 8px);
}
@media screen and (min-width: 1024px) {
  .login .login-wrp {
    padding: 40px;
  }
  .login .login-wrp .brand {
    padding-bottom: 32px;
  }
  .login .login-wrp .heroes {
    margin-top: 0;
  }
  .login .login-wrp .the-title {
    margin-top: 0;
  }
  .login .login-wrp .form .form-box.form-action .btn {
    width: auto;
    min-width: 160px;
  }
  .login .login-wrp .login-display {
    margin-top: 32px;
    display: grid;
    grid-template-columns: calc(50% - 16px) calc(50% - 16px);
    column-gap: 32px;
    align-items: center;
  }
}
.register .register-wrp {
  display: block;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 24px;
}
.register .register-wrp .brand {
  display: block;
  text-align: left;
  padding-bottom: 24px;
  border-bottom: 1px solid #D5DDE5;
}
.register .register-wrp .brand a {
  display: inline-block;
  width: auto;
  color: transparent;
  border: 0;
  outline: none;
}
.register .register-wrp .brand a img {
  display: block;
  width: auto;
  height: 48px;
}
.register .register-wrp .register-form {
  display: block;
  padding-top: 24px;
}
.register .register-wrp .register-form .from-block {
  margin-top: 16px;
}
.register .register-wrp .register-form .form-pic {
  display: block;
}
.register .register-wrp .register-form .form-pic .user-pic {
  border: 1px solid #D5DDE5;
  border-radius: 24px;
  overflow: hidden;
}
.register .register-wrp .register-form .form-pic .pic-header {
  padding: 24px 16px;
  border-bottom: 1px solid #D5DDE5;
}
.register .register-wrp .register-form .form-pic .pic-header span {
  font-weight: 600;
  color: #36414C;
  text-align: left;
  display: block;
  margin-bottom: 0;
}
.register .register-wrp .register-form .form-pic .pic-body {
  background-color: #EEF2F6;
  padding: 24px 16px;
  display: block;
  text-align: center;
}
.register .register-wrp .register-form .form-pic .pic-body .the-pic {
  display: inline-block;
  vertical-align: middle;
  width: 80px;
  height: 80px;
  background-color: #FFFFFF;
  border-radius: 50%;
  border: 1px solid #D5DDE5;
  overflow: hidden;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 8px;
}
.register .register-wrp .register-form .form-pic .pic-body .the-pic img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.register .register-wrp .register-form .form-pic .pic-body .the-upload {
  display: inline-block;
  vertical-align: middle;
  padding-left: 8px;
}
.register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label {
  display: block;
  text-align: center;
}
.register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label input {
  display: none;
}
.register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label .btn.btn--primary {
  width: 100%;
}
.register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label .btn.btn--primary:hover,
.register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label .btn.btn--primary:active {
  background-color: #2B89E1;
  border-color: #2B89E1;
  color: #FFFFFF;
}
.register .register-wrp .register-form .form-box {
  margin-top: 24px;
}
.register .register-wrp .register-form .form-action {
  text-align: center;
}
.register .register-wrp .register-form .form-action .btn {
  display: block;
  width: 100%;
  margin-bottom: 16px;
}
.register .register-wrp .register-form .form-action .btn.btn--primary {
  margin-bottom: 0;
}
.register .register-wrp .register-form .line {
  margin: 24px 0;
  display: block;
  height: 1px;
  background-color: #D5DDE5;
}
@media screen and (min-width: 360px) {
  .register .register-wrp .register-form .form-action {
    text-align: center;
  }
  .register .register-wrp .register-form .form-action .btn {
    display: inline-block;
    width: auto;
    min-width: 135px;
    margin-bottom: 0;
  }
  .register .register-wrp .register-form .form-action .btn.btn--primary {
    margin-left: 8px;
  }
}
@media screen and (min-width: 480px) {
  .register .register-wrp .register-form .form-pic .user-pic {
    border: 1px solid #D5DDE5;
    border-radius: 24px;
    overflow: hidden;
  }
  .register .register-wrp .register-form .form-pic .pic-header,
  .register .register-wrp .register-form .form-pic .pic-body {
    padding-left: 24px;
    padding-right: 24px;
  }
  .register .register-wrp .register-form .form-pic .pic-body .the-pic {
    width: 100px;
    height: 100px;
  }
  .register .register-wrp .register-form .form-pic .pic-body .the-upload {
    padding-left: 32px;
  }
  .register .register-wrp .register-form .form-pic .pic-body .the-upload .image-label .btn.btn--primary {
    width: auto;
    min-width: 160px;
  }
  .register .register-wrp .register-form .form-action .btn {
    min-width: 180px;
  }
  .register .register-wrp .register-form .form-action .btn.btn--primary {
    margin-left: 16px;
  }
}
@media screen and (min-width: 1024px) {
  .register .register-wrp {
    padding: 32px;
  }
  .register .register-wrp .brand {
    padding-bottom: 32px;
  }
  .register .register-wrp .register-form {
    padding-top: 32px;
  }
  .register .register-wrp .register-form .from-block {
    display: grid;
    grid-template-columns: 284px minmax(0, 1fr);
    column-gap: 32px;
    margin-top: 32px;
  }
  .register .register-wrp .register-form .from-block .form-profile .form-box:first-of-type {
    margin-top: 0;
  }
  .register .register-wrp .register-form .line {
    margin-top: 32px;
    margin-bottom: 32px;
  }
}
.popup {
  max-width: 100vw;
  max-height: 100vh;
  overflow: hidden;
}
.popup .popup-full {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 0;
  overflow-y: unset;
}
.popup .inner {
  display: block;
  background-color: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
  max-width: 95%;
  max-height: 95%;
  margin-left: 16px;
  margin-right: 16px;
}
.popup .inner .content {
  display: block;
  overflow: hidden;
  padding: 24px 16px;
}
.popup .popup-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  column-gap: 16px;
  align-items: flex-start;
}
.popup .popup-header span {
  color: #36414C;
  margin-bottom: 0;
}
.popup .popup-header .close-btn {
  position: relative;
  top: unset;
  right: unset;
  width: 40px;
  height: 40px;
  background: url('../img/tabung-point/icons/close.svg') no-repeat;
  background-size: 100% 100%;
}
.popup .popup-body {
  margin-top: 8px;
  margin-bottom: 20px;
}
.popup .popup-body .upload-success {
  display: block;
}
.popup .popup-body .upload-success .upload-information {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  column-gap: 16px;
  align-items: center;
  margin-bottom: 16px;
}
.popup .popup-body .upload-success .upload-information .icon {
  display: block;
  width: 100px;
  height: 100px;
}
.popup .popup-body .upload-success .upload-information .icon img {
  display: block;
  width: auto;
  height: 100%;
}
.popup .popup-body .upload-success .upload-information span {
  color: #36414C;
}
.popup .popup-body .upload-success .paragraph {
  margin-bottom: 16px;
}
.popup .popup-body .upload-success .upload-action {
  display: block;
}
.popup .popup-body .upload-success .upload-action .btn {
  display: block;
  width: 100%;
  margin-bottom: 16px;
}
.popup .popup-body .upload-success .upload-action .btn:last-of-type {
  margin-bottom: 0;
}
.popup .popup-body .form .form-wrp .btn.btn--primary:disabled,
.popup .popup-body .form .form-wrp .btn.btn--primary.disabled {
  background-color: #8BBFEF;
  border-color: #8BBFEF;
}
.popup .popup-body .form .form-wrp.form-wrp--sm {
  margin-top: 16px;
}
.popup .popup-body .form .form-wrp.form-wrp--sm .form-box {
  margin-top: 16px;
}
.popup .popup-body--with-scroll {
  overflow-y: auto;
}
.popup .popup-footer .form .form-check {
  padding-top: 16px;
  padding-bottom: 16px;
  border-top: 1px solid #D5DDE5;
  border-bottom: 1px solid #D5DDE5;
}
.popup .popup-footer .form .form-wrp {
  margin-top: -20px;
}
.popup .popup-footer .form .form-box {
  margin-top: 20px;
}
.popup .popup-footer .form .form-box .grid {
  display: grid;
  grid-template-columns: repeat(minmax(0), 1fr);
  row-gap: 16px;
}
.popup .popup-footer .form .form-action {
  text-align: left;
}
.popup .popup-footer .form .form-action .btn {
  display: block;
  width: 100%;
  margin-bottom: 16px;
}
.popup .popup-footer .form .form-action .btn.btn--primary {
  margin-bottom: 0;
}
.popup .popup-footer .form .form-action .btn.btn--primary:disabled,
.popup .popup-footer .form .form-action .btn.btn--primary.disabled {
  background-color: #8BBFEF;
  border-color: #8BBFEF;
}
.popup.popup--tnc .popup-body.popup-body--with-scroll {
  max-height: calc(100vh - 380px);
  height: 100%;
}
@media screen and (min-width: 360px) {
  .popup .inner .content {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen and (min-width: 480px) {
  .popup .inner {
    margin-left: 24px;
    margin-right: 24px;
  }
  .popup .popup-footer .form .form-check {
    text-align: center;
  }
  .popup .popup-footer .form .form-check .form-check-wrp {
    display: inline-block;
  }
  .popup .popup-footer .form .form-action {
    text-align: center;
  }
  .popup .popup-footer .form .form-action .btn {
    display: inline-block;
    width: auto;
    min-width: 180px;
    margin-bottom: 0;
  }
  .popup .popup-footer .form .form-action .btn.btn--primary {
    margin-left: 8px;
  }
  .popup.popup--tnc .popup-body.popup-body--with-scroll {
    max-height: calc(100vh - 280px);
  }
}
@media screen and (min-width: 767px) {
  .popup .popup-body .upload-success .upload-action {
    text-align: center;
  }
  .popup .popup-body .upload-success .upload-action .btn {
    display: inline-block;
    width: calc(50% - 8px);
    margin-bottom: 0;
  }
  .popup .popup-body .upload-success .upload-action .btn:last-of-type {
    margin-left: 8px;
  }
  .popup.popup--upload .inner,
  .popup.popup--store .inner,
  .popup.popup--redeem-success .inner {
    max-width: 590px;
  }
}
@media screen and (min-width: 1024px) {
  .popup.popup--tnc .inner {
    max-width: 900px;
  }
}