html {
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100% scroll-behavior: smooth;
}

html {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  min-height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

body {
  margin: 0
}

*, *::before, *::after {
  -moz-box-sizing: inherit;
  box-sizing: inherit
}

:root {
  --primary: #602a73;
  --primary-trans--85: rgba(96, 42, 115, 0.85);
  --primary-trans--75: rgba(96, 42, 115, 0.75);
  --secondary: #c5a434;
  --secondary-medium: #9F852A;
  --accent: #231f20;
  --accent-light: #747474;
  --base: #000;
  --base-trans-30: rgba(0, 0, 0, 0.3);
  --white: #fff;
  --white-medium: #f7f7f7;
  --text-xs: 0.444rem;
  --text-s: 0.667rem;
  --text-m: 1rem;
  --text-l: 1.5rem;
  --text-xl: 2.25rem;
  --text-xxl: 3.375rem;
  --text-large-xs: 0.36rem;
  --text-large-s: 0.6rem;
  --text-large-m: 1rem;
  --text-large-l: 1.667rem;
  --text-large-xl: 2.779rem;
  --text-large-xxl: 4.632rem;
  --space-xs: 0.575rem;
  --space-s: 0.93rem;
  --space-m: 1.505rem;
  --space-l: 2.435rem;
  --space-xl: 3.94rem;
  --space-xxl: 6.375rem;
  --space-extra-large: 17.476rem;
  --icon-xs: 1rem;
  --icon-s: 1.375rem;
  --icon-m: 2rem;
  --icon-l: 3rem;
  --icon-xl: 4rem;
  --icon-xxl: 8rem;
  --radius-xs: 0.27777777775rem;
  --radius-s: 0.4166666666875rem;
  --radius-m: 0.625rem;
  --radius-l: 0.9375rem;
  --radius-xl: 1.40625rem;
  --radius-xxl: 3.125rem;
  --radius-50: 50%;
  --radius-circle: 50%;
}

@media screen and (min-width:1920px) {
  :root {
    --text-xs: calc(1.1 * 0.355555555555556vw);
    --text-s: calc(1.1 * 0.533333333333333vw);
    --text-m: calc(1.1 * 0.8vw);
    --text-l: calc(1.1 * 1.2vw);
    --text-xl: calc(1.1 * 1.8vw);
    --text-xxl: calc(1.1 * 2.7vw);
    --text-large-xs: calc(1.1 * 0.287884834550786vw);
    --text-large-s: calc(1.1 * 0.479904019196161vw);
    --text-large-m: calc(1.1 * 0.8vw);
    --text-large-l: calc(1.1 * 1.3336vw);
    --text-large-xl: calc(1.1 * 2.2231112vw);
    --text-large-xxl: calc(1.1 * 3.7059263704vw);
    --space-xs: calc(1.1 * 0.479078142117884vw);
    --space-s: calc(1.1 * 0.775148433946736vw);
    --space-m: calc(1.1 * 1.25419016612582vw);
    --space-l: calc(1.1 * 2.02927968879158vw);
    --space-xl: calc(1.1 * 3.28337453646477vw);
    --space-xxl: calc(1.1 * 5.3125vw);
    --space-extra-large: calc(1.1 * 13.9808984375vw);
    --icon-xs: 0.833333333333333vw;
    --icon-s: 1.14583333333333vw;
    --icon-m: 1.66666666666667vw;
    --icon-l: 2.5vw;
    --icon-xl: 3.33333333333333vw;
    --icon-xxl: 6.66666666666667vw;
    --radius-xs: 0.35555555552vw;
    --radius-s: 0.53333333336vw;
    --radius-m: 0.8vw;
    --radius-l: 1.2vw;
    --radius-xl: 1.8vw;
    --radius-xxl: 2.7vw;
  }
}

@media screen and (max-width:1920px) {
  :root {
    --text-large-xs: clamp(0.36rem, calc(0.36rem + ((1vw - 0.2rem) * 0.2019)), 0.492rem);
    --text-large-s: clamp(0.656rem, calc(0.656rem + ((1vw - 0.2rem) * -0.0857)), 0.6rem);
    --text-large-m: clamp(0.875rem, calc(0.875rem + ((1vw - 0.2rem) * 0.1912)), 1rem);
    --text-large-l: clamp(1.166rem, calc(1.166rem + ((1vw - 0.2rem) * 0.7663)), 1.667rem);
    --text-large-xl: clamp(1.555rem, calc(1.555rem + ((1vw - 0.2rem) * 1.8723)), 2.779rem);
    --text-large-xxl: clamp(2.073rem, calc(2.073rem + ((1vw - 0.2rem) * 3.9143)), 4.632rem);
    --space-extra-large: clamp(6.97rem, calc(6.97rem + ((1vw - 0.85375rem) * 30.342)), 17.476rem);
  }
}

@media screen and (max-width:1366px) {
  :root {
    --text-xs: clamp(0.492rem, calc(0.492rem + ((1vw - 0.2rem) * -0.0734)), 0.444rem);
    --text-s: clamp(0.656rem, calc(0.656rem + ((1vw - 0.2rem) * 0.0168)), 0.667rem);
    --text-m: clamp(0.875rem, calc(0.875rem + ((1vw - 0.2rem) * 0.1912)), 1rem);
    --text-l: clamp(1.166rem, calc(1.166rem + ((1vw - 0.2rem) * 0.5109)), 1.5rem);
    --text-xl: clamp(1.555rem, calc(1.555rem + ((1vw - 0.2rem) * 1.0631)), 2.25rem);
    --text-xxl: clamp(2.073rem, calc(2.073rem + ((1vw - 0.2rem) * 1.9916)), 3.375rem);
    --space-xs: clamp(0.477rem, calc(0.477rem + ((1vw - 0.2rem) * 0.1499)), 0.575rem);
    --space-s: clamp(0.773rem, calc(0.773rem + ((1vw - 0.2rem) * 0.2402)), 0.93rem);
    --space-m: clamp(1.25rem, calc(1.25rem + ((1vw - 0.2rem) * 0.3901)), 1.505rem);
    --space-l: clamp(2.023rem, calc(2.023rem + ((1vw - 0.2rem) * 0.6302)), 2.435rem);
    --space-xl: clamp(3.272rem, calc(3.272rem + ((1vw - 0.2rem) * 1.0218)), 3.94rem);
    --space-xxl: clamp(6.375rem, calc(6.375rem + ((1vw - 0.2rem) * -1.652)), 5.295rem);
    --icon-xs: clamp(0.446rem, calc(0.446rem + ((1vw - 0.2rem) * 1.2591)), 1rem);
    --icon-s: clamp(0.721rem, calc(0.721rem + ((1vw - 0.2rem) * 1.4864)), 1.375rem);
    --icon-m: clamp(1.167rem, calc(1.167rem + ((1vw - 0.2rem) * 1.8932)), 2rem);
    --icon-l: clamp(1.889rem, calc(1.889rem + ((1vw - 0.2rem) * 2.525)), 3rem);
    --icon-xl: clamp(3.056rem, calc(3.056rem + ((1vw - 0.2rem) * 2.1455)), 4rem);
    --icon-xxl: clamp(4.944rem, calc(4.944rem + ((1vw - 0.2rem) * 6.9455)), 8rem);
  }
}

body, html {
  -webkit-overflow-scrolling: touch;
  margin: 0;
  padding: 0;
  font-style: normal;
  font-weight: 400
}

body {
  color: var(--base);
  font-size: var(--text-m);
  line-height: 1.6;
  font-weight: 300;
}

body a {
  color: var(--secondary);
  font-weight: 400;
  -webkit-text-decoration: none;
  text-decoration: underline;
  transition: 0.3s ease-in-out;
}

body a:hover {
  color: var(--secondary-medium);
  text-decoration: underline;
}

.img {
  width: 100%;
  height: auto;
}

.pointer {
  cursor: pointer;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  text-decoration: inherit;
  line-height: 1.1;
  color: var(--primary);
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit;
  text-decoration: inherit;
  line-height: 1.1;
  transition: 0.3s ease-in-out;
}

h1 {
  font-size: 3.375rem;
  font-size: var(--text-xxl);
}

h2 {
  font-size: 2.25rem;
  font-size: var(--text-xl);
}

h3 {
  font-size: 1.5rem;
  font-size: var(--text-l);
}

h4 {
  font-size: 1rem;
  font-size: var(--text-m);
}

h5 {
  font-size: 0.667rem;
  font-size: var(--text-s);
}

h6 {
  font-size: 0.444rem;
  font-size: var(--text-xs);
}

/* colors */
.bg--primary {
  background-color: var(--primary);
}

.bg--secondary {
  background-color: var(--secondary);
}

.bg--accent {
  background-color: var(--accent);
}

.bg--accent-light {
  background-color: var(--accent-light);
}

.bg--base {
  background-color: var(--base);
}

.bg--white {
  background-color: var(--white);
}

.overlay--primary-trans-75 {
  position: relative;
  z-index: 0;
}

.overlay--primary-trans-75::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-color: var(--primary-trans--75);
}

.overlay--base-trans-30 {
  position: relative;
  z-index: 0;
}

.overlay--base-trans-30::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-color: var(--base-trans-30);
}

/* text */
.text--xs {
  font-size: var(--text-xs)
}

.text--s {
  font-size: var(--text-s)
}

.text--m {
  font-size: var(--text-m)
}

.text--l {
  font-size: var(--text-l)
}

.text--xl {
  font-size: var(--text-xl)
}

.text--xxl {
  font-size: var(--text-xxl)
}

.text--large-xs {
  font-size: var(--text-large-xs);
}

.text--large-s {
  font-size: var(--text-large-s);
}

.text--large-m {
  font-size: var(--text-large-m);
}

.text--large-l {
  font-size: var(--text-large-l);
}

.text--large-xl {
  font-size: var(--text-large-xl);
}

.text--large-xxl {
  font-size: var(--text-large-xxl);
}

.text--100 {
  font-weight: 100;
}

.text--200 {
  font-weight: 200;
}

.text--300 {
  font-weight: 300;
}

.text--400 {
  font-weight: 400;
}

.text--500 {
  font-weight: 500;
}

.text--600 {
  font-weight: 600;
}

.text--700 {
  font-weight: 700;
}

.text--800 {
  font-weight: 800;
}

.text--900 {
  font-weight: 900;
}

.text--bold {
  font-weight: bold;
}

.text--italic {
  font-style: italic;
}

.text--oblique {
  font-style: oblique;
}

.text-line-height--none {
  line-height: 0;
}

.text--decoration-none {
  -webkit-text-decoration: none;
  text-decoration: none;
}

.text--underline {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.text--underline-wavy {
  -webkit-text-decoration: underline wavy;
  text-decoration: underline wavy;
}

.text--underline-dotted {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

.text--underline-double {
  -webkit-text-decoration: underline double;
  text-decoration: underline double;
}

.text--underline-dashed {
  -webkit-text-decoration: underline dashed;
  text-decoration: underline dashed;
}

.text--overline {
  -webkit-text-decoration: overline;
  text-decoration: overline;
}

.text--line-through {
  -webkit-text-decoration: line-through;
  text-decoration: line-through;
}

.text--transform-none {
  text-transform: none;
}

.text--uppercase {
  text-transform: uppercase;
}

.text--lowercase {
  text-transform: lowercase;
}

.text--capitalize {
  text-transform: capitalize;
}

.text--left {
  text-align: left;
}

.text--center {
  text-align: center;
}

.text--right {
  text-align: right;
}

.text--justify {
  text-align: justify;
}

.text--primary {
  color: var(--primary);
}

.text--secondary {
  color: var(--secondary);
}

.text--accent {
  color: var(--accent);
}

.text--accent-light {
  color: var(--accent-light);
}

.text--white {
  color: var(--white);
}

.text--white-medium {
  color: var(--white-medium);
}

.link--white a, a.link--white {
  color: var(--white);
  text-decoration: none;
}

.link--white a:hover, a.link--white:hover {
  color: var(--secondary-medium);
  text-decoration: none;
}

.link--base a, a.link--base {
  color: var(--base);
  text-decoration: none;
}

.link--base a:hover, a.link--base:hover {
  color: var(--secondary-medium);
  text-decoration: none;
}

.link--accent-light a, a.link--accent-light {
  color: var(--accent-light);
  text-decoration: none;
}

.link--accent-light a:hover, a.link--accent-light:hover {
  color: var(--accent-light);
  text-decoration: none;
}

/* section & column */
.pad--xs {
  padding: var(--space-xs);
}

.pad--s {
  padding: var(--space-s);
}

.pad--m {
  padding: var(--space-m);
}

.pad--l {
  padding: var(--space-l);
}

.pad--xl {
  padding: var(--space-xl);
}

.pad--xxl {
  padding: var(--space-xxl);
}

.pad-left--xs {
  padding-left: var(--space-xs);
}

.pad-right--xs {
  padding-right: var(--space-xs);
}

.pad-top--xs {
  padding-top: var(--space-xs);
}

.pad-bottom--xs {
  padding-bottom: var(--space-xs);
}

.pad-left--s {
  padding-left: var(--space-s);
}

.pad-right--s {
  padding-right: var(--space-s);
}

.pad-top--s {
  padding-top: var(--space-s);
}

.pad-bottom--s {
  padding-bottom: var(--space-s);
}

.pad-left--m {
  padding-left: var(--space-m);
}

.pad-right--m {
  padding-right: var(--space-m);
}

.pad-top--m {
  padding-top: var(--space-m);
}

.pad-bottom--m {
  padding-bottom: var(--space-m);
}

.pad-left--l {
  padding-left: var(--space-l);
}

.pad-right--l {
  padding-right: var(--space-l);
}

.pad-top--l {
  padding-top: var(--space-l);
}

.pad-bottom--l {
  padding-bottom: var(--space-l);
}

.pad-left--xl {
  padding-left: var(--space-xl);
}

.pad-right--xl {
  padding-right: var(--space-xl);
}

.pad-top--xl {
  padding-top: var(--space-xl);
}

.pad-bottom--xl {
  padding-bottom: var(--space-xl);
}

.pad-left--xxl {
  padding-left: var(--space-xxl);
}

.pad-right--xxl {
  padding-right: var(--space-xxl);
}

.pad-top--xxl {
  padding-top: var(--space-xxl);
}

.pad-bottom--xxl {
  padding-bottom: var(--space-xxl);
}

.owl--xs>*+* {
  margin-top: var(--space-xs);
}

.owl--s>*+* {
  margin-top: var(--space-s);
}

.owl--m>*+* {
  margin-top: var(--space-m);
}

.owl--l>*+* {
  margin-top: var(--space-l);
}

.owl--xl>*+* {
  margin-top: var(--space-xl);
}

.owl--xxl>*+* {
  margin-top: var(--space-xxl);
}

.margin-left--xs {
  margin-left: var(--space-xs);
}

.margin-right--xs {
  margin-right: var(--space-xs);
}

.margin-top--xs {
  margin-top: var(--space-xs);
}

.margin-bottom--xs {
  margin-bottom: var(--space-xs);
}

.margin-left--s {
  margin-left: var(--space-s);
}

.margin-right--s {
  margin-right: var(--space-s);
}

.margin-top--s {
  margin-top: var(--space-s);
}

.margin-bottom--s {
  margin-bottom: var(--space-s);
}

.margin-left--m {
  margin-left: var(--space-m);
}

.margin-right--m {
  margin-right: var(--space-m);
}

.margin-top--m {
  margin-top: var(--space-m);
}

.margin-bottom--m {
  margin-bottom: var(--space-m);
}

.margin-left--l {
  margin-left: var(--space-l);
}

.margin-right--l {
  margin-right: var(--space-l);
}

.margin-top--l {
  margin-top: var(--space-l);
}

.margin-bottom--l {
  margin-bottom: var(--space-l);
}

.margin-left--xl {
  margin-left: var(--space-xl);
}

.margin-right--xl {
  margin-right: var(--space-xl);
}

.margin-top--xl {
  margin-top: var(--space-xl);
}

.margin-bottom--xl {
  margin-bottom: var(--space-xl);
}

.margin-left--xxl {
  margin-left: var(--space-xxl);
}

.margin-right--xxl {
  margin-right: var(--space-xxl);
}

.margin-top--xxl {
  margin-top: var(--space-xxl);
}

.margin-bottom--xxl {
  margin-bottom: var(--space-xxl);
}

.gap--xs {
  gap: var(--space-xs);
}

.gap--s {
  gap: var(--space-s);
}

.gap--m {
  gap: var(--space-m);
}

.gap--l {
  gap: var(--space-l);
}

.gap--xl {
  gap: var(--space-xl);
}

.gap--xxl {
  gap: var(--space-xxl);
}

@media (max-width: 992px) {
  .pad--l-xs {
    padding-left: var(--space-xs);
  }

  .pad--l-s {
    padding-left: var(--space-s);
  }

  .pad--l-m {
    padding-left: var(--space-m);
  }

  .pad--l-l {
    padding-left: var(--space-l);
  }

  .pad--l-xl {
    padding-left: var(--space-xl);
  }

  .pad--l-xxl {
    padding-left: var(--space-xxl);
  }

  .pad-left--l-xs {
    padding-left: var(--space-xs);
  }

  .pad-right--l-xs {
    padding-right: var(--space-xs);
  }

  .pad-top--l-xs {
    padding-top: var(--space-xs);
  }

  .pad-bottom--l-xs {
    padding-bottom: var(--space-xs);
  }

  .pad-left--l-s {
    padding-left: var(--space-s);
  }

  .pad-right--l-s {
    padding-right: var(--space-s);
  }

  .pad-top--l-s {
    padding-top: var(--space-s);
  }

  .pad-bottom--l-s {
    padding-bottom: var(--space-s);
  }

  .pad-left--l-m {
    padding-left: var(--space-m);
  }

  .pad-right--l-m {
    padding-right: var(--space-m);
  }

  .pad-top--l-m {
    padding-top: var(--space-m);
  }

  .pad-bottom--l-m {
    padding-bottom: var(--space-m);
  }

  .pad-left--l-l {
    padding-left: var(--space-l);
  }

  .pad-right--l-l {
    padding-right: var(--space-l);
  }

  .pad-top--l-l {
    padding-top: var(--space-l);
  }

  .pad-bottom--l-l {
    padding-bottom: var(--space-l);
  }

  .pad-left--l-xl {
    padding-left: var(--space-xl);
  }

  .pad-right--l-xl {
    padding-right: var(--space-xl);
  }

  .pad-top--l-xl {
    padding-top: var(--space-xl);
  }

  .pad-bottom--l-xl {
    padding-bottom: var(--space-xl);
  }

  .pad-left--l-xxl {
    padding-left: var(--space-xxl);
  }

  .pad-right--l-xxl {
    padding-right: var(--space-xxl);
  }

  .pad-top--l-xxl {
    padding-top: var(--space-xxl);
  }

  .pad-bottom--l-xxl {
    padding-bottom: var(--space-xxl);
  }

  .pad-left--l-none {
    padding-left: 0px;
  }

  .pad-right--l-none {
    padding-right: 0px;
  }

  .pad-top--l-none {
    padding-top: 0px;
  }

  .pad-bottom--l-none {
    padding-bottom: 0px;
  }

  .margin-left--l-none {
    margin-left: 0px;
  }

  .margin-right--l-none {
    margin-right: 0px;
  }

  .margin-top--l-none {
    margin-top: 0px;
  }

  .margin-bottom--l-none {
    margin-bottom: 0px;
  }

  .margin-left--l-xs {
    margin-left: var(--space-xs);
  }

  .margin-right--l-xs {
    margin-right: var(--space-xs);
  }

  .margin-top--l-xs {
    margin-top: var(--space-xs);
  }

  .margin-bottom--l-xs {
    margin-bottom: var(--space-xs);
  }

  .margin-left--l-s {
    margin-left: var(--space-s);
  }

  .margin-right--l-s {
    margin-right: var(--space-s);
  }

  .margin-top--l-s {
    margin-top: var(--space-s);
  }

  .margin-bottom--l-s {
    margin-bottom: var(--space-s);
  }

  .margin-left--l-m {
    margin-left: var(--space-m);
  }

  .margin-right--l-m {
    margin-right: var(--space-m);
  }

  .margin-top--l-m {
    margin-top: var(--space-m);
  }

  .margin-bottom--l-m {
    margin-bottom: var(--space-m);
  }

  .margin-left--l-l {
    margin-left: var(--space-l);
  }

  .margin-right--l-l {
    margin-right: var(--space-l);
  }

  .margin-top--l-l {
    margin-top: var(--space-l);
  }

  .margin-bottom--l-l {
    margin-bottom: var(--space-l);
  }

  .margin-left--l-xl {
    padding-left: var(--space-xl);
  }

  .margin-right--l-xl {
    margin-right: var(--space-xl);
  }

  .margin-top--l-xl {
    margin-top: var(--space-xl);
  }

  .margin-bottom--l-xl {
    margin-bottom: var(--space-xl);
  }

  .margin-left--l-xxl {
    margin-left: var(--space-xxl);
  }

  .margin-right--l-xxl {
    margin-right: var(--space-xxl);
  }

  .margin-top--l-xxl {
    margin-top: var(--space-xxl);
  }

  .margin-bottom--l-xxl {
    margin-bottom: var(--space-xxl);
  }

  .gap--l-none {
    gap: 0px;
  }

  .gap--l-xs {
    gap: var(--space-xs);
  }

  .gap--l-s {
    gap: var(--space-s);
  }

  .gap--l-m {
    gap: var(--space-m);
  }

  .gap--l-l {
    gap: var(--space-l);
  }

  .gap--l-xl {
    gap: var(--space-xl);
  }

  .gap--l-xxl {
    gap: var(--space-xxl);
  }
}

@media (max-width: 768px) {
  .pad--m-xs {
    padding: var(--space-xs);
  }

  .pad--m-s {
    padding: var(--space-s);
  }

  .pad--m-m {
    padding: var(--space-m);
  }

  .pad--m-l {
    padding: var(--space-l);
  }

  .pad--m-xl {
    padding: var(--space-xl);
  }

  .pad--m-xxl {
    padding: var(--space-xxl);
  }

  .pad-left--m-xs {
    padding-left: var(--space-xs);
  }

  .pad-right--m-xs {
    padding-right: var(--space-xs);
  }

  .pad-top--m-xs {
    padding-top: var(--space-xs);
  }

  .pad-bottom--m-xs {
    padding-bottom: var(--space-xs);
  }

  .pad-left--m-s {
    padding-left: var(--space-s);
  }

  .pad-right--m-s {
    padding-right: var(--space-s);
  }

  .pad-top--m-s {
    padding-top: var(--space-s);
  }

  .pad-bottom--m-s {
    padding-bottom: var(--space-s);
  }

  .pad-left--m-m {
    padding-left: var(--space-m);
  }

  .pad-right--m-m {
    padding-right: var(--space-m);
  }

  .pad-top--m-m {
    padding-top: var(--space-m);
  }

  .pad-bottom--m-m {
    padding-bottom: var(--space-m);
  }

  .pad-left--m-l {
    padding-left: var(--space-l);
  }

  .pad-right--m-l {
    padding-right: var(--space-l);
  }

  .pad-top--m-l {
    padding-top: var(--space-l);
  }

  .pad-bottom--m-l {
    padding-bottom: var(--space-l);
  }

  .pad-left--m-xl {
    padding-left: var(--space-xl);
  }

  .pad-right--m-xl {
    padding-right: var(--space-xl);
  }

  .pad-top--m-xl {
    padding-top: var(--space-xl);
  }

  .pad-bottom--m-xl {
    padding-bottom: var(--space-xl);
  }

  .pad-left--m-xxl {
    padding-left: var(--space-xxl);
  }

  .pad-right--m-xxl {
    padding-right: var(--space-xxl);
  }

  .pad-top--m-xxl {
    padding-top: var(--space-xxl);
  }

  .pad-bottom--m-xxl {
    padding-bottom: var(--space-xxl);
  }

  .pad-left--m-none {
    padding-left: 0px;
  }

  .pad-right--m-none {
    padding-right: 0px;
  }

  .pad-top--m-none {
    padding-top: 0px;
  }

  .pad-bottom--m-none {
    padding-bottom: 0px;
  }

  .margin-left--m-none {
    margin-left: 0px;
  }

  .margin-right--m-none {
    margin-right: 0px;
  }

  .margin-top--m-none {
    margin-top: 0px;
  }

  .margin-bottom--m-none {
    margin-bottom: 0px;
  }

  .margin-left--m-xs {
    margin-left: var(--space-xs);
  }

  .margin-right--m-xs {
    margin-right: var(--space-xs);
  }

  .margin-top--m-xs {
    margin-top: var(--space-xs);
  }

  .margin-bottom--m-xs {
    margin-bottom: var(--space-xs);
  }

  .margin-left--m-s {
    margin-left: var(--space-s);
  }

  .margin-right--m-s {
    margin-right: var(--space-s);
  }

  .margin-top--m-s {
    margin-top: var(--space-s);
  }

  .margin-bottom--m-s {
    margin-bottom: var(--space-s);
  }

  .margin-left--m-m {
    margin-left: var(--space-m);
  }

  .margin-right--m-m {
    margin-right: var(--space-m);
  }

  .margin-top--m-m {
    margin-top: var(--space-m);
  }

  .margin-bottom--m-m {
    margin-bottom: var(--space-m);
  }

  .margin-left--m-l {
    margin-left: var(--space-l);
  }

  .margin-right--m-l {
    margin-right: var(--space-l);
  }

  .margin-top--m-l {
    margin-top: var(--space-l);
  }

  .margin-bottom--m-l {
    margin-bottom: var(--space-l);
  }

  .margin-left--m-xl {
    padding-left: var(--space-xl);
  }

  .margin-right--m-xl {
    margin-right: var(--space-xl);
  }

  .margin-top--m-xl {
    margin-top: var(--space-xl);
  }

  .margin-bottom--m-xl {
    margin-bottom: var(--space-xl);
  }

  .margin-left--m-xxl {
    margin-left: var(--space-xxl);
  }

  .margin-right--m-xxl {
    margin-right: var(--space-xxl);
  }

  .margin-top--m-xxl {
    margin-top: var(--space-xxl);
  }

  .margin-bottom--m-xxl {
    margin-bottom: var(--space-xxl);
  }

  .gap--m-none {
    gap: 0px;
  }

  .gap--m-xs {
    gap: var(--space-xs);
  }

  .gap--m-s {
    gap: var(--space-s);
  }

  .gap--m-m {
    gap: var(--space-m);
  }

  .gap--m-l {
    gap: var(--space-l);
  }

  .gap--m-xl {
    gap: var(--space-xl);
  }

  .gap--m-xxl {
    gap: var(--space-xxl);
  }
}

@media (max-width: 480px) {
  .pad--s-xs {
    padding-left: var(--space-xs);
  }

  .pad--s-s {
    padding-left: var(--space-s);
  }

  .pad--s-m {
    padding-left: var(--space-m);
  }

  .pad--s-l {
    padding-left: var(--space-l);
  }

  .pad--s-xl {
    padding-left: var(--space-xl);
  }

  .pad--s-xxl {
    padding-left: var(--space-xxl);
  }

  .pad-left--s-xs {
    padding-left: var(--space-xs);
  }

  .pad-right--s-xs {
    padding-right: var(--space-xs);
  }

  .pad-top--xs {
    padding-top: var(--space-xs);
  }

  .pad-bottom--s-xs {
    padding-bottom: var(--space-xs);
  }

  .pad-left--s-s {
    padding-left: var(--space-s);
  }

  .pad-right--s-s {
    padding-right: var(--space-s);
  }

  .pad-top--s-s {
    padding-top: var(--space-s);
  }

  .pad-bottom--s-s {
    padding-bottom: var(--space-s);
  }

  .pad-left--s-m {
    padding-left: var(--space-m);
  }

  .pad-right--s-m {
    padding-right: var(--space-m);
  }

  .pad-top--s-m {
    padding-top: var(--space-m);
  }

  .pad-bottom--s-m {
    padding-bottom: var(--space-m);
  }

  .pad-left--s-l {
    padding-left: var(--space-l);
  }

  .pad-right--s-l {
    padding-right: var(--space-l);
  }

  .pad-top--s-l {
    padding-top: var(--space-l);
  }

  .pad-bottom--s-l {
    padding-bottom: var(--space-l);
  }

  .pad-left--s-xl {
    padding-left: var(--space-xl);
  }

  .pad-right--xl {
    padding-right: var(--space-xl);
  }

  .pad-top--s-xl {
    padding-top: var(--space-xl);
  }

  .pad-bottom--s-xl {
    padding-bottom: var(--space-xl);
  }

  .pad-left--s-xxl {
    padding-left: var(--space-xxl);
  }

  .pad-right--s-xxl {
    padding-right: var(--space-xxl);
  }

  .pad-top--s-xxl {
    padding-top: var(--space-xxl);
  }

  .pad-bottom--s-xxl {
    padding-bottom: var(--space-xxl);
  }

  .pad-left--s-none {
    padding-left: 0px;
  }

  .pad-right--s-none {
    padding-right: 0px;
  }

  .pad-top--s-none {
    padding-top: 0px;
  }

  .pad-bottom--s-none {
    padding-bottom: 0px;
  }

  .margin-left--s-none {
    margin-left: 0px;
  }

  .margin-right--s-none {
    margin-right: 0px;
  }

  .margin-top--s-none {
    margin-top: 0px;
  }

  .margin-bottom--s-none {
    margin-bottom: 0px;
  }

  .margin-left--s-xs {
    margin-left: var(--space-xs);
  }

  .margin-right--s-xs {
    margin-right: var(--space-xs);
  }

  .margin-top--s-xs {
    margin-top: var(--space-xs);
  }

  .margin-bottom--s-xs {
    margin-bottom: var(--space-xs);
  }

  .margin-left--s-s {
    margin-left: var(--space-s);
  }

  .margin-right--s-s {
    margin-right: var(--space-s);
  }

  .margin-top--s-s {
    margin-top: var(--space-s);
  }

  .margin-bottom--s-s {
    margin-bottom: var(--space-s);
  }

  .margin-left--s-m {
    margin-left: var(--space-m);
  }

  .margin-right--s-m {
    margin-right: var(--space-m);
  }

  .margin-top--s-m {
    margin-top: var(--space-m);
  }

  .margin-bottom--s-m {
    margin-bottom: var(--space-m);
  }

  .margin-left--s-l {
    margin-left: var(--space-l);
  }

  .margin-right--s-l {
    margin-right: var(--space-l);
  }

  .margin-top--s-l {
    margin-top: var(--space-l);
  }

  .margin-bottom--s-l {
    margin-bottom: var(--space-l);
  }

  .margin-left--s-xl {
    padding-left: var(--space-xl);
  }

  .margin-right--s-xl {
    margin-right: var(--space-xl);
  }

  .margin-top--s-xl {
    margin-top: var(--space-xl);
  }

  .margin-bottom--s-xl {
    margin-bottom: var(--space-xl);
  }

  .margin-left--s-xxl {
    margin-left: var(--space-xxl);
  }

  .margin-right--s-xxl {
    margin-right: var(--space-xxl);
  }

  .margin-top--s-xxl {
    margin-top: var(--space-xxl);
  }

  .margin-bottom--s-xxl {
    margin-bottom: var(--space-xxl);
  }

  .gap--s-none {
    gap: 0px;
  }

  .gap--s-xs {
    gap: var(--space-xs);
  }

  .gap--s-s {
    gap: var(--space-s);
  }

  .gap--s-m {
    gap: var(--space-m);
  }

  .gap--s-l {
    gap: var(--space-l);
  }

  .gap--s-xl {
    gap: var(--space-xl);
  }

  .gap--s-xxl {
    gap: var(--space-xxl);
  }
}

/* border */
.rounded--xs {
  border-radius: 0.4444444444rem;
}

.rounded--s {
  border-radius: 0.6666666667rem;
}

.rounded--m {
  border-radius: 1rem;
}

.rounded--l {
  border-radius: 1.5rem;
}

.rounded--xl {
  border-radius: 2.25rem;
}

.rounded--xxl {
  border-radius: 3.375rem;
}

.rounded--50 {
  border-radius: 50%;
}

.rounded--circle {
  border-radius: 50%;
}

.border--xs {
  border: 1px solid;
}

.border--s {
  border: 2px solid;
}

.border--m {
  border: 3px solid;
}

.border--l {
  border: 4px solid;
}

.border--xl {
  border: 5px solid;
}

.border--xxl {
  border: 6px solid;
}

.border-top--xs {
  border-top: 1px solid;
}

.border-top--s {
  border-top: 2px solid;
}

.border-top--m {
  border-top: 3px solid;
}

.border-top--l {
  border-top: 4px solid;
}

.border-top--xl {
  border-top: 5px solid;
}

.border-top--xxl {
  border-top: 6px solid;
}

.border-bottom--xs {
  border-bottom: 1px solid;
}

.border-bottom--s {
  border-bottom: 2px solid;
}

.border-bottom--m {
  border-bottom: 3px solid;
}

.border-bottom--l {
  border-bottom: 4px solid;
}

.border-bottom--xl {
  border-bottom: 5px solid;
}

.border-bottom--xxl {
  border-bottom: 6px solid;
}

.border-left--xs {
  border-left: 1px solid;
}

.border-left--s {
  border-left: 2px solid;
}

.border-left--m {
  border-left: 3px solid;
}

.border-left--l {
  border-left: 4px solid;
}

.border-left--xl {
  border-left: 5px solid;
}

.border-left--xxl {
  border-left: 6px solid;
}

.border-right--xs {
  border-right: 1px solid;
}

.border-right--s {
  border-right: 2px solid;
}

.border-right--m {
  border-right: 3px solid;
}

.border-right--l {
  border-right: 4px solid;
}

.border-right--xl {
  border-right: 5px solid;
}

.border-right--xxl {
  border-right: 6px solid;
}

.border--primary {
  border-color: var(--primary);
}

.border--secondary {
  border-color: var(--secondary);
}

.border--secondary-light {
  border-color: var(--secondary-light);
}

.border--accent {
  border-color: var(--accent);
}

.border--base {
  border-color: var(--base);
}

.border--shade {
  border-color: var(--shade);
}

.border--black {
  border-color: var(--black);
}

.border--white {
  border-color: var(--white);
}

@media (max-width: 992px) {
  .border--l-none {
    border: 0;
  }

  .border-top-l-none {
    border-top: 0;
  }

  .border-bottom-l-none {
    border-bottom: 0;
  }

  .border-right-l-none {
    border-right: 0;
  }

  .border-left-l-none {
    border-left: 0;
  }

  .border-top--l-xs {
    border: 1px solid;
  }

  .border-top--l-s {
    border-top: 2px solid;
  }

  .border-top--l-m {
    border-top: 3px solid;
  }

  .border-top--l-l {
    border-top: 4px solid;
  }

  .border-top--l-xl {
    border-top: 5px solid;
  }

  .border-top--l-xxl {
    border-top: 6px solid;
  }

  .border-bottom--l-xs {
    border-bottom: 1px solid;
  }

  .border-bottom--l-s {
    border-bottom: 2px solid;
  }

  .border-bottom--l-m {
    border-bottom: 3px solid;
  }

  .border-bottom--l-l {
    border-bottom: 4px solid;
  }

  .border-bottom--l-xl {
    border-bottom: 5px solid;
  }

  .border-bottom--l-xxl {
    border-bottom: 6px solid;
  }

  .border-left--l-xs {
    border-left: 1px solid;
  }

  .border-left--l-s {
    border-left: 2px solid;
  }

  .border-left--l-m {
    border-left: 3px solid;
  }

  .border-left--l-l {
    border-left: 4px solid;
  }

  .border-left--l-xl {
    border-left: 5px solid;
  }

  .border-left--l-xxl {
    border-left: 6px solid;
  }

  .border-right--l-xs {
    border-right: 1px solid;
  }

  .border-right--l-s {
    border-right: 2px solid;
  }

  .border-right--l-m {
    border-right: 3px solid;
  }

  .border-right--l-l {
    border-right: 4px solid;
  }

  .border-right--l-xl {
    border-right: 5px solid;
  }

  .border-right--l-xxl {
    border-right: 6px solid;
  }
}

@media (max-width: 768px) {
  .border--m-none {
    border: 0;
  }

  .border-top-m-none {
    border-top: 0;
  }

  .border-bottom-m-none {
    border-bottom: 0;
  }

  .border-right-m-none {
    border-right: 0;
  }

  .border-left-m-none {
    border-left: 0;
  }

  .border-top--m-xs {
    border: 1px solid;
  }

  .border-top--m-s {
    border-top: 2px solid;
  }

  .border-top--m-m {
    border-top: 3px solid;
  }

  .border-top--m-l {
    border-top: 4px solid;
  }

  .border-top--m-xl {
    border-top: 5px solid;
  }

  .border-top--m-xxl {
    border-top: 6px solid;
  }

  .border-bottom--m-xs {
    border-bottom: 1px solid;
  }

  .border-bottom--m-s {
    border-bottom: 2px solid;
  }

  .border-bottom--m-m {
    border-bottom: 3px solid;
  }

  .border-bottom--m-l {
    border-bottom: 4px solid;
  }

  .border-bottom--m-xl {
    border-bottom: 5px solid;
  }

  .border-bottom--m-xxl {
    border-bottom: 6px solid;
  }

  .border-left--m-xs {
    border-left: 1px solid;
  }

  .border-left--m-s {
    border-left: 2px solid;
  }

  .border-left--m-m {
    border-left: 3px solid;
  }

  .border-left--m-l {
    border-left: 4px solid;
  }

  .border-left--m-xl {
    border-left: 5px solid;
  }

  .border-left--m-xxl {
    border-left: 6px solid;
  }

  .border-right--m-xs {
    border-right: 1px solid;
  }

  .border-right--m-s {
    border-right: 2px solid;
  }

  .border-right--m-m {
    border-right: 3px solid;
  }

  .border-right--m-l {
    border-right: 4px solid;
  }

  .border-right--m-xl {
    border-right: 5px solid;
  }

  .border-right--m-xxl {
    border-right: 6px solid;
  }
}

@media (max-width: 480px) {
  .border--s-none {
    border: 0;
  }

  .border-top-s-none {
    border-top: 0;
  }

  .border-bottom-s-none {
    border-bottom: 0;
  }

  .border-right-s-none {
    border-right: 0;
  }

  .border-left-s-none {
    border-left: 0;
  }

  .border-top--s-xs {
    border: 1px solid;
  }

  .border-top--s-s {
    border-top: 2px solid;
  }

  .border-top--s-m {
    border-top: 3px solid;
  }

  .border-top--s-l {
    border-top: 4px solid;
  }

  .border-top--s-xl {
    border-top: 5px solid;
  }

  .border-top--s-xxl {
    border-top: 6px solid;
  }

  .border-bottom--s-xs {
    border-bottom: 1px solid;
  }

  .border-bottom--s-s {
    border-bottom: 2px solid;
  }

  .border-bottom--s-m {
    border-bottom: 3px solid;
  }

  .border-bottom--s-l {
    border-bottom: 4px solid;
  }

  .border-bottom--s-xl {
    border-bottom: 5px solid;
  }

  .border-bottom--s-xxl {
    border-bottom: 6px solid;
  }

  .border-left--s-xs {
    border-left: 1px solid;
  }

  .border-left--s-s {
    border-left: 2px solid;
  }

  .border-left--s-m {
    border-left: 3px solid;
  }

  .border-left--s-l {
    border-left: 4px solid;
  }

  .border-left--s-xl {
    border-left: 5px solid;
  }

  .border-left--s-xxl {
    border-left: 6px solid;
  }

  .border-right--s-xs {
    border-right: 1px solid;
  }

  .border-right--s-s {
    border-right: 2px solid;
  }

  .border-right--s-m {
    border-right: 3px solid;
  }

  .border-right--s-l {
    border-right: 4px solid;
  }

  .border-right--s-xl {
    border-right: 5px solid;
  }

  .border-right--s-xxl {
    border-right: 6px solid;
  }
}

/* icon */
.icon--xs>svg {
  width: var(--icon-xs);
  height: var(--icon-xs);
}

.icon--s>svg {
  width: var(--icon-s);
  height: var(--icon-s);
}

.icon--m>svg {
  width: var(--icon-m);
  height: var(--icon-m);
}

.icon--l>svg {
  width: var(--icon-l);
  height: var(--icon-l);
}

.icon--xl>svg {
  width: var(--icon-xl);
  height: var(--icon-xl);
}

.icon--xxl>svg {
  width: var(--icon-xxl);
  height: var(--icon-xxl);
}

.icon--primary>svg {
  color: var(--primary);
}

.icon--secondary>svg {
  color: var(--secondary);
}

.icon--secondary-light>svg {
  color: var(--secondary-light);
}

.icon--accent>svg {
  color: var(--accent);
}

.icon--base>svg {
  color: var(--base);
}

.icon--black>svg {
  color: var(--black);
}

.icon--white>svg {
  color: var(--white);
}

/* Aspect Ratio */
.object-fit--cover {
  -o-object-fit: cover;
  object-fit: cover;
}

.object-fit--contain {
  -o-object-fit: contain;
  object-fit: contain;
}

.object-fit--top-left {
  -o-object-position: 10% 90%;
  object-position: 10% 90%;
}

.object-fit--top-center {
  -o-object-position: 50% 10%;
  object-position: 50% 10%;
}

.object-fit--top-right {
  -o-object-position: 90% 10%;
  object-position: 90% 10%;
}

.object-fit--center-left {
  -o-object-position: 10% 50%;
  object-position: 10% 50%;
}

.object-fit--center-right {
  -o-object-position: 90% 50%;
  object-position: 90% 50%;
}

.object-fit--bottom-left {
  -o-object-position: 90% 10%;
  object-position: 90% 10%;
}

.object-fit--bottom-center {
  -o-object-position: 50% 90%;
  object-position: 50% 90%;
}

.object-fit--bottom-right {
  -o-object-position: 90% 90%;
  object-position: 90% 90%;
}

.aspect--1-1 {
  aspect-ratio: 1 / 1;
}

img.aspect--1-1 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--1-1 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
}

.aspect--1-2 {
  aspect-ratio: 1 / 2;
}

img.aspect--1-2 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--1-2 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 2;
}

.aspect--2-1 {
  aspect-ratio: 2 / 1;
}

img.aspect--2-1 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--2-1 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 2 / 1;
}

.aspect--2-3 {
  aspect-ratio: 2 / 3;
}

img.aspect--2-3 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--2-3 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 2 / 3;
}

.aspect--3-2 {
  aspect-ratio: 3 / 2;
}

img.aspect--3-2 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--3-2 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
}

.aspect--3-4 {
  aspect-ratio: 3 / 4;
}

img.aspect--3-4 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--3-4 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 4;
}

.aspect--4-3 {
  aspect-ratio: 4 / 3;
}

img.aspect--4-3 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--4-3 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
}

.aspect--16-9 {
  aspect-ratio: 16 / 9;
}

img.aspect--16-9 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--16-9 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
}

.aspect--9-16 {
  aspect-ratio: 9 / 16;
}

img.aspect--9-16 {
  -o-object-fit: cover;
  object-fit: cover;
}

.aspect--9-16 iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 9 / 16;
}

@media (max-width: 1919px) {
  .aspect--xl-1-1 {
    aspect-ratio: 1 / 1;
  }

  img.aspect--xl-1-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-1-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
  }

  .aspect--xl-1-2 {
    aspect-ratio: 1 / 2;
  }

  img.aspect--xl-1-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-1-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 2;
  }

  .aspect--xl-2-1 {
    aspect-ratio: 2 / 1;
  }

  img.aspect--xl-2-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-2-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 1;
  }

  .aspect--xl-2-3 {
    aspect-ratio: 2 / 3;
  }

  img.aspect--xl-2-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-2-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
  }

  .aspect--xl-3-2 {
    aspect-ratio: 3 / 2;
  }

  img.aspect--xl-3-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-3-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
  }

  .aspect--xl-3-4 {
    aspect-ratio: 3 / 4;
  }

  img.aspect--xl-3-4 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-3-4 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 4;
  }

  .aspect--xl-4-3 {
    aspect-ratio: 4 / 3;
  }

  img.aspect--xl-4-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-4-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
  }

  .aspect--xl-16-9 {
    aspect-ratio: 16 / 9;
  }

  img.aspect--xl-16-9 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-16-9 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .aspect--xl-9-16 {
    aspect-ratio: 9 / 16;
  }

  img.aspect--xl-9-16 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--xl-9-16 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 9 / 16;
  }
}

@media (max-width: 992px) {
  .aspect--l-1-1 {
    aspect-ratio: 1 / 1;
  }

  img.aspect--l-1-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-1-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
  }

  .aspect--l-1-2 {
    aspect-ratio: 1 / 2;
  }

  img.aspect--l-1-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-1-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 2;
  }

  .aspect--l-2-1 {
    aspect-ratio: 2 / 1;
  }

  img.aspect--l-2-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-2-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 1;
  }

  .aspect--l-2-3 {
    aspect-ratio: 2 / 3;
  }

  img.aspect--l-2-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-2-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
  }

  .aspect--l-3-2 {
    aspect-ratio: 3 / 2;
  }

  img.aspect--l-3-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-3-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
  }

  .aspect--l-3-4 {
    aspect-ratio: 3 / 4;
  }

  img.aspect--l-3-4 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-3-4 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 4;
  }

  .aspect--l-4-3 {
    aspect-ratio: 4 / 3;
  }

  img.aspect--l-4-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-4-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
  }

  .aspect--l-16-9 {
    aspect-ratio: 16 / 9;
  }

  img.aspect--l-16-9 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-16-9 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .aspect--l-9-16 {
    aspect-ratio: 9 / 16;
  }

  img.aspect--l-9-16 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--l-9-16 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 9 / 16;
  }
}

@media (max-width: 768px) {
  .aspect--m-1-1 {
    aspect-ratio: 1 / 1;
  }

  img.aspect--m-1-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-1-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
  }

  .aspect--m-1-2 {
    aspect-ratio: 1 / 2;
  }

  img.aspect--m-1-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-1-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 2;
  }

  .aspect--m-2-1 {
    aspect-ratio: 2 / 1;
  }

  img.aspect--m-2-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-2-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 1;
  }

  .aspect--m-2-3 {
    aspect-ratio: 2 / 3;
  }

  img.aspect--m-2-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-2-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
  }

  .aspect--m-3-2 {
    aspect-ratio: 3 / 2;
  }

  img.aspect--m-3-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-3-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
  }

  .aspect--m-3-4 {
    aspect-ratio: 3 / 4;
  }

  img.aspect--m-3-4 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-3-4 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 4;
  }

  .aspect--m-4-3 {
    aspect-ratio: 4 / 3;
  }

  img.aspect--m-4-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-4-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
  }

  .aspect--m-16-9 {
    aspect-ratio: 16 / 9;
  }

  img.aspect--m-16-9 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-16-9 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .aspect--m-9-16 {
    aspect-ratio: 9 / 16;
  }

  img.aspect--m-9-16 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--m-9-16 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 9 / 16;
  }
}

@media (max-width: 480px) {
  .aspect--s-1-1 {
    aspect-ratio: 1 / 1;
  }

  img.aspect--s-1-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-1-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
  }

  .aspect--s-1-2 {
    aspect-ratio: 1 / 2;
  }

  img.aspect--s-1-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-1-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 2;
  }

  .aspect--s-2-1 {
    aspect-ratio: 2 / 1;
  }

  img.aspect--s-2-1 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-2-1 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 1;
  }

  .aspect--s-2-3 {
    aspect-ratio: 2 / 3;
  }

  img.aspect--s-2-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-2-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
  }

  .aspect--s-3-2 {
    aspect-ratio: 3 / 2;
  }

  img.aspect--s-3-2 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-3-2 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
  }

  .aspect--s-3-4 {
    aspect-ratio: 3 / 4;
  }

  img.aspect--s-3-4 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-3-4 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 4;
  }

  .aspect--s-4-3 {
    aspect-ratio: 4 / 3;
  }

  img.aspect--s-4-3 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-4-3 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
  }

  .aspect--s-16-9 {
    aspect-ratio: 16 / 9;
  }

  img.aspect--s-16-9 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-16-9 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .aspect--s-9-16 {
    aspect-ratio: 9 / 16;
  }

  img.aspect--s-9-16 {
    -o-object-fit: cover;
    object-fit: cover;
  }

  .aspect--s-9-16 iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 9 / 16;
  }
}

@supports not (aspect-ratio: 1.7777777778) {
  .aspect--1-1::before {
    float: left;
    padding-top: 100%;
    content: "";
  }

  .aspect--1-1::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--1-2::before {
    float: left;
    padding-top: 50%;
    content: "";
  }

  .aspect--1-2::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--2-1::before {
    float: left;
    padding-top: 200%;
    content: "";
  }

  .aspect--2-1::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--2-3::before {
    float: left;
    padding-top: 150%;
    content: "";
  }

  .aspect--2-3::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--3-2::before {
    float: left;
    padding-top: 66%;
    content: "";
  }

  .aspect--3-2::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--3-4::before {
    float: left;
    padding-top: 133%;
    content: "";
  }

  .aspect--3-4::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--4-3::before {
    float: left;
    padding-top: 75%;
    content: "";
  }

  .aspect--4-3::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--16-9::before {
    float: left;
    padding-top: 56.25%;
    content: "";
  }

  .aspect--16-9::after {
    display: block;
    content: "";
    clear: both;
  }

  .aspect--9-16::before {
    float: left;
    padding-top: 177%;
    content: "";
  }

  .aspect--9-16::after {
    display: block;
    content: "";
    clear: both;
  }

  @media (max-width: 1919px) {
    .aspect--1-1::before {
      float: left;
      padding-top: 100%;
      content: "";
    }

    .aspect--1-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--1-2::before {
      float: left;
      padding-top: 50%;
      content: "";
    }

    .aspect--1-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-1::before {
      float: left;
      padding-top: 200%;
      content: "";
    }

    .aspect--2-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-3::before {
      float: left;
      padding-top: 150%;
      content: "";
    }

    .aspect--2-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-2::before {
      float: left;
      padding-top: 66%;
      content: "";
    }

    .aspect--3-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-4::before {
      float: left;
      padding-top: 133%;
      content: "";
    }

    .aspect--3-4::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--4-3::before {
      float: left;
      padding-top: 75%;
      content: "";
    }

    .aspect--4-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--16-9::before {
      float: left;
      padding-top: 56.25%;
      content: "";
    }

    .aspect--16-9::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--9-16::before {
      float: left;
      padding-top: 177%;
      content: "";
    }

    .aspect--9-16::after {
      display: block;
      content: "";
      clear: both;
    }
  }

  @media (max-width: 992px) {
    .aspect--1-1::before {
      float: left;
      padding-top: 100%;
      content: "";
    }

    .aspect--1-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--1-2::before {
      float: left;
      padding-top: 50%;
      content: "";
    }

    .aspect--1-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-1::before {
      float: left;
      padding-top: 200%;
      content: "";
    }

    .aspect--2-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-3::before {
      float: left;
      padding-top: 150%;
      content: "";
    }

    .aspect--2-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-2::before {
      float: left;
      padding-top: 66%;
      content: "";
    }

    .aspect--3-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-4::before {
      float: left;
      padding-top: 133%;
      content: "";
    }

    .aspect--3-4::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--4-3::before {
      float: left;
      padding-top: 75%;
      content: "";
    }

    .aspect--4-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--16-9::before {
      float: left;
      padding-top: 56.25%;
      content: "";
    }

    .aspect--16-9::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--9-16::before {
      float: left;
      padding-top: 177%;
      content: "";
    }

    .aspect--9-16::after {
      display: block;
      content: "";
      clear: both;
    }
  }

  @media (max-width: 768px) {
    .aspect--1-1::before {
      float: left;
      padding-top: 100%;
      content: "";
    }

    .aspect--1-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--1-2::before {
      float: left;
      padding-top: 50%;
      content: "";
    }

    .aspect--1-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-1::before {
      float: left;
      padding-top: 200%;
      content: "";
    }

    .aspect--2-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-3::before {
      float: left;
      padding-top: 150%;
      content: "";
    }

    .aspect--2-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-2::before {
      float: left;
      padding-top: 66%;
      content: "";
    }

    .aspect--3-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-4::before {
      float: left;
      padding-top: 133%;
      content: "";
    }

    .aspect--3-4::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--4-3::before {
      float: left;
      padding-top: 75%;
      content: "";
    }

    .aspect--4-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--16-9::before {
      float: left;
      padding-top: 56.25%;
      content: "";
    }

    .aspect--16-9::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--9-16::before {
      float: left;
      padding-top: 177%;
      content: "";
    }

    .aspect--9-16::after {
      display: block;
      content: "";
      clear: both;
    }
  }

  @media (max-width: 480px) {
    .aspect--1-1::before {
      float: left;
      padding-top: 100%;
      content: "";
    }

    .aspect--1-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--1-2::before {
      float: left;
      padding-top: 50%;
      content: "";
    }

    .aspect--1-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-1::before {
      float: left;
      padding-top: 200%;
      content: "";
    }

    .aspect--2-1::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--2-3::before {
      float: left;
      padding-top: 150%;
      content: "";
    }

    .aspect--2-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-2::before {
      float: left;
      padding-top: 66%;
      content: "";
    }

    .aspect--3-2::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--3-4::before {
      float: left;
      padding-top: 133%;
      content: "";
    }

    .aspect--3-4::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--4-3::before {
      float: left;
      padding-top: 75%;
      content: "";
    }

    .aspect--4-3::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--16-9::before {
      float: left;
      padding-top: 56.25%;
      content: "";
    }

    .aspect--16-9::after {
      display: block;
      content: "";
      clear: both;
    }

    .aspect--9-16::before {
      float: left;
      padding-top: 177%;
      content: "";
    }

    .aspect--9-16::after {
      display: block;
      content: "";
      clear: both;
    }
  }
}

/* flex & grid alignment */
.place-content--center {
  place-content: center;
}

.justify-content--start {
  justify-content: flex-start;
}

.justify-content--end {
  justify-content: flex-end;
}

.justify-content--center {
  justify-content: center;
}

.justify-content--between {
  justify-content: space-between;
}

.justify-content--around {
  justify-content: space-around;
}

.justify-content--stretch {
  justify-content: stretch;
}

.align-content--start {
  align-content: flex-start;
}

.align-content--end {
  align-content: flex-end;
}

.align-content--center {
  align-content: center;
}

.align-content--baseline {
  align-content: baseline;
}

.align-content--stretch {
  align-content: stretch;
}

.justify-items--start {
  justify-items: flex-start;
}

.justify-items--center {
  justify-items: center;
}

.justify-items--end {
  justify-items: flex-end;
}

.justify-items--stretch {
  justify-items: stretch;
}

.align-items--start {
  align-items: flex-start;
}

.align-items--end {
  align-items: flex-end;
}

.align-items--center {
  align-items: center;
}

.align-items--baseline {
  align-items: baseline;
}

.align-items--stretch {
  align-items: stretch;
}

.self--start {
  align-self: flex-start;
}

.self--end {
  align-self: flex-end;
}

.self--stretch {
  align-self: stretch;
}

.self--center {
  align-self: center;
}

.stretch {
  align-content: stretch;
  align-items: stretch;
  justify-content: stretch;
  justify-items: stretch;
}

.flex--wrap {
  flex-wrap: wrap;
}

/* height */
.height--20 {
  min-height: 20vh;
}

.height--30 {
  min-height: 30vh;
}

.height--40 {
  min-height: 40vh;
}

.height--50 {
  min-height: 50vh;
}

.height--60 {
  min-height: 60vh;
}

.height--70 {
  min-height: 70vh;
}

.height--80 {
  min-height: 80vh;
}

.height--90 {
  min-height: 90vh;
}

.height--full {
  min-height: 100%;
}

@media (max-width: 992px) {
  .height--l-20 {
    min-height: 20vh;
  }

  .height--l-30 {
    min-height: 30vh;
  }

  .height--l-40 {
    min-height: 40vh;
  }

  .height--l-50 {
    min-height: 50vh;
  }

  .height--l-60 {
    min-height: 60vh;
  }

  .height--l-70 {
    min-height: 70vh;
  }

  .height--l-80 {
    min-height: 80vh;
  }

  .height--l-90 {
    min-height: 90vh;
  }

  .height--l-full {
    min-height: 100vh;
  }
}

@media (max-width: 768px) {
  .height--m-20 {
    min-height: 20vh;
  }

  .height--m-30 {
    min-height: 30vh;
  }

  .height--m-40 {
    min-height: 40vh;
  }

  .height--m-50 {
    min-height: 50vh;
  }

  .height--m-60 {
    min-height: 60vh;
  }

  .height--m-70 {
    min-height: 70vh;
  }

  .height--m-80 {
    min-height: 80vh;
  }

  .height--m-90 {
    min-height: 90vh;
  }

  .height--m-full {
    min-height: 100vh;
  }
}

@media (max-width: 480px) {
  .height--s-20 {
    min-height: 20vh;
  }

  .height--s-30 {
    min-height: 30vh;
  }

  .height--s-40 {
    min-height: 40vh;
  }

  .height--s-50 {
    min-height: 50vh;
  }

  .height--s-60 {
    min-height: 60vh;
  }

  .height--s-70 {
    min-height: 70vh;
  }

  .height--s-80 {
    min-height: 80vh;
  }

  .height--s-90 {
    min-height: 90vh;
  }

  .height--s-full {
    min-height: 100vh;
  }
}

.max-height--20 {
  max-height: 20vh;
}

.max-height--30 {
  max-height: 30vh;
}

.max-height--40 {
  max-height: 40vh;
}

.max-height--50 {
  max-height: 50vh;
}

.max-height--60 {
  max-height: 60vh;
}

.max-height--70 {
  max-height: 70vh;
}

.max-height--80 {
  max-height: 80vh;
}

.max-height--90 {
  max-height: 90vh;
}

.max-height--full {
  max-height: 100vh;
}

@media (max-width: 992px) {
  .max-height--l-20 {
    min-height: 20vh;
  }

  .max-height--l-30 {
    min-height: 30vh;
  }

  .max-height--l-40 {
    min-height: 40vh;
  }

  .max-height--l-50 {
    min-height: 50vh;
  }

  .max-height--l-60 {
    min-height: 60vh;
  }

  .max-height--l-70 {
    min-height: 70vh;
  }

  .max-height--l-80 {
    min-height: 80vh;
  }

  .max-height--l-90 {
    min-height: 90vh;
  }

  .max-height--l-full {
    min-height: 100vh;
  }
}

@media (max-width: 768px) {
  .max-height--m-20 {
    min-height: 20vh;
  }

  .max-height--m-30 {
    min-height: 30vh;
  }

  .max-height--m-40 {
    min-height: 40vh;
  }

  .max-height--m-50 {
    min-height: 50vh;
  }

  .max-height--m-60 {
    min-height: 60vh;
  }

  .max-height--m-70 {
    min-height: 70vh;
  }

  .max-height--m-80 {
    min-height: 80vh;
  }

  .max-height--m-90 {
    min-height: 90vh;
  }

  .max-height--m-full {
    min-height: 100vh;
  }
}

@media (max-width: 480px) {
  .max-height--s-20 {
    min-height: 20vh;
  }

  .max-height--s-30 {
    min-height: 30vh;
  }

  .max-height--s-40 {
    min-height: 40vh;
  }

  .max-height--s-50 {
    min-height: 50vh;
  }

  .max-height--s-60 {
    min-height: 60vh;
  }

  .max-height--s-70 {
    min-height: 70vh;
  }

  .max-height--s-80 {
    min-height: 80vh;
  }

  .max-height--s-90 {
    min-height: 90vh;
  }

  .max-height--s-full {
    min-height: 100vh;
  }
}

/* width */
.width--xs:not([class*="breakout--"]) {
  width: 100%;
  max-width: 10%;
}

.width--s:not([class*="breakout--"]) {
  width: 100%;
  max-width: 20%;
}

.width--m:not([class*="breakout--"]) {
  width: 100%;
  max-width: 40%;
}

.width--l:not([class*="breakout--"]) {
  width: 100%;
  max-width: 60%;
}

.width--xl:not([class*="breakout--"]) {
  width: 100%;
  max-width: 80%;
}

.width--xxl:not([class*="breakout--"]) {
  width: 100%;
  max-width: 90%;
}

.width--vp-max:not([class*="breakout--"]) {
  width: 100%;
  max-width: calc((136.6 - 3 * 2) * 1rem);
  margin-left: auto;
  margin-right: auto;
}

.width--50:not([class*="breakout--"]) {
  width: 100%;
  max-width: 50%;
}

.width--full:not([class*="breakout--"]) {
  width: 100%;
  max-width: 100%;
}

.width--auto {
  width: auto !important;
  width: 100%;
}

@media (max-width: 1366px) {
  .width--xs:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.1) * 0.625rem);
  }

  .width--s:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.2) * 0.625rem);
  }

  .width--m:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.4) * 0.625rem);
  }

  .width--l:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.6) * 0.625rem);
  }

  .width--xl:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.8) * 0.625rem);
  }

  .width--xxl:not([class*="breakout--"]) {
    max-width: calc((136.6 * 0.9) * 0.625rem);
  }

  .width--vp-max:not([class*="breakout--"]) {
    max-width: calc((136.6 - 3 * 2) * 0.625rem);
  }

  .width--50:not([class*="breakout--"]) {
    max-width: calc((136.6 / 2) * 0.625rem);
  }
}

/* grid order */
.order--first {
  order: -1;
}

.order--last {
  order: 999;
}

@media (max-width: 992px) {
  .order--first-l {
    order: -1;
  }

  .order--last-l {
    order: 999;
  }
}

@media (max-width: 768px) {
  .order--first-m {
    order: -1;
  }

  .order--last-m {
    order: 999;
  }
}

@media (max-width: 480px) {
  .order--first-s {
    order: -1;
  }

  .order--last-s {
    order: 999;
  }
}

/* display */
.display--inline {
  display: inline;
}

.display--block {
  display: block;
}

.display--contents {
  display: contents;
}

.display--inline-block {
  display: inline-block;
}

.display--inline-flex {
  display: inline-flex;
}

.display--list-item {
  display: list-item;
}

.display--none {
  display: none;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.flex-wrap--anywhere {
  overflow-wrap: anywhere;
  line-height: 1;
}

@media (max-width: 992px) {
  .display--l-none {
    display: none;
  }

  .display--l-block {
    display: block;
  }
}

@media (max-width: 768px) {
  .display--m-none {
    display: none;
  }

  .display--m-block {
    display: block;
  }

  .display--m-contents {
    display: contents !important;
  }
}

/* layout flex */
.flex--col {
  flex-direction: column;
}

.flex--row {
  flex-direction: row;
}

.flex--col-reverse {
  flex-direction: column-reverse;
}

.flex--row-reverse {
  flex-direction: row-reverse;
}

@media (max-width: 991px) {
  .flex--col-l {
    flex-direction: column;
  }

  .flex--row-l {
    flex-direction: row;
  }

  .flex--col-reverse-l {
    flex-direction: column-reverse;
  }

  .flex--row-reverse-l {
    flex-direction: row-reverse;
  }
}

@media (max-width: 767px) {
  .flex--col-m {
    flex-direction: column;
  }

  .flex--row-m {
    flex-direction: row;
  }

  .flex--col-reverse-m {
    flex-direction: column-reverse;
  }

  .flex--row-reverse-m {
    flex-direction: row-reverse;
  }
}

@media (max-width: 479px) {
  .flex--col-s {
    flex-direction: column;
  }

  .flex--row-s {
    flex-direction: row;
  }

  .flex--col-reverse-s {
    flex-direction: column-reverse;
  }

  .flex--row-reverse-s {
    flex-direction: row-reverse;
  }
}

/* layout grids */
.grid--1 {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
}

.grid--2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
}

.grid--3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
}

.grid--4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
}

.grid--5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
}

.grid--6 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  width: 100%;
}

.grid--1-2 {
  display: grid;
  grid-template-columns: 1fr 2fr;
  width: 100%;
}

.grid--1-3 {
  display: grid;
  grid-template-columns: 1fr 3fr;
  width: 100%;
}

.grid--2-1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
  width: 100%;
}

.grid--2-3 {
  display: grid;
  grid-template-columns: 2fr 3fr;
  width: 100%;
}

.grid--3-1 {
  display: grid;
  grid-template-columns: 3fr 1fr;
  width: 100%;
}

.grid--3-2 {
  display: grid;
  grid-template-columns: 3fr 2fr;
  width: 100%;
}

.grid--auto-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(43.6789297659rem, 100vw - 6rem), 1fr));
  width: 100%;
}

.grid--auto-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  width: 100%;
}

.grid--auto-4 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(26.1723446894rem, 100vw - 6rem), 1fr));
  width: 100%;
}

.grid--auto-5 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(21.8030050083rem, 100vw - 6rem), 1fr));
  width: 100%;
}

.grid--auto-6 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(18.6838340486rem, 100vw - 6rem), 1fr));
  width: 100%;
}

.grid--auto-1-2 {
  display: grid;
  grid-template-columns: 1fr 2fr;
  width: 100%;
}

.grid--auto-1-3 {
  display: grid;
  grid-template-columns: 1fr 3fr;
  width: 100%;
}

.grid--auto-2-1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
  width: 100%;
}

.grid--auto-2-3 {
  display: grid;
  grid-template-columns: 2fr 3fr;
  width: 100%;
}

.grid--auto-3-1 {
  display: grid;
  grid-template-columns: 3fr 1fr;
  width: 100%;
}

.grid--auto-3-2 {
  display: grid;
  grid-template-columns: 3fr 2fr;
  width: 100%;
}

@media (max-width: 1366px) {
  .grid--xl-1 {
    grid-template-columns: 1fr;
  }

  .grid--xl-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid--xl-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grid--xl-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grid--xl-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .grid--xl-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 992px) {
  .grid--l-1 {
    grid-template-columns: 1fr;
  }

  .grid--l-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid--l-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grid--l-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grid--l-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .grid--l-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .grid--m-1 {
    grid-template-columns: 1fr;
  }

  .grid--m-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid--m-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grid--m-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grid--m-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .grid--m-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .grid--s-1 {
    grid-template-columns: 1fr;
  }

  .grid--s-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid--s-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grid--s-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grid--s-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .grid--s-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 992px) {
  .grid--auto-1-2 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }

  .grid--auto-1-3 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }

  .grid--auto-3-2 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }

  .grid--auto-2-3 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }

  .grid--auto-2-1 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }

  .grid--auto-3-1 {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(32.7318295739rem, 100vw - 6rem), 1fr));
  }
}

.row-span--1 {
  grid-row: span 1;
}

.col-span--1 {
  grid-column: span 1;
}

.row-start--1 {
  grid-row-start: 1;
}

.col-start--1 {
  grid-column-start: 1;
}

.row-span--2 {
  grid-row: span 2;
}

.col-span--2 {
  grid-column: span 2;
}

.row-start--2 {
  grid-row-start: 2;
}

.col-start--2 {
  grid-column-start: 2;
}

.row-span--3 {
  grid-row: span 3;
}

.col-span--3 {
  grid-column: span 3;
}

.row-start--3 {
  grid-row-start: 3;
}

.col-start--3 {
  grid-column-start: 3;
}

.row-span--4 {
  grid-row: span 4;
}

.col-span--4 {
  grid-column: span 4;
}

.row-start--4 {
  grid-row-start: 4;
}

.col-start--4 {
  grid-column-start: 4;
}

.row-span--5 {
  grid-row: span 5;
}

.col-span--5 {
  grid-column: span 5;
}

.row-start--5 {
  grid-row-start: 5;
}

.col-start--5 {
  grid-column-start: 5;
}

.row-span--6 {
  grid-row: span 6;
}

.col-span--6 {
  grid-column: span 6;
}

.row-start--6 {
  grid-row-start: 6;
}

.col-start--6 {
  grid-column-start: 6;
}

@media (max-width: 1366px) {
  .row-span--xl-1 {
    grid-row: span 1;
  }

  .col-span--xl-1 {
    grid-column: span 1;
  }

  .row-start--xl-1 {
    grid-row-start: 1;
  }

  .col-start--xl-1 {
    grid-column-start: 1;
  }

  .row-span--xl-2 {
    grid-row: span 2;
  }

  .col-span--xl-2 {
    grid-column: span 2;
  }

  .row-start--xl-2 {
    grid-row-start: 2;
  }

  .col-start--xl-2 {
    grid-column-start: 2;
  }

  .row-span--xl-3 {
    grid-row: span 3;
  }

  .col-span--xl-3 {
    grid-column: span 3;
  }

  .row-start--xl-3 {
    grid-row-start: 3;
  }

  .col-start--xl-3 {
    grid-column-start: 3;
  }

  .row-span--xl-4 {
    grid-row: span 4;
  }

  .col-span--xl-4 {
    grid-column: span 4;
  }

  .row-start--xl-4 {
    grid-row-start: 4;
  }

  .col-start--xl-4 {
    grid-column-start: 4;
  }

  .row-span--xl-5 {
    grid-row: span 5;
  }

  .col-span--xl-5 {
    grid-column: span 5;
  }

  .row-start--xl-5 {
    grid-row-start: 5;
  }

  .col-start--xl-5 {
    grid-column-start: 5;
  }

  .row-span--xl-6 {
    grid-row: span 6;
  }

  .col-span--xl-6 {
    grid-column: span 6;
  }

  .row-start--xl-6 {
    grid-row-start: 6;
  }

  .col-start--xl-6 {
    grid-column-start: 6;
  }
}

@media (max-width: 992px) {
  .row-span--l-1 {
    grid-row: span 1;
  }

  .col-span--l-1 {
    grid-column: span 1;
  }

  .row-start--l-1 {
    grid-row-start: 1;
  }

  .col-start--l-1 {
    grid-column-start: 1;
  }

  .row-span--l-2 {
    grid-row: span 2;
  }

  .col-span--l-2 {
    grid-column: span 2;
  }

  .row-start--l-2 {
    grid-row-start: 2;
  }

  .col-start--l-2 {
    grid-column-start: 2;
  }

  .row-span--l-3 {
    grid-row: span 3;
  }

  .col-span--l-3 {
    grid-column: span 3;
  }

  .row-start--l-3 {
    grid-row-start: 3;
  }

  .col-start--l-3 {
    grid-column-start: 3;
  }

  .row-span--l-4 {
    grid-row: span 4;
  }

  .col-span--l-4 {
    grid-column: span 4;
  }

  .row-start--l-4 {
    grid-row-start: 4;
  }

  .col-start--l-4 {
    grid-column-start: 4;
  }

  .row-span--l-5 {
    grid-row: span 5;
  }

  .col-span--l-5 {
    grid-column: span 5;
  }

  .row-start--l-5 {
    grid-row-start: 5;
  }

  .col-start--l-5 {
    grid-column-start: 5;
  }

  .row-span--l-6 {
    grid-row: span 6;
  }

  .col-span--l-6 {
    grid-column: span 6;
  }

  .row-start--l-6 {
    grid-row-start: 6;
  }

  .col-start--l-6 {
    grid-column-start: 6;
  }
}

@media (max-width: 768px) {
  .row-span--m-1 {
    grid-row: span 1;
  }

  .col-span--m-1 {
    grid-column: span 1;
  }

  .row-start--m-1 {
    grid-row-start: 1;
  }

  .col-start--m-1 {
    grid-column-start: 1;
  }

  .row-span--m-2 {
    grid-row: span 2;
  }

  .col-span--m-2 {
    grid-column: span 2;
  }

  .row-start--m-2 {
    grid-row-start: 2;
  }

  .col-start--m-2 {
    grid-column-start: 2;
  }

  .row-span--m-3 {
    grid-row: span 3;
  }

  .col-span--m-3 {
    grid-column: span 3;
  }

  .row-start--m-3 {
    grid-row-start: 3;
  }

  .col-start--m-3 {
    grid-column-start: 3;
  }

  .row-span--m-4 {
    grid-row: span 4;
  }

  .col-span--m-4 {
    grid-column: span 4;
  }

  .row-start--m-4 {
    grid-row-start: 4;
  }

  .col-start--m-4 {
    grid-column-start: 4;
  }

  .row-span--m-5 {
    grid-row: span 5;
  }

  .col-span--m-5 {
    grid-column: span 5;
  }

  .row-start--m-5 {
    grid-row-start: 5;
  }

  .col-start--m-5 {
    grid-column-start: 5;
  }

  .row-span--m-6 {
    grid-row: span 6;
  }

  .col-span--m-6 {
    grid-column: span 6;
  }

  .row-start--m-6 {
    grid-row-start: 6;
  }

  .col-start--m-6 {
    grid-column-start: 6;
  }
}

@media (max-width: 480px) {
  .row-span--s-1 {
    grid-row: span 1;
  }

  .col-span--s-1 {
    grid-column: span 1;
  }

  .row-start--s-1 {
    grid-row-start: 1;
  }

  .col-start--s-1 {
    grid-column-start: 1;
  }

  .row-span--s-2 {
    grid-row: span 2;
  }

  .col-span--s-2 {
    grid-column: span 2;
  }

  .row-start--s-2 {
    grid-row-start: 2;
  }

  .col-start--s-2 {
    grid-column-start: 2;
  }

  .row-span--s-3 {
    grid-row: span 3;
  }

  .col-span--s-3 {
    grid-column: span 3;
  }

  .row-start--s-3 {
    grid-row-start: 3;
  }

  .col-start--s-3 {
    grid-column-start: 3;
  }

  .row-span--s-4 {
    grid-row: span 4;
  }

  .col-span--s-4 {
    grid-column: span 4;
  }

  .row-start--s-4 {
    grid-row-start: 4;
  }

  .col-start--s-4 {
    grid-column-start: 4;
  }

  .row-span--s-5 {
    grid-row: span 5;
  }

  .col-span--s-5 {
    grid-column: span 5;
  }

  .row-start--s-5 {
    grid-row-start: 5;
  }

  .col-start--s-5 {
    grid-column-start: 5;
  }

  .row-span--s-6 {
    grid-row: span 6;
  }

  .col-span--s-6 {
    grid-column: span 6;
  }

  .row-start--s-6 {
    grid-row-start: 6;
  }

  .col-start--s-6 {
    grid-column-start: 6;
  }
}

/* header familiaamerica */
.familiaamerica-header {
  padding: var(--space-xs) var(--space-m);
}

.familiaamerica-header.oxy-header-wrapper.oxy-header.oxy-sticky-header.oxy-sticky-header-active {
  z-index: 999 !important;
}

.familiaamerica-pro-menu a {
  color: var(--white);
  font-size: var(--text-m);
  text-decoration: none;
  padding-top: 0px;
  padding-bottom: 0px;
  border: 0;
  padding-left: var(--space-s);
  padding-right: var(--space-s);
  text-transform: uppercase;
  transition: 0.3s ease-in-out;
  position: relative;
  z-index: 1;
}

.familiaamerica-pro-menu a:hover {
  color: var(--white);
}

.familiaamerica-pro-menu .oxy-pro-menu-list>.menu-item {
  margin-left: var(--space-s);
}

.familiaamerica-pro-menu a:before,
.familiaamerica-pro-menu a:after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 3px;
  height: 2px;
  bottom: 0;
  left: 0;
  transition: all 1s ease 0s;
}

.familiaamerica-pro-menu a:focus:after,
.familiaamerica-pro-menu a:hover:after,
.familiaamerica-pro-menu a:focus:before,
.familiaamerica-pro-menu a:hover:before {
  width: 100%;
  height: 2px;
  background-color: var(--white);
  -webkit-transition: all 1s ease 0s;
  -moz-transition: all 1s ease 0s;
  -ms-transition: all 1s ease 0s;
  -o-transition: all 1s ease 0s;
  transition: all 1s ease 0s;
}

.familiaamerica-pro-menu .current-menu-item>a:after,
.familiaamerica-pro-menu .current-menu-item>a:before {
  width: 100%;
  height: 2px outline: 0;
  background-color: var(--white);
}

.familiaamerica-pro-menu .current-menu-ancestor>a:after,
.familiaamerica-pro-menu .current-menu-ancestor>a:before {
  width: 100%;
  height: 2px outline: 0;
  background-color: var(--white);
}

.familiaamerica-pro-menu .current-menu-item>a {
  color: var(--white);
}

.familiaamerica-pro-menu .current-menu-ancestor>a {
  color: var(--white);
}

.familiaamerica-pro-menu ul>li:nth-child(2)>ul {
  max-height: 65vh;
  overflow: auto;
}

.familiaamerica-pro-menu li ul a {
  color: var(--accent-light);
  transition: all 0.3s ease-in-out;
  padding-top: var(--space-s);
  padding-bottom: var(--space-s);
  padding-left: var(--space-m);
  padding-right: var(--space-m);
  border-bottom: 1px solid var(--accent-light) !important;
}

.familiaamerica-pro-menu li ul li.current-menu-ancestor>a,
.familiaamerica-pro-menu li ul li.current-menu-item>a {
  color: var(--white-medium);
  background-color: var(--primary);
}

.familiaamerica-pro-menu .oxy-pro-menu-show-dropdown .oxy-pro-menu-list .menu-item-has-children>a svg {
  font-size: var(--text-xs);
  margin-left: var(--space-xs);
  transition: all 1s ease 0s;
}

.familiaamerica-pro-menu .oxy-pro-menu-show-dropdown .oxy-pro-menu-list .menu-item-has-children>a:hover svg {
  transform: rotate(180deg);
}

.familiaamerica-pro-menu .oxy-pro-menu-container:not(.oxy-pro-menu-open-container):not(.oxy-pro-menu-off-canvas-container) .sub-menu,
.familiaamerica-pro-menu .oxy-pro-menu-container:not(.oxy-pro-menu-open-container):not(.oxy-pro-menu-off-canvas-container) .sub-menu .sub-menu {
  top: 0;
  left: 100%;
  background: var(--white-medium);
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.familiaamerica-pro-menu li ul a::after,
.familiaamerica-pro-menu li ul a::before {
  display: none;
}

.familiaamerica-pro-menu .oxy-pro-menu-container:not(.oxy-pro-menu-open-container):not(.oxy-pro-menu-off-canvas-container) .sub-menu a:hover,
.familiaamerica-pro-menu .oxy-pro-menu-container:not(.oxy-pro-menu-open-container):not(.oxy-pro-menu-off-canvas-container) .sub-menu .sub-menu a:hover {
  background: var(--primary);
  color: var(--white-medium);
  font-weight: 400;
}

.familiaamerica-trigger-menu .hamburger-inner,
.familiaamerica-trigger-menu .hamburger-inner:after,
.familiaamerica-trigger-menu .hamburger-inner:before {
  background-color: var(--secondary);
}

.familiaamerica-off-canvas--menu .offcanvas-inner {
  background-color: var(--accent);
  color: var(--white);
  width: 40%;
  transition-duration: .6s;
  margin: 0px !important;
  padding: 0px;
}

.familiaamerica-slide-menu .mm-navbar {
  color: var(--white);
  align-items: center;
}

.familiaamerica-slide-menu .oxy-horizontal-slide-menu_inner {
  --mm-color-background: var(--accent);
  --mm-color-border: var(--white);
}

.familiaamerica-slide-menu .menu-item a {
  color: var(--white) !important;
  background-color: var(--accent) !important;
}

.familiaamerica-slide-menu .current-menu-ancestor>a,
.familiaamerica-slide-menu .current-menu-item>a {
  color: var(--white) !important;
  background-color: var(--primary) !important;
}

.familiaamerica-logo {
  width: 12.188rem;
  height: auto;
}

@media (min-width: 1920px) {
  .familiaamerica-logo {
    width: calc(1.1 * 9.75vw);
  }
}

@media (max-width: 992px) {
  .familiaamerica-logo {
    width: clamp(7.5rem, calc(7.5rem + ((1vw - 0.2rem) * 7.1709)), 12.188rem);
  }

  .familiaamerica-off-canvas--menu .offcanvas-inner {
    width: 40%;
  }
}

@media (max-width: 768px) {
  .familiaamerica-off-canvas--menu .offcanvas-inner {
    width: 80%;
  }
}

@media (max-width: 480px) {
  .familiaamerica-off-canvas--menu .offcanvas-inner {
    width: 100%;
  }
}

/* form */
.familiaamerica-form .ff-el-form-control {
  background-clip: padding-box;
  background-image: none;
  background-color: var(--white);
  outline: none;
  border-radius: 0px;
  border: 3px solid var(--white);
  display: block;
  font-size: var(--text-m);
  color: var(--base);
  line-height: 1.5;
  width: 100%;
  max-width: 100%;
  padding: var(--text-xs);
  transition: all 1s ease 0s;
}

.familiaamerica-form .ff-el-form-control:focus {
  outline: none;
  border: 3px solid var(--secondary);
}

.familiaamerica-form .ff-el-group {
  margin: 0;
}

.familiaamerica-form .ff-el-input--label label {
  display: none;
}

.familiaamerica-form .ff_submit_btn_wrapper {
  margin-top: var(--space-m);
  display: flex;
}

/* button familiaamerica */
.familiaamerica-form .ff-btn-submit,
.familiaamerica-btn--header,
.familiaamerica-btn--primary,
.familiaamerica-btn--white {
  display: flex;
  flex-direction: row;
  font-size: var(--text-m);
  text-decoration: none;
  color: var(--white-medium);
  transition: all .3s ease-in-out;
  border: 1px solid;
  border-radius: var(--radius-xxl);
  outline: none;
  cursor: pointer;
}

.familiaamerica-btn--header,
.familiaamerica-btn--primary {
  background-color: var(--primary);
  border-color: var(--primary);
}

.familiaamerica-form .ff-btn-submit,
.familiaamerica-btn--white {
  background-color: inherit;
  border-color: var(--white-medium);
}

.familiaamerica-btn--primary:hover {
  background-color: inherit;
  color: var(--primary);
  text-decoration: none;
}

.familiaamerica-btn--header:hover,
.familiaamerica-form .ff-btn-submit:hover,
.familiaamerica-btn--white:hover {
  color: var(--base);
  background-color: var(--white-medium);
  border-color: var(--white-medium);
  text-decoration: none;
}

.familiaamerica-btn--text a {
  display: flex;
  flex-direction: row;
  color: var(--base);
  text-align: left;
  position: relative;
  align-items: center;
  justify-content: flex-start;
  text-transform: capitalize;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}

.familiaamerica-btn--text a:hover {
  color: var(--secondary);
  text-decoration: none;
}

.familiaamerica-btn--text a::after {
  content: '&#8594;';
  width: var(--icon-s);
  height: var(--icon-s);
  margin-left: var(--space-xs);
}

.familiaamerica-btn--text a:hover::before {
  margin-left: var(--space-s);
}

.btn--xs {
  padding: var(--space-xs) var(--space-xs);
}

.btn--s {
  padding: var(--space-xs) var(--space-s);
}

.btn--m {
  padding: var(--space-xs) var(--space-m);
}

.btn--l {
  padding: var(--space-xs) var(--space-l);
}

.familiaamerica-form .ff-btn-submit,
.btn--xl {
  padding: var(--space-xs) var(--space-xl);
}

.btn--xxl {
  padding: var(--space-xs) var(--space-xxl);
}

/* blog familiaamerica */
.link--adjent-post a, a.link--adjent-post {
  color: var(--secondary);
}

.link--adjent-post a:hover, a.link--adjent-post:hover {
  color: var(--secondary-medium);
}

.familiaamerica-icon--post a {
  padding: var(--space-s);
  border-radius: var(--radius-circle);
}

.familiaamerica-icon--post>a:nth-child(1) {
  background: #3a5998;
}

.familiaamerica-icon--post>a:nth-child(2) {
  background: #2867b2;
}

.familiaamerica-icon--post>a:nth-child(3) {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
}

.familiaamerica-icon--post>a:nth-child(4) {
  background: #617379;
}

.familiaamerica-search-form {
  display: flex;
  flex-direction: row;
  position: relative;
  align-items: center;
}

.familiaamerica-search-form .submit-search {
  position: absolute;
  right: var(--space-xs);
  cursor: pointer;
}

.familiaamerica-search-form svg {
  width: var(--space-s);
  height: var(--space-s);
}

.familiaamerica-search-form #s {
  width: 100%;
  max-width: 100%;
  padding-top: var(--space-xs);
  padding-bottom: var(--space-xs);
  padding-left: var(--space-s);
  padding-right: var(--space-l);
  border-radius: var(--radius-xxl);
}

.familiaamerica-search-form #searchsubmit {
  display: none;
}

/* carousel familiaamerica */
.familiaamerica-carousel-contents {
  padding-top: 0px;
  padding-bottom: var(--space-xxl);
  padding-left: var(--space-l);
  padding-right: var(--space-l);
}

.familiaamerica-carousel__testimonial .cell {
  width: 100%;
  height: 29.688rem;
  align-items: center;
  justify-content: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.cell>div {
  width: 100%;
  max-width: 70%;
  text-align: center;
  color: var(--white);
}

.cell::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-color: var(--primary-trans--75);
}

.familiaamerica-carousel__testimonial .oxy-carousel-builder_icon {
  background-color: inherit;
}

.familiaamerica-carousel__testimonial .oxy-carousel-builder_icon svg {
  width: var(--icon-m);
  height: var(--icon-m);
  color: var(--white);
  opacity: 0.75;
  transition: all 0.3s ease 0s;
}

.familiaamerica-carousel__testimonial .oxy-carousel-builder_icon svg:hover {
  color: var(--white);
  opacity: 1;
}

.familiaamerica-carousel__testimonial .oxy-carousel-builder_prev {
  left: calc(-1 * (var(--space-m)));
  opacity: 0;
  transition: all 0.3s ease 0s;
}

.familiaamerica-carousel__testimonial .oxy-carousel-builder_next {
  right: calc(-1 * (var(--space-m)));
  opacity: 0;
  transition: all 0.3s ease 0s;
}

.familiaamerica-carousel__testimonial:hover .oxy-carousel-builder_prev {
  left: 0;
  opacity: 1;
}

.familiaamerica-carousel__testimonial:hover .oxy-carousel-builder_next {
  right: 0;
  opacity: 1;
}

@media (min-width: 1920) {
  .familiaamerica-carousel__testimonial .cell {
    height: 50vh;
  }
}

@media (max-width: 520px) {
  .cell>div {
    width: 100%;
    max-width: 80%;
    text-align: center;
    color: var(--white);
  }

  .familiaamerica-carousel-contents {
    padding-bottom: var(--space-xl);
    padding-left: 0px;
    padding-right: 0px;
  }
}

/* Accordion familiaamerica */
.familiaamerica-accordion .oxy-pro-accordion_header {
  color: var(--primary);
  background-color: inherit;
  letter-spacing: 0;
  transition: all 1s ease 0s;
  text-transform: capitalize;
}

.familiaamerica-accordion .oxy-pro-accordion_item {
  --extras-accordion-duration: 1000ms;
}

.familiaamerica-accordion .oxy-pro-accordion_title-area {
  padding-top: var(--space-m);
  padding-left: 0px;
}

.familiaamerica-accordion svg {
  width: var(--icon-s);
  height: var(--icon-s);
}

.familiaamerica-accordion .oxy-pro-accordion_content {
  padding-left: 0px;
  transition: all 1s ease 0s;
}

.familiaamerica-accordion h4 {
  font-size: var(--text-l);
}

/* tab contact us familiaamerica */
.familiaamerica-tab-contents .oxy-tab-content {
  padding: 0;
  color: var(--white);
  height: 100%;
}

.familiaamerica-tab {
  padding: var(--space-xs) var(--space-m);
  color: var(--primary);
  text-transform: uppercase;
  transition: 0.3s ease-in-out;
}

.familiaamerica-tab:hover {
  color: var(--white);
  background-color: var(--primary);
}

.tabs-6685-tab-active {
  color: var(--white);
  background-color: var(--primary);
}

.familiaamerica-tab-content {
  padding: var(--space-m);
  background-color: var(--primary);
  height: 100%;
}

.familiaamerica-tab-content--wrap .familiaamerica-tab-content {
  animation-name: fadeUpIn;
  animation-duration: 500ms;
  animation-timing-function: ease-in-out;
}

@keyframes fadeUpIn {
  from {
    opacity: 0;
    transform: translate(0, -4px);
  }

  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}

.familiaamerica-img--tabs {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: 50% 0%;
  aspect-ratio: 1/1;
}

@media (max-width: 992px) {
  .familiaamerica-tab {
    border: 1px solid var(--primary);
  }
}

@media (max-width: 768px) {
  .familiaamerica-img--tabs {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: 50% 0%;
  }

  .familiaamerica-tabs,
  .familiaamerica-tab-contents {
    display: contents !important;
  }

  .familiaamerica-tabs>*+* {
    margin-top: var(--space-xs);
  }

  .familiaamerica-tab-content--wrap {
    margin-top: var(--space-xs);
  }
}

/* layout familiaamerica */
.familiaamerica-heroes {
  width: 100%;
  max-width: 100%;
  position: relative;
  margin-bottom: var(--space-xl);
}

.familiaamerica-heroes>div>div:first-child {
  width: 100%;
  max-width: 100%;
  height: 70vh;
  background-size: cover !important;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  align-items: flex-start;
  justify-content: flex-end;
}

.familiaamerica-heroes>div>div:last-child {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  max-width: 50%;
  backdrop-filter: blur(5px);
  background-color: var(--primary-trans--85);
  border-radius: var(--radius-xl);
  padding: var(--space-m);
  margin-bottom: calc(-1 * var(--space-xl));
}

.familiaamerica-heroes h2 {
  font-size: var(--text-large-xl);
  color: var(--white);
}

.familiaamerica-content {
  padding-top: var(--space-xxl);
  padding-bottom: var(--space-xxl);
  padding-left: var(--space-extra-large);
  padding-right: var(--space-extra-large);
}

.familiaamerica-contents {
  padding-top: 0px;
  padding-bottom: var(--space-xxl);
  padding-left: var(--space-extra-large);
  padding-right: var(--space-extra-large);
}

.familiaamerica-footer {
  padding-left: var(--space-extra-large);
  padding-right: var(--space-extra-large);
}

.familiaamerica-img-cta {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 10% 50%;
}

.familiaamerica-img--1-1 {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.familiaamerica-img-content {
  width: 100%;
  max-width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  align-items: flex-end;
  justify-content: center;
}

.familiaamerica-imgs-div,
.familiaamerica-img-div {
  position: relative;
}

.familiaamerica-imgs-div::before {
  content: '';
  position: absolute;
  backdrop-filter: blur(5px);
  background-color: var(--primary-trans--85);
  left: 0;
  bottom: 0;
  width: 100%;
  max-width: 60%;
  min-height: 6.25rem;
  margin-bottom: -3.25rem;
}

.familiaamerica-img-div::before {
  content: '';
  position: absolute;
  backdrop-filter: blur(5px);
  background-color: var(--primary-trans--85);
  right: 0;
  bottom: 0;
  width: 100%;
  max-width: 60%;
  min-height: 6.25rem;
  margin-bottom: -3.25rem;
}

.familiaamerica-team--left {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 20.75rem;
  backdrop-filter: blur(5px);
  background-color: var(--primary-trans--85);
  padding: var(--space-l) var(--space-m);
  margin-top: calc(-1 * var(--space-xl));
  margin-left: calc(-1 * var(--space-m));
}

.familiaamerica-team--right {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 20.75rem;
  backdrop-filter: blur(5px);
  background-color: var(--primary-trans--85);
  padding: var(--space-l) var(--space-m);
  margin-top: calc(-1 * var(--space-xl));
  margin-left: var(--space-m);
}

.familiaamerica-team-content {
  width: 100%;
  max-width: 100%;
  padding: var(--space-xl) var(--space-m);
  background-size: cover;
  background-position: 50% 0%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  position: relative;
  z-index: 0;
}

.familiaamerica-team-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-color: var(--primary-trans--75);
}

.familiaamerica-card--01 {
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  background-color: var(--white);
}

.familiaamerica-grid--center-4 {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  width: 100%;
}

.familiaamerica-grid--center-4>img {
  grid-column: span 2;
}

.familiaamerica-grid--center-4>img:last-child:nth-child(4n - 1) {
  grid-column-end: -2;
}

.familiaamerica-grid--center-4>img:nth-last-child(3):nth-child(4n + 1) {
  grid-column-end: 4;
}

.familiaamerica-grid--center-4>img:nth-last-child(2):nth-child(4n + 2) {
  grid-column-end: 6;
}

.familiaamerica-google-maps {
  width: 100%;
  height: 27.813rem;
}

.familiaamerica-blog--img {
  transition: 0.3s ease-in-out;
}

.familiaamerica-blog--img:hover {
  transform: scale(1.5);
}

@media (min-width: 1920px) {
  .familiaamerica-img-content {
    height: 60vh;
  }

  .familiaamerica-imgs-div::before,
  .familiaamerica-img-div::before {
    min-height: 10vh;
  }

  .familiaamerica-google-maps.oxy-map {
    width: 100%;
    height: 46.3541666666667vh;
  }

  .familiaamerica-team--left,
  .familiaamerica-team--right {
    height: 100%;
    max-height: 34.5833333333333vh;
  }
}

@media (max-width: 1366px) {
  .familiaamerica-content {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
  }

  .familiaamerica-contents {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
  }

  .familiaamerica-footer {
    padding-left: var(--space-m);
    padding-right: var(--space-m);
  }

  .familiaamerica-heroes {
    margin-bottom: var(--space-l);
  }

  .familiaamerica-heroes>div>div:first-child {
    height: 90vh;
  }

  .familiaamerica-heroes>div>div:last-child {
    max-width: calc((136.6 * 0.5) * 0.625rem);
  }
}

@media (max-width: 992px) {
  .familiaamerica-content {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }

  .familiaamerica-contents {
    padding-bottom: var(--space-xl);
  }
}

@media (max-width: 768px) {
  .familiaamerica-img--1-1 {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
  }

  .familiaamerica-img-cta {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
  }
}

@media (max-width: 520px) {
  .familiaamerica-footer>div:last-child {
    flex-wrap: wrap;
    justify-content: center;
  }

  .familiaamerica-imgs-div::before,
  .familiaamerica-img-div::before {
    max-width: 70%;
    min-height: 3.8627935723115rem;
    margin-bottom: -1.93139678615575rem;
  }
}
