@charset "UTF-8";
@font-face {
  font-family: "Sarabun";
  src: url(../../../../../../fonts/Sarabun/Sarabun-Regular.ttf);
}
@font-face {
  font-family: "Kanit";
  src: url(../../../../../../fonts/Kanit/Kanit-Light.ttf);
}
@font-face {
  font-family: "Prompt";
  src: url(../../../../../../fonts/Prompt/Prompt-Regular.ttf);
}
@font-face {
  font-family: "PlexSans";
  src: url(../../../../../../fonts/IBM_Plex_Sans_Thai/IBMPlexSansThai-Medium.ttf);
}
@font-face {
  font-family: "NotoSansThai";
  src: url(../../../../../../fonts/NotoSansThai/NotoSansThai-Light.ttf);
}
:root {
  font-family: Sarabun;
  font-weight: normal;
  font-size: 16px;
  --def-undr: black;
  --def-bgnd: black;
  --def-text: #fe71a2;
}

*, *:before, *:after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

*, *:before, *:after {
  margin: 0;
  padding: 0;
}

body {
  margin: 0rem 2rem 1rem 2rem;
  padding: 0;
  background-color: hsl(339deg, 99%, 22%);
  overflow-x: clip;
}

h1, h2, h3, h4 {
  font-family: Kanit;
  color: hsl(46deg, 100%, 54%);
  margin: 2rem 2rem 0rem 2rem;
}

h1 {
  text-align: center;
  font-size: 3rem;
  line-height: 3rem;
  margin-bottom: 1rem;
}

div.fileList {
  counter-reset: lesson 0;
}

p.benji {
  font-size: 2rem;
  counter-increment: lesson;
  border-bottom: 3px dotted rgb(190, 61, 0);
}

p.benji a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: hsl(319deg, 96%, 74%);
  text-decoration: none;
}

p.benji a:before {
  content: "บทที่ " counter(lesson);
}

p.benji:nth-child(-n+9) a:before {
  content: "บทที่ 0" counter(lesson);
}

p.benji img {
  width: 6rem;
  height: auto;
  border-radius: 50%;
  margin: 1rem;
  border: 1px solid hsl(0deg, 0%, 0%);
}

u {
  line-height: 3rem;
}

i {
  font-style: normal;
  color: #2d0010;
}