@charset "utf-8";

:root {
  --color-c1: #17E26E;
  --color-c2: #00B581;
  --color-c3: #0B9970;

  --color-gr1: #646464;
  --color-gr2: #7E7F84;
  --color-gr3: #A6A8AD;
  --color-gr4: #DADADA;
  --color-gr5: #F1F3F8;

  --color-bg: #F3F5FB;

  --color-rd: #ff3f3a;
  --color-og: #FF7043;
  --color-yl: #FEC671;
  --color-gn: #00c493;
  --color-bl: #1c73ff;

  --color-b: #DBDDE2;
}

.f-bk,
.f-bk-h:hover,
.f-bk-h-c > *:hover {
  color: #000;
}

.f-wt,
.f-wt-h:hover,
.f-wt-h-c > *:hover {
  color: white;
}

.f-gr1,
.f-gr1-h:hover,
.f-gr1-h-c > *:hover {
  color: var(--color-gr1);
}

.f-gr2,
.f-gr2-h:hover,
.f-gr2-h-c > *:hover {
  color: var(--color-gr2);
}

.f-gr3,
.f-gr3-h:hover,
.f-gr3-h-c > *:hover {
  color: var(--color-gr3);
}

.f-gr4,
.f-gr4-h:hover,
.f-gr4-h-c > *:hover {
  color: var(--color-gr4);
}

.f-gr5,
.f-gr5-h:hover,
.f-gr5-h-c > *:hover {
  color: var(--color-gr5);
}

.f-rd,
.f-rd-h:hover,
.f-rd-h-c > *:hover {
  color: var(--color-rd);
}

.f-og,
.f-og-h:hover,
.f-og-h-c > *:hover {
  color: var(--color-og);
}

.f-yl,
.f-yl-h:hover,
.f-yl-h-c > *:hover {
  color: var(--color-yl);
}

.f-gn,
.f-gn-h:hover,
.f-gn-h-c > *:hover {
  color: var(--color-gn);
}

.f-bl,
.f-bl-h:hover,
.f-bl-h-c > *:hover {
  color: var(--color-bl);
}

.f-kakao {
  color: #3c1e20;
}

.f-naver {
  color: #4dc83e;
}

.f-facebook {
  color: #385591;
}

.f-c1,
.f-c1-h:hover,
.f-c1-h-c > *:hover {
  color: var(--color-c1);
}

.f-c2,
.f-c2-h:hover,
.f-c2-h-c > *:hover {
  color: var(--color-c2);
}

.swiper-pagination-bullet {
  background-color: #fff;
}

.swiper-pagination-progressbar-fill,
.swiper-pagination-bullet-active {
  background-color: #fff;
}

.bw-switch.on {
  background: #3b39ff;
}

.c-n {
  background-color: transparent;
}

.c-bk,
.c-bk-c > *,
.c-bk-cc > * > *,
.c-bk-h:hover,
.c-bk-h-c > *:hover,
input[type="checkbox"]:checked + label:before {
  background-color: #000;
}

.c-rd,
.c-rd-c > *,
.c-rd-cc > * > *,
.c-rd-h:hover,
.c-rd-h-c > *:hover {
  background-color: var(--color-rd);
}

.c-og,
.c-og-c > * > *,
.c-og-h:hover,
.c-og-h-c > *:hover {
  background-color: var(--color-og);
}

.c-yl,
.c-yl-c > *,
.c-yl-cc > * > *,
.c-yl-h:hover,
.c-yl-h-c > *:hover {
  background-color: var(--color-yl);
}

.c-gn,
.c-gn-c > *,
.c-gn-cc > * > *,
.c-gn-h:hover,
.c-gn-h-c > *:hover {
  background-color: var(--color-gn);
}

.c-bl,
.c-bl-c > *,
.c-bl-cc > * > *,
.c-bl-h:hover,
.c-bl-h-c > *:hover {
  background-color: var(--color-bl);
}

.c-wt,
.c-wt-c > *,
.c-wt-cc > * > *,
.c-wt-h:hover,
.c-wt-h-c > *:hover {
  background-color: white;
}

.c-gr1,
.c-gr1-c > *,
.c-gr1-cc > * > *,
.c-gr1-h:hover,
.c-gr1-h-c > *:hover {
  background-color: var(--color-gr1);
}

.c-gr2,
.c-gr2-c > *,
.c-gr2-cc > * > *,
.c-gr2-h:hover,
.c-gr2-h-c > *:hover {
  background-color: var(--color-gr2);
}

.c-gr3,
.c-gr3-c > *,
.c-gr3-cc > * > *,
.c-gr3-h:hover,
.c-gr3-h-c > *:hover {
  background-color: var(--color-gr3);
}

.c-gr4,
.c-gr4-c > *,
.c-gr4-cc > * > *,
.c-gr4-h:hover,
.c-gr4-h-c > *:hover {
  background-color: var(--color-gr4);
}

.c-gr5,
.c-gr5-c > *,
.c-gr5-cc > * > *,
.c-gr5-h:hover,
.c-gr5-h-c > *:hover {
  background-color: var(--color-gr5);
}
.c-bg,
.c-bg-c > *,
.c-bg-cc > * > *,
.c-bg-h:hover,
.c-bg-h-c > *:hover {
  background-color: var(--color-bg);
}

.c-kakao {
  background-color: #fee500;
}

.c-naver {
  background-color: #60ca6c;
}

.c-facebook {
  background-color: #385591;
}

.c-c1,
.c-c1-c > *,
.c-c1-c > * > *,
.c-c1-h:hover,
.c-c1-h-c > *:hover {
  background-color: var(--color-c1);
}

.c-c2,
.c-c2-c > *,
.c-c2-c > * > *,
.c-c2-h:hover,
.c-c2-h-c > *:hover {
  background-color: var(--color-c2);
}
.c-c3,
.c-c3-c > *,
.c-c3-c > * > *,
.c-c3-h:hover,
.c-c3-h-c > *:hover {
  background-color: var(--color-c3);
}
.c-c4,
.c-c4-c > *,
.c-c4-c > * > *,
.c-c4-h:hover,
.c-c4-h-c > *:hover {
  background-color: var(--color-c4);
}

.ovl-l,
.ovl-l-c > *,
.ovl-l-cc > * > * {
  background-color: rgba(255, 255, 255, 0.2);
}

.ovl-d,
.ovl-d-c > *,
.ovl-d-cc > * > * {
  background-color: rgba(0, 0, 0, 0.7);
}

.ovl-gr,
.ovl-gr-c > *,
.ovl-gr-cc > * > * {
  background-color: rgba(0, 0, 0, 0.4);
}

.ovl-c,
.ovl-c-c > *,
.ovl-c-cc > * > * {
  background-color: rgba(28, 127, 243, 0.8);
}

.grd-1 {
  background: -webkit-linear-gradient(30deg, #621AFF 0%, #4A36FC 100%);
  background: -moz-linear-gradient(30deg, #621AFF 0%, #4A36FC 100%);
  background: -o-linear-gradient(30deg, #621AFF 0%, #4A36FC 100%);
  background: linear-gradient(30deg, #621AFF 0%, #4A36FC 100%);
}

.grd-v1 {
  background: -webkit-linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.0) 100%);
  background: -moz-linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.0) 100%);
  background: -o-linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.0) 100%);
  background: linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.0) 100%);
}

.grd-v2 {
  background: rgb(89, 89, 89);
  background: -moz-radial-gradient(
    circle,
    rgba(89, 89, 89, 1) 0%,
    rgba(48, 48, 48, 1) 100%
  );
  background: -webkit-radial-gradient(
    circle,
    rgba(89, 89, 89, 1) 0%,
    rgba(48, 48, 48, 1) 100%
  );
  background: radial-gradient(
    circle,
    rgba(89, 89, 89, 1) 0%,
    rgba(48, 48, 48, 1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#595959", endColorstr="#303030", GradientType=1);
}

.btn-1{background-color:var(--color-c2);color:#fff;}
.btn-b1{border:1px solid var(--color-c2);color:var(--color-c2);}
.btn-gr{background-color:var(--color-gr5);color:var(--color-gr2);}

@media screen and (max-width: 768px) {
  .c-wt-c > *{background-color:white;}
  .c-n-sm{background-color:transparent;}
}