body {
    font-family: 'Anuphan';
}

.imgbanner {
    /* Untitled-1 1 */
position: absolute;
width: 1511px;
height: 404px;
left: -12px;
top: 181px;
background: url(Untitled-1.png);
}

.langg {
    /* แหล่งรวบรวมหนังสือ */
position: absolute;
left: 63.05%;
right: 5.47%;
top: 39.19%;
bottom: 88.91%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 45px;
line-height: 58px;
color: #FFFFFB;
}

.lag {
    /* หลากหลายความรู้ประวัติศาสตร์ไทย */
position: absolute;
left: 62.03%;
right: 4.14%;
top: 47.19%;
bottom: 87.86%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 30px;
line-height: 39px;
/* identical to box height */
color: #FFFFFB;
}

.borderunder {
    /* Line 33 */
position: absolute;
width: 41px;
height: 0px;
left: 1130px;
top: 405px;
/* White */
border: 1px solid #FFFFFF;
}

.siammul {
    /* สยามเทศะ โดยมูลิธิเล็ก-ประไพ วิริยะพันธ์ุ */
position: absolute;
left: 56.88%;
right: 4.3%;
top: 58.12%;
bottom: 85.9%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 24px;
line-height: 31px;
text-align: center;
color: #FFFFFB;
}
#muad {
    /* หมวดหนังสือ */
position: relative;
font-family: 'Anuphan';
font-style: normal;
font-weight: 800;
font-size: 30px;
text-align: center;
color: #171717;
}

.lag2 {
    /* หลากหลายความรู้ครบทุกหมวดหมู่ */
position: relative;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
text-align: center;

color: #000000;
}

.icon01 {
position: relative;
left: 0%;
right: 0%;
top: 0%;
bottom: 0%;
height: 69px;
width: 86px;
left: 0px;
top: 0px;
border-radius: 0px;
}

.texticon1 {
    /* รอบรู้รอบเมือง */
position: absolute;
left: 39%;
right: 86.72%;
top: 110.26%;
bottom: 0%;
width: 500px;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 19px;
/* or 95% */
color: #000000;
}

.texticon3 {
    /* ธรรมชาติและสิ่งแวดล้อม */
position: absolute;
left: 10%;
right: 86.72%;
top: 110.26%;
bottom: 0%;
width: 500px;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 19px;
/* or 95% */
color: #000000;
}

.texticon4 {
    /* ชุมชน */
position: absolute;
left: 41%;
right: 86.72%;
top: 110.26%;
bottom: 0%;
width: 500px;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 19px;
/* or 95% */
color: #000000;
}

.texticon5 {
    /* พิพิธภัณฑ์ */
position: absolute;
left: 33%;
right: 86.72%;
top: 110.26%;
bottom: 0%;
width: 500px;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 19px;
/* or 95% */
color: #000000;
}

.nae {
    /* แนะนำหนังสือยอดนิยม */
position: absolute;
left: 7.03%;
right: 64.84%;
top: 135.74%;
bottom: 67.81%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 800;
font-size: 30px;
line-height: 47px;
color: #171717;
}

.bookspecial {
    /* หนังสือเล่มพิเศษที่ทุกคนให้ความสนใจ */
position: absolute;
left: 7.03%;
right: 73.2%;
top: 142.03%;
bottom: 67.08%;
font-style: normal;
font-family: 'Anuphan';
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
color: #000000;
}

.bgcolorr {
    /* Rectangle 110 */
position: absolute;
left: 1.83%;
right: 68.92%;
top: 5.41%;
bottom: 4.27%;
background: #FEC85B;
height: 317px;
width: 303px;
left: 19px;
top: 19px;
border-radius: 0px;
}

.picbuy {
    /* Rectangle 165 */
position: absolute;
left: 0%;
right: 70.66%;
top: 0%;
bottom: 0%;
background: url(image.png);
filter: drop-shadow(0px 4px 20px rgba(199, 199, 199, 0.25));
height: 351px;
width: 304px;
left: 0px;
top: 0px;
border-radius: 0px;
box-shadow: 0px 4px 20px 0px #C7C7C740;
}

.hisbkk {
    /* Sidebar posts */
position: absolute;
left: 41.89%;
right: 2.12%;
top: 0%;
bottom: 92.59%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 26px;
line-height: 26px;
/* identical to box height, or 98% */
color: #171717;
font-family: Anuphan;
font-size: 26px;
font-weight: 600;
line-height: 26px;
letter-spacing: 0px;
text-align: left;
}

.poo0 {
    /* Sidebar posts */
position: absolute;
left: 41.89%;
right: 39.19%;
top: 15.95%;
bottom: 78.92%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 18px;
line-height: 18px;
/* identical to box height, or 100% */
color: #393535;
font-family: Anuphan;
font-size: 18px;
font-weight: 600;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
height: 18px;
width: 196px;
left: 434px;
top: 56px;
border-radius: nullpx;

}

.sung {
    /* สังคมล้านนายุคจารีตแยกคนเป็นชนชั้น ๒ ชนชั้นใหญ่ ๆ คือ ชนชั้นมูลนาย ประกอบด้วยผู้เป็น มูลนายโดยกำเนิดเรียกว่า "เจ้า " กับพวกมูลนายเพราะ
ทำราชการ หรือ "ท้าว" "ขุน"ฯลฯ กลุ่ม */
position: absolute;
left: 41.89%;
right: 0.39%;
top: 24.5%;
bottom: 51.85%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 23px;
/* or 128% */
color: #393535;
height: 83px;
width: 598px;
left: 434px;
top: 86px;
border-radius: nullpx;
}

.price {
    /* Sidebar posts */
position: absolute;
left: 41.89%;
right: 42.66%;
top: 54.42%;
bottom: 40.46%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 30px;
line-height: 18px;
/* identical to box height, or 60% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 160px;
left: 434px;
top: 191px;
border-radius: nullpx;
}

.jumn {
    /* Sidebar posts */
position: absolute;
left: 42.28%;
right: 52.8%;
top: 71.51%;
bottom: 23.36%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
/* identical to box height, or 100% */
color: #393535;
height: 18px;
width: 51px;
left: 438px;
top: 251px;
border-radius: nullpx;

}

.bookbook {
    /* Component 17 */
position: absolute;
width: 1036px;
height: 351px;
left: 122px;
top: 1081px;
}

#inputt {
    /* Rectangle 168 */
box-sizing: border-box;
position: absolute;
left: 49.23%;
right: 42.28%;
top: 67.52%;
bottom: 19.66%;
/* Gray 5 */
border: 1px solid #E0E0E0;
height: 45px;
width: 88px;
left: 510px;
top: 237px;
border-radius: 0px;
border: 1px solid #E0E0E0;
background: #E0E0E0;
}

.inc {
    /* + */
position: absolute;
left: 55.48%;
right: 43.03%;
top: 70.94%;
bottom: 21.08%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
/* Gray 3 */
color: #828282;
height: 28px;
width: 15.48799991607666px;
left: 574.767578125px;
top: 249px;
border-radius: nullpx;

}
.one {
    /* 1 */
position: absolute;
left: 53.03%;
right: 45.47%;
top: 70.94%;
bottom: 21.08%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
/* Gray 3 */
color: #828282;
height: 28px;
width: 15.48799991607666px;
left: 549.423828125px;
top: 249px;
border-radius: nullpx;

}
.dec {/* - */
position: absolute;
left: 50.45%;
right: 48.05%;
top: 70.94%;
bottom: 21.08%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
/* Gray 3 */
color: #828282;
height: 28px;
width: 15.48799991607666px;
left: 522.671875px;
top: 249px;
border-radius: nullpx;
}

.button1 {
/* Rectangle 170 */
height: 45px;
width: 159px;
left: 439px;
top: 306px;
border-radius: 0px;
position: absolute;
left: 42.37%;
right: 42.28%;
top: 87.18%;
bottom: 0%;
/* Active_01 */
background: #D39427;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.buynow {
    /* Sidebar posts */
position: absolute;
left: 40.55%;
right: 42.28%;
top: 30.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #FFFFFF;
height: 18px;
width: 95.01219940185547px;
}

.buynow:hover {
    /* Sidebar posts */
position: absolute;
left: 40.55%;
right: 42.28%;
top: 30.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #FFFFFF;
height: 18px;
width: 95.01219940185547px;
}

.iconbuynow {
    /* Vector */
position: relative;
left: 20.55%;
right: 0%;
top: 16.45%;
bottom: 0%;
/* White */
}

.button2 {
    /* Rectangle 169 */
box-sizing: border-box;
position: absolute;
left: 59.46%;
right: 21.33%;
top: 87.18%;
bottom: 0%;
/* White */
background: #FFFFFF;
/* Active_01 */
border: 1px solid #D39427;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
height: 45px;
width: 199px;
left: 616px;
top: 306px;
border-radius: 0px;
}

.inctrakra {
    /* Sidebar posts */
position: absolute;
left: 20%;
right: 0%;
top: 30.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #D39427;
width: 143px;
height: 18px;
}

.inctrakra:hover {
    /* Sidebar posts */
position: absolute;
left: 20%;
right: 0%;
top: 30.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #D39427;
width: 143px;
height: 18px;
}

.icontrakra {
    /* Vector */
position: absolute;
left: 6.33%;
right: 0%;
top: 25.45%;
bottom: 4.76%;
/* Active_01 */
}

.favorite {
    /* Sidebar posts */
height: 18px;
width: 147px;
left: 653px;
top: 250px;
border-radius: nullpx;
position: absolute;
left: 63.03%;
right: 22.78%;
top: 71.23%;
bottom: 23.65%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
/* identical to box height, or 100% */
text-decoration-line: underline;
/* Gray 2 */
color: #4F4F4F;
}

#heart {
    /* Vector */
height: 17.103425979614258px;
width: 20px;
left: 0px;
top: 1.646484375px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0%;
top: 8.23%;
bottom: 6.25%;
/* Gray 1 */
}

.bookgood {
height: 46px;
width: 360px;
left: 90px;
top: 1522px;
border-radius: nullpx;

    /* หนังสือขายดี */
position: absolute;
left: 7.03%;
right: 64.84%;
bottom: 50.32%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 800;
font-size: 30px;
line-height: 47px;
color: #171717;
}

.koon {
height: 28px;
width: 253px;
left: 90px;
top: 1563px;
border-radius: nullpx;
/* พบกับหนังสือที่คัดสรรคุณภาพ */
position: absolute;
left: 7.03%;
right: 73.2%;
bottom: 49.59%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
color: #000000;
}

.allbook {
    /* หนังสือทั้งหมด */
height: 20px;
width: 95px;
left: 1079px;
top: 1549px;
border-radius: nullpx;
position: absolute;
left: 84.3%;
right: 8.28%;
bottom: 50.29%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
/* or 119% */
text-align: center;
color: #000000;
/* Rectangle 147 */
box-sizing: border-box;
position: absolute;
width: 123.78px;
height: 36px;
border: 0.5px solid #B9B9B9;
border-radius: 5px;
height: 36px;
width: 123.78471374511719px;
padding-top: 5px;
border-radius: 5px;
}

#book01 {
height: 386px;
width: 239px;
left: 108px;
top: 1619px;
border-radius: 0px;
/* Component 2 */
position: absolute;
width: 239px;
height: 386px;
animation-duration: 0ms;
animation-timing-function: ease-out;
animation-duration: 300ms;
}

.img1 {
    /* Rectangle 165 */
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
}

.supwee1 {
    /* Sidebar posts */
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
}

.t1 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 5.86%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
}

.price1 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
}
/****************************************************************************************************************************************/
#book02 {
height: 386px;
width: 239px;
left: 455px;
top: 1619px;
border-radius: 0px;
/* Component 3 */
position: absolute;
width: 239px;
height: 386px;
}
    
.img2 {
    /* Rectangle 165 */
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
}

.supwee2 {
    /* Sidebar posts */
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
}

.t2 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: -0.42%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
}

.price2 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
}

#book03 {
    /* Component 4 */
position: absolute;
width: 239px;
height: 386px;
left: 805px;
top: 1619px;
height: 386px;
width: 239px;
border-radius: 0px;
}

.img3 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee3 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
font-family: Anuphan;
font-size: 12px;
font-weight: 500;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
}

.t3 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 7.11%;
top: 80.57%;
bottom: 14.77%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #171717;
font-family: Anuphan;
font-size: 16px;
font-weight: 600;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
}

.price3 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
font-family: Anuphan;
font-size: 24px;
font-weight: 700;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
}

#book04 {
    /* Component 5 */
position: absolute;
width: 239px;
height: 386px;
left: 1150px;
top: 1619px;
height: 386px;
width: 239px;
border-radius: 0px;
}

.img4 {
/* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee4 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t4 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 9.62%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
}

.price4 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book05 {
    /* Component 12 */
position: absolute;
width: 239px;
height: 386px;
left: 108px;
top: 2055px;
}

.img5 {
    /* Rectangle 165 */
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
}

.supwee5 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t5 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 3.77%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 39px;
width: 230px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price5 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book06 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 455px;
top: 2055px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img6 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee6 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t6 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 16.74%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 39px;
width: 199px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price6 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book07 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 805px;
top: 2055px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img7 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee7 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t7 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 15.9%;
top: 80.57%;
bottom: 3.89%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 60px;
width: 201px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price7 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book08 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 1150px;
top: 2055px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img8 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee8 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t8 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 15.9%;
top: 80.57%;
bottom: 3.89%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 60px;
width: 201px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price8 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

































#book09 {
    /* Component 12 */
position: absolute;
width: 239px;
height: 386px;
left: 108px;
top: 2491px;
}

.img9 {
    /* Rectangle 165 */
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
}

.supwee9 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t9 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 3.77%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 39px;
width: 230px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price9 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book010 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 455px;
top: 2491px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img10 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee10 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t10 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 16.74%;
top: 80.57%;
bottom: 9.33%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 39px;
width: 199px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price10 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book011 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 805px;
top: 2491px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img11 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee11 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t11 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 15.9%;
top: 80.57%;
bottom: 3.89%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 60px;
width: 201px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price11 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#book012 {
    /* Component 11 */
height: 386px;
width: 239px;
left: 1150px;
top: 2491px;
border-radius: 0px;
position: absolute;
width: 239px;
height: 386px;
}

.img12 {
    /* Rectangle 165 */
height: 274px;
width: 237px;
left: 0px;
top: 0px;
border-radius: 0px;
position: absolute;
left: 0%;
right: 0.84%;
top: 0%;
bottom: 29.02%;
background: url(image.png);
}

.supwee12 {
    /* Sidebar posts */
position: absolute;
left: 0%;
right: 66.53%;
top: 74.09%;
bottom: 21.24%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 18px;
/* identical to box height, or 150% */
color: #393535;
height: 18px;
width: 80px;
left: 0px;
top: 286px;
border-radius: nullpx;
}

.t12 {
/* Sidebar posts */
position: absolute;
left: 0%;
right: 15.9%;
top: 80.57%;
bottom: 3.89%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* or 112% */
color: #171717;
height: 60px;
width: 201px;
left: 0px;
top: 311px;
border-radius: nullpx;
}

.price12 {
    /* Sidebar posts */
position: absolute;
left: 45.61%;
right: 0.84%;
top: 95.34%;
bottom: 0%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 18px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
height: 18px;
width: 128px;
left: 109px;
top: 368px;
border-radius: nullpx;
}

#messsss {
    /* messenger 2 */
position: absolute;
left: 66.33%;
right: 3.28%;
top: -133.92%;
bottom: 67.14%;
height: 472px;
width: 389px;
left: 880px;
top: 345%;
border-radius: 0px;
}

.imgmes {
    /* messenger 1 */
height: 67px;
width: 67px;
left: 322px;
top: 405px;
border-radius: 0px;
position: absolute;
left: 115%;
right: 0%;
top: 85.81%;
bottom: 0%;
background: url(messenger.png);
/* Dropshadow01 */
filter: drop-shadow(0px 4px 10px rgba(36, 36, 36, 0.25));
}

.borderfooter {
    /* Line 7 */
left: 0px;
top: 127px;
border-radius: nullpx;
position: absolute;
left: 0%;
right: 0%;
top: 415%;
bottom: 55.12%;
border: 0.7px solid #000000;
}

.pnew1 {
    /* หนังสือขายดี */
font-family: 'Anuphan';
font-style: normal;
font-weight: 800;
font-size: 30px;
color: #171717;
}
.pnew2 {
    font-family: 'Anuphan';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
}

.product-action-btn-2 {
    font-family: 'Anuphan';
}

.sup1 {
    font-family: 'Anuphan';
}

.anuphan {
    font-family: 'Anuphan';
    font-size: 16px;
    text-decoration: none;
}

.pricecc {
    /* Sidebar posts */
text-align: right;
align-items: flex-end;
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 24px;
/* identical to box height, or 75% */
/* Active_01 */
color: #D39427;
}

.his {
font-family: 'Anuphan';
font-weight: 600;
font-size: 22px;
/* width: 500px; */
color: #393535;
}

.potang {
    /* Sidebar posts */
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 18px;
/* identical to box height, or 100% */
color: #393535;
}

.sungggg {
    min-height: 130px;
    /* width: 520px; */
    /* left: 434px;
    top: 86px; */
    border-radius: nullpx;
    font-family: 'Anuphan';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    /* or 128% */
    color: #393535;
}

.priceeeee {
font-family: 'Anuphan';
font-style: normal;
font-weight: 700;
font-size: 30px;
line-height: 18px;
/* identical to box height, or 60% */
/* Active_01 */
color: #D39427;
}

.imgasd {
    /* Rectangle 165 */
    height: 351px;
    width: 304px;
background: url(image.png);
filter: drop-shadow(0px 4px 20px rgba(199, 199, 199, 0.25));
}

.asdf {
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
color: #393535;
}

.sss {
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
color: #393535;
}
/* 
.bgbuynow {
 
position: absolute;
left: 42.37%;
right: 42.28%;
top: 80.18%;
bottom: 0%;
 
background: #D39427;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
height: 45px;
width: 159px;
left: 1px;
top: 75px;
border-radius: 0px;
}

.bgbuynow:hover { 
position: absolute;
left: 42.37%;
right: 42.28%;
top: 80.18%;
bottom: 0%; 
background: #bd7e11;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
height: 45px;
width: 159px;
left: 1px;
top: 75px;
border-radius: 0px;
} */

.buynowbuynow {
    /* Sidebar posts */
text-decoration: none;
position: relative;
left: 35.55%;
right: 42.28%;
top: 25.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #FFFFFF;
}

.buynowbuynow:hover {
    /* Sidebar posts */
text-decoration: none;
position: relative;
left: 35.55%;
right: 42.28%;
top: 25.45%;
bottom: 3.42%;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 18px;
/* identical to box height, or 112% */
color: #dad3c3;
}
/* 
.icona {
     
position: relative;
left: 22%;
right: 0%;
top: 15%;
bottom: 0%;
} */



.bgbuynow{
    cursor: pointer;
}
.buynowbuynow:hover{
    color: #FFF !important;
}
/*
.trakraaa { 
    box-sizing: border-box;
    position: absolute;
    left: 59.46%;
    right: 21.33%;
    top: 87.18%;
    bottom: 0%; 
    background: #FFFFFF; 
    border: 1px solid #D39427;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    height: 45px;
    width: 199px;
    left: 175px;
    top: 75px;
    border-radius: 0px;
}

.trakraaa:hover { 
    box-sizing: border-box;
    position: absolute;
    left: 59.46%;
    right: 21.33%;
    top: 87.18%;
    bottom: 0%; 
    background: #dad3c3; 
    border: 1px solid #D39427;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    height: 45px;
    width: 199px;
    left: 175px;
    top: 75px;
    border-radius: 0px;
}

.trakrass { 
    position: relative;
    top: 10px;
    left: 18px;
    font-family: 'Anuphan';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px; 
    text-decoration: none;
    color: #D39427;
}

.trakrass:hover { 
    position: relative;
    top: 10px;
    left: 18px;
    font-family: 'Anuphan';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px; 
    text-decoration: none;
    color: #bd7e11;
}

.trakradd { 
    position: relative;
    left: 6.33%;
    right: 0%;
    top: 15.76%;
    bottom: 4.76%;
}
*/
.text-onbanner1 {
    /* แหล่งรวบรวมหนังสือ */
position: relative;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 45px;
line-height: 58px;
color: #FFFFFB;
text-align: right;
}

.text-onbanner2 {
    /* หลากหลายความรู้ประวัติศาสตร์ไทย */
position: relative;
font-family: 'Anuphan';
font-style: normal;
font-weight: 500;
font-size: 30px;
line-height: 39px;
/* identical to box height */
text-align: right;
color: #FFFFFB;
}

.text-onbanner3 {
    /* สยามเทศะ โดยมูลิธิเล็ก-ประไพ วิริยะพันธ์ุ */
position: relative;
font-family: 'Anuphan';
font-style: normal;
font-weight: 600;
font-size: 24px;
line-height: 31px;
text-align: right;
color: #FFFFFB;
}

.border-onbanner {
    /* Line 33 */
position: relative;
text-align: center;
color: #FFFFFB;
border: 1px #FFFFFF;
left: 100px;
}

.brand-logo-active {
    border: 0px solid #e1e1e1;
    padding: 48px 10px;
    max-width: 100%;
    transform: scale(1);
    transition: all .4s ease 0s;
    
}

.product-quality .qtybutton.inc {
    left: auto;
    right: 5px;
    font-size: 20px;
    top: 19px;
}

[class^="pe-7s-"], [class*=" pe-7s-"] {
    display: inline-block;
    font-family: 'Pe-icon-7-stroke', 'Anuphan';
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}