:root {
  --fallback-font-stack: Helvetica, Arial, serif;
}

.about.main {
  display: flex;
  flex-direction: column;
  row-gap: 0;
  overflow: hidden;
}
.about .responsiveItemsSection {
  min-height: 72px;
}
.about .aboutStoreSection {
  display: flex;
  flex-direction: column;
  background: var(--src) center center/cover no-repeat;
}
.about .infoColumn {
  display: flex;
  flex-direction: column;
  row-gap: 23px;
  margin: 112px 0 139px 4.44%;
  width: 767.9861450195px;
  max-width: 85%;
}
@media (max-width: 575px) {
  .about .infoColumn {
    position: relative;
    margin: 80px 0 80px 4.44%;
  }
}
@media (max-width: 383px) {
  .about .infoColumn {
    margin: 50px 0 50px 4.44%;
  }
}
.about .aboutHeading {
  font: 56px/1.2 Archivo, Helvetica, Arial, serif;
  color: white;
  letter-spacing: -0.56001px;
}
@media (max-width: 991px) {
  .about .aboutHeading {
    align-items: flex-start;
    font-size: 50px;
  }
}
@media (max-width: 479px) {
  .about .aboutHeading {
    font-size: 36px;
  }
}
.about .aboutDescription {
  font: 18px/1.5 Sarabun, Helvetica, Arial, serif;
  color: white;
}
@media (max-width: 991px) {
  .about .aboutDescription {
    align-items: flex-start;
    font-size: 16px;
  }
}
.about .historyMissionVisionSection {
  display: flex;
  flex-direction: column;
  background-color: white;
}
.about .contentContainer {
  display: flex;
  flex-direction: column;
  row-gap: 80px;
  margin: 112px auto;
  width: 91.11%;
  max-width: 1311.9792480469px;
}
@media (max-width: 575px) {
  .about .contentContainer {
    position: relative;
    margin: 80px auto;
  }
}
@media (max-width: 383px) {
  .about .contentContainer {
    row-gap: 50px;
    margin: 50px auto;
  }
}
.about .textBlock {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 32px;
  column-gap: 32px;
}
@media (max-width: 991px) {
  .about .textBlock {
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }
}
.about .historyMissionVisionHeading {
  margin: 0 0 6px;
  width: 616px;
  font: 40px/1.2 Archivo, Helvetica, Arial, serif;
  color: #9a3927;
  letter-spacing: -0.4px;
}
@media (max-width: 991px) {
  .about .historyMissionVisionHeading {
    position: relative;
    align-items: flex-start;
    margin: 0;
    width: 100%;
    font-size: 36px;
  }
}
@media (max-width: 479px) {
  .about .historyMissionVisionHeading {
    font-size: 32px;
  }
}
.about .philosophyDescription {
  width: 616px;
  font: 18px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
}
@media (max-width: 991px) {
  .about .philosophyDescription {
    position: relative;
    align-items: flex-start;
    width: 100%;
    font-size: 16px;
  }
}
.about .philosophyImage {
  width: 100%;
  border-radius: 28px;
  -o-object-fit: cover;
  object-fit: cover;
}
.about .contactInformationSection {
  display: flex;
  flex-direction: column;
  background-color: white;
}
.about .contactInformationWrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  -moz-column-gap: 32px;
  column-gap: 32px;
  margin: 112px auto 148px;
  width: 91.11%;
  max-width: 1311.9792480469px;
}
@media (max-width: 1199px) {
  .about .contactInformationWrapper {
    flex-direction: column;
    gap: 32px;
  }
}
@media (max-width: 575px) {
  .about .contactInformationWrapper {
    position: relative;
    margin: 80px auto;
  }
}
@media (max-width: 383px) {
  .about .contactInformationWrapper {
    margin: 50px auto;
  }
}
.about .emailContactCard {
  display: flex;
  flex-direction: column;
  row-gap: 0;
  width: 405px;
  min-width: 0;
}
@media (max-width: 1199px) {
  .about .emailContactCard {
    position: relative;
    width: 100%;
    min-width: unset;
  }
}
.about .emailIcon {
  width: 48px;
  -o-object-fit: cover;
  object-fit: cover;
}
.about .emailLabel {
  margin: 24px 0 0;
  font: 32px/1.3 Archivo, Helvetica, Arial, serif;
  color: #0b0209;
  letter-spacing: -0.32px;
}
@media (max-width: 991px) {
  .about .emailLabel {
    align-items: flex-start;
    font-size: 30px;
  }
}
@media (max-width: 479px) {
  .about .emailLabel {
    font-size: 26px;
  }
}
.about .emailDescription {
  margin: 16px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
}
.about .emailAddress {
  margin: 24px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
  text-decoration: underline;
}
.about .phoneContactCard {
  display: flex;
  flex-direction: column;
  row-gap: 0;
  margin: 0 0 24px;
  width: 405px;
  min-width: 0;
}
@media (max-width: 1199px) {
  .about .phoneContactCard {
    position: relative;
    margin: 0;
    width: 100%;
    min-width: unset;
  }
}
.about .phoneIcon {
  width: 48px;
  -o-object-fit: cover;
  object-fit: cover;
}
.about .phoneLabel {
  margin: 24px 0 0;
  font: 32px/1.3 Archivo, Helvetica, Arial, serif;
  color: #0b0209;
  letter-spacing: -0.32px;
}
@media (max-width: 991px) {
  .about .phoneLabel {
    align-items: flex-start;
    font-size: 30px;
  }
}
@media (max-width: 479px) {
  .about .phoneLabel {
    font-size: 26px;
  }
}
.about .phoneDescription {
  margin: 16px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
}
.about .phoneNumber {
  margin: 24px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
  text-decoration: underline;
}
.about .officeContactCard {
  display: flex;
  flex-direction: column;
  row-gap: 0;
  margin: 0 0 11px;
  width: 405px;
  min-width: 0;
}
@media (max-width: 1199px) {
  .about .officeContactCard {
    position: relative;
    margin: 0;
    width: 100%;
    min-width: unset;
  }
}
.about .officeIcon {
  width: 48px;
  -o-object-fit: cover;
  object-fit: cover;
}
.about .officeLabel {
  margin: 24px 0 0;
  font: 32px/1.3 Archivo, Helvetica, Arial, serif;
  color: #0b0209;
  letter-spacing: -0.32px;
}
@media (max-width: 991px) {
  .about .officeLabel {
    align-items: flex-start;
    font-size: 30px;
  }
}
@media (max-width: 479px) {
  .about .officeLabel {
    font-size: 26px;
  }
}
.about .officeDescription {
  margin: 16px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
}
.about .officeAddress {
  margin: 24px 0 0;
  font: 16px/1.5 Sarabun, Helvetica, Arial, serif;
  color: #0b0209;
  text-decoration: underline;
}
.about .companyInfoSection {
  min-height: 546px;
}