.intro__a { background-color: rgba(45, 59, 67, 1); background-image: url(https://abload.de/img/concrete-wall-34pfef.png); width: 620px; min-height: 500px; margin: 40px auto; position: relative;}
.intro__a-head {background: var(--intro-dark2); border-bottom: 1.1px solid var(--intro-dark); width: 100%; height: 40px; position: absolute; top: 0;}

.intro__a-headimage {width: 100%; height: 415px; background-image: url(https://abload.de/img/code1kmekn.png); text-align: center; position: relative;}
.intro__a-title {display: inline-block; font: 500 43px 'Bigilla', sans-serif; text-transform: uppercase; color: var(--intro-darktext); letter-spacing: 0.4rem; text-align: center; line-height: 39px; margin-top: 120px; border: 1.5px solid var(--intro-dark); padding: 30px;}

.intro__a-head2 {background: var(--intro-dark2); border-top: 1.1px solid var(--intro-dark); border-bottom: 1.1px solid var(--intro-dark); width: 100%; height: 40px; position: absolute; bottom: 0; text-align: center}
intro__ainfo {display: inline-block; float: ; position: relative; padding: 4px 10.6px 4px 10px; font: 500 8px 'Noto Sans Thai', sans-serif; text-transform: uppercase; color: var(--intro-darktext); letter-spacing: 0.4rem; text-align: center; margin-top: 12px; margin-left 1px; margin-right: 6px;  transition: 0.35s;}
intro__ainfo:hover {color: rgba(191, 191, 191, 0.6);}

.intro__a-body {box-sizing: border-box; background-color: var(--intro-darkbody); width: 100%; height: auto; margin: 0px auto; margin-top: 0px; padding: 59px; font: 500 12px 'Libre Franklin', sans-serif; color: var(--intro-darktext); text-align: justify; line-height: 19px; position: relative;}
.intro__a-body::before {content: "the idea"; position: absolute; font: 600 42.5px 'Bigilla', sans-serif; text-transform: none; color: var(--intro-darkbefore); letter-spacing: 0.3rem; text-align: left; top: 33px; left: 50px;}
.intro__a-bodyscroll { width: 100%; height: 510px; background: ; overflow-y: scroll;}
.intro__a-body2 {box-sizing: border-box; background-color: var(--intro-darkbody2); width: 100%; height: auto; margin: 0px auto; margin-top: 0px; padding: 59px; font: 500 12px 'Libre Franklin', sans-serif; color: var(--intro-darktext); text-align: justify; line-height: 19px; position: relative;}
.intro__a-icon {position: relative; float: left; width: 140px; margin-top: 10px; margin-left: -14px; margin-right: 24px; margin-bottom: 30px;opacity: 0.7; transform: rotate(10deg);}

.intro__a-head3 {background-color: var(--intro-dark22); background-image: url(https://abload.de/img/code1kmekn.png); border-top: 1.1px solid var(--intro-dark); border-bottom: 1.1px solid var(--intro-dark); width: 100%; height: 40px; position: relative; bottom: 0; text-align: center;}

.intro__a ::-webkit-scrollbar {width: 0px;} .intro__a ::-webkit-scrollbar-thumb {background-color: var(--accent-colorr); border-radius: 0px;} .intro__a ::-webkit-scrollbar-track {border-radius: 0px; box-shadow: inset 0 0 0px rgb(0 0 0 / 0%);}
intro__a-under {font: 500 18px 'Bigilla', sans-serif; text-transform: uppercase; color: var(--intro-darktext); letter-spacing: 0.3rem; text-align: left; margin-top: 7px; display: inline-block; padding-bottom: 0px; position: relative;}
.intro__a b {font-weight: 600; color: var(--intro-darktext2); background-color: var(--intro-dark3); padding: 1px 4px 1px 4px; margin-left: 1px; margin-right: 1px;}
.intro__a i {font-style: italic; color: var(--intro-darktext2); text-decoration-line: underline;}





.intro2__a { background-color: rgba(45, 59, 67, 1); background-image: var(--intro2-background); width: 620px; min-height: 500px; height: auto; margin: 40px auto; position: relative;}
.intro2__a-head {background: var(--intro2-dark2); border-bottom: 1.1px solid var(--intro2-dark); width: 100%; height: 40px; position: absolute; top: 0;}

.intro2__a-headimage {width: 100%; height: 415px; background-image: var(--intro2-background2); text-align: center; position: relative;}
.intro2__a-title {display: inline-block; font: 500 43px 'Bigilla', sans-serif; text-transform: uppercase; color: var(--intro2-title); letter-spacing: 0.4rem; text-align: center; line-height: 39px; margin-top: 120px; border: 1.5px solid var(--intro2-dark); padding: 30px;}

.intro2__a-head2 {background: var(--intro2-dark2); border-top: 1.1px solid var(--intro2-dark); border-bottom: 1.1px solid var(--intro2-dark); width: 100%; height: 40px; position: absolute; bottom: 0; text-align: center}
intro2__ainfo {display: inline-block; float: ; position: relative; padding: 4px 10.6px 4px 10px; font: 500 8px 'Noto Sans Thai', sans-serif; text-transform: uppercase; color: var(--intro2-darktext); letter-spacing: 0.4rem; text-align: center; margin-top: 12px; margin-left 1px; margin-right: 6px;  transition: 0.35s;}
intro2__ainfo:hover {color: rgba(191, 191, 191, 0.6);}

.intro2__a-body {box-sizing: border-box; background-color: var(--intro2-darkbody); width: 100%; height: auto; margin: 0px auto; margin-top: 0px; padding: 60px; font: 500 12px 'Libre Franklin', sans-serif; color: var(--intro2-darktext); text-align: justify; line-height: 19px; position: relative;}
.intro2__a-body::before {content: "our story"; position: absolute; font: 600 42.5px 'Bigilla', sans-serif; text-transform: none; color: var(--intro2-darkbefore); letter-spacing: 0.3rem; text-align: left; top: 33px; left: 50px;}

.intro2__a-head3 {background: var(--intro2-dark3); background-image: var(--intro2-background22); border-top: 1.1px solid var(--intro2-dark); border-bottom: 1.1px solid var(--intro2-dark); width: 100%; height: 30px; position: relative; bottom: 0; text-align: center;}