/*
Theme Name: ABCBKK;
Author Name: Teerawat Xu;
*/

@import url(‘https://fonts.googleapis.com/css2?family=Kanit:wght@100;200;300;400;500;600;700;800;900&display=swap’);

/*Setting*/

:root {
–ci-db: #7D5A50;
–ci-b: #B4846C;
–ci-dbeige: #E5B299;
–ci-beige: #FCDEC0;
}

* {
text-decoration: none !important;
list-style: none;
}

body, h1, h2, h3, h4, h5, h6, p, ul {
padding: 0 !important;
margin: 0 !important;
color: var(–ci-db);
font-family: ‘Kanit’, sans-serif !important;
}

a {color: var(–ci-b);}
a:hover {color: var(–ci-dbeige);}

/*text*/

.text-c {text-align: center;}

/*display*/

.d-f {display: flex;}

/*flex*/

.flex-r {flex-direction: row;}
.flex-c {flex-direction: column;}
.flex-r-r {flex-direction: row-reverse;}
.flex-r-c {flex-direction: column-reverse;}

.center {display: flex;justify-content: center;align-items: center;}

.jc-c {display: flex;justify-content: center;}
.jc-s {display: flex;justify-content: flex-start;}
.jc-e {display: flex;justify-content: flex-end;}
.jc-b {display: flex;justify-content: space-between;}

.ai-c {display: flex;align-items: center;}
.ai-s {display: flex;align-items: flex-start;}
.ai-e {display: flex;align-items: flex-end;}

/*float*/

.float-l {float: left;}
.float-r {float: right;}

/*sp*/

.sp-1 {width: 100%;height: 1px;background-color: #E0E0E0;margin: .5rem 0;}
.sp-2 {width: 100%;height: 2px;background-color: #E0E0E0;margin: 1rem 0;}
.sp-v-1 {width: 3px;background-color: #E0E0E0;margin-right: .5rem;}

/*width*/

.w-5 {width: 5%;}
.w-10 {width: 10%;}
.w-15 {width: 15%;}
.w-20 {width: 20%;}
.w-25 {width: 25%;}
.w-30 {width: 30%;}
.w-33 {width: 33.33%;}
.w-35 {width: 35%;}
.w-40 {width: 40%;}
.w-45 {width: 45%;}
.w-50 {width: 50%;}
.w-55 {width: 55%;}
.w-60 {width: 60%;}
.w-65 {width: 65%;}
.w-70 {width: 70%;}
.w-75 {width: 75%;}
.w-80 {width: 80%;}
.w-85 {width: 85%;}
.w-90 {width: 90%;}
.w-95 {width: 95%;}
.w-100 {width: 100%;}

/*height*/

.h-5 {height: 5%;}
.h-10 {height: 10%;}
.h-15 {height: 15%;}
.h-20 {height: 20%;}
.h-25 {height: 25%;}
.h-30 {height: 30%;}
.h-33 {height: 33.33%;}
.h-35 {height: 35%;}
.h-40 {height: 40%;}
.h-45 {height: 45%;}
.h-50 {height: 50%;}
.h-55 {height: 55%;}
.h-60 {height: 60%;}
.h-65 {height: 65%;}
.h-70 {height: 70%;}
.h-75 {height: 75%;}
.h-80 {height: 80%;}
.h-85 {height: 85%;}
.h-90 {height: 90%;}
.h-95 {height: 95%;}
.h-100 {height: 100%;}

/*Default Main*/

section.main {
padding: 0 2rem;
}
.inner {
padding: 2rem 0;
}