@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500;700&display=swap");
@import url("https://spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css");
.primary {
  color: #00B400;
}

.system_red {
  color: #F44432;
}

.system_yellow {
  color: #FFC710;
}

.lv_yellow {
  color: #ffc60f;
}

.lv_orange {
  color: #ff8e00;
}

.lv_blue {
  color: #00ABEA;
}

.lv_purple {
  color: #6565d9;
}

.black {
  color: #2F2F2F;
}

.gray01 {
  color: #747474;
}

.gray02 {
  color: #9F9F9F;
}

.gray03 {
  color: #C9C9C9;
}

.gray04 {
  color: #DFDFDF;
}

.gray05 {
  color: #F5F5F5;
}

.primary {
  color: #00B400;
}

.system_red {
  color: #F44432;
}

.system_yellow {
  color: #FFC710;
}

.lv_yellow {
  color: #ffc60f;
}

.lv_orange {
  color: #ff8e00;
}

.lv_blue {
  color: #00ABEA;
}

.lv_purple {
  color: #6565d9;
}

.black {
  color: #2F2F2F;
}

.gray01 {
  color: #747474;
}

.gray02 {
  color: #9F9F9F;
}

.gray03 {
  color: #C9C9C9;
}

.gray04 {
  color: #DFDFDF;
}

.gray05 {
  color: #F5F5F5;
}

/* mediaquery */
/* typo */
/* grid */
/* card */
/***************************************************************
    01. base
***************************************************************/
* {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  outline: 0;
}

*,
:after,
:before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

:root {
  width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
  -moz-tab-size: 4;
    -o-tab-size: 4;
       tab-size: 4;
  background-color: #fff;
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  height: 100%;
  scroll-behavior: smooth;
}

main,
header,
section,
nav,
footer,
aside,
article,
figure {
  display: block;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

img {
  vertical-align: middle;
}

a {
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input,
textarea,
button {
  font-family: inherit;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0;
  outline-style: none;
  margin: 0;
  border: none;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

input:foucs {
  outline: none;
}

input::-webkit-input-placeholder {
  color: #b5b5b5;
  font-size: inherit;
  line-height: 1;
}

[type=radio],
[type=checkbox] {
  -webkit-appearance: auto;
     -moz-appearance: auto;
          appearance: auto;
  padding: 0;
}

[type=number] {
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
          appearance: none;
}

button {
  background: none;
  border: 0;
  cursor: pointer;
}

[type=search] {
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
          appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
          appearance: button;
  font: inherit;
}

/***************************************************************
    02. animations
***************************************************************/
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(0.5rem);
            transform: translateY(0.5rem);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes checkbg {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes circle {
  0% {
    -webkit-box-shadow: 0 0 0 0 white;
            box-shadow: 0 0 0 0 white;
  }
  100% {
    -webkit-box-shadow: 0 0 0 13px rgba(255, 255, 255, 0.1);
            box-shadow: 0 0 0 13px rgba(255, 255, 255, 0.1);
  }
}
@-webkit-keyframes step2 {
  0% {
    width: 0.3125rem;
  }
  100% {
    width: calc(100% / 8 * 3);
  }
}
@-webkit-keyframes step3 {
  0% {
    width: calc(100% / 8 * 3);
  }
  100% {
    width: calc(100% / 8 * 5);
  }
}
@-webkit-keyframes step4 {
  0% {
    width: calc(100% / 8 * 5);
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes stept {
  0% {
    color: #fff;
  }
  80% {
    color: #fff;
  }
  100% {
    color: #00B400;
  }
}
@-webkit-keyframes splashlogo {
  0% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes splashline1 {
  0% {
    height: 100%;
    opacity: 1;
  }
  50% {
    height: 100%;
    opacity: 1;
  }
  89% {
    opacity: 1;
  }
  90% {
    height: 20%;
    opacity: 0;
  }
  100% {
    height: 20%;
    opacity: 0;
  }
}
@-webkit-keyframes splashline2 {
  0% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    opacity: 1;
    left: -5.75rem;
  }
  25% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    opacity: 1;
    left: -5.75rem;
  }
  60% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  100% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    opacity: 1;
    left: 25.25rem;
  }
}
@-webkit-keyframes splashend {
  10% {
    opacity: 0;
  }
  90% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes dropdown {
  0% {
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  100% {
    -webkit-transform: translate(-50%, 180%);
            transform: translate(-50%, 180%);
  }
}
@-webkit-keyframes dropbg {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  30% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes load_circle {
  0% {
    scale: 1;
    opacity: 0.1;
  }
  100% {
    scale: 2.5;
    opacity: 0;
  }
}
@-webkit-keyframes loading1 {
  0% {
    height: 0.3125rem;
  }
  24% {
    height: 0.3125rem;
  }
  50% {
    height: 2rem;
  }
  60% {
    height: 2rem;
  }
  100% {
    height: 0.3125rem;
  }
}
@-webkit-keyframes loading2 {
  0% {
    height: 0.3125rem;
  }
  16% {
    height: 0.3125rem;
  }
  50% {
    height: 2rem;
  }
  60% {
    height: 2rem;
  }
  100% {
    height: 0.3125rem;
  }
}
@-webkit-keyframes loading3 {
  0% {
    height: 0.3125rem;
  }
  8% {
    height: 0.3125rem;
  }
  50% {
    height: 2rem;
  }
  60% {
    height: 2rem;
  }
  100% {
    height: 0.3125rem;
  }
}
@-webkit-keyframes dragpill {
  0% {
    top: 0.25rem;
  }
  50% {
    top: -0.25rem;
  }
  100% {
    top: 0.25rem;
  }
}
@-webkit-keyframes draghand {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-150%);
            transform: translateY(-150%);
  }
  70% {
    -webkit-transform: translateY(-150%);
            transform: translateY(-150%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes dragcircle {
  0% {
    scale: 1;
    opacity: 0.5;
  }
  100% {
    scale: 1.5;
    opacity: 0;
  }
}
@-webkit-keyframes fullpage {
  0% {
    opacity: 0;
    top: 0;
  }
  10% {
    opacity: 1;
    top: calc(100svh - 2rem);
    height: 2rem;
  }
  20% {
    opacity: 1;
    left: calc(50% - 1.5rem);
    top: calc(50% - 1.5rem);
    height: 3rem;
    position: relative;
  }
  21% {
    scale: 1;
  }
  40% {
    scale: 30;
  }
  70% {
    scale: 30;
  }
  98% {
    scale: 1;
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes roundborder {
  from {
    --p:0;
  }
}
@-webkit-keyframes prograssbar {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes nav {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes like {
  0% {
    background-size: 1.25rem;
    padding-left: 1.5rem;
  }
  80% {
    background-size: 1.5rem;
    padding-left: 1.625rem;
  }
  100% {
    background-size: 1.25rem;
    padding-left: 1.5rem;
  }
}
@-webkit-keyframes likel {
  0% {
    background-size: 2rem;
    padding-left: 2.25rem;
  }
  80% {
    background-size: 2.25rem;
    padding-left: 2.375rem;
  }
  100% {
    background-size: 2rem;
    padding-left: 2.25rem;
  }
}
@-webkit-keyframes lv_circle {
  0% {
    opacity: 0;
    scale: 0.8;
  }
  80% {
    opacity: 1;
    scale: 1;
  }
}
@-webkit-keyframes lv_line {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-5%);
            transform: translateY(-5%);
  }
  80% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@-webkit-keyframes chat_ld {
  0% {
    background: #9F9F9F;
  }
  33% {
    background: #C9C9C9;
  }
  66% {
    background: #DFDFDF;
  }
  100% {
    background: #DFDFDF;
  }
}
@-webkit-keyframes skeleton {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}
@-webkit-keyframes fullcover {
  0% {
    height: 0%;
    background-color: transparent;
  }
  100% {
    height: 100%;
    background-color: #00B400;
  }
}
@-webkit-keyframes loading {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 1;
  }
  34% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes navlotate {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}
@-webkit-keyframes navwidth {
  0% {
    width: 23.8889vw;
    max-width: 5.375rem;
  }
  90% {
    width: 23.8889vw;
    max-width: 5.375rem;
  }
  100% {
    width: 43.3333vw;
  }
}
@-webkit-keyframes navname {
  0% {
    opacity: 0;
  }
  90% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes navbottom {
  0% {
    bottom: -100svh;
  }
  100% {
    bottom: 0;
  }
}
@-webkit-keyframes waterbg {
  0% {
    bottom: -100%;
  }
  100% {
    bottom: -45%;
  }
}
/***************************************************************
    03. layer
***************************************************************/
:root {
  --header-height: 3rem;
  --nav-height: 3.4375rem;
  --tapmenu-height: 2.625rem;
  --base-height: calc(var(--header-height));
  --main-height: calc(var(--header-height) + var(--nav-height));
  --full-height: calc(var(--header-height) + var(--nav-height) + var(--tapmenu-height));
}

.main {
  width: 100%;
  min-height: 100svh;
  background-color: #fff;
}

.contents {
  width: 100%;
  padding: 0rem 1rem;
  background-color: #fff;
  position: relative;
  padding-top: var(--header-height);
}

.section_b::after {
  content: "";
  display: block;
  position: absolute;
  left: -1rem;
  bottom: 0;
  background-color: #F5F5F5;
  width: calc(100% + 2rem);
  height: 0.5rem;
}

.section_bb::after {
  content: "";
  display: block;
  position: absolute;
  left: -1.25rem;
  bottom: 0;
  background-color: #F5F5F5;
  width: calc(100% + 2.5rem);
  height: 0.5rem;
}

.section {
  padding: 0 0.25rem 1.5rem;
  position: relative;
}

.pd_none {
  padding-bottom: 0;
}

.mb_0_5 {
  margin-bottom: 0.5rem;
}

.mb_1 {
  margin-bottom: 1rem;
}

.mb_1_5 {
  margin-bottom: 1.5rem;
}

.mb_2 {
  margin-bottom: 2rem;
}

.mb_2_5 {
  margin-bottom: 2.5rem;
}

.mb_3 {
  margin-bottom: 3rem;
}

.acenter {
  text-align: center;
}

.pd_bottom::after {
  content: "";
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  height: 15svh;
  background-color: #F5F5F5;
  display: block;
}

.pd_bottom_s::after {
  content: "";
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  height: 10svh;
  background-color: #F5F5F5;
  display: block;
}

.nav_padding::after {
  content: "";
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  height: calc(10svh + 2rem);
  display: block;
}

.flexbtw {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* 전체페이지 로딩 */
.basicLoading {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 100;
}
.basicLoading #basicLoading_img {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-width: 5rem;
  width: 22.2841vw;
}

.txt_center {
  text-align: center;
}

/*font*/
/***************************************************************
    04. typo
***************************************************************/
:root {
  --h1-f: 1.5rem;
  --h2-f: 1.25rem;
  --h3-f: 1.125rem;
  --p1-f: 1.25rem;
  --p2-f: .9375rem;
  --p3-f: .875rem;
  --p4-f: .8125rem;
  --p5-f: .75rem;
  --p6-f: 1.125rem;
  --p7-f: 1rem;
  --span1-f: .9375rem;
  --span2-f: .8125rem;
  --span3-f: .75rem;
  --span4-f: .625rem;
  --misc1-f: .9375rem;
  --misc2-f: .8125rem;
  --line-th: line-through;
  --line-under: underline;
  --bold-f: 700;
  --line-h: 1.5;
}

body {
  font-family: "Spoqa Han Sans Neo", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "sans-serif";
  font-weight: 500;
  line-height: 1.2;
  color: #2F2F2F;
}

.h1_f {
  font-size: var(--h1-f);
  font-weight: var(--bold-f);
}

.h2_f {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
}

.h3_f {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
}

.p1_f {
  font-size: var(--p1-f);
  line-height: var(--line-h);
}

.p1_fb {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p2_f {
  font-size: var(--p2-f);
  line-height: var(--line-h);
}

.p2_fb {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p3_f {
  font-size: var(--p3-f);
  line-height: var(--line-h);
}

.p3_fb {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p4_f {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}

.p4_fb {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p5_f {
  font-size: var(--p5-f);
  line-height: var(--line-h);
}

.p5_fb {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p6_f {
  font-size: var(--p6-f);
  line-height: var(--line-h);
}

.p6_fb {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.p7_f {
  font-size: var(--p7-f);
  line-height: var(--line-h);
}

.p7_fb {
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.span1_f {
  font-size: var(--span1-f);
}

.span1_fb {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}

.span2_f {
  font-size: var(--span2-f);
}

.span2_fb {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}

.span3_f {
  font-size: var(--span3-f);
}

.span3_fb {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
}

.span4_f {
  font-size: var(--span4-f);
}

.span4_fb {
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
}

.misc1_th {
  font-size: var(--misc1-f);
  -webkit-text-decoration: var(--line-th);
          text-decoration: var(--line-th);
}

.misc1_thb {
  font-size: var(--misc1-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-th);
          text-decoration: var(--line-th);
}

.misc2_th {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-th);
          text-decoration: var(--line-th);
}

.misc2_thb {
  font-size: var(--misc2-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-th);
          text-decoration: var(--line-th);
}

.misc1_under {
  font-size: var(--misc1-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
}

.misc1_underb {
  font-size: var(--misc1-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
}

.misc2_under {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
}

.misc2_underb {
  font-size: var(--misc2-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
}

.line_h {
  line-height: var(line-height);
}

.line_th {
  -webkit-text-decoration: var(--line-th);
          text-decoration: var(--line-th);
}

.line_under {
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
}

.bold_f {
  font-weight: var(--bold-f);
}

.point_f {
  font-family: "Poppins";
}

@media (max-width: 359px) {
  :root {
    --h1-f: 6.6852vw;
    --h2-f: 5.571vw;
    --h3-f: 5.0139vw;
    --p1-f: 5.571vw;
    --p2-f: 4.178vw;
    --p3-f: 3.8997vw;
    --p4-f: 3.6212vw;
    --p5-f: 3.3426vw;
    --p6-f: 5.0139vw;
    --p7-f: 4.4568vw;
    --span1-f: 4.178vw;
    --span2-f: 3.6212vw;
    --span3-f: 3.3426vw;
    --span4-f: 2.7855vw;
    --misc1-f: 4.1783vw;
    --misc2-f: 3.6212vw;
  }
}
/***************************************************************
    05. buttons
***************************************************************/
/* btn grid */
.btn_wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2rem 1rem 1.5rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
}
.btn_wrap .toast {
  top: -1.5rem;
  bottom: initial;
}
.btn_wrap .btn_b + .toast {
  top: -1.1875rem;
  bottom: initial;
}

.btn_wide.btn_fix {
  padding: 0;
}
.btn_wide.btn_fix .btn_basic {
  margin: 0;
  border-radius: 0;
}
.btn_wide.btn_fix .qna_noti {
  margin: 1rem;
}

.btn_fix {
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
  padding: 1.5rem 1rem;
  z-index: 10;
}
.btn_fix button + .toast {
  bottom: 5.375rem;
}
@media (max-device-width: 320px) {
  .btn_fix button + .toast {
    bottom: 5.25rem;
  }
}
.btn_fix .navtoast {
  bottom: 3.9375rem;
}
.btn_fix .btn_db {
  bottom: 8.75rem;
}
@media (max-device-width: 320px) {
  .btn_fix .btn_db {
    bottom: 8.4375rem;
  }
}
.btn_fix .btn_w + .qna_noti {
  position: absolute;
  bottom: 5.375rem;
  width: calc(100% - 2rem);
}
.btn_fix .qna_noti + .toast {
  bottom: 9.0625rem;
}
.btn_fix .home_top {
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  width: 2.75rem;
  height: 2.75rem;
  background: #fff url(../images/icon/top.svg) no-repeat;
  background-position: center;
  border-radius: 50%;
  position: absolute;
  right: 1rem;
  top: -5rem;
}
.btn_fix .qna_noti + .home_top {
  top: -4rem;
}

.home_top {
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  width: 2.75rem;
  height: 2.75rem;
  background: #fff url(../images/icon/top.svg) no-repeat;
  background-position: center;
  border-radius: 50%;
  position: absolute;
  right: 1rem;
  opacity: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.home_top.topbtn {
  opacity: 1;
}

.btn_fixgr {
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
  padding: 2.5rem 1rem 1.5rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(40%, #fff));
  background: linear-gradient(transparent 0, #fff 40%);
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 111;
}
.btn_fixgr button + .toast {
  bottom: 5.375rem;
}
.btn_fixgr button + .home_top {
  bottom: 5.375rem;
}
.btn_fixgr .qna_noti + .home_top {
  bottom: 5rem;
}
.btn_fixgr .toast ~ .home_top {
  bottom: 8.875rem;
}
.btn_fixgr .bt_bb {
  position: absolute;
  top: -0.75rem;
  left: 0;
  width: 100%;
  z-index: 11;
}
.btn_fixgr .bt_bb .bbpop {
  margin: 0 auto;
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.btn_fix_home {
  position: fixed;
  bottom: calc(var(--nav-height) + 1.5rem);
  width: 100%;
  left: 0;
  padding: 0 1rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(40%, #fff));
  background: linear-gradient(transparent 0, #fff 40%);
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 111;
}

.btn_left {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}

.btn_right {
  position: fixed;
  right: 1.25rem;
  bottom: 0.5rem;
  z-index: 1;
}
.btn_right.nav_btn {
  bottom: 3.9375rem;
}
.btn_right + .btn_fix .toast {
  bottom: 3.6875rem;
}
@media (max-device-width: 320px) {
  .btn_right + .btn_fix .toast {
    bottom: 3.4375rem;
  }
}

.btn_inner {
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
}

/* btn */
.btn_w {
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  padding: 1rem 0;
}

.btn_b {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  border-radius: 0.5rem;
  width: 100%;
  padding: 1rem 0;
  margin: 0.25rem 0;
  line-height: 1;
}
.btn_b.btn_trans {
  padding: 0.5rem 0 0;
}

.wide_btn {
  border-radius: 0;
  margin: 0;
}

.btn_m {
  font-size: var(--span2-f);
  border-radius: 0.25rem;
  padding: 0.532rem 0.75rem;
  line-height: 1;
}

.btn_s {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  border-radius: 0.25rem;
  padding: 0.469rem 0.625rem;
  line-height: 1;
}

.btn_icon {
  font-size: var(--span3-f);
  border-radius: 3rem;
  padding: 0.282rem 0.625rem;
  border: 1px solid transparent;
  display: inline-block;
  line-height: 1;
}

.btn_edit {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
}
.btn_edit.edit_ok {
  color: #00B400;
}

.btn_social {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  width: 100%;
  padding: 0.75rem 0;
  border-radius: 0.25rem;
  margin: 0.25rem 0;
}

.btn_black {
  background: #2F2F2F;
  color: #fff;
  font-size: var(--span1-f);
  line-height: 1;
  border-radius: 3rem;
  padding: 0.75rem 1rem;
  -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.btn_black img {
  margin-right: 0.5rem;
}

.btn_blacks {
  background-color: #2F2F2F;
  color: #fff;
}

button:disabled {
  background-color: #C9C9C9;
  color: #9F9F9F;
}

.btn_basic {
  background-color: #00B400;
  color: #fff;
}

.btn_red {
  background-color: #F44432;
  color: #fff;
}

.btn_light {
  background-color: #F5F5F5;
  color: #9F9F9F;
}

.btn_light.btn_b {
  color: #747474;
}

.btn_white {
  background-color: #fff;
  color: #747474;
  bordeR: 1px solid #DFDFDF;
}
.btn_white.btn_s, .btn_white.btn_m, .btn_white.btn_icon {
  color: #9F9F9F;
}

.btn_trans {
  background-color: transparent;
  color: #747474;
}

.btn_border {
  background-color: #fff;
  border-color: #00B400;
  color: #00B400;
}

.btn_kakao {
  background-color: #FEE500;
  color: #191919;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.6875rem 0;
}
.btn_kakao img {
  margin-right: 0.5rem;
}

.btn_apple {
  background-color: #000;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.6875rem 0;
}
.btn_apple img {
  margin-right: 0.5rem;
}

.btn_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.9375rem 0;
  line-height: 1;
}
.btn_img img {
  margin: 0 0.25rem;
}

.btn_m.btn_img {
  padding: 0.5rem 0.75rem;
}

.btn_s.btn_img {
  padding: 0.315rem 0.625rem;
}
.btn_s.btn_img img {
  width: 1rem;
}

.icon_s {
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  padding: 0.25rem 0.5rem;
  font-size: var(--span4-f);
}
.icon_s.icon_basic {
  background: rgba(0, 180, 0, 0.1);
  color: #00B400;
}
.icon_s.icon_red {
  background: rgba(244, 68, 50, 0.05);
  color: #F44432;
}
.icon_s.icon_gray {
  background: #F5F5F5;
  color: #747474;
}

/***************************************************************
    06. form
***************************************************************/
/* ------- input ----------- */
input[type=text],
input[type=number],
input[type=search],
input[type=password],
input[type=email] {
  background-color: #F5F5F5;
  border-radius: 0.5rem;
  padding: 1rem 0.75rem;
  font-size: var(--span2-f);
  width: 100%;
}
input[type=text]:focus, input[type=text]:hover,
input[type=number]:focus,
input[type=number]:hover,
input[type=search]:focus,
input[type=search]:hover,
input[type=password]:focus,
input[type=password]:hover,
input[type=email]:focus,
input[type=email]:hover {
  background-color: rgba(0, 180, 0, 0.05);
}
input[type=text]::-webkit-input-placeholder, input[type=number]::-webkit-input-placeholder, input[type=search]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
input[type=text]::-moz-placeholder, input[type=number]::-moz-placeholder, input[type=search]::-moz-placeholder, input[type=password]::-moz-placeholder, input[type=email]::-moz-placeholder {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
input[type=text]:-ms-input-placeholder, input[type=number]:-ms-input-placeholder, input[type=search]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
input[type=text]::-ms-input-placeholder, input[type=number]::-ms-input-placeholder, input[type=search]::-ms-input-placeholder, input[type=password]::-ms-input-placeholder, input[type=email]::-ms-input-placeholder {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
input[type=text]::placeholder,
input[type=number]::placeholder,
input[type=search]::placeholder,
input[type=password]::placeholder,
input[type=email]::placeholder {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
input[type=text]:disabled,
input[type=number]:disabled,
input[type=search]:disabled,
input[type=password]:disabled,
input[type=email]:disabled {
  background-color: var(--gray04);
}
input[type=text]:disabled::-webkit-input-placeholder, input[type=number]:disabled::-webkit-input-placeholder, input[type=search]:disabled::-webkit-input-placeholder, input[type=password]:disabled::-webkit-input-placeholder, input[type=email]:disabled::-webkit-input-placeholder {
  color: var(--gray02);
}
input[type=text]:disabled::-moz-placeholder, input[type=number]:disabled::-moz-placeholder, input[type=search]:disabled::-moz-placeholder, input[type=password]:disabled::-moz-placeholder, input[type=email]:disabled::-moz-placeholder {
  color: var(--gray02);
}
input[type=text]:disabled:-ms-input-placeholder, input[type=number]:disabled:-ms-input-placeholder, input[type=search]:disabled:-ms-input-placeholder, input[type=password]:disabled:-ms-input-placeholder, input[type=email]:disabled:-ms-input-placeholder {
  color: var(--gray02);
}
input[type=text]:disabled::-ms-input-placeholder, input[type=number]:disabled::-ms-input-placeholder, input[type=search]:disabled::-ms-input-placeholder, input[type=password]:disabled::-ms-input-placeholder, input[type=email]:disabled::-ms-input-placeholder {
  color: var(--gray02);
}
input[type=text]:disabled::placeholder,
input[type=number]:disabled::placeholder,
input[type=search]:disabled::placeholder,
input[type=password]:disabled::placeholder,
input[type=email]:disabled::placeholder {
  color: var(--gray02);
}
input[type=text]:-moz-placeholder-shown ~ .btnClear, input[type=number]:-moz-placeholder-shown ~ .btnClear, input[type=search]:-moz-placeholder-shown ~ .btnClear, input[type=password]:-moz-placeholder-shown ~ .btnClear, input[type=email]:-moz-placeholder-shown ~ .btnClear {
  opacity: 0;
}
input[type=text]:-ms-input-placeholder ~ .btnClear, input[type=number]:-ms-input-placeholder ~ .btnClear, input[type=search]:-ms-input-placeholder ~ .btnClear, input[type=password]:-ms-input-placeholder ~ .btnClear, input[type=email]:-ms-input-placeholder ~ .btnClear {
  opacity: 0;
}
input[type=text]:placeholder-shown ~ .btnClear,
input[type=number]:placeholder-shown ~ .btnClear,
input[type=search]:placeholder-shown ~ .btnClear,
input[type=password]:placeholder-shown ~ .btnClear,
input[type=email]:placeholder-shown ~ .btnClear {
  opacity: 0;
}
input[type=text]:-moz-placeholder-shown ~ .pass_view, input[type=number]:-moz-placeholder-shown ~ .pass_view, input[type=search]:-moz-placeholder-shown ~ .pass_view, input[type=password]:-moz-placeholder-shown ~ .pass_view, input[type=email]:-moz-placeholder-shown ~ .pass_view {
  opacity: 0;
}
input[type=text]:-ms-input-placeholder ~ .pass_view, input[type=number]:-ms-input-placeholder ~ .pass_view, input[type=search]:-ms-input-placeholder ~ .pass_view, input[type=password]:-ms-input-placeholder ~ .pass_view, input[type=email]:-ms-input-placeholder ~ .pass_view {
  opacity: 0;
}
input[type=text]:placeholder-shown ~ .pass_view,
input[type=number]:placeholder-shown ~ .pass_view,
input[type=search]:placeholder-shown ~ .pass_view,
input[type=password]:placeholder-shown ~ .pass_view,
input[type=email]:placeholder-shown ~ .pass_view {
  opacity: 0;
}
input[type=text]:not(:focus):not(:-moz-placeholder-shown):invalid, input[type=number]:not(:focus):not(:-moz-placeholder-shown):invalid, input[type=search]:not(:focus):not(:-moz-placeholder-shown):invalid, input[type=password]:not(:focus):not(:-moz-placeholder-shown):invalid, input[type=email]:not(:focus):not(:-moz-placeholder-shown):invalid {
  background-color: rgba(236, 115, 109, 0.05);
  background-image: none;
}
input[type=text]:not(:focus):not(:-ms-input-placeholder):invalid, input[type=number]:not(:focus):not(:-ms-input-placeholder):invalid, input[type=search]:not(:focus):not(:-ms-input-placeholder):invalid, input[type=password]:not(:focus):not(:-ms-input-placeholder):invalid, input[type=email]:not(:focus):not(:-ms-input-placeholder):invalid {
  background-color: rgba(236, 115, 109, 0.05);
  background-image: none;
}
input[type=text]:not(:focus):not(:placeholder-shown):invalid,
input[type=number]:not(:focus):not(:placeholder-shown):invalid,
input[type=search]:not(:focus):not(:placeholder-shown):invalid,
input[type=password]:not(:focus):not(:placeholder-shown):invalid,
input[type=email]:not(:focus):not(:placeholder-shown):invalid {
  background-color: rgba(236, 115, 109, 0.05);
  background-image: none;
}
input[type=text]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .btnClear, input[type=number]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .btnClear, input[type=search]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .btnClear, input[type=password]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .btnClear, input[type=email]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .btnClear {
  opacity: 0;
}
input[type=text]:not(:focus):not(:-ms-input-placeholder):invalid ~ .btnClear, input[type=number]:not(:focus):not(:-ms-input-placeholder):invalid ~ .btnClear, input[type=search]:not(:focus):not(:-ms-input-placeholder):invalid ~ .btnClear, input[type=password]:not(:focus):not(:-ms-input-placeholder):invalid ~ .btnClear, input[type=email]:not(:focus):not(:-ms-input-placeholder):invalid ~ .btnClear {
  opacity: 0;
}
input[type=text]:not(:focus):not(:placeholder-shown):invalid ~ .btnClear,
input[type=number]:not(:focus):not(:placeholder-shown):invalid ~ .btnClear,
input[type=search]:not(:focus):not(:placeholder-shown):invalid ~ .btnClear,
input[type=password]:not(:focus):not(:placeholder-shown):invalid ~ .btnClear,
input[type=email]:not(:focus):not(:placeholder-shown):invalid ~ .btnClear {
  opacity: 0;
}
input[type=text]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .pass_view, input[type=number]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .pass_view, input[type=search]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .pass_view, input[type=password]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .pass_view, input[type=email]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .pass_view {
  opacity: 0;
}
input[type=text]:not(:focus):not(:-ms-input-placeholder):invalid ~ .pass_view, input[type=number]:not(:focus):not(:-ms-input-placeholder):invalid ~ .pass_view, input[type=search]:not(:focus):not(:-ms-input-placeholder):invalid ~ .pass_view, input[type=password]:not(:focus):not(:-ms-input-placeholder):invalid ~ .pass_view, input[type=email]:not(:focus):not(:-ms-input-placeholder):invalid ~ .pass_view {
  opacity: 0;
}
input[type=text]:not(:focus):not(:placeholder-shown):invalid ~ .pass_view,
input[type=number]:not(:focus):not(:placeholder-shown):invalid ~ .pass_view,
input[type=search]:not(:focus):not(:placeholder-shown):invalid ~ .pass_view,
input[type=password]:not(:focus):not(:placeholder-shown):invalid ~ .pass_view,
input[type=email]:not(:focus):not(:placeholder-shown):invalid ~ .pass_view {
  opacity: 0;
}
input[type=text].clearInput:required:valid ~ .btnClear,
input[type=number].clearInput:required:valid ~ .btnClear,
input[type=search].clearInput:required:valid ~ .btnClear,
input[type=password].clearInput:required:valid ~ .btnClear,
input[type=email].clearInput:required:valid ~ .btnClear {
  opacity: 0;
}
input[type=text]:focus:required:valid ~ button,
input[type=number]:focus:required:valid ~ button,
input[type=search]:focus:required:valid ~ button,
input[type=password]:focus:required:valid ~ button,
input[type=email]:focus:required:valid ~ button {
  color: #9F9F9F;
  background: #fff;
  border-color: #DFDFDF;
}
input[type=text]:required:valid ~ button,
input[type=number]:required:valid ~ button,
input[type=search]:required:valid ~ button,
input[type=password]:required:valid ~ button,
input[type=email]:required:valid ~ button {
  background-color: #00B400;
  color: #fff;
  border-color: transparent;
}
input[type=text]:required:valid ~ .input_time,
input[type=number]:required:valid ~ .input_time,
input[type=search]:required:valid ~ .input_time,
input[type=password]:required:valid ~ .input_time,
input[type=email]:required:valid ~ .input_time {
  right: 6rem;
}
@media (max-device-width: 320px) {
  input[type=text]:required:valid ~ .input_time,
input[type=number]:required:valid ~ .input_time,
input[type=search]:required:valid ~ .input_time,
input[type=password]:required:valid ~ .input_time,
input[type=email]:required:valid ~ .input_time {
    right: 5.75rem;
  }
}
input[type=text]:not(:focus):not(:-moz-placeholder-shown):valid ~ .input_time, input[type=text]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .input_time, input[type=number]:not(:focus):not(:-moz-placeholder-shown):valid ~ .input_time, input[type=number]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .input_time, input[type=search]:not(:focus):not(:-moz-placeholder-shown):valid ~ .input_time, input[type=search]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .input_time, input[type=password]:not(:focus):not(:-moz-placeholder-shown):valid ~ .input_time, input[type=password]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .input_time, input[type=email]:not(:focus):not(:-moz-placeholder-shown):valid ~ .input_time, input[type=email]:not(:focus):not(:-moz-placeholder-shown):invalid ~ .input_time {
  right: 4.25rem;
}
input[type=text]:not(:focus):not(:-ms-input-placeholder):valid ~ .input_time, input[type=text]:not(:focus):not(:-ms-input-placeholder):invalid ~ .input_time, input[type=number]:not(:focus):not(:-ms-input-placeholder):valid ~ .input_time, input[type=number]:not(:focus):not(:-ms-input-placeholder):invalid ~ .input_time, input[type=search]:not(:focus):not(:-ms-input-placeholder):valid ~ .input_time, input[type=search]:not(:focus):not(:-ms-input-placeholder):invalid ~ .input_time, input[type=password]:not(:focus):not(:-ms-input-placeholder):valid ~ .input_time, input[type=password]:not(:focus):not(:-ms-input-placeholder):invalid ~ .input_time, input[type=email]:not(:focus):not(:-ms-input-placeholder):valid ~ .input_time, input[type=email]:not(:focus):not(:-ms-input-placeholder):invalid ~ .input_time {
  right: 4.25rem;
}
input[type=text]:not(:focus):not(:placeholder-shown):valid ~ .input_time, input[type=text]:not(:focus):not(:placeholder-shown):invalid ~ .input_time,
input[type=number]:not(:focus):not(:placeholder-shown):valid ~ .input_time,
input[type=number]:not(:focus):not(:placeholder-shown):invalid ~ .input_time,
input[type=search]:not(:focus):not(:placeholder-shown):valid ~ .input_time,
input[type=search]:not(:focus):not(:placeholder-shown):invalid ~ .input_time,
input[type=password]:not(:focus):not(:placeholder-shown):valid ~ .input_time,
input[type=password]:not(:focus):not(:placeholder-shown):invalid ~ .input_time,
input[type=email]:not(:focus):not(:placeholder-shown):valid ~ .input_time,
input[type=email]:not(:focus):not(:placeholder-shown):invalid ~ .input_time {
  right: 4.25rem;
}
input[type=text]:-moz-read-only, input[type=number]:-moz-read-only, input[type=search]:-moz-read-only, input[type=password]:-moz-read-only, input[type=email]:-moz-read-only {
  background-color: #DFDFDF;
  cursor: auto;
}
input[type=text]:read-only,
input[type=number]:read-only,
input[type=search]:read-only,
input[type=password]:read-only,
input[type=email]:read-only {
  background-color: #DFDFDF;
  cursor: auto;
}

input[type=file] {
  display: none;
}

/* ---------------- input grid --------------- */
.input_block {
  width: 100%;
  padding: 0.5rem 0;
  position: relative;
}
.input_block label {
  font-size: var(--span2-f);
  display: block;
  margin-bottom: 0.25rem;
}
.input_block .input_error {
  color: #F44432;
  font-size: var(--span3-f);
  margin-top: 0.5rem;
}
.input_block .input_info {
  color: #9F9F9F;
  font-size: var(--span3-f);
  margin-top: 0.25rem;
}
.input_block .input_infob {
  color: #2F2F2F;
  font-size: var(--span3-f);
}
.input_block .input_ok {
  color: #00B400;
  font-size: var(--span3-f);
  margin-top: 0.5rem;
}

.input_basic {
  position: relative;
}
.input_basic .clearInput {
  padding-right: 2.5rem;
}

.input_ptck {
  position: relative;
}
.input_ptck .clearInput {
  padding-right: 2.5rem;
}

.add_file .file_list {
  width: 5.375rem;
  aspect-ratio: 1;
  border-radius: 0.5rem;
  overflow: hidden;
  position: relative;
}
.add_file .file_list::after {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.add_file .deleteBtn {
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/icon/delete_gr.svg) no-repeat;
  width: 2rem;
  aspect-ratio: 1;
  z-index: 1;
  cursor: pointer;
}

.input_file {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.input_file label {
  width: 5.375rem;
  aspect-ratio: 1;
  border-radius: 0.5rem;
  background: #F5F5F5 url(../images/icon/camera.svg) no-repeat center;
}
.input_file::after {
  display: none;
}

/* ------------------- input option -------------------- */
.input_ptck input {
  background: #F5F5F5 url(../images/icon/check_off.svg) no-repeat;
  background-size: inherit;
  background-position: calc(100% - 1rem) center;
  position: relative;
}
.input_ptck input:focus {
  background-image: none;
}
.input_ptck input:required:valid {
  background-image: url(../images/icon/check_on.svg);
}
.input_ptck input:required:valid:focus {
  background-image: none;
}

.btnClear {
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: url(../images/icon/delete_gr.svg) no-repeat center;
  top: 50%;
  right: 0.75rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  opacity: 1;
  cursor: pointer;
}

.btnSearch {
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: transparent url(../images/icon/search.svg) no-repeat center;
  top: 50%;
  right: 0.75rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  font-size: 0;
  z-index: 2;
}
.pass_view {
  width: 2rem;
  height: 2rem;
  position: absolute;
  right: 3rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background: url(../images/icon/eyeOn.svg) no-repeat center;
  cursor: pointer;
  opacity: 1;
}
.pass_view.pass_view-on {
  background: url(../images/icon/eyeOff.svg) no-repeat center;
}

.input_btn .btn_m {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 0.75rem;
}
.input_btn .input_btnl + .btnClear {
  right: 7.5rem;
}
@media (max-device-width: 320px) {
  .input_btn .input_btnl + .btnClear {
    right: 7rem;
  }
}
.input_btn .input_btns + .btnClear {
  right: 4.25rem;
}
@media (max-device-width: 320px) {
  .input_btn .input_btns + .btnClear {
    right: 4rem;
  }
}
.input_btn .input_time {
  font-size: var(--span2-f);
  color: #9F9F9F;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 4.25rem;
  font-weight: var(--bold-f);
}

.input_search {
  position: relative;
}
.input_search .clearInput ~ .btnClear {
  right: 3rem;
}

/* ---------------- textarea -------------------- */
textarea {
  background-color: #F5F5F5;
  border-radius: 0.5rem;
  padding: 1rem 0.75rem;
  width: 100%;
  resize: vertical;
  font-size: var(--span2-f);
  line-height: var(--line-h);
}
textarea::-webkit-input-placeholder {
  color: #C9C9C9;
}
textarea::-moz-placeholder {
  color: #C9C9C9;
}
textarea:-ms-input-placeholder {
  color: #C9C9C9;
}
textarea::-ms-input-placeholder {
  color: #C9C9C9;
}
textarea::placeholder {
  color: #C9C9C9;
}

.textarea_block {
  margin: 0 0 0.5rem;
}
.textarea_block label {
  font-size: var(--span2-f);
  display: block;
  margin-bottom: 0.5rem;
}

/* ------------------- select --------------------- */
.select_block {
  width: 100%;
  position: relative;
}
.select_block label {
  font-size: var(--span2-f);
  display: block;
  margin-bottom: 0.5rem;
}
.select_block .selectBtn {
  background: #F5F5F5 url(../images/icon/down.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
  width: 100%;
  border-radius: 0.5rem;
  font-size: var(--span2-f);
  color: #C9C9C9;
  padding: 1rem 0.75rem;
  text-align: left;
}
.select_block .selectBtn.optSlt {
  color: #2F2F2F;
}
.select_block .optionList {
  position: absolute;
  left: 0;
  width: 100%;
  border-left: 1px solid #DFDFDF;
  border-right: 1px solid #DFDFDF;
  margin-top: 0.5rem;
  -webkit-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  max-height: 0;
  overflow: hidden;
  z-index: 10;
}
.select_block .optionList .optionItem {
  border-bottom: 1px solid #DFDFDF;
  color: #747474;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
  background-color: #fff;
  padding: 1rem 0.75rem;
  cursor: pointer;
}
.select_block .optionList .optionItem:first-child {
  border-top: 1px solid #DFDFDF;
}
.select_block .optionList .optionItem:hover {
  background-color: #F5F5F5;
}
.select_block .optionList.optionmodal {
  position: fixed;
  bottom: -10vh;
  background-color: #fff;
  border-radius: 1.5rem 1.5rem 0 0;
  z-index: 112;
  padding: 1rem 0;
  overflow: initial;
}
.select_block .optionList.optionmodal .optionItem {
  border-color: #fff;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  color: #2F2F2F;
  padding: 1rem 2rem;
}
.select_block .optionList.optionmodal .optionItem.op_disabled {
  color: #C9C9C9;
}
.select_block .optionList.optionmodal .toast {
  top: -3.5625rem;
  bottom: initial;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: none;
}
.select_block .overlay {
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: -1;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.select_block.active .optionmodal {
  bottom: 0;
}
.select_block.active .optionmodal .toast {
  display: block;
}
.select_block.active .overlay {
  z-index: 2;
  opacity: 0.6;
}
.select_block .selectArrow {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.select_block.active .selectBtn {
  background: #F5F5F5 url(../images/icon/top.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
}
.select_block.active .optionList {
  max-height: 500px;
}

/* -------------- toggle ------------------ */
.toggle_block .toggle {
  display: none;
}
.toggle_block .toggle + .toggle_btn {
  display: block;
  width: 2.875rem;
  height: 1.75rem;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background: #DFDFDF;
  border-radius: 2.875rem;
  padding: 2px;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
@media (max-device-width: 359px) {
  .toggle_block .toggle + .toggle_btn {
    scale: 0.9;
  }
}
.toggle_block .toggle + .toggle_btn:after, .toggle_block .toggle + .toggle_btn::before {
  position: relative;
  display: block;
  content: "";
  width: 1.5rem;
  height: 100%;
}
.toggle_block .toggle + .toggle_btn:after {
  left: 0;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.toggle_block .toggle + .toggle_btn:before {
  display: none;
}
.toggle_block .toggle:checked + .toggle_btn {
  background: #00B400;
}
.toggle_block .toggle:checked + .toggle_btn:after {
  left: 1.125rem;
}

/* ----------------- checkbox ----------------- */
.input_check {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.input_check input[type=checkbox],
.input_check input[type=radio] {
  display: none;
}
.input_check input[type=checkbox] ~ .ck_line,
.input_check input[type=radio] ~ .ck_line {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  display: block;
  padding: 0.375rem 1rem 0.5rem 2rem;
  background: url(../images/icon/checkBtn_off.svg) no-repeat;
  background-position: top left;
  background-size: 2rem;
  cursor: pointer;
}
.input_check input[type=checkbox]:checked ~ .ck_line,
.input_check input[type=radio]:checked ~ .ck_line {
  background: url(../images/icon/checkBtn_on.svg) no-repeat;
  background-size: 2rem;
  background-position: top left;
}
.input_check input[type=checkbox] ~ .ck_circle,
.input_check input[type=radio] ~ .ck_circle {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  display: block;
  padding: 0.375rem 1rem 0.5rem 2rem;
  background: url(../images/icon/radioBtn_off.svg) no-repeat;
  background-size: 2rem;
  background-position: top left;
  cursor: pointer;
}
.input_check input[type=checkbox]:checked ~ .ck_circle,
.input_check input[type=radio]:checked ~ .ck_circle {
  background: url(../images/icon/radioBtn_on.svg) no-repeat;
  background-size: 2rem;
  background-position: top left;
}

/***************************************************************
    07. components
***************************************************************/
.cardround {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
}
@media (max-device-width: 320px) {
  .cardround {
    padding: 1rem;
  }
}

.cardround_shadow {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
}

.card_point {
  border-radius: 0.5rem;
  padding: 1.5rem;
  position: relative;
}

.infocard {
  border-radius: 0 1rem 1rem 1rem;
  padding: 1rem;
  position: relative;
}

.card_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  margin: 0.5rem 0;
}
.card_wrap .card_point,
.card_wrap .cardround {
  width: 50%;
  border-radius: 1rem 0 0 0;
}

.bg_gr {
  background-color: rgba(0, 180, 0, 0.05);
}

.bg_red {
  background-color: rgba(244, 68, 50, 0.05);
}

.bg_gray {
  background-color: #F5F5F5;
}

.info_red {
  background-color: #F44432;
  color: #fff;
  padding: 0.75rem;
  border-radius: 0.5rem;
  font-size: var(--span2-f);
}

.info_black {
  background: #2F2F2F url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
  color: #fff;
  padding: 0.75rem;
  border-radius: 0.5rem;
  font-size: var(--span2-f);
  display: block;
}

/***************************************************************
    08. nav
***************************************************************/
.tab_menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: calc(100% + 2rem);
  position: sticky;
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  left: 0;
  z-index: 8;
  background: #fff;
}
.tab_menu .tab_link {
  width: 100%;
  color: #C9C9C9;
  font-weight: var(--bold-f);
  cursor: pointer;
  text-align: center;
  padding: 1rem 0 0.625rem;
  font-size: var(--span1-f);
}
.tab_menu .tab_link.active {
  color: #2F2F2F;
}
.tab_menu.under_l .tab_link {
  border-bottom: 1px solid #DFDFDF;
}
.tab_menu.under_l .tab_link.active {
  border-bottom: 2px solid #2F2F2F;
  padding: 1rem 0 0.5625rem;
}
.tab_menu.tab_slide {
  position: relative;
  padding-left: 1rem;
  padding-right: 1rem;
}
.tab_menu.tab_slide .tab_link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}
.tab_menu.tab_slide .tab_link.active {
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}
.tab_menu.tab_slide::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #DFDFDF;
  width: 100%;
  height: 1px;
}

.txt_tap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1rem;
}
.txt_tap .tap {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #C9C9C9;
}
.txt_tap .tap.active {
  color: #2F2F2F;
}

.top_tag {
  padding: 1rem 0;
  width: calc(100% + 2.5rem);
  position: relative;
  left: -1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.top_tag .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-right: 0.5rem;
}
.top_tag .swiper-slide:first-child {
  margin-left: 1.25rem;
}
.top_tag .swiper-slide.active {
  background-color: #2F2F2F;
  color: #fff;
}
.top_tag .total {
  position: absolute;
  right: 1.25rem;
  font-size: var(--span3-f);
  color: #9F9F9F;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.top_tag .myqna_link {
  position: absolute;
  right: 1.25rem;
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #9F9F9F;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

/***************************************************************
    09. popup
***************************************************************/
body.open {
  overflow: hidden;
}

.popup,
.modal {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: -1;
  opacity: 0;
  /* 기본 알람 팝업 */
  /* 모달 팝업 */
}
.popup .overlay,
.modal .overlay {
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  z-index: 0;
  overflow: hidden;
}
.popup .popup_msg,
.modal .popup_msg {
  position: fixed;
  width: calc(100% - 2.5rem);
  max-width: 20rem;
  background-color: #fff;
  border-radius: 0.75rem;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 1.5rem;
}
@media (max-device-width: 320px) {
  .popup .popup_msg,
.modal .popup_msg {
    padding: 1rem;
  }
}
.popup .popup_msg .popup_t,
.modal .popup_msg .popup_t {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.popup .popup_msg .popup_con,
.modal .popup_msg .popup_con {
  padding: 0.75rem 0 1rem;
}
.popup .popup_msg .popup_con .popup_txt,
.modal .popup_msg .popup_con .popup_txt {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #747474;
}
.popup .popup_msg .popup_con .popup_txtr,
.modal .popup_msg .popup_con .popup_txtr {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #F44432;
}
.popup .popup_msg .popup_con .popup_txtg,
.modal .popup_msg .popup_con .popup_txtg {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #00B400;
}
.popup .popup_msg .popup_btn,
.modal .popup_msg .popup_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  gap: 0.5rem;
}
.popup .popup_msg .popup_btn button,
.modal .popup_msg .popup_btn button {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  padding: 0.8125rem;
  width: 100%;
  border-radius: 0.5rem;
}
.popup .modal_block,
.modal .modal_block {
  position: fixed;
  bottom: 0%;
  left: 50%;
  width: 100%;
  max-width: 500px;
  -webkit-transform: translate(-50%, 100%);
          transform: translate(-50%, 100%);
  background: #fff;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  border-radius: 1.5rem 1.5rem 0 0;
}
.popup .modal_block .toast,
.modal .modal_block .toast {
  bottom: initial;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: -3.25rem;
}
.popup .modal_block .alarm_tip,
.modal .modal_block .alarm_tip {
  position: absolute;
  background: #fff;
  width: calc(100% - 2rem);
  left: 1rem;
  border-radius: 1rem;
  padding: 1.25rem 1.5rem;
  top: -7.5625rem;
}
.popup .modal_block .alarm_tip .span1_fb,
.modal .modal_block .alarm_tip .span1_fb {
  background: url(../images/icon/alarm.svg) no-repeat;
  background-size: 1.0625rem;
  background-position: left center;
  padding-left: 1.5rem;
  margin-bottom: 0.6875rem;
}
.popup .modal_block .alarm_tip .closeTip,
.modal .modal_block .alarm_tip .closeTip {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  background: url(../images/icon/close_bk.svg) no-repeat;
  background-position: center;
  width: 2rem;
  height: 2rem;
  display: block;
  background-size: 1.5rem;
}
.popup .modal_block .alarm_tip + .toast,
.modal .modal_block .alarm_tip + .toast {
  top: -11.0625rem;
}
.popup .modal_block .modal_in,
.modal .modal_block .modal_in {
  padding: 2rem 1.25rem 0;
}
.popup .modal_block .modal_in .modal_top,
.modal .modal_block .modal_in .modal_top {
  padding-bottom: 1rem;
}
.popup .modal_block .modal_in .modal_top .modal_t,
.modal .modal_block .modal_in .modal_top .modal_t {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.popup .modal_block .modal_in .modal_top .modal_sub,
.modal .modal_block .modal_in .modal_top .modal_sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.popup .modal_block .modal_in .modal_top .time_sub,
.modal .modal_block .modal_in .modal_top .time_sub {
  font-size: var(--span2-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.popup .modal_block .modal_in .modal_top .time_sub .date,
.modal .modal_block .modal_in .modal_top .time_sub .date {
  position: relative;
}
.popup .modal_block .modal_in .modal_top .time_sub .date::after,
.modal .modal_block .modal_in .modal_top .time_sub .date::after {
  content: "";
  position: relative;
  width: 1px;
  top: 1px;
  height: 0.7rem;
  background: #C9C9C9;
  margin: 0 0.4rem 0 0.4rem;
  display: inline-block;
}
.popup .modal_block .modal_in .modal_con,
.modal .modal_block .modal_in .modal_con {
  overflow-y: auto;
  max-height: 40svh;
  width: 100%;
  position: relative;
}
.popup .modal_block .modal_in .modal_con li,
.modal .modal_block .modal_in .modal_con li {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  padding-left: 1.25rem;
  position: relative;
  color: #9F9F9F;
}
.popup .modal_block .modal_in .modal_con li::before,
.modal .modal_block .modal_in .modal_con li::before {
  content: "";
  position: absolute;
  left: 0.5rem;
  top: 0.4rem;
  width: 2px;
  height: 2px;
  display: block;
  background-color: #9F9F9F;
}
.popup .modal_block .modal_in .modal_con li ul,
.modal .modal_block .modal_in .modal_con li ul {
  font-weight: initial;
}
.popup .modal_block .modal_in .modal_con li ul li,
.modal .modal_block .modal_in .modal_con li ul li {
  padding-left: 0;
  margin-bottom: 0.25rem;
}
.popup .modal_block .modal_in .modal_con .cardround,
.modal .modal_block .modal_in .modal_con .cardround {
  margin: 0 0 0.75rem;
  padding: 0.75rem 1rem;
}
.popup .modal_block .modal_in .modal_con .cardround:last-child,
.modal .modal_block .modal_in .modal_con .cardround:last-child {
  margin-bottom: 0;
}
.popup .modal_block .modal_in .modal_con .cardround .title,
.modal .modal_block .modal_in .modal_con .cardround .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.popup .modal_block .modal_in .modal_con .cardround .title .title_r,
.modal .modal_block .modal_in .modal_con .cardround .title .title_r {
  color: #747474;
  text-align: right;
}
.popup .modal_block .modal_in .modal_con .cardround .title .title_r .title_info,
.modal .modal_block .modal_in .modal_con .cardround .title .title_r .title_info {
  display: block;
  color: #00B400;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
}
.popup .modal_block .modal_in .modal_con .cardround .check_list,
.modal .modal_block .modal_in .modal_con .cardround .check_list {
  margin-top: 0.5rem;
}
.popup .modal_block .modal_in .modal_con .cardround .check_list .check_txt,
.modal .modal_block .modal_in .modal_con .cardround .check_list .check_txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
  margin-top: 0.25rem;
  background: url(../images/icon/check_on.svg) no-repeat;
  background-position: left top;
  padding-left: 1.75rem;
}
.popup .modal_block .modal_in .modal_con .cardround .info_table,
.modal .modal_block .modal_in .modal_con .cardround .info_table {
  padding: 0.375rem 0.5rem;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.popup .modal_block .modal_in .modal_con .cardround .info_table:first-child,
.modal .modal_block .modal_in .modal_con .cardround .info_table:first-child {
  padding-top: 0.25rem;
}
.popup .modal_block .modal_in .modal_con .cardround .info_table:last-child,
.modal .modal_block .modal_in .modal_con .cardround .info_table:last-child {
  padding-bottom: 0.25rem;
}
.popup .modal_block .modal_in .modal_con .cardround .info_table .table_l,
.modal .modal_block .modal_in .modal_con .cardround .info_table .table_l {
  font-size: var(--span2-f);
}
.popup .modal_block .modal_in .modal_con .cardround .info_table .table_r,
.modal .modal_block .modal_in .modal_con .cardround .info_table .table_r {
  font-size: var(--span2-f);
}
.popup .modal_block .modal_in .modal_con .cardround.drug_edit,
.modal .modal_block .modal_in .modal_con .cardround.drug_edit {
  margin: 0 0 0.5rem;
}
.popup .modal_block .modal_in .modal_con .cardround.drug_edit:last-child,
.modal .modal_block .modal_in .modal_con .cardround.drug_edit:last-child {
  margin-bottom: 3rem;
}
.popup .modal_block .modal_in .modal_con .cardround .flexin,
.modal .modal_block .modal_in .modal_con .cardround .flexin {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin: 0.75rem 0;
}
.popup .modal_block .modal_in .modal_con .cardround .flexin .title,
.modal .modal_block .modal_in .modal_con .cardround .flexin .title {
  width: 30%;
  font-size: var(--span2-f);
  color: #9F9F9F;
}
.popup .modal_block .modal_in .modal_con .cardround .flexin .txt,
.modal .modal_block .modal_in .modal_con .cardround .flexin .txt {
  width: 70%;
  font-size: var(--span2-f);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
}
.popup .modal_block .modal_in .modal_con .cardround.add_drug,
.modal .modal_block .modal_in .modal_con .cardround.add_drug {
  background-color: #F5F5F5;
  margin: 0 0 0.5rem;
  position: relative;
}
.popup .modal_block .modal_in .modal_con .cardround.add_drug .addt,
.modal .modal_block .modal_in .modal_con .cardround.add_drug .addt {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.popup .modal_block .modal_in .modal_con .cardround.add_drug .delBtn,
.modal .modal_block .modal_in .modal_con .cardround.add_drug .delBtn {
  position: absolute;
  background: url(../images/icon/delete_gr.svg) no-repeat;
  width: 1.75rem;
  height: 1.75rem;
  background-size: cover;
  top: 50%;
  right: 1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.popup .modal_block .modal_in .modal_con .cardround.brand_list,
.modal .modal_block .modal_in .modal_con .cardround.brand_list {
  background: #F5F5F5;
  margin-top: 0.5rem;
  padding: 1rem 0.75rem;
}
@media (max-device-width: 320px) {
  .popup .modal_block .modal_in .modal_con .cardround,
.modal .modal_block .modal_in .modal_con .cardround {
    padding: 0.5rem 0.75rem;
  }
}
.popup .modal_block .modal_in .modal_con .cardround_b,
.modal .modal_block .modal_in .modal_con .cardround_b {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  padding: 1.25rem 1rem;
}
.popup .modal_block .modal_in .modal_con .cardround_b .info_table,
.modal .modal_block .modal_in .modal_con .cardround_b .info_table {
  padding: 0.375rem 0.5rem;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.popup .modal_block .modal_in .modal_con .cardround_b .info_table:first-child,
.modal .modal_block .modal_in .modal_con .cardround_b .info_table:first-child {
  padding-top: 0.25rem;
}
.popup .modal_block .modal_in .modal_con .cardround_b .info_table:last-child,
.modal .modal_block .modal_in .modal_con .cardround_b .info_table:last-child {
  padding-bottom: 0.25rem;
}
.popup .modal_block .modal_in .modal_con .cardround_b .info_table .table_l,
.modal .modal_block .modal_in .modal_con .cardround_b .info_table .table_l {
  font-size: var(--span2-f);
}
.popup .modal_block .modal_in .modal_con .cardround_b .info_table .table_r,
.modal .modal_block .modal_in .modal_con .cardround_b .info_table .table_r {
  font-size: var(--span2-f);
}
.popup .modal_block .modal_in .modal_con .table_btw,
.modal .modal_block .modal_in .modal_con .table_btw {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.popup .modal_block .modal_in .modal_con .textarea_block,
.modal .modal_block .modal_in .modal_con .textarea_block {
  margin: 0;
  font-size: 0;
}
.popup .modal_block .modal_in .modal_con .mycash,
.modal .modal_block .modal_in .modal_con .mycash {
  font-size: var(--span2-f);
  border: 1px solid rgba(0, 180, 0, 0.5);
  border-radius: 0.25rem;
  padding: 0.375rem 0.75rem 0.375rem 1.625rem;
  background: url(../images/icon/icon_cash.svg) no-repeat;
  background-size: 1.25rem;
  background-position: 0.375rem center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.popup .modal_block .modal_in .modal_con .mycash span,
.modal .modal_block .modal_in .modal_con .mycash span {
  font-weight: 700;
  padding-left: 4px;
}
.popup .modal_block .modal_in .modal_con .cash_info,
.modal .modal_block .modal_in .modal_con .cash_info {
  border-bottom: 1px dashed #DFDFDF;
  padding: 1.25rem 0 1.5rem;
  margin-bottom: 0.375rem;
  background: url(../images/icon/right_line.svg) no-repeat;
  background-size: 1.5rem;
  background-position: 50% center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.5rem;
}
.popup .modal_block .modal_in .modal_con .cash_info .block,
.modal .modal_block .modal_in .modal_con .cash_info .block {
  width: 100%;
  text-align: center;
}
.popup .modal_block .modal_in .modal_con .cash_info .block .gray02,
.modal .modal_block .modal_in .modal_con .cash_info .block .gray02 {
  margin-bottom: 0.375rem;
}
.popup .modal_block .modal_in .modal_con .draw_goods,
.modal .modal_block .modal_in .modal_con .draw_goods {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
  margin: 0 0.25rem;
  border-radius: 0.5rem;
  padding: 1.25rem 1rem;
  gap: 0.75rem;
}
.popup .modal_block .modal_in .modal_con .draw_goods .thumb,
.modal .modal_block .modal_in .modal_con .draw_goods .thumb {
  width: 4.25rem;
  aspect-ratio: 1;
  border: 1px solid #DFDFDF;
  background-color: #F5F5F5;
  border-radius: 0.25rem;
  overflow: hidden;
}
@media (max-device-width: 359px) {
  .popup .modal_block .modal_in .modal_con .draw_goods .thumb,
.modal .modal_block .modal_in .modal_con .draw_goods .thumb {
    width: 18.9415vw;
  }
}
.popup .modal_block .modal_in .modal_con .draw_goods .thumb img,
.modal .modal_block .modal_in .modal_con .draw_goods .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.popup .modal_block .modal_in .modal_con .draw_goods::after,
.modal .modal_block .modal_in .modal_con .draw_goods::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -0.875rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  display: block;
  background: #fff;
  -webkit-box-shadow: inset 0 0 8px 0 rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 0 8px 0 rgba(0, 0, 0, 0.1);
}
.popup .modal_block .modal_in .modal_con .draw_goods .goods_info,
.modal .modal_block .modal_in .modal_con .draw_goods .goods_info {
  width: calc(100% - 5rem);
}
@media (max-device-width: 359px) {
  .popup .modal_block .modal_in .modal_con .draw_goods .goods_info,
.modal .modal_block .modal_in .modal_con .draw_goods .goods_info {
    width: calc(100% - 22.2841vw);
  }
}
.popup .modal_block .modal_in .modal_con .draw_goods .goods_info .goods_name,
.modal .modal_block .modal_in .modal_con .draw_goods .goods_info .goods_name {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  width: 92%;
  padding: 0.125rem 0 0;
  margin-bottom: 0.375rem;
  position: relative;
  word-break: break-all;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
}
.popup .modal_block .modal_in .modal_con .draw_goods .goods_info .draw_ticket,
.modal .modal_block .modal_in .modal_con .draw_goods .goods_info .draw_ticket {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #00B400;
  background: url(../images/icon/icon_ticket.svg) no-repeat;
  background-size: 1.25rem;
  padding-left: 1.5rem;
  background-position: left center;
  line-height: 1;
}
.popup .modal_block .modal_in .modal_con .ticket_now,
.modal .modal_block .modal_in .modal_con .ticket_now {
  font-size: var(--span2-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.75rem 0 0.75rem 0.5rem;
  gap: 0.125rem;
}
.popup .modal_block .modal_in .modal_file .add_file,
.modal .modal_block .modal_in .modal_file .add_file {
  width: calc(100% + 2.5rem);
  left: -1.25rem;
}
.popup .modal_block .modal_in .modal_file .add_file .file_list:first-child,
.modal .modal_block .modal_in .modal_file .add_file .file_list:first-child {
  margin-left: 1.25rem;
}
.popup .modal_block .modal_in .modal_file .add_file .file_list:last-child,
.modal .modal_block .modal_in .modal_file .add_file .file_list:last-child {
  margin-right: 1.25rem;
}
.popup .modal_block .modal_in .add_none,
.modal .modal_block .modal_in .add_none {
  font-size: var(--span2-f);
  color: #9F9F9F;
  text-align: center;
  padding: 1rem 0;
}
.popup .modal_block .modal_img,
.modal .modal_block .modal_img {
  border-radius: 1.5rem 1.5rem 0 0;
  overflow: hidden;
  position: relative;
}
.popup .modal_block .modal_img img,
.modal .modal_block .modal_img img {
  width: 100%;
}
.popup .modal_block .modal_img.swiper,
.modal .modal_block .modal_img.swiper {
  aspect-ratio: 360/256;
}
.popup .modal_block .modal_img.swiper .swiper-pagination-fraction,
.modal .modal_block .modal_img.swiper .swiper-pagination-fraction {
  font-size: var(--span2-f);
  background: rgba(0, 0, 0, 0.7);
  display: inline-block;
  position: absolute;
  right: 1.25rem;
  bottom: 1rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  color: #C9C9C9;
  padding: 0.25rem 0.5rem;
  border-radius: 3rem;
  left: initial;
}
.popup .modal_block .modal_img.swiper .swiper-pagination-fraction .swiper-pagination-current,
.modal .modal_block .modal_img.swiper .swiper-pagination-fraction .swiper-pagination-current {
  color: #fff;
}
.popup .modal_block .modal_imgdetail,
.modal .modal_block .modal_imgdetail {
  border-radius: 1.5rem 1.5rem 0 0;
  overflow: auto;
  max-height: 26.625rem;
  padding-top: 1.125rem;
}
.popup .modal_block .modal_imgdetail img,
.modal .modal_block .modal_imgdetail img {
  width: 100%;
}
.popup .modal_block .modal_detail,
.modal .modal_block .modal_detail {
  padding: 0 1.25rem 9rem;
  max-height: 75svh;
  overflow: auto;
}
.popup .modal_block .modal_detail .detail_top,
.modal .modal_block .modal_detail .detail_top {
  padding: 1.5rem 0 0.75rem;
  position: sticky;
  background: #fff;
  top: 0;
  z-index: 1;
}
.popup .modal_block .modal_detail .detail_top .img,
.modal .modal_block .modal_detail .detail_top .img {
  width: 2.8125rem;
}
.popup .modal_block .modal_detail .detail_top .img img,
.modal .modal_block .modal_detail .detail_top .img img {
  width: 100%;
}
.popup .modal_block .modal_detail .detail_top .name,
.modal .modal_block .modal_detail .detail_top .name {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  margin: 0.5rem 0;
}
.popup .modal_block .modal_detail .detail_top .fix,
.modal .modal_block .modal_detail .detail_top .fix {
  position: absolute;
  top: 1.5rem;
  right: 0;
}
.popup .modal_block .modal_detail .detail_top .fix img,
.modal .modal_block .modal_detail .detail_top .fix img {
  width: 2rem;
  display: inline-block;
}
.popup .modal_block .modal_detail .detail_top .span1_f span,
.modal .modal_block .modal_detail .detail_top .span1_f span {
  margin-right: 0.25rem;
}
.popup .modal_block .modal_detail .detail_info,
.modal .modal_block .modal_detail .detail_info {
  padding-top: 1rem;
  color: #747474;
}
.popup .modal_block .modal_detail .detail_info .data,
.modal .modal_block .modal_detail .detail_info .data {
  margin-bottom: 1rem;
}
.popup .modal_block .modal_detail .detail_info .data .title,
.modal .modal_block .modal_detail .detail_info .data .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
  color: #2F2F2F;
}
.popup .modal_block .modal_detail .detail_info .data table,
.modal .modal_block .modal_detail .detail_info .data table {
  width: 100%;
}
.popup .modal_block .modal_detail .detail_info .data:nth-child(5) ul li,
.modal .modal_block .modal_detail .detail_info .data:nth-child(5) ul li {
  padding-left: 0;
}
.popup .modal_block .modal_detail .detail_info .data:nth-child(5) ul li::before,
.modal .modal_block .modal_detail .detail_info .data:nth-child(5) ul li::before {
  display: none;
}
.popup .modal_block .modal_detail ul li,
.modal .modal_block .modal_detail ul li {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding-left: 1rem;
  position: relative;
}
.popup .modal_block .modal_detail ul li::before,
.modal .modal_block .modal_detail ul li::before {
  content: "";
  position: absolute;
  top: 0.4rem;
  left: 0.4rem;
  display: block;
  width: 3px;
  height: 3px;
  background-color: #747474;
  border-radius: 50%;
}
.popup .modal_block .modal_detail table th,
.modal .modal_block .modal_detail table th {
  background-color: #DFDFDF;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  padding: 0.5rem 0.75rem;
  text-align: left;
  border: 1px solid #DFDFDF;
}
.popup .modal_block .modal_detail table th:first-child,
.modal .modal_block .modal_detail table th:first-child {
  border-right: 1px solid #C9C9C9;
}
.popup .modal_block .modal_detail table td,
.modal .modal_block .modal_detail table td {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding: 0.5rem 0.75rem;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.popup .modal_block .modal_detail table td:first-child,
.modal .modal_block .modal_detail table td:first-child {
  border-left: 1px solid #DFDFDF;
}
.popup .modal_block .modal_detail .info_notice,
.modal .modal_block .modal_detail .info_notice {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  padding: 0.75rem;
}
.popup .modal_block .modal_detail + .btn_fixgr,
.modal .modal_block .modal_detail + .btn_fixgr {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(20%, #fff));
  background: linear-gradient(transparent 0, #fff 20%);
}
.popup .modal_block .modal_detail + .btn_fixgr .toast,
.modal .modal_block .modal_detail + .btn_fixgr .toast {
  top: -0.75rem;
}
.popup .modal_block .home_add,
.modal .modal_block .home_add {
  padding: 0 0 9rem;
  max-height: 50svh;
  overflow: auto;
}
.popup .modal_block .home_add .cardround,
.modal .modal_block .home_add .cardround {
  background: #F5F5F5 url(../images/icon/check_off.svg) no-repeat;
  background-position: 1rem 1.125rem;
  border-radius: 0.5rem;
  margin: 0 0 0.5rem;
  padding: 1rem 1rem 1rem 3.25rem;
  position: relative;
}
.popup .modal_block .home_add .cardround .date,
.modal .modal_block .home_add .cardround .date {
  color: #9F9F9F;
  font-size: var(--span3-f);
  margin-bottom: 0.25rem;
}
.popup .modal_block .home_add .cardround .title,
.modal .modal_block .home_add .cardround .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.popup .modal_block .home_add .cardround .time,
.modal .modal_block .home_add .cardround .time {
  font-size: 0;
  width: 2.5rem;
  height: 1.25rem;
  position: absolute;
  top: 50%;
  right: 1.375rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.popup .modal_block .home_add .cardround .time .sun,
.modal .modal_block .home_add .cardround .time .sun {
  background: url(../images/icon/sun_gr.svg) no-repeat;
  display: none;
  width: 1.25rem;
  height: 100%;
}
.popup .modal_block .home_add .cardround .time .moon,
.modal .modal_block .home_add .cardround .time .moon {
  background: url(../images/icon/moon_gr.svg) no-repeat;
  display: none;
  width: 1.25rem;
  height: 100%;
}
.popup .modal_block .home_add .cardround .time.am .sun, .popup .modal_block .home_add .cardround .time.pm .moon,
.modal .modal_block .home_add .cardround .time.am .sun,
.modal .modal_block .home_add .cardround .time.pm .moon {
  display: block;
}
.popup .modal_block .home_add .cardround.add_check,
.modal .modal_block .home_add .cardround.add_check {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/check_on.svg) no-repeat;
  background-position: 1rem 1.125rem;
}
.popup .modal_block .home_add .cardround.add_check .time,
.modal .modal_block .home_add .cardround.add_check .time {
  position: relative;
  font-size: var(--span3-f);
  width: 100%;
  background: #fff;
  background-size: 1.25rem;
  background-position: 0.5rem center;
  height: initial;
  right: 0;
  -webkit-transform: initial;
          transform: initial;
  margin-top: 0.5rem;
  border-radius: 0.5rem;
  padding: 0.25rem 0.5rem;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  color: #00B400;
}
.popup .modal_block .home_add .cardround.add_check .time .sun,
.modal .modal_block .home_add .cardround.add_check .time .sun {
  background: url(../images/icon/icon_sun.svg) no-repeat;
  display: none;
  width: 1.25rem;
  height: 1.25rem;
  background-size: cover;
  margin-right: 0.125rem;
}
.popup .modal_block .home_add .cardround.add_check .time .moon,
.modal .modal_block .home_add .cardround.add_check .time .moon {
  background: url(../images/icon/icon_moon.svg) no-repeat;
  display: none;
  width: 1.25rem;
  height: 1.25rem;
  background-size: cover;
  margin-right: 0.125rem;
}
.popup .modal_block .home_add .cardround.add_check .time.am .sun, .popup .modal_block .home_add .cardround.add_check .time.pm .moon,
.modal .modal_block .home_add .cardround.add_check .time.am .sun,
.modal .modal_block .home_add .cardround.add_check .time.pm .moon {
  display: block;
}
.popup .modal_block .home_add + .btn_fixgr,
.modal .modal_block .home_add + .btn_fixgr {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(20%, #fff));
  background: linear-gradient(transparent 0, #fff 20%);
}
.popup .modal_block .home_add + .btn_fixgr .toast,
.modal .modal_block .home_add + .btn_fixgr .toast {
  top: -0.75rem;
}
.popup .modal_block .time_select,
.modal .modal_block .time_select {
  padding: 0 4rem;
  margin: 1.5rem auto 0;
}
.popup .modal_block .btn_wrap,
.modal .modal_block .btn_wrap {
  padding: 1rem;
}
.popup .modal_block .btn_wrap .transbg_wrap,
.modal .modal_block .btn_wrap .transbg_wrap {
  position: absolute;
  top: -3rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(40%, #fff));
  background: linear-gradient(transparent 0, #fff 40%);
  padding: 2rem 1rem 0;
  width: 100%;
}
.popup .modal_block .btn_wrap .transbg_wrap .total_txt,
.modal .modal_block .btn_wrap .transbg_wrap .total_txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.popup .modal_block .btn_wrap .btn_transbg,
.modal .modal_block .btn_wrap .btn_transbg {
  position: absolute;
  width: 100%;
  height: 3rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(70%, #fff));
  background: linear-gradient(transparent 0, #fff 70%);
  z-index: 0;
  top: -2.25rem;
  display: none;
}
.popup .modal_block .modal_optlist,
.modal .modal_block .modal_optlist {
  padding: 1rem 0;
  max-height: 50svh;
  overflow: auto;
}
.popup .modal_block .modal_optlist .motal_opt,
.modal .modal_block .modal_optlist .motal_opt {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding: 1rem 2rem;
}
.popup .modal_block .modal_imgdetail + .btn_wrap .toast,
.modal .modal_block .modal_imgdetail + .btn_wrap .toast {
  top: -2.75rem;
}
.popup.open,
.modal.open {
  z-index: 10000;
  opacity: 1;
}
.popup.open .modal_block,
.modal.open .modal_block {
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

.top_toast {
  background: #000;
  color: #fff;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  position: sticky;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  left: 0;
  top: var(--header-height);
  z-index: 999;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.75rem 1.125rem;
  -webkit-transition: background 0.5s;
  transition: background 0.5s;
}
.top_toast svg {
  margin-right: 0.3rem;
}
.top_toast.fixtop {
  background: rgba(0, 0, 0, 0.8);
}

.toast {
  position: absolute;
  width: calc(100% - 2rem);
  background: rgba(0, 0, 0, 0.75);
  font-size: var(--p4-f);
  line-height: var(--line-h);
  text-align: center;
  padding: 0.75rem;
  color: #fff;
  border-radius: 3rem;
  top: initial;
  bottom: 0.5rem;
  z-index: 10;
}

.bbpop {
  background-color: #00B400;
  font-size: var(--span2-f);
  color: #fff;
  position: relative;
  padding: 0.375rem 0.75rem;
  border-radius: 3rem;
  display: inline-block;
  -webkit-animation: bounce 1.5s ease-in-out infinite;
          animation: bounce 1.5s ease-in-out infinite;
}
.bbpop.bt_center::after {
  content: "";
  position: absolute;
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  bottom: -0.4375rem;
  left: calc(50% - .4375rem);
  background-color: #00B400;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.bbpop.bt_left::after {
  content: "";
  position: absolute;
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  bottom: -0.4375rem;
  left: 1.5rem;
  background-color: #00B400;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.bbpop.bt_right::after {
  content: "";
  position: absolute;
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  bottom: -0.4375rem;
  right: 1.5rem;
  background-color: #00B400;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.bbpop.t_left::after {
  content: "";
  position: absolute;
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  top: -0.4375rem;
  left: 1.5rem;
  background-color: #00B400;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.bbpop.t_right::after {
  content: "";
  position: absolute;
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  top: -0.4375rem;
  right: 1.5rem;
  background-color: #00B400;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.bbpop.bbwhite {
  background-color: #fff;
  color: #9F9F9F;
  border: 1px solid #DFDFDF;
}
.bbpop.bbwhite.bt_center::after {
  background-color: #fff;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.bbpop.bbwhite.bt_left::after {
  background-color: #fff;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.bbpop.bbwhite.bt_right::after {
  background-color: #fff;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.bbpop.bbwhite.t_left::after {
  background-color: #fff;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.bbpop.bbwhite.t_right::after {
  background-color: #fff;
  border-right: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.bbpop.bbblack {
  background: #2F2F2F;
}
.bbpop.bbblack.bt_center::after {
  background-color: #2F2F2F;
  border-right: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.bbpop.bbblack.bt_left::after {
  background-color: #2F2F2F;
  border-right: 1px solid transparent;
  border-bottom: 1px solid transparent;
}

.btn_main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1.5rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}

.modal .mission_ani {
  position: absolute;
  top: 30svh;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 7.375rem;
  height: 7.375rem;
}

.randompop {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: -1;
  opacity: 0;
}
.randompop .overlay {
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  z-index: 0;
  overflow: hidden;
}
.randompop .random_con {
  background: #F5F5F5 url(../images/randompop_bg.svg) no-repeat;
  background-position: center 3rem;
  background-size: 20rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 0.5rem;
  width: calc(100% - 2.5rem);
  max-width: 20rem;
  height: 55svh;
  max-height: 26.875rem;
}
@media (max-device-width: 359px) {
  .randompop .random_con {
    background-size: 89.1365vw;
  }
}
.randompop .random_con .random_count {
  padding-top: 10svh;
}
.randompop .random_con .random_count .random_ani {
  width: 140%;
  position: relative;
  left: -20%;
}
.randompop .random_con .random_goods {
  background: url(../images/randomtxt.svg) no-repeat;
  background-size: 12.75rem;
  background-position: center 2.5rem;
  height: 100%;
  width: 100%;
  position: relative;
  padding-top: 7.5rem;
}
@media (max-device-width: 359px) {
  .randompop .random_con .random_goods {
    padding-top: 33.4262vw;
    background-size: 56.8245vw;
  }
}
.randompop .random_con .random_goods .random_ani2 {
  position: absolute;
  top: -110px;
  width: 200%;
  left: -50%;
  z-index: 5;
}
.randompop .random_con .random_goods .random_in {
  width: 100%;
  text-align: center;
}
.randompop .random_con .random_goods .random_in .random_thumb {
  width: 8.25rem;
  height: 8.25rem;
  margin: 0 auto;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 1.375rem;
}
@media (max-device-width: 359px) {
  .randompop .random_con .random_goods .random_in .random_thumb {
    width: 36.7688vw;
    height: 36.7688vw;
  }
}
.randompop .random_con .random_goods .random_in .random_thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.randompop .random_con .random_goods .random_in .random_thumb.random_coupon {
  padding: 1rem;
}
.randompop .random_con .random_goods .random_in .random_thumb.random_coupon img {
  -o-object-fit: contain;
     object-fit: contain;
}
.randompop .random_con .random_goods .btn_wrap {
  position: absolute;
  bottom: 1rem;
  padding: 0 1.25rem;
}
.randompop .random_con .btn_close {
  position: absolute;
  background: url(../images/icon/close_bk.svg) no-repeat;
  width: 2rem;
  height: 2rem;
  right: 0.5rem;
  top: 0.5rem;
  z-index: 10;
}
.randompop.open {
  z-index: 10000;
  opacity: 1;
}

/***************************************************************
    10. header
***************************************************************/
.header {
  padding: 0.5rem 1rem;
  width: 100%;
  background: #fff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  position: fixed;
  z-index: 99;
  top: 0;
}
.header.header_fix {
  position: fixed;
  background: rgba(255, 255, 255, 0.9);
}
.header.black_header {
  background-color: #000;
  color: #fff;
}
.header .header_in {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.header .header_in .header_title {
  width: calc(100% - 8.5rem);
  text-align: center;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.header .header_in .header_back {
  width: 4.25rem;
}
@media (max-device-width: 320px) {
  .header .header_in .header_back img {
    width: 1.5rem;
  }
}
.header .header_in .header_back.logo,
.header .header_in .header_back .logo {
  width: initial;
}
.header .header_in .header_back.logo img,
.header .header_in .header_back .logo img {
  width: 100%;
}
@media (max-device-width: 320px) {
  .header .header_in .header_back.logo img,
.header .header_in .header_back .logo img {
    width: auto;
    height: 1.5rem;
  }
}
.header .header_in .header_quick {
  width: 4.25rem;
  font-size: var(--span1-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  color: #C9C9C9;
  gap: 0.25rem;
}
@media (max-device-width: 320px) {
  .header .header_in .header_quick img {
    width: 1.5rem;
  }
}
@media (max-device-width: 320px) {
  .header {
    padding: 0.75rem 1rem;
  }
}
.header.home_header .header_quick {
  width: calc(100% - 5.25rem);
}
.header.home_header .header_quick .mypoint {
  font-size: var(--span2-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  margin-right: 0.25rem;
  color: #2F2F2F;
  line-height: 1;
}
.header.clg_header .clg_icon {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media (max-device-width: 359px) {
  .header.clg_header .clg_icon {
    width: 25.0696vw;
  }
}
.header.draw_header {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(18, 18, 18, 0.71)), color-stop(80%, rgba(25, 25, 25, 0.24776)), to(rgba(29, 29, 29, 0)));
  background: linear-gradient(rgba(18, 18, 18, 0.71) 0%, rgba(25, 25, 25, 0.24776) 80%, rgba(29, 29, 29, 0) 100%);
}
.header.draw_header img {
  -webkit-filter: brightness(10);
          filter: brightness(10);
}

/***************************************************************
    11. footer
***************************************************************/
/* ---------- 하단 공지 --------------- */
.notice {
  padding: 1.5rem 1.25rem 5rem;
  background-color: #F5F5F5;
}
.notice .notice_txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  position: relative;
  padding-left: 1rem;
}
.notice .notice_txt::before {
  content: "";
  display: block;
  position: absolute;
  left: 0.3rem;
  top: 6px;
  background-color: #9F9F9F;
  height: 3px;
  width: 3px;
  border-radius: 50%;
}
.notice .notice_txt_sub {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  padding-left: 1rem;
  padding-top: 0.25rem;
}

.nav {
  position: fixed;
  bottom: 0;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  border-top: 1px solid #efefef;
  z-index: 100;
}
.nav .nav_left,
.nav .nav_right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: calc((100% / 2) - 2.25rem);
  z-index: 1;
}
.nav .nav_link {
  padding: 0.625rem 0 0.25rem;
  width: 100%;
}
.nav .nav_link .nav_img {
  margin-bottom: 0.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.nav .nav_link .nav_txt {
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  text-align: center;
}
.nav .drag_icon {
  position: absolute;
  bottom: 0.625rem;
  left: 50%;
  width: 3.375rem;
  height: 3.375rem;
  aspect-ratio: 1;
  background: #fff;
  border-radius: 50%;
  padding: 3px;
  -webkit-box-shadow: inset 1px -2px 2px rgba(0, 0, 0, 0.1), 0 -1px 0 rgba(0, 0, 0, 0.08);
          box-shadow: inset 1px -2px 2px rgba(0, 0, 0, 0.1), 0 -1px 0 rgba(0, 0, 0, 0.08);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.nav .drag_icon .pill_bg {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #00B400;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 2px 0 #00B400;
          box-shadow: 0 0 2px 0 #00B400;
  position: relative;
  border: 1px solid transparent;
  z-index: 2;
}
.nav .drag_icon .pill_bg img {
  width: 1.4375rem;
  position: relative;
}
.nav .drag_icon::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border-radius: 50%;
}

.open_nav {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  width: 52px;
  height: 52px;
  aspect-ratio: 1;
  border: 2px solid #fff;
  border-radius: 50%;
  -webkit-box-shadow: 0 2px rgba(0, 0, 0, 0.08);
          box-shadow: 0 2px rgba(0, 0, 0, 0.08);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 101;
}
.open_nav .navBtn {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #00B400;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 2px 0 #00B400;
          box-shadow: 0 0 2px 0 #00B400;
  position: relative;
  border: 1px solid transparent;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.open_nav .navBtn.navOpen {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-animation: navlotate 0.3s linear;
          animation: navlotate 0.3s linear;
}

.nav_clg {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: -1;
  opacity: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.nav_clg .nav_list {
  position: absolute;
  bottom: 5.75rem;
  left: 50%;
  -webkit-transform: translate(-50%, 150%);
          transform: translate(-50%, 150%);
  -webkit-transition: -webkit-transform 0.5s ease-in;
  transition: -webkit-transform 0.5s ease-in;
  transition: transform 0.5s ease-in;
  transition: transform 0.5s ease-in, -webkit-transform 0.5s ease-in;
}
.nav_clg .nav_list.loadup {
  -webkit-transform: translate(-50%, 0%);
          transform: translate(-50%, 0%);
}
.nav_clg .nav_list.loadup .bottomnav {
  -webkit-animation: navwidth 1s ease-in;
          animation: navwidth 1s ease-in;
}
.nav_clg .nav_list.loadup .bottomnav:first-child {
  bottom: 0;
  -webkit-transition: bottom 0.75s ease-in-out;
  transition: bottom 0.75s ease-in-out;
}
.nav_clg .nav_list.loadup .bottomnav:nth-child(2) {
  bottom: 0;
  -webkit-transition: bottom 0.5s ease-in-out;
  transition: bottom 0.5s ease-in-out;
}
.nav_clg .nav_list.loadup .bottomnav:nth-child(3) {
  bottom: 0;
  -webkit-transition: bottom 0.25s ease-in-out;
  transition: bottom 0.25s ease-in-out;
}
.nav_clg .nav_list.loadup .menu {
  -webkit-animation: navname 1s 0.2s linear;
          animation: navname 1s 0.2s linear;
}
.nav_clg .bottomnav {
  background: #fff;
  border-radius: 5rem;
  padding: 0.4375rem 1.125rem;
  display: block;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin-top: 1rem;
  width: 43.3333vw;
  max-width: 9.75rem;
  -webkit-transition: all 1s;
  transition: all 1s;
  bottom: -100svh;
}
.nav_clg .icon_img {
  max-width: 3.125rem;
  width: 13.8889vw;
}
.nav_clg .menu {
  color: #747474;
  text-align: center;
  width: calc(100% - 3.125rem);
  white-space: nowrap;
  -webkit-transition: opacity 0.3s 1s;
  transition: opacity 0.3s 1s;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  opacity: 1;
}
.nav_clg .none {
  color: #fff;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  position: absolute;
  top: -1.75rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.nav_clg.listOpen {
  z-index: 100;
  opacity: 1;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

/***************************************************************
    12. board
***************************************************************/
.board_wrap {
  /*--------- 리스트 페이지 ------------- */
  /* 갤러리형 1단 */
  /* 갤러리형 2단 */
  /* 미리보기형 - 2줄 + 하단패딩 */
  /* ------------------------- 상세보기 ----------------- */
  /* ---------------- 검색 --------------------*/
}
.board_wrap .board_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #9F9F9F;
  height: calc(100svh - var(--main-height));
  text-align: center;
}
.board_wrap .board_blank.review_blank {
  background: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: calc(100svh - (var(--main-height) + 5rem));
}
.board_wrap .board_blank.review_blank button {
  margin-top: 0.5rem;
}
.board_wrap .board_blank.bg_gray {
  height: calc(85svh - var(--main-height));
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.board_wrap .board_blank .adddataBtn img {
  margin: 0 0 0 0.25rem;
  opacity: 0.5;
}
.board_wrap .search_block + .board_blank {
  height: calc(100svh - 35svh);
}
.board_wrap .top_tag + .board_blank {
  height: calc(100svh - (var(--main-height)) - 4.974375rem);
}
.board_wrap.pd_bottom .top_tag + .board_blank {
  height: calc(100svh - (var(--main-height)) - 11.974375rem);
}
.board_wrap .gallery_1 {
  padding-top: 0.5rem;
}
.board_wrap .gallery_1 .gallery_item {
  padding-bottom: 1.5rem;
}
.board_wrap .gallery_1 .gallery_item .card_point {
  padding: 0;
  aspect-ratio: 2/1;
  max-height: 260px;
  overflow: hidden;
  width: 100%;
  position: relative;
  margin-bottom: 0.75rem;
}
.board_wrap .gallery_1 .gallery_item .card_point img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.board_wrap .gallery_1 .gallery_item .card_point .likeBtnl {
  position: absolute;
  bottom: 0.5rem;
  right: 1rem;
}
.board_wrap .gallery_1 .gallery_item .gallery_info .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin: 0.25rem 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board_wrap .gallery_1 .gallery_item .gallery_info .date {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.board_wrap .gallery_1 .gallery_item .title_sub {
  font-size: var(--span2-f);
  color: #9F9F9F;
  margin: 0.25rem 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board_wrap .gallery_2 {
  padding-top: 0;
}
.board_wrap .gallery_2 .card_wrap {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.board_wrap .gallery_2 .card_wrap:last-child .gallery_item {
  margin-bottom: 0;
}
.board_wrap .gallery_2 .card_wrap .gallery_item {
  width: 100%;
  margin-bottom: 1rem;
}
.board_wrap .gallery_2 .card_wrap .gallery_item .card_point {
  width: initial;
  aspect-ratio: 1.4/1;
}
.board_wrap .gallery_2 .card_wrap .gallery_item .gallery_info .title {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  margin: 0.5625rem 0 0.625rem;
}
.board_wrap .gallery_2 .card_wrap .gallery_item .gallery_info .btn_icon {
  margin: 0.125rem 0;
}
.board_wrap .preview_1 .list_item {
  position: relative;
  padding: 1.25rem 0 1.5rem;
}
.board_wrap .preview_1 .list_item .error_icon {
  font-size: var(--span4-f);
  color: #F44432;
  background-color: rgba(244, 68, 50, 0.1);
  padding: 0.125rem 0.25rem;
  display: inline-block;
  margin-left: 0.25rem;
}
.board_wrap .preview_1 .list_item .ass_icon {
  font-size: var(--span4-f);
  color: #00B400;
  background-color: rgba(0, 180, 0, 0.1);
  padding: 0.125rem 0.25rem;
  display: inline-block;
  margin-left: 0.25rem;
}
.board_wrap .preview_1 .list_item .chat_error {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #F44432;
  margin-top: 0.375rem;
}
.board_wrap .preview_1 .list_item .chat_error svg {
  margin-right: 0.375rem;
}
.board_wrap .preview_1 .list_item .icon_list {
  margin-bottom: 0.5rem;
}
.board_wrap .preview_1 .list_item .icon_list .btn_icon {
  margin-right: 0.25rem;
}
.board_wrap .preview_1 .list_item .pic_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin-bottom: 0.75rem;
}
.board_wrap .preview_1 .list_item .pic_title .pic_img {
  width: 44px;
  height: 44px;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.5rem;
}
.board_wrap .preview_1 .list_item .pic_title .pic_txt .pic_t {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.board_wrap .preview_1 .list_item .pic_title .pic_txt .pic_sub {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.board_wrap .preview_1 .list_item .pic_title .btn_icon {
  position: absolute;
  right: 0;
  top: 0;
}
.board_wrap .preview_1 .list_item .result_title {
  font-size: var(--h1-f);
  font-weight: var(--bold-f);
  color: #00B400;
  margin-bottom: 0.75rem;
}
.board_wrap .preview_1 .list_item .result_title .result_type {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin-left: 0.25rem;
  color: #2F2F2F;
}
.board_wrap .preview_1 .list_item .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.board_wrap .preview_1 .list_item .title.search_title {
  display: block;
  margin-top: 0rem;
}
.board_wrap .preview_1 .list_item .title + .icon_list {
  margin: 0.5rem 0 0.75rem;
}
.board_wrap .preview_1 .list_item .sub_over {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.board_wrap .preview_1 .list_item .pre {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin: 0.75rem 0;
  height: auto;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  color: #747474;
}
.board_wrap .preview_1 .list_item .con_notice {
  background: rgba(0, 180, 0, 0.05);
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  padding: 0.75rem 1.25rem;
  margin: 0.5rem 0 0.25rem;
}
.board_wrap .preview_1 .list_item .con_notice .txt {
  font-size: var(--span3-f);
  color: #747474;
  position: relative;
  padding-left: 0.5rem;
  line-height: 1.2;
}
.board_wrap .preview_1 .list_item .con_notice .txt::before {
  content: "";
  position: absolute;
  top: 0.3rem;
  left: 0;
  display: block;
  width: 2px;
  height: 2px;
  background-color: #9F9F9F;
  border-radius: 50%;
}
.board_wrap .preview_1 .list_item .con_notice .info_table {
  padding: 0;
}
.board_wrap .preview_1 .list_item .con_notice .info_table .table_l {
  width: 25%;
  min-width: 3.75rem;
  font-size: var(--span3-f);
}
.board_wrap .preview_1 .list_item .con_notice .info_table .table_r {
  width: 75%;
  font-size: var(--span3-f);
}
.board_wrap .preview_1 .list_item .con_notice.con_result {
  background-color: #F5F5F5;
  margin-top: 0.75rem;
}
.board_wrap .preview_1 .list_item.sub_on .sub_over {
  color: #00B400;
}
.board_wrap .preview_1 .list_item.sub_on .title .btn_icon {
  border-color: #00B400;
  color: #00B400;
}
.board_wrap .preview_1 .list_item.sub_on .sub_info .info_table .table_r {
  color: #2F2F2F;
}
.board_wrap .preview_1 .list_item.sub_error .sub_over {
  color: #F44432;
}
.board_wrap .preview_1 .list_item.sub_error .bg_gray {
  background-color: rgba(244, 68, 50, 0.05);
}
.board_wrap .preview_1 .list_item.sub_error .bg_gray .error {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #F44432;
  padding: 0.5rem 0 0.625rem;
}
.board_wrap .preview_1 .list_item.sub_error .bg_gray .error svg {
  margin-right: 0.25rem;
}
.board_wrap .preview_1 .list_item.con_done .con_notice {
  background-color: #F5F5F5;
}
.board_wrap .preview_1 .list_item.con_done .list_btm .date_info {
  color: #747474;
}
.board_wrap .preview_1 .list_item.con_done .btn_border {
  border-color: #DFDFDF;
  color: #9F9F9F;
}
.board_wrap .preview_1 .subscrible_item {
  padding: 1.25rem 0 1.75rem;
}
.board_wrap .preview_1 .subscrible_item .title .btn_icon {
  position: absolute;
  right: 0;
}
.board_wrap .preview_1 .subscrible_list .subscrible_title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.board_wrap .preview_1 .subscrible_list .list_left {
  margin-top: 0.5rem;
}
.board_wrap .preview_1 .subscrible_list .list_left .list_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.25rem 0;
}
.board_wrap .preview_1 .subscrible_list .list_left .list_data .data_title {
  font-size: var(--span3-f);
  color: #9F9F9F;
  width: 25%;
  max-width: 5rem;
}
.board_wrap .preview_1 .subscrible_list .list_left .list_data .data_txt {
  font-size: var(--span3-f);
  width: 75%;
}
.board_wrap .preview_1 .subscrible_list.subscrible_bg {
  background: url(../images/icon/right.svg) no-repeat right center;
}
.board_wrap .preview_1 .date {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.board_wrap .preview_1 .pre_img {
  margin-bottom: 0.75rem;
  display: none;
}
.board_wrap .preview_1 .pre_img img {
  width: 5.375rem;
  aspect-ratio: 1;
  border-radius: 0.5rem;
  margin-right: 0.5rem;
}
@media (max-device-width: 320px) {
  .board_wrap .preview_1 .pre_img img {
    width: 4rem;
  }
}
.board_wrap .preview_1 .pre_edit {
  text-align: right;
  font-size: var(--misc2-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #9F9F9F;
  display: none;
  margin-top: 0.75rem;
}
.board_wrap .preview_1 .pre_edit a {
  margin-left: 1.5rem;
}
@media (max-device-width: 320px) {
  .board_wrap .preview_1 .pre_edit a {
    margin-left: 1rem;
  }
}
.board_wrap .preview_1 .list_fold .list_item .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.board_wrap .preview_1 .list_fold .list_item .title .title_r {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.board_wrap .preview_1 .list_fold .list_item .title .title_r img {
  margin-left: 0.5rem;
}
.board_wrap .preview_1 .list_fold .list_item .title > p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.board_wrap .preview_1 .list_fold .list_item .title .cate_icon {
  background-color: rgba(0, 180, 0, 0.1);
  color: #00B400;
  font-size: var(--span4-f);
  display: inline-block;
  padding: 0.125rem 0.25rem;
  margin-left: 0.25rem;
}
.board_wrap .preview_1 .list_fold .list_item .title_elip {
  width: calc(100% - 1.25rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 0.75rem;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.board_wrap .preview_1 .list_fold .list_item .reply {
  display: none;
  margin-top: 1.5rem;
}
.board_wrap .preview_1 .list_fold .list_item .reply .title {
  color: #00B400;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.board_wrap .preview_1 .list_fold .list_item .reply .comment {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin-bottom: 0.75rem;
}
.board_wrap .preview_1 .list_fold .list_item .review_star {
  margin-top: 0.5rem;
}
.board_wrap .preview_1 .list_fold.open .list_item .title img {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.board_wrap .preview_1 .list_fold.open .list_item .title_elip {
  white-space: initial;
}
.board_wrap .preview_1 .list_fold.open .list_item .pre {
  -webkit-line-clamp: initial;
}
.board_wrap .preview_1 .list_fold.open .list_item .reply {
  display: block;
}
.board_wrap .preview_1 .list_fold.open .pre_edit {
  display: block;
}
.board_wrap .preview_1 .list_fold.open .pre_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.board_wrap .preview_1 .sub_info {
  padding: 0.5rem 1.25rem;
}
.board_wrap .preview_1 .sub_info .info_table {
  padding: 0.25rem 0;
  margin: 0;
}
.board_wrap .preview_1 .sub_info .info_table .table_l {
  font-size: var(--span3-f);
  color: #9F9F9F;
  width: 25%;
  min-width: 3.5rem;
}
.board_wrap .preview_1 .sub_info .info_table .table_r {
  font-size: var(--span3-f);
  color: #9F9F9F;
  width: 75%;
}
.board_wrap .preview_1 .date_l {
  color: #2F2F2F;
  margin-right: 0.5rem;
}
.board_wrap .list_btm {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 0.5rem;
}
.board_wrap .list_btm .date_info {
  color: #00B400;
  margin-left: 0.125rem;
}
.board_wrap .consult_on {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2F2F2F), color-stop(60%, #2F2F2F), color-stop(60%, #F5F5F5), to(#F5F5F5));
  background: linear-gradient(#2F2F2F 0, #2F2F2F 60%, #F5F5F5 60%, #F5F5F5 100%);
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 1.5rem 1.25rem 0.5rem;
}
.board_wrap .consult_on .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  color: #fff;
  position: relative;
  padding-left: 0.75rem;
}
.board_wrap .consult_on .title::before {
  content: "";
  position: absolute;
  width: 0.375rem;
  height: 0.375rem;
  background-color: #00B400;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  border-radius: 50%;
  display: block;
}
.board_wrap .consult_on .sub_t {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.board_wrap .consult_on .cardround {
  background: #fff url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  border-radius: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1rem;
}
.board_wrap .consult_on .cardround .on_img {
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.5rem;
}
.board_wrap .consult_on .cardround .on_info .on_t {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.board_wrap .consult_on .cardround .on_info .on_sub {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.board_wrap .consult_on .cardround .on_info .on_date {
  font-size: var(--span3-f);
  margin-top: 0.5rem;
}
.board_wrap .consult_on .cardround .on_info .on_date .date_info {
  color: #00B400;
  margin-left: 0.25rem;
}
.board_wrap .top_title {
  padding: 1rem 0;
}
.board_wrap .top_title h3.title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.board_wrap .top_title .sub {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.board_wrap article.detail .event_img {
  width: calc(100% + 2.5rem);
  max-width: calc(100% + 2.5rem);
  position: relative;
  left: -1.25rem;
}
.board_wrap article.detail .txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.board_wrap .rcmd_article {
  background: #f5f5f5;
  padding-bottom: 5rem;
  max-height: calc(100svh - var(--base-height));
  overflow: auto;
}
.board_wrap .search_block {
  margin: 0 0 1.5rem;
}
.board_wrap .search_block .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 1.5rem 0 0;
}
.board_wrap .search_block .title .search_tn {
  font-size: var(--span3-f);
  color: #9F9F9F;
  font-weight: initial;
}
.board_wrap .search_block .title_lg {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-top: 1.5rem;
}
.board_wrap .search_block .list_total {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.75rem;
  text-align: right;
}
.board_wrap .search_block .search_rk {
  margin-top: 0.75rem;
}
.board_wrap .search_block .search_rk .rk_item {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  margin-bottom: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.board_wrap .search_block .search_rk .rk_item .rk_n {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span3-f);
  margin-right: 0.5rem;
  width: 1.375rem;
  aspect-ratio: 1;
  background-color: #2F2F2F;
  color: #fff;
  border-radius: 0.5rem 0 0 0;
}
.board_wrap .search_block .searchadd_list {
  padding: 1rem 0 0;
}
.board_wrap .search_block .searchadd_list .add_data {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background: #F5F5F5 url(../images/icon/check_off.svg) no-repeat;
  background-position: 1rem center;
  padding: 1.25rem 1rem 1.25rem 3rem;
  margin: 0 0 0.5rem;
}
.board_wrap .search_block .searchadd_list .add_data .stitle {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.board_wrap .search_block .searchadd_list .add_data .stitle span.gray01 {
  margin-right: 0.25rem;
}
.board_wrap .search_block .searchadd_list .add_data .span3_f {
  margin-bottom: 0.25rem;
}
.board_wrap .search_block .searchadd_list .add_data.check {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/check_on.svg) no-repeat;
  background-position: 1rem center;
}
.board_wrap .search_block .searchadd_list.review_list .add_data {
  padding: 1rem 1rem 1rem 3.25rem;
  background: #F5F5F5 url(../images/icon/radioBtn_off.svg) no-repeat;
  background-position: 1rem center;
}
.board_wrap .search_block .searchadd_list.review_list .check {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/radioBtn_on.svg) no-repeat;
  background-position: 1rem center;
}
.board_wrap .search_block .searchadd_list.review_list .check_disabled .stitle,
.board_wrap .search_block .searchadd_list.review_list .check_disabled .span3_f {
  color: #C9C9C9;
}
.board_wrap .tag_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: 0.75rem;
}
.board_wrap .tag_list .tag {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  position: relative;
  z-index: 1;
}
.board_wrap .tag_list .tag .xBtn {
  position: relative;
  z-index: 9;
}
.board_wrap .tag_list .tag img {
  margin-right: 0;
}
.board_wrap .offlineSwiper {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.board_wrap .offlineSwiper .offline_btn:first-child {
  margin-left: 1.25rem !important;
}
.board_wrap .offlineSwiper .offline_btn:last-child {
  margin-right: 1.25rem !important;
}
.board_wrap .offline_btn {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
  padding: 0.75rem;
  width: 100%;
  background: url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
  border-radius: 0.25rem;
  margin-top: 1rem;
  text-align: left;
  display: block;
}

.search_txt {
  color: #00B400;
}

/* ------------------ 글쓰기 --------------------- */
.board_write {
  padding-top: 1.5rem;
}
.board_write .write_top {
  padding: 0.75rem;
  background: rgba(0, 180, 0, 0.05) url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
}
.board_write .write_top.cardround {
  margin: 0 0 0.5rem;
}
.board_write .write_top .primary {
  margin-bottom: 0.75rem;
}
.board_write .write_top .list_p {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding-left: 1rem;
  position: relative;
}
.board_write .write_top .list_p::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  top: 0.4rem;
  left: 0.4rem;
  display: block;
  background-color: #2F2F2F;
  border-radius: 50%;
}
.board_write .write_top .list_p2 {
  font-size: var(--span3-f);
  margin: 0.25rem;
}
.board_write .write_top .list_p2 span {
  color: #00B400;
  margin-right: 0.5rem;
}
.board_write .add_file {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 0.5rem;
}
.board_write .add_file .file_list {
  margin-left: 0.5rem;
}
@media (max-device-width: 359px) {
  .board_write .add_file .input_file label {
    width: 4.5rem;
  }
  .board_write .add_file .file_list {
    width: 4.5rem;
  }
}
.board_write .add_file.swiper {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  margin-bottom: 0;
}
.board_write .add_file.swiper .input_file {
  margin-left: 1.25rem;
}
.board_write .add_file.swiper .file_list:last-child {
  margin-right: 1.25rem;
}

.review_star {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
}
.review_star .rank_star {
  width: 2rem;
  aspect-ratio: 1;
  background: url(../images/icon/star_off.svg) no-repeat;
  background-size: cover;
  cursor: pointer;
}
.review_star .rank_star.star_on {
  background: url(../images/icon/star_on.svg) no-repeat;
  background-size: cover;
}
@media (max-device-width: 359px) {
  .review_star .rank_star {
    width: 1.75rem;
  }
}

.review_star {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
}
.review_star .rank_star {
  width: 2rem;
  aspect-ratio: 1;
  background: url(../images/icon/star_off.svg) no-repeat;
  background-size: cover;
  cursor: pointer;
}
.review_star .rank_star.star_on {
  background: url(../images/icon/star_on.svg) no-repeat;
  background-size: cover;
}
@media (max-device-width: 359px) {
  .review_star .rank_star {
    width: 1.75rem;
  }
}

.likeBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #F44432;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  padding-left: 1.5rem;
  height: 1.25rem;
  background: url(../images/icon/heart_on.svg) no-repeat;
  background-position: left center;
  -webkit-animation: like 0.4s ease-in-out;
          animation: like 0.4s ease-in-out;
}
.likeBtn.unlike {
  background: url(../images/icon/heart_off.svg) no-repeat;
  background-position: left center;
  color: #C9C9C9;
  -webkit-animation: none;
          animation: none;
}

.likeBtnl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #F44432;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  padding-left: 2.25rem;
  height: 2rem;
  background: url(../images/icon/heartb_on.svg) no-repeat;
  background-position: left center;
  -webkit-animation: likel 0.4s ease-in-out;
          animation: likel 0.4s ease-in-out;
}
.likeBtnl.unlike {
  background: url(../images/icon/heartb_off.svg) no-repeat;
  background-position: left center;
  color: #C9C9C9;
  -webkit-animation: none;
          animation: none;
}

.detail_footer {
  position: fixed;
  padding: 0.75rem 1.25rem;
  width: 100%;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #fff;
  z-index: 11;
}
.detail_footer .share {
  width: 1.25rem;
  height: 1.25rem;
  background: url(../images/icon/share.svg) no-repeat center;
  background-size: 2rem;
  margin-right: 0.5rem;
  cursor: pointer;
  position: absolute;
  right: 4rem;
}

.detail_footer + .btn_fix .qna_noti {
  position: relative;
  bottom: 1.875rem;
}
.detail_footer + .btn_fix .toast {
  bottom: 3.5rem;
}

.list_btm {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 0.5rem;
}
.list_btm .date_info {
  color: #00B400;
  margin-left: 0.125rem;
}

/* 약사 이미지 리스트 */
.pre_rp {
  background-color: rgba(0, 180, 0, 0.05);
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  padding: 0.25rem 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pre_rp .rp_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 1.5rem;
}
.pre_rp .rp_img.img2n {
  width: 2.5rem;
}
.pre_rp .rp_img.img3n {
  width: 3.5rem;
}
.pre_rp .rp_img.img4n {
  width: 4.5rem;
}
.pre_rp .rp_img.img4n .s_more {
  width: 1.5rem;
  height: 1.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  position: relative;
  -webkit-transform: translateX(-1.5rem);
          transform: translateX(-1.5rem);
}
.pre_rp .rp_img.img4n .s_more::after {
  content: "+3";
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  font-size: var(--span4-f);
  color: #fff;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.pre_rp .rp_img img {
  width: 1.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  position: relative;
}
.pre_rp .rp_img img:nth-child(2n) {
  -webkit-transform: translateX(-0.5rem);
          transform: translateX(-0.5rem);
}
.pre_rp .rp_img img:nth-child(3n) {
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.pre_rp .rp_txt {
  font-size: var(--span3-f);
  color: #00B400;
  margin-left: 0.5rem;
}
.pre_rp.re_none {
  background-color: #F5F5F5;
}
.pre_rp.re_none .rp_txt {
  color: #747474;
}

/* 구독중인 핏타민 추가 */
.addsub_list {
  padding: 0.5rem 0;
}
.addsub_list .sublist {
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  padding: 1rem 1.25rem;
  border-radius: 1rem;
  margin-top: 0.75rem;
}
.addsub_list .sublist .title {
  line-height: 2rem;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  background: url(../../images/icon/radioBtn_off.svg) no-repeat;
  background-position: right center;
  background-size: contain;
  margin: 0;
}
.addsub_list .sublist .info_card {
  margin-top: 0.5rem;
  background: #F5F5F5;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  padding: 0.5rem 0.75rem;
}
.addsub_list .sublist .info_card .info_table .table_l {
  font-size: var(--span3-f);
  margin-right: 0;
}
.addsub_list .sublist .info_card .info_table .table_r {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.addsub_list .sublist .date {
  margin-top: 0.75rem;
  font-size: var(--span3-f);
}
.addsub_list .sublist .date .gray02 {
  margin-left: 0.5rem;
}
.addsub_list .sublist.check {
  background: rgba(0, 180, 0, 0.1);
}
.addsub_list .sublist.check .title {
  background: url(../../images/icon/radioBtn_on.svg) no-repeat;
  background-position: right center;
  background-size: contain;
}
.addsub_list .sublist.check .info_card {
  background: #fff;
}
.addsub_list .sublist.check .info_card .info_table .table_r {
  color: #2F2F2F;
}

/***************************************************************
    13. main
***************************************************************/
/* -------------------------- 공통 ---------------------*/
/* 결과 페이지 */
.cpl_wrap {
  padding-top: 2rem;
}
.cpl_wrap .cpl_icon {
  width: 3rem;
  margin-bottom: 1.5rem;
  position: relative;
}
.cpl_wrap .cpl_icon .checkbg {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  -webkit-animation: checkbg 2.5s linear;
          animation: checkbg 2.5s linear;
}
.cpl_wrap .cpl_icon.con_center {
  width: 4rem;
  height: 4rem;
  margin: 12svh auto 3.125rem;
}
.cpl_wrap .cpl_icon.con_center lottie-player {
  width: 4rem;
  height: 4rem;
}
.cpl_wrap .cpl_icon.con_center .checkbg {
  width: 100%;
}
.cpl_wrap .cpl_title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.75rem;
}
.cpl_wrap .cpl_txt {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  margin-bottom: 0.75rem;
}
.cpl_wrap .cpl_banner {
  width: 100%;
  margin-top: 1rem;
}
.cpl_wrap .cardround {
  padding: 1.25rem 1.5rem;
  margin-bottom: 0;
}

.info_table {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.25rem 0;
}
.info_table .table_l {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  margin-right: 1rem;
  color: #9F9F9F;
  width: 32%;
  max-width: 5rem;
}
.info_table .table_r {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  width: 68%;
}

/* 약관 */
.plc_wrap {
  padding: 1.5rem 0;
}
.plc_wrap .plc_item {
  margin-bottom: 2rem;
  padding: 0 0.25rem;
}
.plc_wrap .plc_item:last-child {
  margin-bottom: 0;
}
.plc_wrap .plc_title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.75rem;
}
.plc_wrap h3 {
  margin-bottom: 0.75rem;
  line-height: var(--line-h);
}
.plc_wrap .plc_txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
  margin-bottom: 1rem;
}
.plc_wrap .plc_txt:last-child {
  margin-bottom: 0;
}
.plc_wrap table {
  border-right: 1px solid #DFDFDF;
}
.plc_wrap table th {
  background-color: #DFDFDF;
  color: #747474;
  border-left: 1px solid #DFDFDF;
  padding: 0.75rem 1rem;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  text-align: left;
}
.plc_wrap table td {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
  padding: 0.75rem 0.75rem;
  border-left: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
}
.plc_wrap .plc_li {
  list-style: disc;
  padding-left: 1.5rem;
}
.plc_wrap .plc_li li {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
}

/* 스플래시 */
.start {
  text-align: center;
  position: relative;
}
.start .app_logo {
  width: 5.75rem;
  margin: 40svh auto 0.25rem;
}

/* ----------------------- 메인페이지 ------------------------- */
/* 친구등록 애니 */
.friend_pop {
  position: fixed;
  top: 20svh;
  width: 100%;
}

.friend_ani {
  width: 80%;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.friend_img {
  position: absolute;
  top: 5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.friend_img .img_list {
  width: 5.125rem;
  height: 5.125rem;
  overflow: hidden;
  border: 3px solid #fff;
  background: #F5F5F5 url(../images/icon/user.svg) no-repeat;
  background-size: 2.3125rem;
  background-position: center;
  border-radius: 50%;
  margin: 0 -0.5rem;
  position: relative;
  -webkit-animation: circle 1.2s linear infinite;
          animation: circle 1.2s linear infinite;
}

/* ------------------- 설문 ----------------- */
.servey_first {
  padding: 15svh 0 0;
  text-align: center;
}
.servey_first .servey_visual {
  margin: 0 auto;
  width: 100vw;
  max-width: 22.5rem;
  position: relative;
}
.servey_first .servey_visual::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(30%, #fff), to(#fff));
  background: linear-gradient(transparent 0, #fff 30%, #fff 100%);
  height: 20svh;
  z-index: 1;
}
.servey_first .servey_txt {
  position: fixed;
  z-index: 2;
  width: 100%;
  left: 0;
  bottom: 17svh;
}
.servey_first + .btn_wrap {
  padding: 0 0 1.5rem;
}
.servey_first .loading_ani {
  width: 11.125rem;
  margin: 15svh auto 0;
  position: relative;
  top: initial;
  left: initial;
  -webkit-transform: initial;
          transform: initial;
  background-color: #Fff;
}
@media (max-device-width: 320px) {
  .servey_first .loading_ani {
    width: 48.2385vw;
  }
}
.servey_first .loading_ani.loading_water {
  width: 146px;
  aspect-ratio: 1;
  border: 12px solid #fff;
  border-radius: 50%;
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
  overflow: hidden;
  margin-bottom: 1rem;
  position: relative;
}
.servey_first .loading_ani.loading_water .water_bg {
  border-radius: 50%;
  width: 200%;
  position: absolute;
  bottom: -60%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.servey_first .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.75rem;
}
.servey_first .sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
}
.servey_first.payment_loading .loading_ani {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 2.25rem;
}
.servey_first.payment_loading .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
}
.servey_first.payment_loading .sub {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #9F9F9F;
}

.first_slide {
  height: calc(100svh - var(--header-height));
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.first_slide .fisrt_visual {
  width: 100%;
  position: relative;
}
.first_slide .fisrt_visual::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(30%, #fff), to(#fff));
  background: linear-gradient(transparent 0, #fff 30%, #fff 100%);
  height: 20svh;
  z-index: 1;
}
@media (min-device-width: 361px) {
  .first_slide .fisrt_visual::after {
    height: 23svh;
  }
}
@media (min-device-width: 480px) {
  .first_slide .fisrt_visual::after {
    height: 30svh;
  }
}
.first_slide .fisrt_visual .pd_side {
  width: 88.8889vw;
  max-width: 20rem;
  margin: 0 auto;
}
.first_slide .fisrt_visual .coin_img {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: 0;
  max-width: 18rem;
  width: 80vw;
}
.first_slide .fisrt_visual.bg_none::after {
  background: none;
}
.first_slide .fisrt_txt {
  position: fixed;
  z-index: 2;
  width: 100%;
  left: 0;
  bottom: 25svh;
  text-align: center;
}
.first_slide .fisrt_txt .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 1rem;
}
.first_slide .swiper-pagination {
  bottom: 20svh;
}
.first_slide .swiper-pagination-bullet {
  width: 5px;
  height: 5px;
  background: #DFDFDF;
  opacity: 1;
  margin: 0 0.1875rem !important;
}
.first_slide .swiper-pagination-bullet-active {
  background: #2F2F2F;
}
.servey_wrap {
  padding-top: 1.5rem;
  position: relative;
}
.servey_wrap .icon {
  width: 3.125rem;
  aspect-ratio: 1;
  margin-bottom: 1.5rem;
}
.servey_wrap .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.75rem;
  word-break: keep-all;
}
.servey_wrap .sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  margin-bottom: 0.75rem;
}
.servey_wrap .dbcheck {
  font-size: var(--span2-f);
  color: #F44432;
  margin-bottom: 0.75rem;
}
.servey_wrap .slide_year {
  height: 18.75rem;
  margin-top: 10svh;
  position: relative;
  overflow: hidden;
}
@media (min-device-width: 480px) {
  .servey_wrap .slide_year {
    height: calc(100svh - 28rem);
  }
}
.servey_wrap .slide_year::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 10svh;
  max-height: 5.625rem;
  display: block;
  z-index: 2;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(transparent));
  background: linear-gradient(#fff 0%, transparent 100%);
}
.servey_wrap .slide_year::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10svh;
  max-height: 5.625rem;
  display: block;
  z-index: 2;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#fff));
  background: linear-gradient(transparent 0%, #fff 100%);
}
.servey_wrap .slide_year .slide_list .slide_item {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #C9C9C9;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.servey_wrap .slide_year .slide_list .slide_item.swiper-slide-active {
  font-size: 2rem;
  color: #00B400;
}
@media (max-device-width: 359px) {
  .servey_wrap .slide_year .slide_list .slide_item.swiper-slide-active {
    font-size: 8.9136vw;
  }
}
.servey_wrap .servey_input {
  font-family: "Spoqa Han Sans Neo", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "sans-serif";
  margin-top: 30svh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.servey_wrap .servey_input input[type=number] {
  font-size: 2rem;
  font-weight: var(--bold-f);
  color: #00B400;
  padding: 0;
  width: 3.75rem;
  text-align: right;
  background-color: transparent;
}
@media (max-device-width: 359px) {
  .servey_wrap .servey_input input[type=number] {
    font-size: 8.9136vw;
  }
}
.servey_wrap .servey_input input[type=number]::-webkit-input-placeholder {
  font-size: 2rem;
}
.servey_wrap .servey_input input[type=number]::-moz-placeholder {
  font-size: 2rem;
}
.servey_wrap .servey_input input[type=number]:-ms-input-placeholder {
  font-size: 2rem;
}
.servey_wrap .servey_input input[type=number]::-ms-input-placeholder {
  font-size: 2rem;
}
.servey_wrap .servey_input input[type=number]::placeholder {
  font-size: 2rem;
}
@media (max-device-width: 359px) {
  .servey_wrap .servey_input input[type=number]::-webkit-input-placeholder {
    font-size: 8.9136vw;
  }
  .servey_wrap .servey_input input[type=number]::-moz-placeholder {
    font-size: 8.9136vw;
  }
  .servey_wrap .servey_input input[type=number]:-ms-input-placeholder {
    font-size: 8.9136vw;
  }
  .servey_wrap .servey_input input[type=number]::-ms-input-placeholder {
    font-size: 8.9136vw;
  }
  .servey_wrap .servey_input input[type=number]::placeholder {
    font-size: 8.9136vw;
  }
}
.servey_wrap .servey_input input[type=number]:-moz-placeholder-shown + .centertxt {
  color: #C9C9C9;
}
.servey_wrap .servey_input input[type=number]:-ms-input-placeholder + .centertxt {
  color: #C9C9C9;
}
.servey_wrap .servey_input input[type=number]:placeholder-shown + .centertxt {
  color: #C9C9C9;
}
.servey_wrap .servey_input .centertxt {
  font-size: 2rem;
  color: #00B400;
  font-weight: var(--bold-f);
  margin: 0 0.75rem 0 0.15rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
@media (max-device-width: 359px) {
  .servey_wrap .servey_input .centertxt {
    font-size: 8.9136vw;
  }
}
.servey_wrap .servey_input label {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #9F9F9F;
}
.servey_wrap .roading {
  margin-top: 1.5rem;
}
.servey_wrap .roading .roading_bar {
  width: 100%;
  position: relative;
  background-color: #F5F5F5;
  height: 0.3125rem;
  border-radius: 3rem;
}
.servey_wrap .roading .roading_bar::after {
  content: "";
  width: 0.3125rem;
  border-radius: 3rem;
  display: block;
  height: 0.3125rem;
  background-color: #00B400;
  position: absolute;
  top: 0;
  left: 0;
}
.servey_wrap .roading .roading_step {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0.75rem;
}
.servey_wrap .roading .roading_step p {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #fff;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  width: calc(100% / 4);
}
.servey_wrap .roading .roading_step p:first-child {
  color: #00B400;
}
.servey_wrap .roading .roading_step p:nth-child(2) {
  text-align: center;
}
.servey_wrap .roading .roading_step p:nth-child(3) {
  text-align: center;
}
.servey_wrap .roading .roading_step p:last-child {
  text-align: right;
}
.servey_wrap .roading.step2 .roading_bar:after {
  width: calc(100% / 8 * 3);
  -webkit-animation: step2 1s ease-in-out;
          animation: step2 1s ease-in-out;
}
.servey_wrap .roading.step2 .roading_step p:first-child {
  color: #fff;
}
.servey_wrap .roading.step2 .roading_step p:nth-child(2) {
  color: #00B400;
  -webkit-animation: stept 1.2s ease-in-out;
          animation: stept 1.2s ease-in-out;
}
.servey_wrap .roading.step3 .roading_bar:after {
  width: calc(100% / 8 * 5);
  -webkit-animation: step3 1s ease-in-out;
          animation: step3 1s ease-in-out;
}
.servey_wrap .roading.step3 .roading_step p:first-child {
  color: #fff;
}
.servey_wrap .roading.step3 .roading_step p:nth-child(3) {
  color: #00B400;
  -webkit-animation: stept 1.2s ease-in-out;
          animation: stept 1.2s ease-in-out;
}
.servey_wrap .roading.step4 .roading_bar:after {
  width: 100%;
  -webkit-animation: step4 1s ease-in-out;
          animation: step4 1s ease-in-out;
}
.servey_wrap .roading.step4 .roading_step p:first-child {
  color: #fff;
}
.servey_wrap .roading.step4 .roading_step p:last-child {
  color: #00B400;
  -webkit-animation: stept 1.2s ease-in-out;
          animation: stept 1.2s ease-in-out;
}
.servey_wrap .chat_p {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 2rem;
}
.servey_wrap .chat_p .img {
  width: 2.75rem;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  margin-right: 0.5rem;
  overflow: hidden;
}
.servey_wrap .chat_p .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.servey_wrap .chat_p .chat_name .span2_fb {
  margin-bottom: 0.25rem;
}
.servey_wrap .chat_p .chat_name p > span {
  margin-left: 0.25rem;
  font-weight: initial;
}
.servey_wrap .chat_p .btn_icon {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.servey_wrap .clg_ml {
  font-size: 2rem;
  color: #00B400;
  text-align: center;
  font-weight: 700;
}
@media (max-device-width: 359px) {
  .servey_wrap .clg_ml {
    font-size: 8.9136vw;
  }
}
.servey_wrap .clg_checklist .check_item {
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  margin-top: 0.75rem;
  border-radius: 1rem;
  padding: 1.5rem 1.25rem 1.5rem 4rem;
  background-image: url(../images/icon/radioBtn_off.svg);
  background-repeat: no-repeat;
  background-position: 1.25rem center;
  background-size: 2rem;
  border: 1px solid transparent;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.servey_wrap .clg_checklist .check_item .item_txt .name {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-bottom: 0.25rem;
}
.servey_wrap .clg_checklist .check_item .item_txt .sub {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  margin-bottom: 0;
}
.servey_wrap .clg_checklist .check_item .item_ticket {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: right;
  padding-left: 1.375rem;
  background-image: url(../images/icon/icon_ticket.svg);
  background-repeat: no-repeat;
  background-size: 1.25rem;
  background-position: left center;
  font-size: var(--span3-f);
  color: #747474;
  line-height: 1.25rem;
}
.servey_wrap .clg_checklist .check_item.disabled {
  background-color: #F5F5F5;
  border-color: #DFDFDF;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.servey_wrap .clg_checklist .check_item.disabled .item_txt .name,
.servey_wrap .clg_checklist .check_item.disabled .item_txt .sub {
  color: #9F9F9F;
}
.servey_wrap .clg_checklist .check_item.disabled .item_ticket {
  background-image: url(../images/icon/icon_ticket_gray.svg);
  color: #9F9F9F;
}
.servey_wrap .clg_checklist .check_item.checked {
  background-color: rgba(0, 180, 0, 0.05);
  -webkit-box-shadow: none;
          box-shadow: none;
  background-image: url(../images/icon/radioBtn_on.svg);
}

/* 설문 스와이프 별도 설정*/
.servey_slide .contents {
  padding: 0;
}
.servey_slide .servey_wrap {
  height: calc(100svh - var(--header-height));
  overflow: auto;
  padding: 1.5rem;
}

.check_btn {
  padding: 0.75rem 0 6rem;
}
.check_btn .checkbtn {
  padding: 1.5rem 4rem 1.5rem 1.25rem;
  background: #fff url(../images/icon/radioBtn_off.svg) no-repeat;
  background-position: calc(100% - 1.25rem) center;
  border-radius: 1rem;
  margin-bottom: 0.75rem;
  color: #9F9F9F;
  position: relative;
  z-index: 0;
  cursor: pointer;
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
}
.check_btn .checkbtn.checked {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/radioBtn_on.svg) no-repeat;
  background-position: calc(100% - 1.25rem) center;
  color: #2F2F2F;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.check_btn .checkbtn .check_sub {
  font-size: var(--span2-f);
  color: #747474;
  font-weight: 500;
}
.check_btn.check_db .checkbtn {
  background: #fff url(../images/icon/checkBtn_off.svg) no-repeat;
  background-position: calc(100% - 1.25rem) center;
}
.check_btn.check_db .checkbtn.checked {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/checkBtn_on.svg) no-repeat;
  background-position: calc(100% - 1.25rem) center;
}
.check_btn .infocard {
  color: #747474;
  font-size: var(--p3-f);
  line-height: var(--line-h);
}
.check_btn.d_list .checkbtn {
  background: #fff url(../images/icon/checkBtn_off.svg) no-repeat;
  background-position: calc(100% - 1.25rem) center;
}
.check_btn.d_list .checkbtn.checked {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/checkBtn_on.svg) no-repeat;
  background-position: calc(100% - 1.25rem) 1.25rem;
}
.check_btn.d_list .checkbtn .d_info {
  background-color: #fff;
  padding: 0.375rem 0.75rem;
  border-radius: 0.5rem;
  width: calc(100% + 2.5rem);
  margin-top: 0.625rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  z-index: 999;
}
.check_btn.d_list .checkbtn .d_info .d_img {
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  margin-right: 0.5rem;
  overflow: hidden;
}
.check_btn.d_list .checkbtn .d_info .d_name {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #747474;
  width: calc(100% - 3.2rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.check_btn.d_list .checkbtn .d_info .ddelBtn {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  width: 1.25rem;
  height: 1.25rem;
  background: url(../images/icon/delete_gr02.svg) no-repeat;
  background-size: cover;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 9999;
}

.check_icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-top: 0.75rem;
  padding-bottom: 5rem;
}
.check_icon .checkicon {
  width: calc(100% / 3 - (2rem / 3));
  margin-right: 1rem;
  margin-bottom: 1rem;
  position: relative;
}
.check_icon .checkicon:nth-child(3n) {
  margin-right: 0;
}
.check_icon .checkicon .sur_icon {
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 1rem;
  padding: 1.5rem;
}
.check_icon .checkicon .sur_icon img {
  max-width: 3.125rem;
}
.check_icon .checkicon .sur_txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  text-align: center;
  margin-top: 0.5rem;
}
.check_icon .checkicon .sur_num {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  background-color: #2F2F2F;
  color: #fff;
  border-radius: 3rem;
  font-size: var(--span3-f);
  padding: 0.25rem 0.625rem;
}
.check_icon .checkicon.checked .sur_txt {
  color: #2F2F2F;
}

.consult_wrap {
  padding: 0 0.25rem 0.5rem;
  position: relative;
}
.consult_wrap.pd_bottom {
  padding-bottom: 0;
}
.consult_wrap.pd_bottom::after {
  height: 15svh;
}
.consult_wrap .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-bottom: 0.5rem;
}
.consult_wrap .check_btn {
  padding: 1rem 0 0.75rem;
}
.consult_wrap .check_btn .checkbtn:last-child {
  margin-bottom: 0;
}
.consult_wrap .consult_top {
  padding: 1.0625rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: url(../images/icon/top.svg) no-repeat;
  background-position: right center;
}
.consult_wrap .consult_top .top_l .t_title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.consult_wrap .consult_top .top_l .sub {
  font-size: var(--span2-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.consult_wrap .consult_top .fold_t {
  color: #9F9F9F;
  opacity: 0;
  padding-right: 1.5rem;
}
.consult_wrap .con_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  padding-bottom: 1.125rem;
  opacity: 1;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.consult_wrap .con_btn .btn {
  width: 100%;
  text-align: center;
  border-radius: 0.5rem;
  padding: 1.5rem 0;
  color: #9F9F9F;
}
.consult_wrap .con_btn .btn p {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-top: 2.875rem;
}
.consult_wrap .con_btn .btn.btn_chat {
  background: #F5F5F5 url(../images/icon/datecaht_off.svg) no-repeat;
  background-position: center 1.5rem;
}
.consult_wrap .con_btn .btn.btn_chat.checked {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/datecaht_on.svg) no-repeat;
  background-position: center 1.5rem;
  color: #2F2F2F;
}
.consult_wrap .con_btn .btn.btn_reserve {
  background: #F5F5F5 url(../images/icon/datereserve_off.svg) no-repeat;
  background-position: center 1.5rem;
}
.consult_wrap .con_btn .btn.btn_reserve.checked {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/datereserve_on.svg) no-repeat;
  background-position: center 1.5rem;
  color: #2F2F2F;
}
.consult_wrap .con_date {
  padding-bottom: 1.25rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  opacity: 1;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.consult_wrap .con_date .swiper-slide:first-child {
  margin-left: 1.25rem;
}
.consult_wrap .con_date .swiper-slide:last-child {
  margin-right: 1.25rem;
}
.consult_wrap .con_time {
  padding-bottom: 1rem;
  opacity: 1;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.consult_wrap .con_time .time_list {
  padding-top: 0.3125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.consult_wrap .con_time .time_list .default {
  width: calc(100% / 4 - (1.5rem / 4));
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
}
.consult_wrap .con_time .time_list .default:nth-child(4n) {
  margin-right: 0;
}
.consult_wrap .con_timetype {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 1.5rem;
  height: auto;
  opacity: 1;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.consult_wrap .con_timetype .type {
  margin-left: 0.5rem;
}
.consult_wrap .con_timetype .type .type_bg {
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  border: 1px solid transparent;
}
.consult_wrap .default {
  background-color: #fff;
  border: 1px solid #DFDFDF;
  border-radius: 0.25rem;
  font-size: var(--span3-f);
  color: #9F9F9F;
  padding: 0.75rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
}
.consult_wrap .default.select {
  background-color: #2F2F2F;
  border-color: transparent;
  color: #fff;
}
.consult_wrap .default.disabled {
  background-color: #F5F5F5;
  border-color: transparent;
}
.consult_wrap.con_fold .consult_top {
  background: url(../images/icon/down.svg) no-repeat;
  background-position: right center;
}
.consult_wrap.con_fold .consult_top .top_l .sub {
  display: none;
}
.consult_wrap.con_fold .consult_top .fold_t {
  opacity: 1;
}
.consult_wrap.con_fold .con_btn,
.consult_wrap.con_fold .con_date,
.consult_wrap.con_fold .con_time,
.consult_wrap.con_fold .con_timetype {
  height: 0;
  overflow: hidden;
  opacity: 0;
  padding: 0;
}

.pack_smr {
  position: relative;
  padding: 1rem 0.25rem;
}
.pack_smr .cardround {
  padding: 0.5rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
  line-height: 1;
  margin: 0 0 0.5rem;
}
.pack_smr .cardround img {
  width: 2rem;
  height: 1.5rem;
  margin-right: 0.5rem;
}
.pack_smr .cardround .name {
  margin-right: 0.25rem;
}

.conlist_wrap {
  background-color: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 1rem 1.25rem 3rem;
}
.conlist_wrap .con_list {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: #fff;
  border-radius: 1rem;
  padding: 1.25rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin: 0 0 0.75rem;
}
.conlist_wrap .con_list .img {
  width: 2.875rem;
  height: 2.875rem;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  overflow: hidden;
  margin-right: 0.5rem;
}
.conlist_wrap .con_list .name .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.25rem;
}
.conlist_wrap .con_list .name .title span {
  padding-left: 1.125rem;
  position: relative;
  color: #C9C9C9;
}
.conlist_wrap .con_list .name .title span::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  background-color: #C9C9C9;
  display: block;
  position: absolute;
  border-radius: 50%;
  top: 0.25rem;
  left: 0.5rem;
}
.conlist_wrap .con_list .name .title span.on {
  color: #00B400;
}
.conlist_wrap .con_list .name .title span.on::before {
  background-color: #00B400;
}
.conlist_wrap .con_list .name .sub {
  color: #9F9F9F;
  font-size: var(--span3-f);
}
.conlist_wrap .con_list .btn_icon {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  display: none;
}
.conlist_wrap .con_list.new .btn_icon {
  display: block;
}

.select_pharm {
  position: relative;
  z-index: 1;
  background: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 1rem 1.25rem 0;
}
.select_pharm .selectPharm {
  border-radius: 0.5rem;
  border: 1px solid #DFDFDF;
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: var(--span2-f);
  background: url(../images/icon/down_bk.svg) no-repeat;
  background-position: calc(100% - .75rem) center;
}
.select_pharm .select_pharmlist {
  position: absolute;
  top: 4rem;
  left: 1rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  border-radius: 0.75rem;
  background: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: none;
}
.select_pharm .select_pharmlist > p {
  border-bottom: 1px solid #F5F5F5;
  padding: 0.625rem 2.75rem;
  font-size: var(--p3-f);
  line-height: var(--line-h);
}
.select_pharm .select_pharmlist > p.slct {
  background: url(../images/icon/check_on.svg) no-repeat;
  background-size: 1.25rem;
  background-position: 1rem center;
}
.select_pharm .select_pharmlist > p:last-child {
  border-bottom: none;
}

.result_card {
  background: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  height: 594px;
}
.result_card .inner {
  text-align: center;
  padding: 6.125rem 0 4.75rem;
  width: calc(100% - 5rem);
  min-width: 17.625rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media (max-device-width: 359px) {
  .result_card .inner {
    width: 78.5515vw;
    min-width: initial;
  }
}
.result_card .inner .p6_fb {
  position: absolute;
  top: 1.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  opacity: 0;
  -webkit-transition: all 0.3s 0.2s;
  transition: all 0.3s 0.2s;
}
.result_card .inner .card_data {
  background: #fff;
  border-radius: 1.5rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  padding: 2rem 1rem;
  -webkit-transition: all 0.3s 0.1s;
  transition: all 0.3s 0.1s;
  height: 24.375rem;
  position: relative;
}
.result_card .inner .card_data .circle {
  width: 13.75rem;
  height: 13.75rem;
  border: 1.25rem solid #fff;
  border-radius: 50%;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
  background: #fff;
  margin: 0 auto 1rem;
  position: relative;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s 0.1s;
  transition: all 0.3s 0.1s;
}
@media (max-device-width: 359px) {
  .result_card .inner .card_data .circle {
    width: 61.2813vw;
    height: 61.2813vw;
  }
}
.result_card .inner .card_data .circle .cover_circle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.375rem;
  overflow: hidden;
}
.result_card .inner .card_data .circle .cover_circle .water_bg {
  position: absolute;
  z-index: 0;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 170%;
}
.result_card .inner .card_data .circle .cover_circle .total_txt {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  position: relative;
  z-index: 1;
}
.result_card .inner .card_data .circle .cover_circle .total_point {
  font-size: 3.25rem;
  font-weight: 700;
  position: relative;
  z-index: 1;
}
@media (max-device-width: 359px) {
  .result_card .inner .card_data .circle .cover_circle .total_point {
    font-size: 14.4847vw;
  }
}
.result_card .inner .card_data .circle .circle_inner {
  border: 1.4375rem solid #00B400;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  height: 100%;
}
@media (max-device-width: 359px) {
  .result_card .inner .card_data .circle .circle_inner {
    border: 6.4067vw solid transparent;
  }
}
.result_card .inner .card_data .circle .circle_inner .type {
  font-size: 2rem;
  font-weight: 700;
  color: #00B400;
}
@media (max-device-width: 359px) {
  .result_card .inner .card_data .circle .circle_inner .type {
    font-size: 8.9136vw;
  }
}
.result_card .inner .card_data .text_con {
  opacity: 0;
  -webkit-transition: all 0.3s 0.1s;
  transition: all 0.3s 0.1s;
}
.result_card .inner .card_data .text_con .title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.result_card .inner .card_data .text_con .title .primary {
  color: #00B400;
}
.result_card .inner .card_data .text_con .sub {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
  margin-top: 0.5rem;
}
.result_card .inner .card_data .icon_list {
  opacity: 0;
  -webkit-transition: all 0.3s 0.1s;
  transition: all 0.3s 0.1s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  margin-top: 0.25rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.result_card .inner .card_data .icon_list .icon_s {
  background-color: rgba(0, 180, 0, 0.05);
  color: #00B400;
}
.result_card .inner .card_data .bmiBtn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  opacity: 0;
  -webkit-transition: all 0.3s 0.1s;
  transition: all 0.3s 0.1s;
}
.result_card .inner.yellow .card_data .text_con .title .primary {
  color: #FFC710;
}
.result_card .inner.yellow .card_data .icon_list .icon_s {
  background-color: rgba(255, 198, 15, 0.05);
  color: #ff8e00;
}
.result_card .inner.yellow .card_data .circle .circle_inner {
  border-color: #FFC710;
}
.result_card .inner.yellow .card_data .circle .circle_inner .type {
  color: #FFC710;
}
.result_card .inner.red .card_data .text_con .title .primary {
  color: #F44432;
}
.result_card .inner.red .card_data .circle .circle_inner {
  border-color: #F44432;
}
.result_card .inner.red .card_data .circle .circle_inner .type {
  color: #F44432;
}
.result_card .inner.orange .card_data .text_con .title .primary {
  color: #ff8e00;
}
.result_card .inner.orange .card_data .circle .circle_inner {
  border-color: #ff8e00;
}
.result_card .inner.orange .card_data .circle .circle_inner .type {
  color: #ff8e00;
}
.result_card .inner.swiper-slide-active {
  padding: 78px 0 56px;
}
.result_card .inner.swiper-slide-active .p6_fb {
  opacity: 1;
}
.result_card .inner.swiper-slide-active .card_data {
  height: 26.875rem;
}
.result_card .inner.swiper-slide-active .card_data .circle,
.result_card .inner.swiper-slide-active .card_data .text_con,
.result_card .inner.swiper-slide-active .card_data .icon_list,
.result_card .inner.swiper-slide-active .card_data .bmiBtn {
  opacity: 1;
}
.result_card .swiper-pagination {
  bottom: 3.5rem;
}
.result_card .swiper-pagination-bullet-active {
  background-color: #00B400;
}

.rcmd_goods {
  position: relative;
  padding: 0 0.25rem 2rem;
}
.rcmd_goods::before {
  content: "";
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  height: 2rem;
  background-color: #fff;
  border-radius: 1.5rem 1.5rem 0 0;
  position: absolute;
  top: -2rem;
  left: 0;
  display: block;
  z-index: 1;
}
.rcmd_goods .title {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  position: relative;
}
.rcmd_goods .title .rcmdBtn {
  display: inline;
  margin-left: 0.25rem;
}
.rcmd_goods .title .rcmdBtn img {
  vertical-align: baseline;
  display: inline;
}
.rcmd_goods .rcmd_list {
  padding-top: 24px;
}
.rcmd_goods .rcmd_list .list_item {
  border-radius: 0.5rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0.75rem;
  border: 1px solid #F5F5F5;
  position: relative;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.rcmd_goods .rcmd_list .list_item .thumb {
  background: #F5F5F5;
  padding: 1.75rem 1.125rem;
  width: 5.625rem;
  border-radius: 0.5rem 0 0 0.5rem;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-device-width: 359px) {
  .rcmd_goods .rcmd_list .list_item .thumb {
    width: 25.0696vw;
  }
}
.rcmd_goods .rcmd_list .list_item .data {
  width: calc(100% - 5.625rem);
  padding: 0.75rem 0.875rem;
}
@media (max-device-width: 359px) {
  .rcmd_goods .rcmd_list .list_item .data {
    width: calc(100% - 25.0696vw);
  }
}
.rcmd_goods .rcmd_list .list_item .data .name {
  margin: 0.25rem 0;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  width: 80%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.rcmd_goods .rcmd_list .list_item .data .info p {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
  position: relative;
  padding-left: 0.75rem;
}
.rcmd_goods .rcmd_list .list_item .data .info p:before {
  content: "";
  width: 0.25rem;
  height: 0.25rem;
  background-color: #747474;
  border-radius: 50%;
  left: 0;
  top: calc(50% - 3px);
  display: block;
  position: absolute;
}
.rcmd_goods .rcmd_list .list_item .best_badge {
  position: absolute;
  top: -0.125rem;
  right: 1rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  color: #fff;
  background: url(../images/icon/best_badge.svg) no-repeat;
  background-size: cover;
  width: 1.625rem;
  height: 2.375rem;
  text-align: center;
  padding-top: 1rem;
  display: none;
}
.rcmd_goods .rcmd_list .list_item.best {
  border-color: #00B400;
}
.rcmd_goods .rcmd_list .list_item.best .best_badge {
  display: block;
}

.more_goods {
  background-color: rgba(0, 180, 0, 0.1);
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 2rem 0;
}
.more_goods .swiper-slide {
  width: 8.5rem;
}
.more_goods .swiper-slide:first-child {
  margin-left: 1.25rem;
}
.more_goods .swiper-slide:last-child {
  margin-right: 1.25rem;
}
.more_goods .swiper-slide.goods_list {
  background-color: #fff;
  border-radius: 0.5rem;
  padding: 0.75rem;
}
.more_goods .swiper-slide.goods_list .img {
  border-radius: 0.5rem;
  background: #F5F5F5;
  height: 3.25rem;
  padding: 0.625rem;
  margin-bottom: 0.5rem;
}
.more_goods .swiper-slide.goods_list .img img {
  height: 2rem;
  margin: 0 auto;
}
.more_goods .swiper-slide.goods_list .name {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  margin-top: 0.25rem;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.tab_goods {
  padding: 2rem 0.25rem;
}
.tab_goods .p6_fb {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
}
.tab_goods .tab_tag {
  margin: 0.5rem 0 1.5rem;
}
.tab_goods .tab_tag .btn_icon.active {
  background-color: #00B400;
  color: #fff;
}
.tab_goods .tab_goodslist {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
}
.tab_goods .tab_goodslist .list_data {
  border-radius: 0.5rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.tab_goods .tab_goodslist .list_data .img {
  background: #F5F5F5;
  height: 7.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-device-width: 359px) {
  .tab_goods .tab_goodslist .list_data .img {
    height: 32.312vw;
  }
}
.tab_goods .tab_goodslist .list_data .img img {
  width: 4.75rem;
}
@media (max-device-width: 359px) {
  .tab_goods .tab_goodslist .list_data .img img {
    width: 19.4986vw;
  }
}
.tab_goods .tab_goodslist .list_data .data_txt {
  padding: 0.875rem 0.75rem 0.75rem;
}
.tab_goods .tab_goodslist .list_data .data_txt .name {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-top: 0.25rem;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.tab_goods .btn_wrap {
  padding: 2rem 1rem 8rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}

/* --------------------- 마이페이지 --------------------- */
/* --- 회원정보 수정 --- */
.form_wrap {
  padding-top: 1rem;
  position: relative;
}
.form_wrap .check_all {
  margin-top: 0.5rem;
}
.form_wrap .check_all .input_check input[type=checkbox] ~ .ck_line,
.form_wrap .check_all .input_check input[type=radio] ~ .ck_line {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.form_wrap .check_list {
  padding-left: 0.5rem;
}
.form_wrap .check_list .input_check input[type=checkbox] ~ .ck_line,
.form_wrap .check_list .input_check input[type=radio] ~ .ck_line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  color: #9F9F9F;
}
.form_wrap .login_kakao {
  margin-top: 0.5rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #747474;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form_wrap .login_kakao img {
  background: #FEE500;
  padding: 0.4063rem;
  width: 1.5rem;
  border-radius: 50%;
  margin-right: 0.437rem;
}
.form_wrap .login_apple {
  margin-top: 0.5rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #747474;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form_wrap .login_apple img {
  background: #000;
  padding: 0.4063rem;
  width: 1.5rem;
  border-radius: 50%;
  margin-right: 0.437rem;
}
.form_wrap .mycode {
  background-color: #F5F5F5;
  padding: 1rem 0.75rem;
  line-height: 1;
  border-radius: 0.5rem;
}
.form_wrap .mycode .copyBtn {
  margin-left: 0.25rem;
}

/* --- faq --- */
.menu_list .list_item {
  position: relative;
  padding: 1.5rem 0 2rem;
}
.menu_list .list_item .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.menu_list .list_item .date {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.75rem;
}
.menu_list .list_item .date span {
  margin-right: 0.5rem;
}
.menu_list.faq_list .list_item {
  padding: 0;
}
.menu_list.faq_list .list_item .title {
  padding: 1.25rem 0 1.75rem;
}
.menu_list.faq_list .list_item .faq_txt {
  overflow: hidden;
  display: none;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  padding-bottom: 1.5rem;
}
.menu_list.setting_list .list_item {
  padding: 0;
}
.menu_list.setting_list .list_item .title {
  font-size: var(--span1-f);
  padding: 1.25rem 0 1.75rem;
}
.menu_list.setting_list .list_item .toggle_list {
  padding-bottom: 12px;
}
.menu_list.setting_list .list_item .toggle_list .list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 0.75rem;
}
.menu_list.setting_list .list_item .toggle_list .list .list_t {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  padding-left: 0.875rem;
  position: relative;
}
.menu_list.setting_list .list_item .toggle_list .list .list_t::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  background-color: #2F2F2F;
  position: absolute;
  left: 0;
  top: 0.25rem;
  border-radius: 50%;
}
.menu_list.setting_depth .list_item {
  padding: 0;
}
.menu_list.setting_depth .list_item .title {
  font-size: var(--span1-f);
  padding: 1.25rem 0 1.25rem;
}
.menu_list.setting_depth .list_item .title .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0;
  font-size: var(--span2-f);
  color: #9F9F9F;
}

/* --- 쿠폰, 포인트, 스토어 --- */
.point_wrap {
  position: relative;
  padding-top: 1.5rem;
  /* 마이페이지 메인 */
  /* 영양제 추천 상단 퀵 슬라이드 */
}
.point_wrap .cash_title {
  background: url(../images/icon/icon_cash.svg) no-repeat;
  background-size: 1.875rem;
  background-position: left center;
  margin-bottom: 1rem;
  padding-left: 2.125rem;
}
@media (max-device-width: 359px) {
  .point_wrap .cash_title {
    padding-left: 10.5556vw;
  }
}
.point_wrap .top_tag {
  width: calc(100% + 2rem);
  left: -1rem;
}
.point_wrap .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0.5rem 0;
}
.point_wrap .c_title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.point_wrap .c_sub {
  font-size: var(--span2-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.point_wrap .btn_img {
  margin-top: 0.75rem;
}
.point_wrap .btn_img.checkbtn {
  background-color: rgba(0, 180, 0, 0.05);
  color: #00B400;
}
.point_wrap .btn_wrap {
  width: 100%;
  padding: 0.75rem 0 0 0;
}
.point_wrap .btn_wrap .btn_m {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
.point_wrap .mypro {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.point_wrap .mypro .pimg {
  width: 3rem;
  aspect-ratio: 1;
  background: #F5F5F5 url(../images/mypage_p.svg) no-repeat center;
  overflow: hidden;
  border-radius: 50%;
  margin-right: 0.75rem;
}
.point_wrap .mypro .username {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.point_wrap .mypro .username .login_mail {
  display: block;
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.point_wrap .mypro .input_file {
  position: absolute;
  bottom: 0;
  left: 1.75rem;
}
.point_wrap .mypro .input_file .picBtn {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  background: #F5F5F5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.point_wrap .bbpop {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: -0.5rem;
}
.point_wrap .bbpop::after {
  bottom: initial;
  top: -0.4375rem;
}
.point_wrap .point_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #F5F5F5;
  color: #9F9F9F;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  position: relative;
  height: calc(100svh - (var(--main-height)) - 11.974375rem);
}
.point_wrap .top_quick {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  margin: 1rem 0 0.5rem;
}
.point_wrap .top_quick .quick_item {
  background-color: #F5F5F5;
  padding: 1rem 1.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 17.5rem;
  border-radius: 0.75rem;
}
@media (max-device-width: 359px) {
  .point_wrap .top_quick .quick_item {
    width: 77.9944vw;
    min-width: 14.375rem;
  }
}
.point_wrap .top_quick .quick_item .top_icon {
  width: 2rem;
  margin-right: 1rem;
}
@media (max-device-width: 359px) {
  .point_wrap .top_quick .quick_item .top_icon {
    width: 8.9136vw;
  }
}
.point_wrap .top_quick .quick_item .top_icon img {
  width: 100%;
}
.point_wrap .top_quick .quick_item .q_title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
}
.point_wrap .top_quick .quick_item.last_child {
  width: 2rem;
  background: #fff;
  padding: 0;
}

.myinfo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0;
}
.myinfo .infoitem {
  width: calc(100% / 3);
  text-align: center;
}
.myinfo .infoitem .gray02 {
  margin-bottom: 0.5rem;
}

.point_list .point_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #DFDFDF;
  padding: 1rem 0;
}
.point_list .point_item .data {
  width: 70%;
}
.point_list .point_item .data .title {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  height: auto;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
}
.point_list .point_item .data .date {
  font-size: var(--span2-f);
  color: #9F9F9F;
}
.point_list .point_item .point {
  text-align: right;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #F44432;
}
.point_list .point_item .point.primary {
  color: #00B400;
}
.point_list .point_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  text-align: center;
  margin-top: 25svh;
}

.coupon_list {
  background-color: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 1.5rem 1.25rem;
  margin-top: 1.5rem;
}
.coupon_list .coupon_item {
  background: #fff;
  border-radius: 1rem;
  position: relative;
  margin-bottom: 0.9375rem;
  padding: 1.5rem;
}
.coupon_list .coupon_item::after {
  content: "";
  width: 2.25rem;
  aspect-ratio: 1;
  display: block;
  position: absolute;
  border-radius: 50%;
  background-color: #F5F5F5;
  right: -1.125rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.coupon_list .coupon_item .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin: 0 0 0.5rem;
  height: auto;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.coupon_list .coupon_item .sub {
  font-size: var(--span2-f);
  color: #747474;
}
.coupon_list .coupon_item .info {
  margin: 1rem 0;
}
.coupon_list .coupon_item .info li {
  font-size: var(--span3-f);
  color: #9F9F9F;
  padding-left: 1rem;
  position: relative;
}
.coupon_list .coupon_item .info li::before {
  content: "";
  width: 3px;
  height: 3px;
  display: block;
  background: #9F9F9F;
  border-radius: 50%;
  position: absolute;
  top: 0.3rem;
  left: 0.3rem;
}
.coupon_list .coupon_item .date {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.coupon_list .coupon_item .date .primary {
  margin-left: 0.5rem;
}
.coupon_list.cash_list {
  padding: 1.5rem 1.25rem 11rem;
}
.coupon_list.cash_list .coupon_item {
  padding: 1.5rem 1.25rem;
}
.coupon_list.cash_list .coupon_item:last-child {
  margin-bottom: 0;
}
.coupon_list.cash_list .coupon_item::after {
  display: none;
}
.coupon_list.cash_list .coupon_item .sub {
  color: #00B400;
  margin-bottom: 0.25rem;
}
.coupon_list.cash_list .coupon_item .info {
  margin: 0.25rem 0 0;
}
.coupon_list.cash_list .coupon_item .info li {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.coupon_list.cash_list .coupon_item .info li::before {
  top: 0.45rem;
}
.coupon_list.cash_list .coupon_item .info li.system_red {
  color: #F44432;
  margin-top: 0.75rem;
}
.coupon_list.cash_list .coupon_item .info li.system_red::before {
  display: none;
}

.store_list {
  background-color: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 0.5rem 1.25rem;
  margin-top: 1.5rem;
}
.store_list .store_sbtn {
  margin: 0.5rem 0 1rem;
  display: block;
  padding: 0.5rem 1rem;
  font-size: var(--span2-f);
  border: 1px solid #DFDFDF;
  background: #fff url(../images/icon/right_bk.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  border-radius: 0.5rem;
}
.store_list .store_sbtn img {
  width: 1.5rem;
  display: inline-block;
  margin-right: 0.5rem;
}
.store_list .cardround {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #fff;
  border-radius: 1rem;
  padding: 1rem;
  margin: 0.75rem 0;
}
.store_list .cardround .img {
  width: 4.5rem;
  aspect-ratio: 1;
  margin-right: 0.75rem;
  overflow: hidden;
  border-radius: 1rem;
}
.store_list .cardround .store_item {
  width: calc(100% - 5.25rem);
}
.store_list .cardround .store_item .store_title {
  font-size: var(--span2-f);
  margin-bottom: 0.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  white-space: nowrap;
}
.store_list .cardround .store_item .price {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.store_list.ex_list {
  background: #fff;
  padding: 0.5rem 1.25rem 0;
}
.store_list.ex_list .ex_block {
  position: relative;
  padding: 0.75rem 0;
}
.store_list.ex_list .ex_block:first-child {
  padding-top: 1.5rem;
}
.store_list.ex_list .date {
  color: #9F9F9F;
  font-size: var(--span3-f);
}
.store_list.ex_list .ex_data {
  position: relative;
  padding: 0;
}
.store_list.ex_list .ex_data .store_item .store_title {
  width: 70%;
}
.store_list.ex_list .btn_icon {
  position: absolute;
  top: 0;
  right: 0;
}
.store_list .store_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem 0.5rem;
}
.store_list .store_grid .cate_list {
  background: #fff;
  border-radius: 0.75rem 0 0 0;
  padding: 1.75rem 0 1.1875rem;
  text-align: center;
}
.store_list .store_grid .cate_list .img {
  width: 3.375rem;
  height: 3.375rem;
  margin: 0 auto 0.75rem;
}
.store_list .store_grid .cate_list .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.store_list .btn_wrap {
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
  padding-top: 1rem;
}
.store_list .subs_list .top_tag {
  padding: 0.5rem 0 1rem;
  left: -1.25rem;
}
.store_list .subs_list .top_tag .swiper-slide {
  background-color: #fff;
}
.store_list .subs_list .top_tag .swiper-slide.active {
  background-color: #2F2F2F;
}
.store_list .subs_list .list_item {
  background: #fff;
  position: relative;
  padding: 1rem;
  border-radius: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.store_list .subs_list .list_item .img {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 1rem;
  overflow: hidden;
  background: #F5F5F5;
}
.store_list .subs_list .list_item .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.store_list .subs_list .list_item .data {
  width: calc(100% - 5.25rem);
}
.store_list .subs_list .list_item .data .name {
  font-size: var(--span2-f);
  padding: 0.25rem 0 0.4375rem;
}
.store_list .subs_list .list_item .data .h3_f {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.store_list .subs_list .list_item .data .h3_f .icon_s {
  border: 1px solid #747474;
  padding: 0.0625rem 0.25rem;
  color: #747474;
}
.store_list .subs_list .list_item::after {
  content: "";
  display: block;
  position: absolute;
  width: 2rem;
  height: 2rem;
  background: #F5F5F5;
  top: 50%;
  right: -1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  border-radius: 50%;
}
.store_list.score_cate {
  background: #fff;
  margin-top: 0;
  padding-top: 0;
}
.store_list.score_cate .cardround {
  -webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
}
.store_list.score_cate .cardround .store_item .store_title {
  margin: 0.25rem 0 0.5rem;
}

.store_catetop {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 0.25rem;
}
.store_catetop .select_pharm {
  background: #fff;
  padding: 0;
  -webkit-transform: initial;
          transform: initial;
  width: calc(100% - 7.5rem);
}
.store_catetop .select_pharm .select_pharmlist {
  top: 2.75rem;
  left: -0.25rem;
}
.store_catetop .mycash {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  background: url(../images/icon/icon_cash.svg) no-repeat;
  background-size: 1.5rem;
  text-align: right;
  padding-left: 1.75rem;
  background-position: left center;
  line-height: 1.5rem;
}

.banner_btn {
  background-color: #2F2F2F;
  color: #fff;
  position: relative;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.banner_btn img {
  margin-right: 0.5rem;
}
.banner_btn .arrow {
  position: absolute;
  top: 50%;
  right: 1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.mypage_list {
  padding: 1rem 0;
}
.mypage_list p.span3_f {
  padding-bottom: 0.25rem;
}
.mypage_list .mypage_link {
  font-size: var(--span1-f);
  padding: 0.75rem;
  display: block;
}
.mypage_list .mypage_link:last-child {
  padding-bottom: 0;
}

.mypage_bottom {
  padding: 1.5rem 1.25rem 2.5rem;
  background-color: #F5F5F5;
}

.store_top {
  background-color: #FFF8DE;
  background-image: url(../images/icon/home_banner1.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 1.25rem) bottom;
  background-size: 7.125rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 2rem 1.25rem 1.5rem;
}
.store_top .span3_f {
  margin-bottom: 0.75rem;
}
.store_top .flex {
  gap: 0.25rem;
}
.store_top .flex .btn_icon {
  border: 1px solid rgba(255, 199, 16, 0.6);
  color: #B88D00;
}
.store_top.subs_top {
  background-image: url(../images/icon/home_banner8.svg);
  background-color: #EBF7EA;
  background-position: calc(100% - .25rem) center;
  background-size: 8.75rem;
}
.store_top.subs_top .flex .btn_icon {
  border-color: #00B400;
  color: #006000;
}

/* 섭취알람 */
.myalarm_list .icon_img {
  width: 2rem;
  aspect-ratio: 1;
  border-radius: 50%;
  margin-right: 0.5rem;
}
.myalarm_list .cat-1 .icon_img {
  background: #00B400 url(../images/icon/noti_icon1.svg) no-repeat center;
}
.myalarm_list .cat-2 .icon_img {
  background: #00B400 url(../images/icon/noti_icon2.svg) no-repeat center;
}
.myalarm_list .cat-3 .icon_img {
  background: #00B400 url(../images/icon/noti_icon3.svg) no-repeat center;
}
.myalarm_list .cat-4 .icon_img {
  background: #00B400 url(../images/icon/noti_icon4.svg) no-repeat center;
}
.myalarm_list .cat-5 .icon_img {
  background: #00B400 url(../images/icon/noti_icon5.svg) no-repeat center;
}
.myalarm_list .alarm_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding: 0.75rem 0;
}
.myalarm_list .alarm_data .alarm_info {
  width: calc(100% - 2.5rem);
}
.myalarm_list .alarm_data .alarm_info .name {
  color: #00B400;
  font-size: var(--span3-f);
}
.myalarm_list .alarm_data .alarm_info .title {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin: 0.25rem 0;
}
.myalarm_list .alarm_data .alarm_info .pre {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  overflow: hidden;
  height: auto;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  text-overflow: ellipsis;
  word-break: break-all;
}
.myalarm_list .alarm_data .alarm_info .time {
  text-align: right;
  font-size: var(--span4-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.myalarm_list .alarm_txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  position: relative;
  background: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 1rem 1.25rem 1rem 2.25rem;
}
.myalarm_list .alarm_txt::before {
  content: "";
  width: 3px;
  height: 3px;
  position: absolute;
  top: 1.4rem;
  left: 1.5rem;
  background: #9F9F9F;
  display: block;
}

/* 로그인 회원가입 */
.login_wrap {
  padding-top: 1.5rem;
}
.login_wrap .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.login_wrap .sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  margin: 0.75rem 0 1rem;
}

.card_list {
  padding-top: 0.5rem;
  overflow-y: auto;
  height: calc(100svh - 15.625rem);
  padding-bottom: 3.5rem;
}
.card_list .list_item {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: #F5F5F5;
  padding: 1rem;
  margin: 0 0 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.card_list .list_item .title {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  width: 30%;
}
.card_list .list_item .txt {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  width: 70%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
}

.login_btn {
  margin-top: 15svh;
}
.login_btn .btn_b {
  margin-bottom: 1.5rem;
}
.login_btn .bbpop {
  background-color: #2F2F2F;
  top: -1.125rem;
}
.login_btn .bbpop::after {
  background-color: #2F2F2F;
}

/* 구독 */
.sub_wrap {
  position: relative;
  padding-bottom: 0.5rem;
}
.sub_wrap.paylist_bg::before {
  content: "";
  background: #F5F5F5 url(../images/icon/paylist_bg.svg);
  height: 0.375rem;
  position: absolute;
  top: 0;
  left: 0;
  background-size: contain;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.sub_wrap.paylist_bg .sub_top {
  padding-top: 1.375rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.sub_wrap .modalBtn {
  margin-left: 0.5rem;
  position: absolute;
  top: 1.2rem;
  left: 5.75rem;
  z-index: 1;
  cursor: pointer;
}
.sub_wrap .modalBtn.modalBtn2 {
  left: 7.75rem;
}
@media (max-device-width: 359px) {
  .sub_wrap .modalBtn.modalBtn2 {
    left: 34.5404vw;
  }
}
@media (max-device-width: 359px) {
  .sub_wrap .modalBtn {
    left: 25.5556vw;
  }
}
.sub_wrap .modalBtn2 {
  margin-left: 0.5rem;
  position: absolute;
  top: 1.2rem;
  left: 7.75rem;
  z-index: 1;
  cursor: pointer;
}
@media (max-device-width: 359px) {
  .sub_wrap .modalBtn2 {
    left: 34.5404vw;
  }
}
.sub_wrap .input_info2 {
  color: #9F9F9F;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding-left: 1rem;
  position: relative;
}
.sub_wrap .input_info2::before {
  content: "";
  position: absolute;
  display: block;
  width: 2px;
  height: 2px;
  left: 0.4rem;
  top: 0.4rem;
  background: #9F9F9F;
  border-radius: 50%;
}
.sub_wrap .editBtn {
  position: absolute;
  top: 0.75rem;
  left: 5.5rem;
  z-index: 9;
}
@media (max-device-width: 320px) {
  .sub_wrap .editBtn {
    left: 24.4444vw;
  }
}
.sub_wrap .resub_top {
  padding: 1rem 0;
}
.sub_wrap .resub_top .flex .img {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 0.5rem;
  background-color: rgba(0, 180, 0, 0.1);
  margin-right: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.sub_wrap .resub_top .flex .img img {
  max-width: 2.375rem;
}
@media (max-device-width: 359px) {
  .sub_wrap .resub_top .flex .img img {
    max-width: 10.585vw;
  }
}
.sub_wrap .sub_summary {
  position: relative;
  padding: 1.25rem 0;
}
.sub_wrap .sub_summary .btn_icon {
  margin-bottom: 0.5rem;
}
.sub_wrap .sub_summary .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.sub_wrap .sub_summary .info {
  color: #00B400;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.sub_wrap .sub_summary .btn_s {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  line-height: 1;
}
.sub_wrap .sub_summary .list_left .list_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 0.5rem;
}
.sub_wrap .sub_summary .list_left .list_data .data_title {
  font-size: var(--span3-f);
  color: #9F9F9F;
  width: 25%;
  max-width: 5rem;
}
.sub_wrap .sub_summary .list_left .list_data .data_txt {
  font-size: var(--span3-f);
  width: 75%;
}
.sub_wrap .sub_summary.sub_over .btn_icon {
  border-color: #DFDFDF;
  color: #9F9F9F;
}
.sub_wrap .sub_summary.sub_over .info {
  color: #9F9F9F;
}
.sub_wrap .sub_summary.error .info {
  color: #F44432;
}
.sub_wrap .sub_summary.error .btn_s {
  top: 40%;
}
.sub_wrap .sub_summary.error .info_black {
  padding: 0.625rem 0.875rem;
  font-size: var(--span3-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-top: 0.75rem;
  border-radius: 0.25rem;
}
.sub_wrap .sub_summary.error .info_black svg {
  margin-right: 0.2rem;
}
.sub_wrap .sub_top {
  padding: 1rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.sub_wrap .sub_top .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.sub_wrap .sub_top .title_r {
  color: #9F9F9F;
  font-size: var(--span2-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.sub_wrap .sub_top .title_r a {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #2F2F2F;
  margin-left: 0.5rem;
}
.sub_wrap .sub_top .top_info {
  display: none;
  margin-right: 0.25rem;
}
.sub_wrap .sub_top .title_b {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
  display: none;
  width: 100%;
}
.sub_wrap .sub_info {
  position: relative;
}
.sub_wrap .sub_info .top_sale {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #2F2F2F;
  border-bottom: 1px solid #DFDFDF;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.sub_wrap .sub_info .bg_title {
  background: #F5F5F5;
  padding: 0.375rem 0.75rem;
  font-size: var(--span2-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.375rem;
  margin-bottom: 0.75rem;
  position: relative;
}
.sub_wrap .sub_info .bg_title .bbpop {
  position: absolute;
  border-radius: 0.5rem;
  -webkit-animation: none;
          animation: none;
  top: 2.5rem;
  left: 2.75rem;
  max-width: 17.5rem;
  padding: 0.625rem 0.75rem;
  opacity: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: -1;
}
.sub_wrap .sub_info .bg_title .bbpop.open {
  opacity: 1;
  z-index: 1;
}
.sub_wrap .sub_info .sub_info_t {
  border-top: 1px solid #DFDFDF;
  font-size: var(--span2-f);
  padding: 0.5rem 0 0.625rem;
}
.sub_wrap .sub_info .edit_user {
  position: absolute;
  top: 0.75rem;
  right: 0;
}
.sub_wrap .sub_info,
.sub_wrap .sub_total {
  padding-bottom: 1rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.sub_wrap .sub_info .sub_data,
.sub_wrap .sub_total .sub_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 0.5rem;
}
.sub_wrap .sub_info .sub_data:last-child,
.sub_wrap .sub_total .sub_data:last-child {
  padding-bottom: 0;
}
.sub_wrap .sub_info .sub_data .data_l,
.sub_wrap .sub_total .sub_data .data_l {
  font-size: var(--span2-f);
  color: #9F9F9F;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.sub_wrap .sub_info .sub_data .data_l img,
.sub_wrap .sub_total .sub_data .data_l img {
  width: 2rem;
  height: 1.5rem;
  margin-right: 0.75rem;
}
.sub_wrap .sub_info .sub_data .data_l .img,
.sub_wrap .sub_total .sub_data .data_l .img {
  width: 2rem;
  height: 1.5rem;
  margin-right: 0.75rem;
}
.sub_wrap .sub_info .sub_data .data_l .img img,
.sub_wrap .sub_total .sub_data .data_l .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.sub_wrap .sub_info .sub_data .data_r,
.sub_wrap .sub_total .sub_data .data_r {
  text-align: right;
  font-size: var(--span2-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.sub_wrap .sub_info .sub_data .data_r.error_line,
.sub_wrap .sub_total .sub_data .data_r.error_line {
  color: #F44432;
  text-decoration: underline;
}
.sub_wrap .sub_info .sub_data .data_r.error,
.sub_wrap .sub_total .sub_data .data_r.error {
  color: #F44432;
}
.sub_wrap .sub_info .input_block,
.sub_wrap .sub_total .input_block {
  padding: 0;
}
.sub_wrap .sub_info .select_block .bbpop,
.sub_wrap .sub_total .select_block .bbpop {
  position: absolute;
  top: -1.25rem;
  right: 0;
}
.sub_wrap .total_info {
  padding-bottom: 1rem;
}
.sub_wrap .total_info .sub_data {
  padding-bottom: 0.75rem;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.sub_wrap .total_info .sub_data .data_l p span {
  display: block;
  margin-top: 0.25rem;
}
.sub_wrap .sub_info2 {
  padding-bottom: 1.25rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.sub_wrap .sub_info2 .sub_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-bottom: 0.5rem;
}
.sub_wrap .sub_info2 .sub_data .data_l {
  font-size: var(--span2-f);
  color: #9F9F9F;
  width: 30%;
}
.sub_wrap .sub_info2 .sub_data .data_r {
  font-size: var(--span2-f);
  width: 70%;
}
.sub_wrap .sub_total {
  border-top: 1px solid #DFDFDF;
  padding: 1rem 0 1.25rem;
}
.sub_wrap .sub_total .total_noti {
  background-color: #00B400;
  color: #fff;
  padding: 0.625rem 0.75rem;
  border-radius: 0.5rem;
  font-size: var(--span3-f);
  margin-top: 0.5rem;
}
.sub_wrap .sub_total .total_info {
  color: #9F9F9F;
  font-size: var(--span3-f);
}
.sub_wrap .pay_slide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.sub_wrap .pay_slide .swiper-slide {
  -webkit-transform: translateX(1.25rem);
          transform: translateX(1.25rem);
}
.sub_wrap .pay_slide .swiper-slide:last-child {
  margin-right: 2.5rem;
}
.sub_wrap .pay_btn_list {
  padding-block: 1.25rem 1.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  position: relative;
}
.sub_wrap .pay_btn_list .bbpop {
  position: absolute;
  top: -3.25rem;
  white-space: nowrap;
}
.sub_wrap .pay_btn_list .bbpop::after {
  width: 0.6rem;
  height: 0.6rem;
  bottom: -0.3rem;
}
.sub_wrap .pay_btn_list .pay_btn {
  width: 77px;
  height: 44px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #DFDFDF;
  border-radius: 0.25rem;
  background-color: #fff;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #747474;
  padding-block: 0.875rem;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.sub_wrap .pay_btn_list .pay_btn.pay_card .bbpop {
  left: 0;
}
.sub_wrap .pay_btn_list .pay_btn.pay_kakao {
  background-image: url(../images/icon/paybtn_kakao_off.svg);
  background-size: 2.375rem;
}
.sub_wrap .pay_btn_list .pay_btn.pay_naver {
  background-image: url(../images/icon/paybtn_naver_off.svg);
  background-size: 2.9375rem;
}
.sub_wrap .pay_btn_list .pay_btn.pay_naver .bbpop {
  right: 0;
}
.sub_wrap .pay_btn_list .pay_btn.active {
  border-color: transparent;
}
.sub_wrap .pay_btn_list .pay_btn.active.pay_card {
  background-color: #00B400;
  color: #fff;
}
.sub_wrap .pay_btn_list .pay_btn.active.pay_kakao {
  background-color: #FFEB00;
  background-image: url(../images/icon/paybtn_kakao_on.svg);
}
.sub_wrap .pay_btn_list .pay_btn.active.pay_naver {
  background-color: #00DE5A;
  background-image: url(../images/icon/paybtn_naver_on.svg);
}
.sub_wrap.list_fold .sub_top .title_r img {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sub_wrap.list_fold .sub_info,
.sub_wrap.list_fold .sub_info2,
.sub_wrap.list_fold .sub_total,
.sub_wrap.list_fold .pay_slide {
  height: 0;
  padding: 0;
  opacity: 0;
  overflow: hidden;
}
.sub_wrap.list_fold .editBtn,
.sub_wrap.list_fold .modalBtn,
.sub_wrap.list_fold .modalBtn2 {
  display: none;
}
.sub_wrap.list_fold .top_info,
.sub_wrap.list_fold .title_b {
  display: block;
}
.sub_wrap.list_fold .next_btn {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sub_wrap.list_fold.paylist_bg::before, .sub_wrap.list_fold.edit_card::before {
  height: 0;
}
.sub_wrap.list_fold.paylist_bg .sub_top, .sub_wrap.list_fold.edit_card .sub_top {
  padding-top: 1rem;
}
.sub_wrap.list_fold.paylist_bg .top_info, .sub_wrap.list_fold.edit_card .top_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.sub_wrap.list_fold.paylist_bg .top_info .payicon, .sub_wrap.list_fold.edit_card .top_info .payicon {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sub_wrap.list_fold.error_card .top_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  text-decoration: underline;
  color: #F44432;
}
.sub_wrap.list_fold.error_card .top_info .payicon {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sub_wrap .input_btn .input_btnm + .btnClear {
  right: 6rem;
}
@media (max-device-width: 320px) {
  .sub_wrap .input_btn .input_btnm + .btnClear {
    right: 5.75rem;
  }
}
.sub_wrap .input_check {
  position: relative;
  color: #9F9F9F;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.sub_wrap .input_check .checkDel {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  cursor: pointer;
}
.sub_wrap .pack_info {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: rgba(0, 180, 0, 0.05);
  padding: 1rem;
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
}
.sub_wrap .pack_list {
  padding: 0 0 0.5rem;
}
.sub_wrap .pack_list .pack_title {
  border-top: 1px solid #DFDFDF;
  padding-top: 0.5rem;
  padding-bottom: 1rem;
}
.sub_wrap .pack_list .pack_title .title {
  font-size: var(--span2-f);
  padding-bottom: 0.25rem;
}
.sub_wrap .pack_list .pack_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  background: url(../images/icon/radioBtn_off.svg) no-repeat;
  background-position: left center;
  padding-left: 2.25rem;
  padding-bottom: 1rem;
  position: relative;
}
.sub_wrap .pack_list .pack_item .img {
  width: 4.125rem;
  max-height: 3rem;
  aspect-ratio: 1.375/1;
  background-color: #F5F5F5;
  border-radius: 0.5rem;
  padding: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 0.5rem;
}
.sub_wrap .pack_list .pack_item .img img {
  width: 100%;
}
.sub_wrap .pack_list .pack_item .pack_data {
  position: relative;
  width: calc(100% - 4.625rem);
  height: 100%;
}
.sub_wrap .pack_list .pack_item .pack_data .title {
  font-size: var(--span3-f);
  margin-top: 0.125rem;
}
.sub_wrap .pack_list .pack_item .pack_data .info {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.25rem;
}
.sub_wrap .pack_list .pack_item .pack_data .cost {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  position: absolute;
  top: 2.5rem;
  right: 0;
}
.sub_wrap .pack_list .pack_item .delBtn {
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/icon/delete_gr02.svg) no-repeat;
  width: 1.25rem;
  height: 1.25rem;
}
.sub_wrap .pack_list .pack_item.checked {
  background: url(../images/icon/radioBtn_on.svg) no-repeat;
  background-position: left center;
}

.pay_slide {
  padding-bottom: 2rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.pay_slide .pay_item {
  background: #2F2F2F;
  border-radius: 0.5rem;
  width: 77.7778vw;
  max-width: 17.5rem;
  aspect-ratio: 1.8/1;
}
.pay_slide .pay_item .error_msg {
  position: absolute;
  right: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #F44432;
  top: 2.25rem;
  opacity: 0;
}
.pay_slide .pay_item .error_msg svg {
  margin-right: 0.25rem;
}
.pay_slide .pay_item .select {
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 2rem;
  height: 2rem;
  background: url(../images/icon/radioBtn_off.svg) no-repeat center;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.pay_slide .pay_item .delBtn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.pay_slide .pay_item .pay_title {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
}
.pay_slide .pay_item .pay_title .pay_name {
  color: #fff;
  font-size: var(--span2-f);
  margin-bottom: 0.4375rem;
}
.pay_slide .pay_item .pay_title .pay_n {
  color: #fff;
  font-size: var(--span2-f);
}
.pay_slide .pay_item.swiper-slide-active .select {
  background: url(../images/icon/radioBtn_on.svg) no-repeat center;
}
.pay_slide .pay_item.error {
  border: 2px solid #F44432;
}
.pay_slide .pay_item.error .select {
  display: none;
}
.pay_slide .pay_item.error .error_msg {
  opacity: 1;
}
.pay_slide .pay_add {
  background: #F5F5F5;
  border-radius: 0.5rem;
  width: 77.7778vw;
  max-width: 17.5rem;
  aspect-ratio: 1.8/1;
  border: 1px solid #DFDFDF;
}
.pay_slide .pay_add .cardadd {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.pay_kakao_list {
  display: grid;
  gap: 0.75rem;
  padding-bottom: 1rem;
}
.pay_kakao_list .kakao_data {
  border: 1px solid #DFDFDF;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.pay_kakao_list .kakao_data .thumb {
  width: 1.875rem;
}
.pay_kakao_list .kakao_data .pay_name {
  font-size: var(--span2-f);
  color: #747474;
}
.pay_kakao_list .kakao_data .delBtn {
  position: absolute;
  width: 1.25rem;
  height: 1.25rem;
  background: url(../images/icon/delete_gr03.svg) no-repeat;
  background-size: cover;
  top: 50%;
  right: 1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
}
.pay_kakao_list .kakao_data.active {
  border-color: #00B400;
}
.pay_kakao_list .kakao_data.active .pay_name {
  font-weight: 700;
  color: #2F2F2F;
}
.pay_kakao_list .kakao_data.error .pay_name {
  font-weight: 700;
}
.pay_kakao_list .kakao_data.error .pay_name span {
  color: #F44432;
  font-weight: 400;
  display: block;
  margin-bottom: 0.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.pay_kakao_list .kakao_data.error.active {
  border-color: #F44432;
  background-color: rgba(244, 68, 50, 0.05);
}
.pay_kakao_list .kakao_data.error.active .pay_name {
  color: #2F2F2F;
}

.list_none {
  text-align: center;
  padding-block: 0.5rem 1rem;
}
.list_none .add_data {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 0.75rem;
}

.error_notice {
  background-color: #2F2F2F;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  color: #fff;
  padding: 0.75rem 1rem;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  position: relative;
}

.drug_edit {
  padding: 0.5rem 0.75rem !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgba(0, 180, 0, 0.05);
}
.drug_edit .edit_l {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  width: 60%;
}
.drug_edit .edit_l .edit_img {
  width: 2rem;
  height: 1.5rem;
  margin-right: 0.5rem;
}
.drug_edit .edit_l .edit_img img {
  width: 100%;
}
.drug_edit .edit_l .edit_t {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  width: calc(100% - 2.5rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.drug_edit .edit_r {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40%;
}
.drug_edit .edit_r .edit_btn {
  background: url(../images/icon/minus_on.svg) no-repeat;
  width: 2rem;
  height: 2rem;
}
.drug_edit.add {
  background-color: #F5F5F5;
}
.drug_edit.add .edit_r .edit_btn {
  background: url(../images/icon/plus_gr.svg) no-repeat;
}

.coupon_check {
  background: #F5F5F5 url(../images/icon/radioBtn_off.svg) no-repeat;
  background-position: 1rem center;
  overflow: hidden;
  padding: 1.5rem 1rem !important;
  border-radius: 1rem;
}
.coupon_check::after {
  content: "";
  width: 1.75rem;
  height: 1.75rem;
  background-color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  right: -0.875rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  border-radius: 50%;
}
.coupon_check .coupon_t {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  padding-left: 2.5rem;
}
.coupon_check .coupon_txt {
  font-size: var(--span2-f);
  color: #747474;
  margin-top: 0.5rem;
  padding-left: 2.5rem;
}
.coupon_check.select {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/radioBtn_on.svg) no-repeat;
  background-position: 1rem center;
}
.coupon_check.disabled .coupon_t,
.coupon_check.disabled .coupon_txt {
  color: #C9C9C9;
}

/* 캘린더 */
#datepicker {
  width: 100%;
  position: relative;
}
#datepicker .primary {
  position: absolute;
  top: -0.5rem;
}
#datepicker .ui-datepicker-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1.5rem 0 1.375rem;
}
#datepicker .ui-datepicker-header .ui-datepicker-prev {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
#datepicker .ui-datepicker-header .ui-datepicker-next {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
#datepicker .ui-datepicker-header .ui-datepicker-title {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  margin: 0 0.5rem;
}
#datepicker .ui-datepicker-calendar {
  width: 95%;
  margin: 0 auto;
}
#datepicker .ui-datepicker-calendar th {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  padding-bottom: 0.5rem;
}
#datepicker .ui-datepicker-calendar td {
  width: calc(100% / 7);
  padding: 0.75rem 0;
}
#datepicker .ui-datepicker-calendar .ui-state-default {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  color: #C9C9C9;
}
#datepicker .ui-datepicker-calendar .ui-state-default.ui-state-active {
  color: #fff;
  z-index: 1;
}
#datepicker .ui-datepicker-calendar .ui-state-default.ui-state-active::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background: #2F2F2F;
  width: 8.8889vw;
  max-width: 2rem;
  aspect-ratio: 1;
  z-index: -1;
  border-radius: 50%;
}
#datepicker .ui-datepicker-calendar .ui-datepicker-today {
  color: #2F2F2F;
}
#datepicker .ui-datepicker-calendar .ui-state-disabled {
  color: #C9C9C9 !important;
}
#datepicker .ui-datepicker-calendar tr td:last-child .ui-state-default {
  color: #F44432;
}
#datepicker .ui-datepicker-unselectable .ui-state-default {
  color: #2F2F2F;
}

/* 친구목록 */
.friend_wrap {
  position: relative;
  padding-bottom: 0.5rem;
}
.friend_wrap .friend_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  background: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: calc(100svh - (var(--main-height) + 8rem));
  text-align: center;
  color: #9F9F9F;
}
.friend_wrap .f_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1.5rem 0 0.5rem;
}
.friend_wrap .f_title .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.friend_wrap .f_title .total {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.friend_wrap .img_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.friend_wrap .img_list .list_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1rem 0;
}
.friend_wrap .img_list .list_data .f_img {
  width: 2.625rem;
  height: 2.625rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.5rem;
}
.friend_wrap .img_list .list_data .f_info .f_name {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
}
.friend_wrap .img_list .list_data .f_info .f_name .date_info {
  margin-left: 0.25rem;
  font-weight: 500;
}
.friend_wrap .img_list .list_data .f_info .f_date {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  margin-top: 0.3125rem;
}
.friend_wrap .img_list .list_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.friend_wrap .img_list .list_btn .pushBtn {
  width: 2rem;
  height: 2rem;
  background: url(../images/icon/mate_push.svg) no-repeat;
  background-size: cover;
}
@media (max-device-width: 320px) {
  .friend_wrap .img_list .list_btn .pushBtn {
    width: 1.75rem;
    height: 1.75rem;
  }
}
.friend_wrap .img_list .list_btn .fdelBtn {
  width: 2rem;
  height: 2rem;
  background: url(../images/icon/made_x.svg) no-repeat;
  background-size: cover;
}
@media (max-device-width: 320px) {
  .friend_wrap .img_list .list_btn .fdelBtn {
    width: 1.75rem;
    height: 1.75rem;
  }
}
.friend_wrap .img_list.f_none .list_data .f_img {
  border: 2px solid #00B400;
}
.friend_wrap .img_list.f_none .list_data .f_info .f_name .date_info {
  color: #00B400;
}
.friend_wrap .img_list.f_done .list_data .f_img {
  border: 2px solid #DFDFDF;
}
.friend_wrap .img_list.f_done .list_data .f_info .f_name .date_info {
  color: #9F9F9F;
}

/* 섭취알람 */
.alarm_wrap {
  background-color: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translate(-1rem);
          transform: translate(-1rem);
  padding: 0.5rem 1.25rem;
}
.alarm_wrap .point_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #F5F5F5;
  color: #9F9F9F;
  position: relative;
  height: calc(100svh - (var(--main-height)) - 11.974375rem);
}
.alarm_wrap .alarm_sbtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #747474;
  border-radius: 0.5rem;
  background: #fff url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
}
.alarm_wrap .alarm_sbtn img {
  margin-right: 0.5rem;
}
.alarm_wrap .alarm_list {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background: #fff;
  padding: 1.5rem 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 1rem;
}
.alarm_wrap .alarm_list:last-child {
  margin-bottom: 5rem;
}
@media (max-device-width: 320px) {
  .alarm_wrap .alarm_list {
    padding: 1.25rem 0.75rem;
  }
}
.alarm_wrap .alarm_list .alarm_time .time {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
}
.alarm_wrap .alarm_list .alarm_time .day {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
@media (max-device-width: 320px) {
  .alarm_wrap .alarm_list .alarm_time .day {
    margin-top: 0.25rem;
  }
}
.alarm_wrap .alarm_list .alarm_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: url(../images/icon/right.svg) no-repeat;
  background-position: right center;
  padding-right: 1.5rem;
}
.alarm_wrap .alarm_list .alarm_info .info_name {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  max-width: 5.625rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-device-width: 359px) {
  .alarm_wrap .alarm_list .alarm_info .info_name {
    max-width: 25.0696vw;
  }
}
@media (max-device-width: 320px) {
  .alarm_wrap .alarm_list .alarm_info .info_name {
    max-width: 20vw;
  }
}
.alarm_wrap .alarm_list.check_alarm {
  background: #fff url(../images/icon/check_off.svg) no-repeat;
  background-position: 1rem center;
  padding-left: 3rem;
}
.alarm_wrap .alarm_list.check_alarm .alarm_info {
  background-image: none;
  padding-right: 0;
}
.alarm_wrap .alarm_list.check_alarm .alarm_info .info_name {
  max-width: 5rem;
}
@media (max-device-width: 359px) {
  .alarm_wrap .alarm_list.check_alarm .alarm_info .info_name {
    max-width: 22.2841vw;
  }
}
@media (max-device-width: 320px) {
  .alarm_wrap .alarm_list.check_alarm .alarm_info .info_name {
    max-width: 18vw;
  }
}
.alarm_wrap .alarm_list.check_alarm.select {
  background: #fff url(../images/icon/check_on.svg) no-repeat;
  background-position: 1rem center;
}

.st_wrap {
  position: relative;
  padding: 1.25rem 0.25rem;
}
.st_wrap .dtitle .date {
  position: relative;
}
.st_wrap .dtitle .date::after {
  content: "";
  position: relative;
  width: 1px;
  top: 1px;
  height: 0.7rem;
  background: #9F9F9F;
  margin: 0 0.3rem 0 0.5rem;
  display: inline-block;
}
.st_wrap .day_select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 1rem 0 1rem;
  padding: 0 0.25rem;
}
.st_wrap .day_select p {
  font-size: var(--span2-f);
  color: #9F9F9F;
  background-color: #F5F5F5;
  width: 10vw;
  height: 10vw;
  border-radius: 0.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.st_wrap .day_select p.select {
  background-color: #2F2F2F;
  color: #fff;
}
.st_wrap .alram {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.add_item .add_data {
  position: relative;
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: #F5F5F5;
  padding: 1.5rem 1rem;
  margin: 0 0 0.5rem;
}
.add_item .add_data:first-child {
  margin-top: 1rem;
}
.add_item .add_data .d_title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.add_item .add_data .d_title span.gray01 {
  margin-right: 0.25rem;
}
.add_item .add_data .deleteBtn {
  position: absolute;
  top: 50%;
  right: 1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 1.75rem;
}

.time_select {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  margin: 1.5rem auto 1.25rem;
  padding: 0 3rem;
}
.time_select::after {
  content: "";
  background-color: rgba(0, 180, 0, 0.1);
  position: absolute;
  display: block;
  height: calc(100% / 3);
  width: calc(100% + 2.5rem);
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.time_select .time_slide {
  width: 3.875rem;
}
.time_select .time_slide .swiper-wrapper {
  height: 8.75rem;
}
.time_select .time_slide .swiper-wrapper .swiper-slide {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #C9C9C9;
  padding: 1rem 0;
  text-align: center;
  line-height: 1;
  width: 100%;
}
.time_select .time_slide .swiper-wrapper .swiper-slide.swiper-slide-active {
  color: #2F2F2F;
}
.time_select .time_slide::after {
  content: "";
}
.time_select .time_slide:nth-child(2) {
  position: relative;
  width: 4.875rem;
}
.time_select .time_slide:nth-child(2)::after {
  content: ":";
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 0;
}

/* --------------------------- qna ------------------------ */
.qna_top {
  background: -webkit-gradient(linear, left top, left bottom, from(#00B400), color-stop(52%, #00B400), color-stop(52%, #F5F5F5), to(#F5F5F5));
  background: linear-gradient(#00B400 0%, #00B400 52%, #F5F5F5 52%, #F5F5F5 100%);
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 2.5rem 1.25rem 1rem;
  position: relative;
}
.qna_top .title {
  color: #fff;
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
}
.qna_top .qna_slide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.qna_top .qna_slide .cardround_shadow {
  background: #fff;
  width: 10rem;
  padding: 1rem;
  margin: 0 0 0.75rem;
}
.qna_top .qna_slide .cardround_shadow .slide_p {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  border: 2px solid #DFDFDF;
  margin-bottom: 1rem;
  position: relative;
}
.qna_top .qna_slide .cardround_shadow .slide_p img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}
.qna_top .qna_slide .cardround_shadow .slide_p .now {
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 50%;
  border: 2px solid #fff;
  background: #DFDFDF;
  position: absolute;
  bottom: 0;
  right: 0;
}
.qna_top .qna_slide .cardround_shadow .slide_p .now.on {
  background: #00B400;
}
.qna_top .qna_slide .cardround_shadow .slide_title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  position: relative;
  margin: 0.125rem 0 0.75rem;
}
.qna_top .qna_slide .cardround_shadow .slide_total {
  font-size: var(--span3-f);
}
.qna_top .qna_slide .cardround_shadow .slide_total .total_n {
  color: #00B400;
  font-weight: var(--bold-f);
  margin-left: 0.25rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.qna_top .qna_slide .cardround_shadow:first-child {
  margin-left: 1.25rem;
}
.qna_top .qna_slide .cardround_shadow:last-child {
  margin-right: 1.25rem;
}
.qna_top .btn_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  padding-bottom: 0.75rem;
}

.qna_wrap {
  padding-top: 2rem;
  position: relative;
}
.qna_wrap h3.title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  background: url(../images/icon/right.svg) no-repeat;
  background-position: right center;
  margin-bottom: 1rem;
}
.qna_wrap h3.title img {
  display: inline;
  margin-right: 0.25rem;
}
.qna_wrap .update_list {
  padding-bottom: 4rem;
}
.qna_wrap .update_list .cardround {
  background-color: #F5F5F5;
  padding: 1rem;
  margin: 0 0 0.5rem;
}
.qna_wrap .update_list .cardround .span3_f {
  color: #9F9F9F;
  margin-bottom: 0.25rem;
}
.qna_wrap .update_list .cardround .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 0.25rem;
}
.qna_wrap .update_list .cardround .txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qna_wrap .update_list .cardround.new {
  background-color: rgba(0, 180, 0, 0.05);
}
.qna_wrap .update_list .cardround.new .span3_f {
  color: #00B400;
}
.qna_wrap .qna_list .qna_link {
  font-size: var(--span2-f);
  border-top: 1px solid #DFDFDF;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0.75rem 0;
}
.qna_wrap .qna_list .qna_link .qna_cate {
  color: #9F9F9F;
  font-weight: var(--bold-f);
  margin-right: 0.5rem;
}
.qna_wrap .qna_list li:first-child .qna_link {
  border-top: 0;
  padding-top: 0.5rem;
}
.qna_wrap .btn_wrap {
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  position: absolute;
  bottom: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(40%, #fff), to(#fff));
  background: linear-gradient(transparent 0%, #fff 40%, #fff 100%);
  padding-top: 4rem;
  z-index: 2;
}
.qna_wrap .best_tag {
  padding: 0.75rem 0 1rem;
  width: 100%;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.qna_wrap .best_tag .btn_m {
  width: 100%;
  text-align: center;
  padding: 0.75rem 0;
}
.qna_wrap .best_tag .btn_m.active {
  background-color: #2F2F2F;
  color: #fff;
}
.qna_wrap .best_list .list_item {
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  padding: 1.125rem;
  border-radius: 0.5rem;
  margin-bottom: 0.5rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
}
.qna_wrap .best_list .list_item .list_no {
  width: 2.5rem;
  height: 2.125rem;
  background-size: 3rem;
  background-position: center;
  background-repeat: no-repeat;
  font-size: var(--span3-f);
  color: #747474;
  text-align: center;
  padding: 0.25rem 0;
  border-radius: 3rem;
}
.qna_wrap .best_list .list_item .list_name .name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.qna_wrap .best_list .list_item .list_name .name .icon_s {
  border-radius: 0.25rem;
  padding: 0.25rem;
  background-color: rgba(0, 180, 0, 0.05);
}
.qna_wrap .best_list .list_item .list_data {
  position: absolute;
  top: 50%;
  right: 1.25rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: right;
}
.qna_wrap .best_list .list_item .list_data .primary {
  padding-top: 0.3125rem;
}
.qna_wrap .best_list .list_item:first-child .list_no {
  background-image: url(../images/icon/best_1.svg);
}
.qna_wrap .best_list .list_item:nth-child(2) .list_no {
  background-image: url(../images/icon/best_2.svg);
}
.qna_wrap .best_list .list_item:nth-child(3) .list_no {
  background-image: url(../images/icon/best_3.svg);
}
.qna_wrap .best_list .list_item:nth-child(4) .list_no, .qna_wrap .best_list .list_item:nth-child(5) .list_no {
  height: initial;
  background: #F5F5F5;
}

.qna_tag {
  background: rgba(0, 180, 0, 0.05);
  width: calc(100% + 2rem);
  -webkit-transform: translate(-1rem);
          transform: translate(-1rem);
  padding: 2rem 1.25rem;
}
.qna_tag .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
}
.qna_tag .tag_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem 0.5rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 1rem 0 2rem;
}
.qna_tag .tag_list .tag {
  border-radius: 3rem;
  font-size: var(--span2-f);
  border: 1px solid #DFDFDF;
  padding: 0.5rem 0.75rem;
  background-color: #fff;
  display: inline-block;
}
.qna_tag::after {
  background-color: #fff;
}

.qna_quick {
  background-color: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1rem 1.25rem;
  gap: 0.5rem;
}
.qna_quick .quick_link {
  background: #fff;
  width: calc(100% / 3);
  text-align: center;
  padding: 0.75rem;
  border-radius: 0.5rem;
  color: #747474;
}
.qna_quick .qna_icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.5rem;
}
.qna_quick .qna_icon img {
  width: 1.625rem;
}

.qna_review {
  background-color: rgba(0, 180, 0, 0.05);
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 0.5rem 0 1rem;
}
.qna_review .review_top {
  padding: 1.5rem 1.25rem;
  background-image: url(../images/reviewtop_img2.png);
  background-repeat: no-repeat;
  background-position: calc(100% - 1.25rem) bottom;
  background-size: 7.125rem;
}
.qna_review .review_top.cslt_top {
  background-image: url(../images/reviewtop_img2.svg);
}
.qna_review .review_top .flex {
  gap: 0.25rem;
  margin-top: 0.75rem;
}
.qna_review .rcomd_topbtn {
  padding: 1.5rem 1.25rem 0.75rem;
  background-position: calc(100% - 1.25rem) 1.6125rem;
}
.qna_review .re_slide {
  width: 100%;
}
.qna_review .re_slide .re_item {
  background: #fff;
  border-radius: 0 0.75rem 0.75rem 0.75rem;
  padding: 1rem 1rem 1.5rem;
  max-width: 16.875rem;
}
@media (max-device-width: 359px) {
  .qna_review .re_slide .re_item {
    width: 77.9944vw;
  }
}
@media (max-device-width: 320px) {
  .qna_review .re_slide .re_item {
    height: 9.375rem;
  }
}
.qna_review .re_slide .re_item .re_ranking {
  height: 1.25rem;
  position: relative;
}
.qna_review .re_slide .re_item .re_ranking .rk {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.qna_review .re_slide .re_item .re_ranking .icon {
  font-size: var(--span4-f);
  color: #00B400;
  padding: 0.125rem 0.25rem;
  background: rgba(0, 180, 0, 0.1);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  right: 0;
  top: 0;
}
.qna_review .re_slide .re_item .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  padding: 0.5rem 0;
}
.qna_review .re_slide .re_item .txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
}
.qna_review .re_slide .re_item.last_child {
  padding: 0;
  background: transparent;
  width: 2rem;
}
.qna_review .btn_wrap {
  padding: 1rem 1rem;
}

.qna_modal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
}
.qna_modal .qnamodal_btn {
  background-color: #F5F5F5;
  width: 100%;
  border-radius: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem 0;
  color: #747474;
}
.qna_modal .qnamodal_btn img {
  width: 2.625rem;
}
@media (max-device-width: 359px) {
  .qna_modal .qnamodal_btn img {
    width: 11.6992vw;
  }
}

.board_slide {
  background-color: #F5F5F5;
  padding: 2rem 1.25rem 1rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.board_slide .cardround_shadow {
  width: 15.5rem;
  padding: 1rem;
  background: #fff;
  border-radius: 1rem 0 1rem 1rem;
}
.board_slide .cardround_shadow .s_title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin: 0.75rem 0 0.25rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board_slide .cardround_shadow .s_txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board_slide .cardround_shadow .pre_rp {
  background: transparent;
  padding-left: 0;
}

.qna_article {
  margin-top: 0.5rem;
}
.qna_article .icon_list {
  margin-bottom: 0.75rem;
}
.qna_article .article_title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.qna_article .username {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-bottom: 1rem;
}
.qna_article .article {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin-bottom: 1rem;
}
.qna_article .cardround {
  padding: 0.75rem 1rem;
  margin-bottom: 0.25rem;
}
.qna_article .cardround .fold_title {
  background: url(../images/icon/top.svg) no-repeat;
  background-position: right center;
}
.qna_article .cardround .info_table {
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.qna_article .cardround .info_table .table_l {
  font-size: var(--span3-f);
  width: 23%;
}
.qna_article .cardround .info_table .table_r {
  font-size: var(--span3-f);
  width: 77%;
}
.qna_article .cardround.info_fold .fold_title {
  background: url(../images/icon/down.svg) no-repeat;
  background-position: right center;
}
.qna_article .cardround.info_fold .info_table:nth-child(2),
.qna_article .cardround.info_fold .info_table:nth-child(3) {
  height: 0;
  padding: 0;
  opacity: 0;
  overflow: hidden;
}
.qna_article .date {
  font-size: var(--span3-f);
  color: #9F9F9F;
}

.cmt_bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 0.75rem;
}
.cmt_bottom .btn_s {
  background: url(../images/icon/like_off.svg) no-repeat;
  background-position: 0.625rem center;
  padding-left: 1.875rem;
  background-size: 1rem;
}
.cmt_bottom .btn_s.likeOn {
  background: #00B400 url(../images/icon/like_wt.svg) no-repeat;
  background-position: 0.625rem center;
  padding-left: 1.875rem;
  background-size: 1rem;
  color: #fff;
  border-color: #00B400;
}

.img_slide {
  margin-top: 0.75rem;
  overflow: hidden;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.img_slide .file_list::after {
  display: none;
}
.img_slide .file_list:first-child {
  margin-left: 1.25rem;
}
.img_slide .file_list:last-child {
  margin-right: 1.25rem;
}

.qna_cmt {
  padding-bottom: 0;
}
.qna_cmt .cmt_total {
  background-color: #00B400;
  font-size: var(--span2-f);
  color: #fff;
  padding: 0.75rem 1.25rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.qna_cmt .cmt_list {
  padding: 0 0 0.5rem;
}
.qna_cmt .cmt_list .cmt_top {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: #F5F5F5;
  padding: 0.75rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.75rem;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_name {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_name span {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  margin-left: 0.5rem;
  padding-left: 0.6rem;
  position: relative;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_name span::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  background-color: #9F9F9F;
  border-radius: 50%;
  display: block;
  position: absolute;
  top: 0.3rem;
  left: 0;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_name span.on {
  color: #00B400;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_name span.on::before {
  background-color: #00B400;
}
.qna_cmt .cmt_list .cmt_top .cmt_info .cmt_sub {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.qna_cmt .cmt_list .cmt_top .cmt_pic {
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
}
.qna_cmt .cmt_list .cmt_txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.qna_cmt .cmt_list .date {
  color: #9F9F9F;
  font-size: var(--span3-f);
  margin-top: 0.5rem;
}
.qna_cmt .board_slide {
  margin-top: 1rem;
}
.qna_cmt .qna_blank {
  padding: 2.5rem 0 1.875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.qna_cmt .qna_blank .blank_img {
  margin-bottom: 0.75rem;
  width: 4.875rem;
}

.qna_noti {
  background-color: #2F2F2F;
  color: #fff;
  padding: 0.625rem 1rem;
  border-radius: 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.img_layerpop {
  position: fixed;
  background: #111;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  opacity: 0;
}
.img_layerpop .header {
  background: #2F2F2F;
}
.img_layerpop .header.header_fix {
  position: relative;
}
.img_layerpop .header .header_title {
  color: #fff;
}
.img_layerpop .popup_img {
  height: calc(100svh - var(--main-height));
  margin-top: var(--header-height);
}
.img_layerpop .popup_img .layerimg_list {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.img_layerpop .popup_img .layerimg_list img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.img_layerpop .navi {
  position: fixed;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  opacity: 0;
  z-index: 1;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.img_layerpop .navi .swiper-button-prev {
  position: initial;
  width: 2.625rem;
  height: 2.625rem;
  padding: 0.3125rem;
  background: rgba(0, 0, 0, 0.7);
}
.img_layerpop .navi .swiper-button-prev::after {
  display: none;
}
.img_layerpop .navi .swiper-button-next {
  position: initial;
  width: 2.625rem;
  height: 2.625rem;
  padding: 0.3125rem;
  background: rgba(0, 0, 0, 0.7);
}
.img_layerpop .navi .swiper-button-next::after {
  display: none;
}
.img_layerpop.open {
  z-index: 999999;
  opacity: 1;
}
.img_layerpop:hover .navi, .img_layerpop:focus .navi, .img_layerpop:active .hover .navi {
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  .img_layerpop:hover .navi, .img_layerpop:focus .navi, .img_layerpop:active .hover .navi {
    opacity: 0;
  }
}

.qna_packslide {
  padding-top: 1.5rem;
  background: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  position: relative;
  padding-bottom: 5rem;
}
.qna_packslide .rcomd_topbtn {
  padding: 0 1.25rem 0;
  background-position: calc(100% - 1.25rem) center;
}
.qna_packslide .btn_inner {
  padding: 0 1rem 1rem;
  width: 100%;
  -webkit-transform: initial;
          transform: initial;
}
.qna_packslide .pack_slide {
  padding: 1rem 0;
}
.qna_packslide .pack_slide .pack_item {
  width: 9.25rem;
  padding: 0.75rem;
  border-radius: 0.5rem;
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.qna_packslide .pack_slide .pack_item:first-child {
  margin-left: 1.25rem;
}
.qna_packslide .pack_slide .pack_item:last-child {
  margin-right: 1.25rem;
}
.qna_packslide .pack_slide .pack_item .thumb {
  background: #F5F5F5;
  padding: 0.625rem 0;
  border-radius: 0.5rem;
  height: 3.25rem;
  margin-bottom: 0.5rem;
}
.qna_packslide .pack_slide .pack_item .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.qna_packslide .pack_slide .pack_item .pack_name {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  padding-top: 0.25rem;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

/* 추천영양제 */
.re_select .select_block {
  margin: 0.75rem 0;
}
.re_select .select_block .selectBtn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1rem 2.5rem 1rem 1rem;
}
.re_select .graph {
  padding: 0.5rem 0 0;
}
.re_select .graph .g_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 6.5rem;
  position: relative;
}
.re_select .graph .g_data::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  border-top: 1px dashed #DFDFDF;
}
.re_select .graph .g_data .g_bar {
  width: 35%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.re_select .graph .g_data .g_bar .my_g {
  border-radius: 0.25rem 0.25rem 0 0;
  background-color: #DFDFDF;
  width: 2rem;
}
.re_select .graph .g_data .g_bar .all_g {
  border-radius: 0.25rem 0.25rem 0 0;
  background-color: #DFDFDF;
  width: 2rem;
}
.re_select .graph .g_txt {
  margin-top: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.re_select .graph .g_txt .g_point {
  text-align: center;
  width: 35%;
}
.re_select .graph .g_txt .g_point .h3_f {
  margin-bottom: 0.25rem;
}

.result_con {
  position: relative;
  padding: 1.5rem 0.25rem 2rem;
}
.result_con .info_black {
  padding: 0.625rem 0.875rem;
  font-size: var(--span3-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin: 0.5rem 0 0.625rem;
  border-radius: 0.25rem;
}
.result_con .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.result_con h3.title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con h3.title img {
  margin-left: 0.375rem;
}
.result_con .small_1 {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
}
.result_con .small_2 {
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.result_con .rlt_topbtn {
  margin: 0.5rem 0 0.375rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .rlt_cmt {
  padding-top: 1rem;
}
.result_con .rlt_cmt .cmt_p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.result_con .rlt_cmt .cmt_p .img {
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.5rem;
}
.result_con .rlt_cmt .cmt_p .cmt_data .name {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.3125rem;
}
.result_con .rlt_cmt .cmt_p .cmt_data .name .small_2 {
  font-weight: 500;
}
.result_con .rlt_cmt .cmt_p .btn_icon,
.result_con .rlt_cmt .cmt_p .btn_s {
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.result_con .rcmd_time .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 1.5rem 0 0.25rem;
}
.result_con .rcmd_time .title img {
  margin-right: 0.5rem;
}
.result_con .rcmd_time .sub {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  padding-left: 1rem;
  position: relative;
}
.result_con .rcmd_time .sub::before {
  content: "";
  position: absolute;
  width: 0.1875rem;
  height: 0.1875rem;
  border-radius: 50%;
  display: block;
  background-color: #747474;
  left: 0.4rem;
  top: 0.4rem;
}
.result_con .rcmd_time .rcmd_block {
  margin-top: 0.75rem;
  background: #F5F5F5;
  border-radius: 0.5rem;
  padding: 1rem;
}
.result_con .rcmd_time .rcmd_block .timeSelect {
  font-size: var(--misc1-f);
  font-weight: var(--bold-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  padding-bottom: 0.25rem;
}
.result_con .rcmd_time .rcmd_block .bbpop {
  margin: 0.5rem 0;
}
.result_con .rcmd_time .rcmd_block .rcmd_item {
  background: #fff;
  border-radius: 0.5rem;
  padding: 1.125rem 1rem;
  margin-top: 0.5rem;
}
.result_con .cardround {
  padding: 1rem;
  margin: 0.75rem 0 0.5rem;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
}
.result_con .recmd_list {
  padding: 0.5rem 0 0;
}
.result_con .recmd_list .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.result_con .recmd_list .title img {
  margin-right: 0.5rem;
}
.result_con .recmd_list .rcmd_slide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.result_con .recmd_list .rcmd_slide .rcmd_data {
  width: 4.5625rem;
  margin-top: 0.25rem;
}
.result_con .recmd_list .rcmd_slide .rcmd_data .img {
  width: 100%;
  padding: 0.6875rem 1.25rem;
  background-color: #F5F5F5;
  border-radius: 0.25rem;
  margin-bottom: 0.5rem;
}
.result_con .recmd_list .rcmd_slide .rcmd_data .img img {
  width: 100%;
}
.result_con .recmd_list .rcmd_slide .rcmd_data:first-child {
  margin-left: 3.75rem;
}
.result_con .recmd_list .rcmd_slide .rcmd_data:last-child {
  margin-right: 1.25rem;
}
.result_con .cmt_top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .cmt_top .img {
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 1rem;
}
.result_con .cmt_top .cardround {
  width: calc(100% - 3.75rem);
  padding: 0.75rem;
}
.result_con .drug_info {
  padding-top: 1rem;
}
.result_con .drug_info .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  position: relative;
  padding-left: 1rem;
  padding-bottom: 0.5rem;
}
.result_con .drug_info .title::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #00B400;
  border-radius: 50%;
}
.result_con .drug_info .title span {
  position: relative;
  margin-right: 2px;
  display: inline-block;
}
.result_con .drug_info .title span::after {
  content: "";
  position: absolute;
  display: block;
  background-color: rgba(0, 180, 0, 0.1);
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.3125rem;
  border-radius: 3rem;
}
.result_con .drug_info .cardround {
  padding: 0.75rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0.5rem 0 0.5rem;
  border-radius: 0.5rem;
}
.result_con .drug_info .cardround .info_l .d_title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.result_con .drug_info .cardround .info_l .info_day {
  background-color: #fff;
  border-radius: 3rem;
  padding: 0.25rem 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-top: 0.75rem;
}
.result_con .drug_info .cardround .info_l .info_day p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .drug_info .cardround .info_l .info_day p img {
  margin-right: 0.25rem;
}
.result_con .drug_info .cardround .info_l .info_day p:first-child {
  margin-right: 0.5rem;
}
.result_con .drug_info .cardround .info_r {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-right: 0.375rem;
}
.result_con .drug_info .cardround .info_r img {
  width: 2rem;
  height: 1.5rem;
  margin-left: 0.5rem;
}
.result_con .drug_info .cardround .info_r img img {
  width: 100%;
}
.result_con .drug_info .cardround.select {
  background-color: #fff;
  border: 1px solid #00B400;
}
.result_con .info_type {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .info_type .small_2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .info_type .now {
  width: 0.625rem;
  height: 0.625rem;
  border: 1px solid #00B400;
  margin-right: 0.25rem;
}
.result_con .info_type .none {
  width: 0.625rem;
  height: 0.625rem;
  background-color: #F5F5F5;
  margin: 0 0.25rem 0 0.5rem;
}
.result_con .result_top .btn_icon {
  color: #fff;
}
.result_con .result_top .re_point {
  font-size: 2rem;
  font-weight: var(--bold-f);
  margin-top: 0.75rem;
}
.result_con .result_top .re_point span {
  margin-left: 0.25rem;
}
.result_con .result_top .re_sub {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-top: 1rem;
}
.result_con .result_top + .cardround {
  margin-bottom: 0;
}
.result_con .result_top + .cardround b {
  font-weight: var(--bold-f);
  color: #2F2F2F;
}
.result_con .bmi_block {
  margin-top: 0.5rem;
}
.result_con .bmi_block .bmi_pic {
  width: 100%;
  position: relative;
  height: 12rem;
}
.result_con .bmi_block .bmi_pic.pic1 {
  background: url(../images/bmi1.svg) no-repeat;
  background-position: center top;
}
.result_con .bmi_block .bmi_pic.pic2 {
  background: url(../images/bmi2.svg) no-repeat;
  background-position: center top;
}
.result_con .bmi_block .bmi_pic.pic2 .bmi_txt .line1::before {
  border-top: 2px solid #00B400;
}
.result_con .bmi_block .bmi_pic.pic3 {
  background: url(../images/bmi3.svg) no-repeat;
  background-position: center top;
}
.result_con .bmi_block .bmi_pic.pic4 {
  background: url(../images/bmi4.svg) no-repeat;
  background-position: center top;
}
.result_con .bmi_block .bmi_pic.pic5 {
  background: url(../images/bmi5.svg) no-repeat;
  background-position: center top;
}
.result_con .bmi_block .bmi_txt {
  font-size: var(--span2-f);
  color: #9F9F9F;
  position: absolute;
  bottom: 0;
  right: 0;
  text-align: right;
  width: 5.5rem;
}
.result_con .bmi_block .bmi_txt .line1 {
  position: relative;
  margin-bottom: 0.25rem;
}
.result_con .bmi_block .bmi_txt .line1::before {
  content: "";
  position: absolute;
  width: 1.125rem;
  border-radius: 3rem;
  border-top: 2px solid #F44432;
  top: 0.3rem;
  display: block;
}
.result_con .bmi_block .bmi_txt .line2 {
  position: relative;
}
.result_con .bmi_block .bmi_txt .line2::before {
  content: "";
  position: absolute;
  width: 1.125rem;
  border-radius: 3rem;
  border-top: 2px dashed #DFDFDF;
  top: 0.3rem;
  display: block;
}
.result_con .bmi_block .bmi_table {
  margin-top: 1rem;
}
.result_con .bmi_block .bmi_table .table_top {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
  background-color: #F5F5F5;
  padding: 0.625rem;
  border-radius: 0.25rem;
}
.result_con .bmi_block .bmi_table .table_top p {
  width: calc(100% / 3 - 1rem);
  text-align: center;
}
.result_con .bmi_block .bmi_table .table_top p:last-child {
  width: calc(100% / 3 + 2rem);
}
.result_con .bmi_block .bmi_table .table_top p:last-child img {
  margin-left: 0.25rem;
  display: inline;
}
.result_con .bmi_block .bmi_table .table_txt {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
  padding: 0.75rem 0.625rem 0.25rem;
}
.result_con .bmi_block .bmi_table .table_txt p {
  width: calc(100% / 3 - 1rem);
  text-align: center;
}
.result_con .bmi_block .bmi_table .table_txt p:last-child {
  width: calc(100% / 3 + 2rem);
}
.result_con .bmi_block .bmi_table + .cardround {
  margin-bottom: 1rem;
}
.result_con .bmi_block .cardround .span2_f {
  margin: 0.75rem 0 0.5rem;
}
.result_con .bmi_block .bmi_bar {
  padding-top: 2.375rem;
}
.result_con .bmi_block .bmi_bar .p_color {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  text-align: center;
}
.result_con .bmi_block .bmi_tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.result_con .result_num {
  margin-top: 1rem;
  padding-bottom: 0.5rem;
}
.result_con .result_num:last-child {
  padding-bottom: 0;
}
.result_con .result_num .num_top {
  margin: 0.75rem 0 0.875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.result_con .result_num .num_top .img {
  width: 2rem;
  margin-right: 0.75rem;
}
.result_con .result_num .num_top .num_title {
  width: calc(100% - 2.75rem);
}
.result_con .result_num .num_top .num_title .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.result_con .result_num .num_top .num_title .title span {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  margin-left: 0.2rem;
}
.result_con .result_num .num_top .num_title .title .small_1 {
  margin-top: 0.25rem;
}
.result_con .result_num .good {
  color: #00B400;
}
.result_con .result_num .bad {
  color: #F44432;
}
.result_con .result_num .num_slide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.result_con .result_num .num_slide .num_data {
  width: 5.625rem;
}
.result_con .result_num .num_slide .num_data:first-child {
  margin-left: 1.25rem;
}
.result_con .result_num .num_slide .num_data:last-child {
  margin-right: 1.25rem;
}
.result_con .result_num .num_slide .num_data .img {
  border-radius: 0.25rem;
  background-color: #F5F5F5;
  height: 3.25rem;
  padding: 0.625rem 1.25rem;
  margin-bottom: 0.5rem;
}
.result_con .result_num .num_slide .num_data .img img {
  width: 100%;
}
.result_con .result_num .num_slide .num_data .span3_fb {
  margin-top: 0.25rem;
}

.reault_bad .p_color {
  color: #F44432;
}
.reault_bad .result_top .btn_icon {
  background-color: #F44432;
}
.reault_bad .graph .g_data .g_bar .my_g {
  background-color: #F44432;
}
.reault_bad.bmi_block .cardround {
  background-color: rgba(244, 68, 50, 0.05);
}
.reault_bad.bmi_block .bmi_bar {
  background: url(../images/result_bar1.svg) no-repeat;
  background-position: center 1rem;
}

.result_good .p_color {
  color: #00B400;
}
.result_good .result_top .btn_icon {
  background-color: #00B400;
}
.result_good .graph .g_data .g_bar .my_g {
  background-color: #00B400;
}
.result_good.bmi_block .cardround {
  background-color: rgba(0, 180, 0, 0.05);
}
.result_good.bmi_block .bmi_bar {
  background: url(../images/result_bar3.svg) no-repeat;
  background-position: center 1rem;
}

.result_so .p_color {
  color: #FFC710;
}
.result_so .result_top .btn_icon {
  background-color: #FFC710;
}
.result_so.bmi_block .cardround {
  background-color: rgba(255, 199, 16, 0.05);
}
.result_so.bmi_block .bmi_bar {
  background: url(../images/result_bar2.svg) no-repeat;
  background-position: center 1rem;
}

.total_infobg {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2F2F2F), color-stop(6.25rem, #2F2F2F), color-stop(6.25rem, #F5F5F5), to(#F5F5F5));
  background: linear-gradient(#2F2F2F 0, #2F2F2F 6.25rem, #F5F5F5 6.25rem, #F5F5F5 100%);
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 1.5rem 1.25rem 8.5rem;
}
.total_infobg .title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #fff;
}
.total_infobg .etc_slide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding-top: 1rem;
}
.total_infobg .etc_slide .etc_list {
  width: 9.25rem;
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.5rem;
}
.total_infobg .etc_slide .etc_list:first-child {
  margin-left: 1.25rem;
}
.total_infobg .etc_slide .etc_list:last-child {
  margin-right: 1.25rem;
}
.total_infobg .etc_slide .etc_list .img {
  width: 100%;
  background-color: #F5F5F5;
  padding: 0.625rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 3.25rem;
  margin-bottom: 0.5rem;
  border-radius: 0.5rem;
}
.total_infobg .etc_slide .etc_list .img img {
  height: 100%;
  width: auto;
}
.total_infobg .etc_slide .etc_list .span3_fb {
  margin-top: 0.25rem;
}
.total_infobg .cardround_shadow {
  background-color: #fff;
  padding: 1.5rem 1.5rem 2rem;
}
.total_infobg .cardround_shadow .txt1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00B400;
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.total_infobg .cardround_shadow .txt2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #9F9F9F;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.total_infobg .cardround_shadow .txt3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin-bottom: 1rem;
}
.total_infobg .cardround_shadow .img {
  width: 1.5rem;
  margin: 0.5rem auto 0.75rem;
}
.total_infobg .cardround_shadow .banner {
  background-color: #2F2F2F;
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  color: #fff;
  position: relative;
  font-size: var(--span3-f);
}
.total_infobg .cardround_shadow .banner .img {
  position: absolute;
  width: 4.1875rem;
  right: 1rem;
  top: 50%;
  -webkit-transform: translateY(-55%);
          transform: translateY(-55%);
}
.total_infobg .cardround_shadow .banner .img_right {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

/* ----------------- 나의기록 ------------------- */
.step_wrap {
  background: rgba(0, 0, 0, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: #fff;
  text-align: center;
  opacity: 0;
  z-index: -1;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.step_wrap .title {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  padding-top: calc(100svh / 5);
}
.step_wrap .closeBtn {
  position: fixed;
  top: 5.625rem;
  right: 0.625rem;
  z-index: 12;
  cursor: pointer;
}
.step_wrap .closeBtn img {
  width: 2.625rem;
}
.step_wrap .alarm_list {
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: calc(100svh / 9);
  width: 100%;
  padding: 0 1.25rem;
}
.step_wrap .alarm_list .btn_item {
  height: 4.375rem;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 1rem 1.25rem;
  border-radius: 0.5rem;
  margin-bottom: 0.5625rem;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.step_wrap .alarm_list .btn_item span {
  width: 100%;
  text-align: left;
  font-size: var(--span3-f);
  font-weight: initial;
}
.step_wrap .alarm_list .btn_add {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 1px solid #fff;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.step_wrap .alarm_list .btn_disabled {
  background-color: #C9C9C9;
  color: #747474;
}
.step_wrap .alarm_list .btn_white {
  border-color: transparent;
}
.step_wrap .step_profile {
  width: 9.125rem;
  height: 9.125rem;
  background: url(../images/guide_sample.png) no-repeat;
  background-size: cover;
  border-radius: 50%;
  position: absolute;
  top: 40%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  overflow: hidden;
}
.step_wrap .step_profile .checkani {
  opacity: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.step_wrap .step_profile .checkani .dropimg {
  width: 2.9375rem;
  height: 2.9375rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, 100%);
          transform: translate(-50%, 100%);
}
.step_wrap .step_profile .checkani .dropbg {
  width: 100%;
  height: 100%;
  background-color: #00B400;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}
.step_wrap .step_profile.drop-target .checkani {
  opacity: 1;
}
.step_wrap .step_profile.drop-target .checkani .dropimg {
  -webkit-animation: dropdown 1s ease-in-out;
          animation: dropdown 1s ease-in-out;
}
.step_wrap .step_profile.drop-target .checkani .dropbg {
  -webkit-animation: dropbg 1.5s ease-in-out;
          animation: dropbg 1.5s ease-in-out;
}
.step_wrap.open {
  opacity: 1;
  z-index: 9;
}

.drag_area {
  position: fixed;
  bottom: 0;
  z-index: 1;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.drag_area .drag_border {
  width: 3.1875rem;
  height: 3.1875rem;
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 1.875rem;
  border: 2px solid #00B400;
  border-radius: 50%;
  background: #fff;
  -webkit-box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.2);
}
.drag_area.drop {
  z-index: 9;
}

/*------------------------ 영양제 추천 ------------------ */
.rcomd_topbtn {
  padding: 1.5rem 0 0.75rem;
  background: url(../images/icon/right_bk.svg) no-repeat;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-position: right 1.6125rem;
}
.rcomd_topbtn .icon_img {
  margin-right: 0.25rem;
}

.rcomd_topbanner {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  padding: 0.75rem 4rem 0.75rem 1rem;
  background: #F5F5F5 url(../images/icon/bannericon.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  margin: 0 0 0.75rem;
}

.thumb_pack {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding-top: 1rem;
}
.thumb_pack .thumb {
  width: 4.125rem;
  aspect-ratio: 1.375/1;
  background-color: #F5F5F5;
  border-radius: 0.5rem;
  padding: 0.75rem;
  margin-right: 0.5rem;
}
.thumb_pack .pack_txt {
  width: calc(100% - 12.125rem);
}
.thumb_pack .pack_txt .name {
  font-size: var(--span2-f);
}
.thumb_pack .pack_txt .info {
  font-size: var(--span3-f);
  color: #00B400;
  margin-top: 0.25rem;
}
.thumb_pack .pack_right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 7.5rem;
}
.thumb_pack .pack_right .cost {
  text-align: right;
  line-height: 1.3;
  margin-right: 0.5rem;
}
.rcmd_detail {
  position: relative;
  padding: 0 0.25rem 1rem;
}
.rcmd_detail .detail_wideimg {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.rcmd_detail .detail_wideimg img {
  width: 100%;
}
.rcmd_detail .title {
  margin-top: 1.5rem;
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
}
.rcmd_detail .title.gr_title {
  padding-left: 1.25rem;
  position: relative;
}
.rcmd_detail .title.gr_title::before {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  border: 0.25rem solid #00B400;
  display: block;
  border-radius: 50%;
  left: 0;
  top: 2px;
}
.rcmd_detail .title.red_title {
  padding-left: 1.25rem;
  position: relative;
}
.rcmd_detail .title.red_title::before {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  border: 0.25rem solid #F44432;
  display: block;
  border-radius: 50%;
  left: 0;
  top: 2px;
}
.rcmd_detail .title_sub {
  margin-top: 1.5rem;
  font-size: var(--span2-f);
  color: #9F9F9F;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rcmd_detail .title_sub + .title {
  margin-top: 0.25rem;
}
.rcmd_detail .tag {
  margin-top: 0.5rem;
}
.rcmd_detail .tag .btn_icon {
  margin-right: 0.25rem;
}
.rcmd_detail .detail_text {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  padding: 1rem 0;
}
.rcmd_detail .cmt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.rcmd_detail .cmt .cmt_p {
  width: 2.75rem;
  height: 2.75rem;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  margin-right: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.rcmd_detail .cmt .cardround {
  padding: 0.75rem;
  font-size: var(--span3-f);
  color: #747474;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  width: calc(100% - 3.75rem);
  margin: 0.75rem 0 0;
}
.rcmd_detail .cmt .cardround .span3_f {
  font-size: var(--p5-f);
  line-height: var(--line-h);
}
.rcmd_detail .cardround.bg_gray {
  padding: 1rem 1.125rem;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  margin: 0.75rem 0 0;
}
.rcmd_detail .cardround.bg_gray .span2_f {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: var(--line-h);
}
.rcmd_detail .cardround.bg_gray .gray03 {
  font-family: "Poppins";
  font-weight: 700;
  font-size: 0.9375rem;
  width: 1rem;
}
.rcmd_detail .innerimg {
  margin-top: 1.5rem;
}
.rcmd_detail .innerimg img {
  width: 100%;
}
.rcmd_detail .rcmd_drug {
  padding-bottom: 0.5rem;
}
.rcmd_detail .rcmd_drug .list_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 1.25rem;
}
.rcmd_detail .rcmd_drug .list_item .img {
  width: 4.125rem;
  height: 3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #F5F5F5;
  padding: 0.75rem 1.0625rem;
  margin-right: 0.75rem;
  border-radius: 0.5rem;
}
.rcmd_detail .rcmd_drug .list_item .img img {
  width: 100%;
}
.rcmd_detail .rcmd_drug .list_item .list_data {
  width: calc(100% - 4.875rem);
}
.rcmd_detail .rcmd_drug .list_item .list_data .data_t {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
}
.rcmd_detail .rcmd_drug .list_item .list_data .span3_f {
  font-size: var(--p5-f);
  line-height: var(--line-h);
}
.rcmd_detail.rcmd_detailbg {
  background-color: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 1.5rem 1.25rem;
}
.rcmd_detail.rcmd_detailbg .title {
  margin: 0 0 1rem;
}
.rcmd_detail.rcmd_detailbg .rcmd_drug .list_item {
  background-color: #fff;
  padding: 0.75rem 1rem;
  margin: 0 0 0.5rem;
}
.rcmd_detail.rcmd_detailbg .rcmd_drug .list_item .img {
  background: transparent;
  width: 2rem;
  height: 2rem;
  padding: 0;
  margin-right: 1rem;
}
.rcmd_detail.rcmd_detailbg .rcmd_drug .list_item .list_data {
  width: calc(100% - 3rem);
}
.rcmd_detail.rcmd_detailbg .infotxt .txt {
  position: relative;
  color: #9F9F9F;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding-left: 1.25rem;
}
.rcmd_detail.rcmd_detailbg .infotxt .txt:before {
  content: "";
  display: block;
  width: 0.1875rem;
  height: 0.1875rem;
  background-color: #9F9F9F;
  border-radius: 50%;
  left: 0.5rem;
  top: 0.3rem;
  position: absolute;
}
.rcmd_detail .rcmdslide {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  margin: 1rem 0 1.25rem;
}
.rcmd_detail .rcmdslide .slide_data {
  width: 12.8125rem;
}
.rcmd_detail .rcmdslide .slide_data .span1_fb {
  line-height: var(--line-h);
}
.rcmd_detail .rcmdslide .slide_data:first-child {
  margin-left: 1.25rem;
}
.rcmd_detail .rcmdslide .slide_data:last-child {
  margin-right: 1.25rem;
}
.rcmd_detail .rcmdslide .slide_data .img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  height: 6.5rem;
  width: 100%;
  aspect-ratio: 1.9/1;
  border-radius: 1.5rem 0 0 0;
  margin-bottom: 0.5rem;
}
.rcmd_detail .rcmdslide .slide_data .tag .btn_icon {
  margin-bottom: 0.25rem;
  margin-right: 0;
}
.rcmd_detail .rcmdslide .slide_data .title_sub {
  margin: 0.75rem 0 0.25rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rcmd_detail + .btn_wrap {
  padding: 0;
}
.rcmd_detail + .btn_wrap::after {
  content: "";
  display: block;
  height: 20svh;
  max-height: 20.625rem;
  background-color: #F5F5F5;
  margin-top: 1.25rem;
  width: calc(100% + 2rem);
  position: absolute;
  top: 7rem;
}
@media (max-device-width: 359px) {
  .rcmd_detail + .btn_wrap::after {
    margin-top: 5vw;
  }
}

.progress_wrap {
  width: 100%;
  height: 2px;
  background: transparent;
  position: absolute;
  top: -1px;
  left: 0;
}
.progress_wrap .progress_bar {
  height: 2px;
  background: #00B400;
  width: 0%;
}

/* ----------------- 상담화면 ------------------*/
.loading_wrap {
  position: fixed;
  top: 20svh;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  width: 100%;
  padding: 0 1.25rem;
}
.loading_wrap .loading_p {
  border-radius: 50%;
  margin-bottom: 3.125rem;
  position: relative;
}
.loading_wrap .loading_p::after {
  content: "";
  position: absolute;
  width: 4rem;
  height: 4rem;
  top: 0;
  background: #00B400;
  display: block;
  z-index: -1;
  opacity: 0.1;
  border-radius: 50%;
  -webkit-animation: load_circle 1s linear infinite;
          animation: load_circle 1s linear infinite;
}
.loading_wrap .loading_p .img {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  position: relative;
}
.loading_wrap .loading_p .img.woman {
  background: #fff url(../images/icon/woman.svg) no-repeat center bottom;
}
.loading_wrap .loading_p .img.man {
  background: #fff url(../images/icon/man.svg) no-repeat center bottom;
}
.loading_wrap .loading_p .img lottie-player {
  width: calc(100% + 10px);
  height: calc(100% + 10px);
  position: absolute;
}
.loading_wrap .loading_time {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #00B400;
  margin-bottom: 0.25rem;
}
.loading_wrap .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.75rem;
}

.video_chat {
  position: fixed;
  width: 100svw;
  height: 100svh;
  left: 0;
  top: 0;
  z-index: 0;
}
.video_chat video {
  position: fixed;
  z-index: 0;
  opacity: 1;
  left: 0;
  top: 0;
  min-height: 100svh;
  width: auto;
}
.video_chat .top_tab {
  padding-top: 0.75rem;
  padding-left: 1rem;
  position: relative;
  z-index: 999;
}
.video_chat .top_tab .tabicon {
  border: 1px solid #DFDFDF;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  padding: 0.625rem 0.75rem 0.625rem 1.75rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: 3rem;
  line-height: 1;
  display: inline-block;
  margin-right: 0.25rem;
}
.video_chat .top_tab .tabicon.tab_result {
  background: rgba(255, 255, 255, 0.8) url(../images/icon/pillbottle.svg) no-repeat 0.5rem center;
}
.video_chat .top_tab .tabicon.tab_result.active {
  background: rgba(0, 180, 0, 0.8) url(../images/icon/pillbottle_wt.svg) no-repeat 0.5rem center;
  color: #fff;
  border: 1px solid transparent;
}
.video_chat .top_tab .tabicon.tab_rcmd {
  background: rgba(255, 255, 255, 0.8) url(../images/icon/survey.svg) no-repeat 0.5rem center;
}
.video_chat .top_tab .tabicon.tab_rcmd.active {
  background: rgba(0, 180, 0, 0.8) url(../images/icon/pillbottle_wt.svg) no-repeat 0.5rem center;
  color: #fff;
  border: 1px solid transparent;
}
.video_chat .chat_bottom {
  width: 100%;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  position: fixed;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.video_chat .chat_bottom .error_msg {
  background: rgba(0, 0, 0, 0.8);
  padding: 0.75rem 0 1.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.video_chat .chat_bottom .error_msg .error {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #fff;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin-bottom: 0.5rem;
}
.video_chat .chat_bottom .user_ac {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding-right: 1rem;
  margin-bottom: 0.75rem;
}
.video_chat .chat_bottom .user_ac .user_video {
  max-height: 9.1875rem;
  width: 5.1875rem;
  aspect-ratio: 1/1.7;
  border-radius: 0.5rem;
  overflow: hidden;
  position: relative;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  opacity: 1;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.video_chat .chat_bottom .user_ac .user_video .video_time {
  color: #fff;
  font-size: var(--span4-f);
  background: rgba(0, 0, 0, 0.6);
  text-align: center;
  padding: 0.5rem 0;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  border-radius: 0 0 0.5rem 0.5rem;
  overflow: hidden;
}
.video_chat .chat_bottom .user_ac .user_video .icon_bottom {
  position: absolute;
  bottom: 2rem;
  right: 0.25rem;
  background: url(../images/icon/mic_wt.svg) no-repeat right center;
  background-size: cover;
  width: 1.125rem;
  height: 1.125rem;
  display: none;
}
.video_chat .chat_bottom .user_ac .user_video .icon_bottom.active {
  display: block;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-backdrop-filter: blur(0.5rem);
          backdrop-filter: blur(0.5rem);
  background: rgba(0, 0, 0, 0.6);
  display: none;
  border-radius: 0.5rem;
  overflow: hidden;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam .icon {
  position: absolute;
  top: 40%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam .icon img {
  width: 1.125rem;
  display: inline;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam .icon img.mic {
  display: none;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam.active {
  display: block;
}
.video_chat .chat_bottom .user_ac .user_video .icon_cam.icon_cam2 .icon img.mic {
  display: inline;
}
.video_chat .chat_bottom .user_ac .user_menu {
  margin-top: 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_mic {
  background: rgba(255, 255, 255, 0.8) url(../images/icon/mic.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_mic.active {
  background: rgba(0, 180, 0, 0.8) url(../images/icon/mic_wt.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_camera {
  background: rgba(255, 255, 255, 0.8) url(../images/icon/cam.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_camera.active {
  background: rgba(0, 180, 0, 0.8) url(../images/icon/cam_wt.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_chat {
  background: rgba(255, 255, 255, 0.8) url(../images/icon/chat.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_chat.active {
  background: rgba(0, 180, 0, 0.8) url(../images/icon/chat_wt.svg) no-repeat center;
}
.video_chat .chat_bottom .user_ac .user_menu .menu_list.menu_report {
  background: rgba(244, 68, 50, 0.8) url(../images/icon/declaration.svg) no-repeat center;
}
.video_chat .chat_bottom .user_chat {
  height: 0;
  max-height: 14.375rem;
  background: #fff;
  border-radius: 1.5rem 1.5rem 0 0;
  padding: 0 1rem;
  position: relative;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  overflow: hidden;
}
.video_chat .chat_bottom .user_chat .chat_main {
  height: calc(100% - 4.5625rem);
  overflow: hidden;
  padding-top: 1.5rem;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_in {
  height: 100%;
  overflow: auto;
}
.video_chat .chat_bottom .user_chat .chat_main .time {
  font-size: var(--span4-f);
  color: #9F9F9F;
  width: 3rem;
  padding-bottom: 0.5rem;
}
.video_chat .chat_bottom .user_chat .chat_main .msg {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_left .msg_list {
  width: calc(100% - 2.5rem);
  margin-bottom: 0.75rem;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_left .mgs_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_left .img {
  width: 2rem;
  height: 2rem;
  background-size: cover;
  border: 1px solid #DFDFDF;
  border-radius: 50%;
  margin-right: 0.5rem;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_left .msg {
  background-color: #F5F5F5;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  max-width: calc(100% - 4rem);
  margin-right: 0.5rem;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_right .msg_list {
  width: 100%;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_right .mgs_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_right .msg {
  background: #00B400;
  color: #fff;
  border-radius: 0.5rem 0 0.5rem 0.5rem;
  max-width: calc(100% - 4rem);
  margin-left: 0.5rem;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.video_chat .chat_bottom .user_chat .chat_main .chat_right .time {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.video_chat .chat_bottom .user_chat .chat_write {
  padding: 0.75rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: calc(100% + 2rem);
  border-top: 1px solid #F5F5F5;
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.video_chat .chat_bottom .user_chat .chat_write .input_basic {
  width: calc(100% - 3.125rem);
}
.video_chat .chat_bottom .user_chat .chat_write .input_basic .msg_file {
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translate(-0.75rem, -50%);
          transform: translate(-0.75rem, -50%);
}
.video_chat .chat_bottom .user_chat .chat_write .senBtn {
  width: 2.5rem;
  height: 2.5rem;
}
.video_chat .chat_bottom .user_chat.open {
  height: 35svh;
}
.video_chat .chat_bottom .user_inner {
  background-color: #fff;
  border-radius: 1.5rem 1.5rem 0 0;
  height: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.video_chat .chat_bottom .user_inner .inner_pd {
  padding: 1.5rem 0;
  height: 100%;
}
.video_chat .chat_bottom .user_inner .result_in {
  width: 100%;
  height: 100%;
  padding: 0 1.25rem;
  overflow-y: auto;
  overflow-x: hidden;
}
.video_chat .chat_bottom .user_inner.open {
  height: 80svh;
  max-height: 600px;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.video_chat .chat_none {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-backdrop-filter: blur(0.5rem);
          backdrop-filter: blur(0.5rem);
  background: rgba(0, 0, 0, 0.5);
  z-index: -1;
  color: #fff;
}
.video_chat .chat_none .txt {
  width: 100%;
  position: absolute;
  top: 42%;
}
.video_chat .chat_none .txt > P {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0.5rem auto;
}
.video_chat .chat_load {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #F5F5F5;
  z-index: -1;
}
.video_chat .chat_load .loading_con {
  position: absolute;
  top: 40%;
  text-align: center;
  width: 100%;
}
.video_chat .chat_load .loading_ani {
  margin-bottom: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 2rem;
}
.video_chat .chat_load .loading_ani > span {
  width: 0.5625rem;
  height: 0.3125rem;
  display: inline-block;
  background: #DFDFDF;
  margin: 0 0.3125rem;
  border-radius: 0.0125rem;
}
.video_chat .chat_load .loading_ani > span.loaing1 {
  -webkit-animation: loading1 1.2s ease-out infinite;
          animation: loading1 1.2s ease-out infinite;
}
.video_chat .chat_load .loading_ani > span.loaing2 {
  -webkit-animation: loading2 1.2s ease-out infinite;
          animation: loading2 1.2s ease-out infinite;
}
.video_chat .chat_load .loading_ani > span.loaing3 {
  -webkit-animation: loading3 1.2s ease-out infinite;
          animation: loading3 1.2s ease-out infinite;
}

/* 상담평가*/
.check_block .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.check_block .review_star {
  margin-bottom: 1.5rem;
}

/* ------------- 나의기록 ----------------*/
.record_wrap {
  position: relative;
  padding: 1rem 0.25rem 1.5rem;
}
.record_wrap .board_blank {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  text-align: center;
  color: #9F9F9F;
  background: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translate(-1.25rem, 0.5rem);
          transform: translate(-1.25rem, 0.5rem);
  height: calc(100svh - (var(--base-height) + 5rem));
  padding-bottom: 10svh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.record_wrap .btn_s {
  display: inline-block;
}
.record_wrap h3.title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  padding: 0.5rem 0 0.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.record_wrap h3.title img {
  margin-left: 0.25rem;
}
.record_wrap h3.title .date {
  font-size: var(--span2-f);
  color: #9F9F9F;
  padding-left: 0.5rem;
}
.record_wrap .sub {
  font-size: var(--span2-f);
  color: #9F9F9F;
}
.record_wrap > a .title {
  background: url(../images/icon/right.svg) no-repeat right center;
}
.record_wrap .calender_info {
  padding: 1rem;
  position: relative;
  margin: 0.4375rem 0 0;
}
.record_wrap .calender_info .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.record_wrap .calender_info .data {
  position: absolute;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  top: 1rem;
  right: 1rem;
}
.record_wrap .calender_info .data::before {
  content: "";
  position: relative;
  top: -4px;
  height: 3px;
  width: 0.75rem;
  background-color: #9F9F9F;
  display: inline-block;
  margin-right: 0.25rem;
}
.record_wrap .calender_info .data.up {
  color: #F44432;
}
.record_wrap .calender_info .data.up::before {
  content: "▲";
  top: initial;
  background-color: transparent;
  position: relative;
  font-size: 0.75rem;
  margin-right: 0.25rem;
}
.record_wrap .calender_info .data.down::before {
  content: "▼";
  top: initial;
  background-color: transparent;
  font-size: 0.75rem;
}
.record_wrap .mission {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 1rem;
  gap: 0.5rem;
}
.record_wrap .mission .default {
  width: 2.875rem;
  aspect-ratio: 1;
  color: #9F9F9F;
  background-color: #F5F5F5;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span2-f);
}
@media (max-device-width: 359px) {
  .record_wrap .mission .default {
    width: 12.8134vw;
  }
}
.record_wrap .mission .default.cmpl {
  background-color: #00B400;
  color: #fff;
}
.record_wrap .graph_data_none {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2.5rem 0;
  text-align: center;
}
.record_wrap .graph_data {
  padding-top: 0.75rem;
  margin-bottom: 1.25rem;
}
.record_wrap .graph_data .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.record_wrap .graph_data .title svg, .record_wrap .graph_data .title img {
  margin-right: 0.5rem;
  width: 1.25rem;
}
.record_wrap .graph_data .title > p {
  width: calc(100% - 1.75rem);
  padding-top: 0.125rem;
}
.record_wrap .graph_data .graph_line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  text-align: center;
  height: 10.5rem;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  position: relative;
}
.record_wrap .graph_data .graph_line::after {
  content: "";
  border-top: 1px dashed #DFDFDF;
  position: absolute;
  top: calc(50% - 2px);
  display: block;
  height: 1px;
  width: 100%;
}
.record_wrap .graph_data .graph_line .group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.record_wrap .graph_data .graph_line .group .time {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  line-height: 1;
}
.record_wrap .graph_data .graph_line .group .line {
  height: 8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.record_wrap .graph_data .graph_line .group .line .bar {
  width: 1.5rem;
  background-color: #F5F5F5;
  border-radius: 0.25rem 0.25rem 0 0;
  min-height: 0.25rem;
  margin-top: 0.25rem;
}
.record_wrap .graph_data .graph_line .group .day {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-top: 0.5rem;
}
.record_wrap .graph_data .graph_line .group.line_2 .time {
  color: #00B400;
}
.record_wrap .graph_data .graph_line .group.line_2 .line .bar {
  background-color: #00B400;
}
.record_wrap .graph_data .graph_line .group.line_1 .time {
  color: #FFC710;
}
.record_wrap .graph_data .graph_line .group.line_1 .line .bar {
  background-color: #FFC710;
}
.record_wrap .graph_data .graph_circle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  align-items: center;
  margin-bottom: 1.25rem;
}
.record_wrap .graph_data .graph_circle .circle {
  width: 8.875rem;
  height: 8.875rem;
  border-radius: 50%;
  margin-top: 1rem;
  margin-right: 2rem;
  position: relative;
  margin-left: 1.625rem;
  overflow: hidden;
  background: conic-gradient(#F5F5F5 20deg, #00B400 20deg);
}
@media (max-device-width: 359px) {
  .record_wrap .graph_data .graph_circle .circle {
    width: 39.5543vw;
    height: auto;
    aspect-ratio: 1;
    margin-right: 1rem;
    margin-left: 1rem;
  }
}
.record_wrap .graph_data .graph_circle .circle span {
  width: 5.25rem;
  height: 5.25rem;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: 2;
}
@media (max-device-width: 359px) {
  .record_wrap .graph_data .graph_circle .circle span {
    width: 23.3983vw;
    height: auto;
    aspect-ratio: 1;
  }
}
.record_wrap .graph_data .graph_circle .circle_info .txt .circle_c {
  width: 0.5rem;
  height: 0.5rem;
  background-color: #F5F5F5;
  border-radius: 50%;
  margin-right: 0.25rem;
  display: inline-block;
}
.record_wrap .graph_data .graph_circle .circle_info .txt .circle_c.primary {
  background-color: #00B400;
}
.record_wrap .graph_data .graph_circle .circle_info .txt .circle_txt {
  font-size: var(--span3-f);
  margin-right: 0.75rem;
  color: #9F9F9F;
}
.record_wrap .graph_data .graph_circle .circle_info .txt .circle_time {
  font-size: var(--span3-f);
}
.record_wrap .graph_data .cardround {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  padding: 1.5rem 2.5rem;
  border-radius: 1rem;
}
.record_wrap .graph_data .cardround > div {
  width: 50%;
}
.record_wrap .graph_data .cardround > div .txt {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-top: 0.25rem;
}
.record_wrap .graph_data .ranking_list {
  margin-bottom: 1.5rem;
}
.record_wrap .graph_data .ranking_list .ranking_data {
  padding: 0.25rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.record_wrap .graph_data .ranking_list .ranking_data .no {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  margin-right: 0.25rem;
  color: #9F9F9F;
  width: 1.75rem;
}
.record_wrap .graph_data .ranking_list .ranking_data .img {
  width: 2.375rem;
  height: 2.375rem;
  background: #F5F5F5 url(../images/icon/user.svg) no-repeat;
  background-position: center bottom;
  border-radius: 50%;
  background-size: 2rem;
  margin-right: 0.5rem;
  overflow: hidden;
}
.record_wrap .graph_data .ranking_list .ranking_data .info {
  width: calc(100% - 7.6rem);
}
.record_wrap .graph_data .ranking_list .ranking_data .info .name {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.25rem;
  color: #9F9F9F;
}
.record_wrap .graph_data .ranking_list .ranking_data .info .name .icon {
  font-size: var(--span4-f);
  color: #00B400;
  display: inline-block;
  background: rgba(0, 180, 0, 0.05);
  margin-left: 0.125rem;
  line-height: 1;
  padding: 0.125rem 0.25rem;
}
.record_wrap .graph_data .ranking_list .ranking_data .info .per {
  width: 100%;
  height: 0.25rem;
  border-radius: 3rem;
  background-color: #F5F5F5;
  position: relative;
}
.record_wrap .graph_data .ranking_list .ranking_data .info .per .bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 3rem;
  background-color: #DFDFDF;
}
.record_wrap .graph_data .ranking_list .ranking_data .info .per .bar.bar1 {
  background-color: #FFC710;
}
.record_wrap .graph_data .ranking_list .ranking_data .info .per .bar.bar2 {
  background-color: #00B400;
}
.record_wrap .graph_data .ranking_list .ranking_data .time {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #747474;
  width: 2.5rem;
  text-align: right;
  padding-top: 1.25rem;
}
.record_wrap .graph_data .ranking_list .ranking_data.my .no, .record_wrap .graph_data .ranking_list .ranking_data.my .name {
  color: #2F2F2F;
}
.record_wrap .graph_data .ranking_list .btn_wrap {
  padding: 1rem 0 0;
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
}
.record_wrap .graph_data .ranking_list .more {
  display: none;
}
.record_wrap .graph_data .ranking_none {
  padding: 1.5rem 0;
}
.record_wrap .graph_data .ranking_none .txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  text-align: center;
}
.record_wrap .graph_data .ranking_none + .btn_b {
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
}
.record_wrap #datepicker {
  padding: 1rem 1rem 0;
}
@media (max-device-width: 359px) {
  .record_wrap #datepicker {
    padding: 1rem 0.25rem 0;
  }
}
@media (max-device-width: 320px) {
  .record_wrap #datepicker {
    padding: 1rem 0rem 0;
  }
}
.record_wrap #datepicker .ui-datepicker-header {
  padding: 0;
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.record_wrap #datepicker .ui-datepicker-header .ui-datepicker-title {
  display: none;
}
.record_wrap #datepicker .ui-datepicker-header .ui-icon-circle-triangle-w {
  cursor: pointer;
  position: relative;
}
@media (max-device-width: 359px) {
  .record_wrap #datepicker .ui-datepicker-header .ui-icon-circle-triangle-w {
    left: -0.5rem;
  }
}
.record_wrap #datepicker .ui-datepicker-header .ui-icon-circle-triangle-e {
  cursor: pointer;
  position: relative;
}
@media (max-device-width: 359px) {
  .record_wrap #datepicker .ui-datepicker-header .ui-icon-circle-triangle-e {
    right: -0.5rem;
  }
}
.record_wrap #datepicker .ui-datepicker-calendar th {
  color: #9F9F9F;
  font-size: var(--span3-f);
}
.record_wrap #datepicker .ui-datepicker-calendar td {
  padding: 0.375rem 0.25rem;
}
.record_wrap #datepicker .ui-datepicker-calendar .ui-state-default {
  width: 2rem;
  aspect-ratio: 1;
  border-radius: 50%;
  z-index: 1;
}
@media (max-device-width: 359px) {
  .record_wrap #datepicker .ui-datepicker-calendar .ui-state-default {
    width: 8.9136vw;
  }
}
.record_wrap #datepicker .ui-datepicker-calendar .ui-state-default::after {
  content: "";
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  width: 1.5rem;
  aspect-ratio: 1;
  background: #fff;
  z-index: -1;
}
@media (max-device-width: 359px) {
  .record_wrap #datepicker .ui-datepicker-calendar .ui-state-default::after {
    width: 7.2423vw;
  }
}
.record_wrap #datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) .ui-state-default,
.record_wrap #datepicker .ui-datepicker-calendar .ui-datepicker-today .ui-state-default {
  background: conic-gradient(#F5F5F5 0deg, #F5F5F5 72deg);
  color: #C9C9C9;
}
.record_wrap #datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) .ui-state-default.cal_g1,
.record_wrap #datepicker .ui-datepicker-calendar .ui-datepicker-today .ui-state-default.cal_g1 {
  background: conic-gradient(#FFC710 216deg, #F5F5F5 216deg);
}
.record_wrap #datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) .ui-state-default.cal_g2,
.record_wrap #datepicker .ui-datepicker-calendar .ui-datepicker-today .ui-state-default.cal_g2 {
  background: conic-gradient(#00B400 324deg, #F5F5F5 324deg);
}
.record_wrap #datepicker .ui-datepicker-calendar .ui-state-default.ui-state-active {
  color: #2F2F2F;
}
.record_wrap #datepicker .ui-datepicker-calendar .ui-state-default.ui-state-active::after {
  background: #fff;
}
.record_wrap .mission_check {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  background-color: #F5F5F5;
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0.75rem 0 0.5rem;
}
.record_wrap .mission_check .check_w {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.record_wrap .mission_check .check_w .circle {
  width: 3.625rem;
  aspect-ratio: 1;
  border: 2px solid #DFDFDF;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #C9C9C9;
  background: #fff;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.record_wrap .mission_check .check_p {
  text-align: center;
  color: #C9C9C9;
  font-size: var(--span2-f);
  width: 5.25rem;
}
.record_wrap .mission_check .check_p .btn_s {
  margin-top: 0.25rem;
  display: none;
}
.record_wrap .mission_check .check_p.cmpl_c p {
  color: #00B400;
}
.record_wrap .mission_check .check_p.cmpl_c .btn_s {
  display: inline-block;
}
.record_wrap .mission_check.cmpl {
  background: rgba(0, 180, 0, 0.05);
}
.record_wrap .mission_check.cmpl .check_w .cmpl_c {
  border-color: #00B400;
  color: #00B400;
}
.record_wrap .mission_list .list_item {
  padding-top: 0.625rem;
  font-size: var(--span2-f);
  color: #9F9F9F;
  padding-left: 1.25rem;
  position: relative;
}
.record_wrap .mission_list .list_item::before {
  content: "";
  width: 1rem;
  aspect-ratio: 1;
  border: 0.25rem solid #DFDFDF;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 0.55rem;
}
.record_wrap .mission_list .list_item .primary {
  display: none;
  padding-left: 0.25rem;
}
.record_wrap .mission_list .list_item.ing {
  background: url(../images/icon/right.svg) no-repeat right center;
}
.record_wrap .mission_list .list_item.done {
  color: #2F2F2F;
}
.record_wrap .mission_list .list_item.done::before {
  border: 0.25rem solid #00B400;
}
.record_wrap .mission_list .list_item.done .primary {
  display: inline-block;
}
.record_wrap .day_mission {
  padding-top: 0.625rem;
}
.record_wrap .day_mission .day_item {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  padding: 1.3125rem 1rem;
  background: #F5F5F5 url(../images/icon/icon_sun.svg) no-repeat;
  background-position: 1rem 1.25rem;
  padding-left: 2.75rem;
  background-size: 1.25rem;
  margin: 0.375rem 0 0;
}
@media (max-device-width: 320px) {
  .record_wrap .day_mission .day_item {
    padding-left: 2.5rem;
    background-position: 1rem 1.125rem;
  }
}
.record_wrap .day_mission .day_item .day_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.record_wrap .day_mission .day_item .day_info .time {
  color: #2F2F2F;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.record_wrap .day_mission .day_item .day_info .time .gray02 {
  margin-left: 0.5rem;
}
.record_wrap .day_mission .day_item .day_info .check {
  padding-left: 1.5rem;
  text-align: right;
  color: #9F9F9F;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
}
@media (max-device-width: 320px) {
  .record_wrap .day_mission .day_item .day_info .check {
    padding-left: 1.25rem;
  }
}
.record_wrap .day_mission .day_item .day_img {
  margin-top: 0.75rem;
  border-radius: 0.25rem;
  overflow: hidden;
  display: none;
}
.record_wrap .day_mission .day_item.cmpl {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/icon_sun.svg) no-repeat;
  background-position: 1rem 1.25rem;
  background-size: 1.25rem;
}
@media (max-device-width: 320px) {
  .record_wrap .day_mission .day_item.cmpl {
    background-position: 1rem 1.125rem;
  }
}
.record_wrap .day_mission .day_item.cmpl .day_info .check {
  color: #00B400;
}
.record_wrap .day_mission .day_item.cmpl.cmpl_img .day_info .check {
  background: url(../images/icon/camera_green.svg) no-repeat left center;
}
.record_wrap .day_mission .day_item.cmpl.cmpl_img .day_img {
  display: block;
}
.record_wrap .day_mission .day_item.pm {
  background: #F5F5F5 url(../images/icon/icon_moon.svg) no-repeat;
  background-position: 1rem 1.25rem;
  background-size: 1.25rem;
}
@media (max-device-width: 320px) {
  .record_wrap .day_mission .day_item.pm {
    background-position: 1rem 1.125rem;
  }
}
.record_wrap .day_mission .day_item.pm.cmpl {
  background: rgba(0, 180, 0, 0.05) url(../images/icon/icon_moon.svg) no-repeat;
  background-position: 1rem 1.25rem;
  background-size: 1.25rem;
}
@media (max-device-width: 320px) {
  .record_wrap .day_mission .day_item.pm.cmpl {
    background-position: 1rem 1.125rem;
  }
}
.record_wrap .result_list {
  padding: 0.75rem 0 1.5rem;
}
.record_wrap .result_list .list_item {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  margin: 0.75rem 0 0;
  border-radius: 1rem;
  padding: 1.25rem;
  background: url(../images/icon/radioBtn_off.svg) no-repeat;
  background-position: calc(100% - .75rem) 0.75rem;
}
.record_wrap .result_list .list_item .point_type {
  margin-bottom: 0.5625rem;
}
.record_wrap .result_list .list_item .point_type .point {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  color: #00B400;
  margin-right: 0.25rem;
}
.record_wrap .result_list .list_item .point_type .point.yellow {
  color: #FFC710;
}
.record_wrap .result_list .list_item .point_type .point.red {
  color: #F44432;
}
.record_wrap .result_list .list_item .infobox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  margin: 0.5rem 0;
  background-color: #F5F5F5;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  padding: 0.5rem 0.75rem;
}
.record_wrap .result_list .list_item.select {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/radioBtn_on.svg) no-repeat;
  background-position: calc(100% - .75rem) 0.75rem;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.record_wrap .result_list .list_item.select .infobox {
  background-color: #fff;
}
.record_wrap .result_list .linktxt {
  display: block;
  margin-top: 1rem;
  text-align: center;
}

/* ---------------------- 홈 ------------------- */
.today_wrap {
  padding: 1rem 0.25rem;
}
.today_wrap .cardround {
  border-radius: 1rem;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
.today_wrap .cardround .flex_block {
  width: 50%;
}
.today_wrap .cardround .flex_block .h3_f {
  margin-top: 0.25rem;
}

.today_list {
  padding: 2rem 1.25rem 1.5rem;
  width: calc(100% + 2rem);
  -webkit-transform: translate(-1rem);
          transform: translate(-1rem);
  position: relative;
  z-index: 1;
}
.today_list .today_blank {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 70.5svh;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  padding-bottom: 10svh;
}
.today_list .today_blank button {
  margin-top: 0.5rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.today_list .list_block .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  position: relative;
  margin-bottom: 0.75rem;
}
.today_list .list_block .list_none {
  text-align: center;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  padding: 1.25rem 0 3.5rem;
}
.today_list .list_block .list_none .btn_s {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0.5rem auto 0;
  color: #747474;
}
.today_list .list_block .list_none .today_img {
  width: 2.625rem;
  height: 2.625rem;
  margin: 0 auto 1rem;
}
.today_list .list_block .list_item {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  margin: 0 0 0.5rem;
  background: #fff;
  padding: 1.375rem 1.25rem 1.375rem 3.5rem;
  background-size: 2rem;
  background-position: 1rem center;
  background-repeat: no-repeat;
}
@media (max-device-width: 359px) {
  .today_list .list_block .list_item {
    background-size: 8.9136vw;
  }
}
.today_list .list_block .list_item.time_sun {
  background-image: url(../images/icon/icon_sun.svg);
}
.today_list .list_block .list_item.time_moon {
  background-image: url(../images/icon/icon_moon.svg);
}
.today_list .list_block .list_item:last-child {
  margin-bottom: 3.125rem;
}
.today_list .list_block .list_item .time {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.5rem;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.today_list .list_block .list_item .time .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin: 0;
  padding-right: 0.25rem;
}
.today_list .list_block .list_item .time .s_icon {
  background: #F5F5F5;
  color: #9F9F9F;
  font-size: var(--span4-f);
  padding: 0.125rem 0.25rem;
  margin-left: 0.5rem;
}
.today_list .list_block .list_item .time .s_icon.s_primary {
  background: rgba(0, 180, 0, 0.1);
  color: #00B400;
}
.today_list .list_block .list_item .pre {
  font-size: var(--span3-f);
  color: #9F9F9F;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
}
.today_list .list_block.today_done .list_item .time .title {
  color: #9F9F9F;
}
.today_list .list_block.today_done .list_item .time.time_sun {
  background: url(../images/icon/sun_gr.svg) no-repeat;
  background-position: left center;
  background-size: 1.25rem;
}
.today_list .list_block.today_done .list_item .time.time_moon {
  background: url(../images/icon/moon_gr.svg) no-repeat;
  background-position: left center;
  background-size: 1.25rem;
}
.today_list .list_block .todaydel {
  padding-bottom: 2.625rem;
}
.today_list .list_block .todaydel .todaydel_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.today_list .list_block .todaydel .todaydel_list .delBtn {
  display: block;
  background: url(../images/icon/minus_black.svg) no-repeat;
  background-size: cover;
  width: 2rem;
  height: 2rem;
}
.today_list .list_block .todaydel .todaydel_list .list_item {
  background: #fff url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  width: 100%;
}
.today_list .list_block .todaydel .todaydel_list .list_item:last-child {
  margin-bottom: 0;
}
.today_list .list_block .todaydel .todaydel_list .list_item.time_sun::before {
  content: "";
  background: url(../images/icon/icon_sun.svg) no-repeat;
  background-size: cover;
  width: 2rem;
  height: 2rem;
  position: absolute;
  left: 1rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media (max-device-width: 359px) {
  .today_list .list_block .todaydel .todaydel_list .list_item.time_sun::before {
    width: 8.9136vw;
    height: 8.9136vw;
  }
}
.today_list .list_block .todaydel .todaydel_list .list_item.time_moon::before {
  content: "";
  background: url(../images/icon/icon_moon.svg) no-repeat;
  background-size: cover;
  width: 2rem;
  height: 2rem;
  position: absolute;
  left: 1rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media (max-device-width: 359px) {
  .today_list .list_block .todaydel .todaydel_list .list_item.time_moon::before {
    width: 8.9136vw;
    height: 8.9136vw;
  }
}
.today_list .editBtn {
  position: absolute;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  right: 0;
  top: -0.25rem;
}
.today_list .editBtn.editbtn2 {
  right: 3rem;
}
@media (max-device-width: 320px) {
  .today_list .editBtn.editbtn2 {
    right: 14.3333vw;
  }
}
.today_list .today_more {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #9F9F9F;
  text-align: center;
}
.today_list .home_today {
  padding-top: 2rem;
}
.today_list .home_today .list_none {
  padding: 1.75rem 1.25rem;
  background: #fff;
  border-radius: 0.5rem;
  margin-top: 1rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.today_list .home_today .list_none .btn_b {
  padding: 0.75rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  border-radius: 0.25rem;
  margin-top: 0.75rem;
}
.today_list .home_today .list_item {
  margin-top: 0.75rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.today_list .home_today .list_item:last-child {
  margin-bottom: 1rem;
}
.today_list .home_today .today_cpl {
  background: #00B400 url(../images/icon/today_cmlt.svg) no-repeat;
  background-position: right bottom;
  background-size: 7.875rem;
  border-radius: 0.5rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  width: 100%;
  height: 9.375rem;
  color: #fff;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  padding: 1.5rem;
}

/* ---------- 레벨 히스토리 ------------- */
.level_top {
  padding: 2rem 0 2rem;
  text-align: center;
  overflow: hidden;
}
.level_top .level_icon {
  width: 5rem;
  margin: 0 auto 0.625rem;
}
.level_top .level_icon img {
  width: 100%;
}
@media (max-device-width: 359px) {
  .level_top .level_icon {
    width: 22.2841vw;
  }
}
.level_top .bar_wrap {
  width: 100%;
  padding: 0.5rem 1.5rem 0;
  position: relative;
}
.level_top .bar_wrap .bar_bg {
  width: 100%;
  background: #F5F5F5;
  height: 0.375rem;
  border-radius: 3rem;
  position: relative;
}
.level_top .bar_wrap .bar_bg .bar_g {
  min-width: 0.375rem;
  height: 100%;
  border-radius: 3rem;
  background: #00B400;
}
.level_top .bar_wrap .bar_bg .next_icon {
  position: absolute;
  top: -2rem;
  right: -0.6875rem;
  width: 1.375rem;
}
.level_top .bar_wrap .bar_bg .next_icon img {
  width: 100%;
}
.level_top .bar_wrap .bar_date {
  position: relative;
}
.level_top .bar_wrap .bar_date .first_lv {
  position: absolute;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #00B400;
  left: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: -20px;
}
.level_top .bar_wrap .bar_date .last_lv {
  position: absolute;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #00B400;
  right: 0;
  bottom: -20px;
}

.level_block {
  padding: 1rem 1.25rem 2rem;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.level_block .level_list {
  margin-top: 0.75rem;
}
.level_block .level_list .level_info {
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin: 1rem 0;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #fff;
  padding: 1.75rem 1.5rem 1.125rem;
  margin: 0.75rem 0;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  border: 1px solid transparent;
}
.level_block .level_list .level_data .span1_fb {
  padding-bottom: 0.25rem;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  gap: 2px;
}
.level_block .level_list .level_data .rwd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0.5rem;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  gap: 0.625rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.level_block .level_list .level_data .cash {
  padding-left: 1.5rem;
  background: url(../images/icon/icon_cash.svg) no-repeat;
  background-size: 1.75rem;
  background-position: -0.25rem center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.level_block .level_list .level_data .ticket {
  padding-left: 1.75rem;
  background: url(../images/icon/icon_ticket.svg) no-repeat;
  background-size: 1.625rem;
  background-position: -1px center;
}
.level_block .level_list .level_data .sale {
  padding-left: 2.75rem;
  background: url(../images/icon/fitple_sale.svg) no-repeat;
  background-size: 2.5rem;
  background-position: -1px center;
}
.level_block .level_list .level_img {
  margin-right: 0.75rem;
  width: 3.25rem;
}
.level_block .level_list .level_img img {
  width: 100%;
}
@media (max-device-width: 359px) {
  .level_block .level_list .level_img {
    width: 14.4847vw;
    margin-right: 3.3426vw;
  }
}
.level_block .level_list .level_none {
  background: rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: none;
          box-shadow: none;
  border-color: #DFDFDF;
}
.level_block .level_list .level_none .p5_f.primary {
  display: none;
}
.level_block .level_list .level_none .system_yellow {
  color: #C9C9C9;
}

.level_cpl {
  background: #111;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  color: #fff;
  padding-bottom: 6.25rem;
  height: 100svh;
  max-height: 780px;
}
.level_cpl .level_reward {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2rem;
  position: relative;
}
.level_cpl .level_reward .re_cash {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  line-height: 1;
}
.level_cpl .level_reward .re_cash img {
  margin-right: 0.25rem;
  width: 1.25rem;
}
.level_cpl .level_reward .re_bonus {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #FFC710;
  position: absolute;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  top: 1.625rem;
  left: 0;
}
.level_cpl .level_reward .re_ticket {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.level_cpl .level_reward .re_ticket img {
  margin-right: 0.25rem;
}
.level_cpl .level_reward .re_sale {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.level_cpl .level_reward .re_sale img {
  margin-right: 0.25rem;
}
.level_cpl .level_t {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin: 4.625rem 0 0.625rem;
}
.level_cpl .level_s {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #DFDFDF;
}
.level_cpl .top_type {
  border-top: 1px solid #FFC710;
  border-bottom: 1px solid #FFC710;
  color: #FFC710;
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  padding: 5px;
  margin: 0 auto;
  max-width: 14.125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.level_cpl .top_type.type_down {
  border-color: #9F9F9F;
  color: #9F9F9F;
}
.level_cpl .level_ani {
  position: relative;
}
.level_cpl .level_ani .ani_img.circle_ani .img {
  -webkit-animation: lv_circle 0.5s linear;
          animation: lv_circle 0.5s linear;
}
.level_cpl .level_ani .ani_img.line_ani .img {
  -webkit-animation: lv_line 0.8s linear;
          animation: lv_line 0.8s linear;
}
.level_cpl .level_ani .ani_img .img {
  width: 6.25rem;
  margin: 0 auto;
  padding: 5.875rem 0 2.1875rem;
}
@media (max-device-width: 359px) {
  .level_cpl .level_ani .ani_img .img {
    width: 27.8552vw;
  }
}
.level_cpl .level_ani .ani_img .img img {
  width: 100%;
}
.level_cpl .level_ani .ani_img .lv_circle {
  position: absolute;
  top: -1.5rem;
  max-width: 23.75rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: -1;
  -webkit-animation: lv_circle 1s linear;
          animation: lv_circle 1s linear;
}
.level_cpl .level_ani .ani_img .lv_line {
  position: absolute;
  top: 50%;
  max-width: 23.75rem;
  left: 50%;
  -webkit-transform: translate(-66%, -67%);
          transform: translate(-66%, -67%);
  z-index: -1;
  -webkit-animation: lv_line 0.3s linear;
          animation: lv_line 0.3s linear;
}
.level_cpl .btn_fix .btn_b {
  background-color: #2F2F2F;
  color: #fff;
}

/* -- 인증하기 -- */
.certification_wrap {
  padding-top: var(--header-height);
  background-color: #111;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.certification_wrap .cer_top {
  background-color: #2F2F2F;
  padding: 1rem 1.25rem;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9;
}
.certification_wrap .cer_top .time {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #fff;
  padding-left: 1.75rem;
  margin-bottom: 0.5625rem;
}
.certification_wrap .cer_top .time.time_sun {
  background: url(../images/icon/icon_sun.svg) no-repeat;
  background-size: 1.25rem;
  background-position: left center;
}
.certification_wrap .cer_top .time.time_moon {
  background: url(../images/icon/icon_moon.svg) no-repeat;
  background-size: 1.25rem;
  background-position: left center;
}
.certification_wrap .cer_top .closeBtn {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
}
.certification_wrap .myslide .swiper-slide {
  background-color: #fff;
  min-height: 70svh;
}
.certification_wrap .evt_con {
  padding-top: 20svh;
  position: relative;
}
.certification_wrap .evt_con .profile_pic {
  width: 6.5rem;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  position: relative;
}
@media (max-device-width: 359px) {
  .certification_wrap .evt_con .profile_pic {
    width: 28.9694vw;
  }
}
.certification_wrap .evt_con .profile_pic .img {
  overflow: hidden;
  border-radius: 50%;
  aspect-ratio: 1;
  z-index: 2;
  position: relative;
  border: 1px solid #111;
}
.certification_wrap .evt_con .profile_pic .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.certification_wrap .evt_con .profile_pic .drag_circle {
  position: absolute;
  width: 100%;
  aspect-ratio: 1;
  background: #fff;
  border-radius: 50%;
  top: 0;
  z-index: 1;
}
.certification_wrap .evt_con .profile_pic.drag_ani .img {
  border: 1px solid rgba(255, 255, 255, 0.5);
  -webkit-box-shadow: 0 0 15px #00B400;
          box-shadow: 0 0 15px #00B400;
}
.certification_wrap .evt_con .profile_pic.drag_ani .drag_circle {
  -webkit-animation: dragcircle 1.5s linear infinite;
          animation: dragcircle 1.5s linear infinite;
}
.certification_wrap .evt_con .drag_img {
  position: absolute;
  bottom: 3.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 2;
}
@media (max-device-width: 359px) {
  .certification_wrap .evt_con .drag_img {
    width: 15.5989vw;
  }
}
.certification_wrap .evt_con .drag_img img {
  -webkit-animation: dragpill 1s linear infinite;
          animation: dragpill 1s linear infinite;
  position: relative;
}
.certification_wrap .evt_con .drag_txt {
  text-align: center;
  color: #fff;
  padding-top: 28svh;
}
.certification_wrap .evt_con .drag_bg {
  position: absolute;
  top: 38svh;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.certification_wrap .evt_con .drag_bg .swipebg {
  width: 2.375rem;
  height: 20svh;
  background: -webkit-gradient(linear, left top, left bottom, from(#2F2F2F), color-stop(75%, rgba(47, 47, 47, 0)));
  background: linear-gradient(180deg, #2F2F2F 0%, rgba(47, 47, 47, 0) 75%);
  border-radius: 3rem 3rem 0 0;
  display: block;
}
@media (max-device-width: 359px) {
  .certification_wrap .evt_con .drag_bg .swipebg {
    width: 10.585vw;
  }
}
.certification_wrap .evt_con .drag_bg .drag_s {
  position: absolute;
  left: 3.3125rem;
  width: 2rem;
  bottom: 2.5rem;
}
@media (max-device-width: 359px) {
  .certification_wrap .evt_con .drag_bg .drag_s {
    width: 8.9136vw;
  }
}
.certification_wrap .evt_con .drag_bg .drag_s img {
  width: 100%;
  -webkit-animation: draghand 1s ease-in-out infinite;
          animation: draghand 1s ease-in-out infinite;
  position: relative;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.certification_wrap .camera_cer {
  padding: 1rem 1.25rem 2rem;
}
.certification_wrap .camera_cer .img {
  margin-bottom: 0.5rem;
}
.certification_wrap .camera_cer .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #fff;
  margin-bottom: 0.75rem;
}
.certification_wrap .camera_cer .sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #747474;
}
.certification_wrap .camera_smaple {
  background: url(../images/cam_sample.png) no-repeat;
  background-size: cover;
  background-position: center;
  aspect-ratio: 1;
  overflow: hidden;
  position: relative;
}
.certification_wrap .camera_smaple .logo {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
}
.certification_wrap .camera_smaple .date {
  position: absolute;
  bottom: 1.125rem;
  text-align: center;
  width: 100%;
  color: #fff;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
}
.certification_wrap .camera_smaple .cam_overlay {
  position: relative;
  z-index: 2;
}
.certification_wrap .cer_con {
  padding-top: 12svh;
  position: relative;
}
.certification_wrap .cer_con .cer_title {
  text-align: center;
  color: #fff;
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 1.5rem;
}
.certification_wrap .cer_con .cam_icon {
  width: 1.25rem;
  margin-left: calc(50% - .625rem);
  margin-bottom: 0.5rem;
}
.certification_wrap .cer_con .confetti_ani {
  width: 100%;
  position: absolute;
  top: 10svh;
  z-index: 0;
  max-width: 360px;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.certification_wrap .cer_con .first_ani {
  width: 12.5rem;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-bottom: 1.5rem;
  margin-top: 10svh;
}
@media (max-device-width: 359px) {
  .certification_wrap .cer_con .first_ani {
    width: 55.7103vw;
  }
}
.certification_wrap .cer_con .time_info {
  color: #fff;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  text-align: center;
  padding-left: 1.75rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-bottom: 0.5rem;
  line-height: 1.25rem;
}
.certification_wrap .cer_con .time_info.time_sun {
  background: url(../images/icon/icon_suns.svg) no-repeat;
  background-size: contain;
  background-position: left center;
}
.certification_wrap .cer_con .time_info.time_moon {
  background: url(../images/icon/icon_moons.svg) no-repeat;
  background-size: contain;
  background-position: left center;
}
.certification_wrap .cer_con .cer_pre {
  font-size: var(--span3-f);
  color: #747474;
  padding: 0 1.25rem;
  text-align: center;
}
.certification_wrap .circle_ani {
  width: 10.875rem;
  aspect-ratio: 1;
  border-radius: 50%;
  padding: 0.8125rem;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-bottom: 1rem;
  position: relative;
}
.certification_wrap .circle_ani .pic_img {
  overflow: hidden;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 7px solid #000;
}
.certification_wrap .circle_ani .pic_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.certification_wrap .circle_ani lottie-player {
  position: absolute;
  top: 0;
  left: 0;
}
@media (max-device-width: 359px) {
  .certification_wrap .circle_ani {
    width: 48.468vw;
    padding: 3.6212vw;
  }
}
.certification_wrap .circle_p {
  --p: 100;
  --b: .5625rem;
  --c:#00B400;
  --w: 10.875rem;
  inset: 0;
  width: 10.875rem;
  aspect-ratio: 1;
  border-radius: 50%;
  padding: 0.5625rem;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-bottom: 1rem;
  position: relative;
  background: radial-gradient(farthest-side, var(--c) 98%, #0000) top/var(--b) var(--b) no-repeat, conic-gradient(var(--c) calc(var(--p)*1%), #F5F5F5 0);
  -webkit-animation: roundborder 1s 0.5s both;
          animation: roundborder 1s 0.5s both;
}
@media (max-device-width: 359px) {
  .certification_wrap .circle_p {
    --b: 2.5070vw;
    --w: 48.4680vw;
    width: 48.468vw;
    padding: 2.507vw;
  }
}
.certification_wrap .circle_p .pic_img {
  overflow: hidden;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 7px solid #000;
}
.certification_wrap .circle_p::before {
  content: "";
  display: block;
  position: absolute;
  width: 0.5625rem;
  aspect-ratio: 1;
  background-color: #00B400;
  top: 0;
  border-radius: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media (max-device-width: 359px) {
  .certification_wrap .circle_p::before {
    width: 2.507vw;
  }
}
.certification_wrap .circle_p::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.5625rem;
  aspect-ratio: 1;
  background-color: #00B400;
  top: 0;
  border-radius: 50%;
  left: 50%;
  inset: calc(50% - var(--b)/2);
  -webkit-transform: rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
          transform: rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}
@media (max-device-width: 359px) {
  .certification_wrap .circle_p::after {
    width: 2.507vw;
  }
}
.certification_wrap .circle_p.prog_none, .certification_wrap .circle_p.prog_none::before, .certification_wrap .circle_p.prog_none::after {
  background: #F5F5F5 !important;
}
.certification_wrap .circle_p.bg_none, .certification_wrap .circle_p.bg_none::before, .certification_wrap .circle_p.bg_none::after {
  background: transparent !important;
}
.certification_wrap .mycer_box {
  background-color: #fff;
  border-radius: 0.5rem;
  height: calc(100svh - 3rem);
  position: relative;
  top: -1.5rem;
  padding: 1rem 0;
}
.certification_wrap .mycer_box.del_f {
  background-color: #111;
}
.certification_wrap .top_profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0.875rem;
  position: relative;
  padding: 0 0.5rem;
}
.certification_wrap .top_profile .img {
  width: 1.875rem;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.5rem;
}
.certification_wrap .top_profile .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.certification_wrap .top_profile .s_icon {
  font-size: var(--span4-f);
  color: #747474;
  background-color: #F5F5F5;
  padding: 0.125rem 0.25rem;
  margin-left: 0.25rem;
}
.certification_wrap .top_profile .s_icon.icon_done {
  background-color: rgba(0, 180, 0, 0.1);
  color: #00B400;
}
.certification_wrap .top_profile .closeBtn {
  position: absolute;
  top: 0;
  right: 0.75rem;
}
.certification_wrap .del_msg {
  text-align: center;
  margin-top: 37svh;
}
.certification_wrap .del_msg .txt {
  color: #fff;
  font-size: var(--span1-f);
  margin-bottom: 0.5rem;
}
.certification_wrap .center_con {
  margin: 10svh auto 0;
}
.certification_wrap .center_con .circle_p {
  -webkit-animation: none;
          animation: none;
  position: relative;
}
.certification_wrap .center_con .circle_p .pic_img {
  border-color: #fff;
}
.certification_wrap .center_con .circle_p .pic_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.certification_wrap .center_con .circle_p .lv_icon {
  position: absolute;
  width: 3.625rem;
  bottom: -0.75rem;
  right: 0;
}
@media (max-device-width: 359px) {
  .certification_wrap .center_con .circle_p .lv_icon {
    width: 16.156vw;
  }
}
.certification_wrap .center_con .monthly {
  width: 100%;
  -webkit-transform: initial;
          transform: initial;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.certification_wrap .center_con .info_txt {
  margin-top: 2.1875rem;
  text-align: center;
}
.certification_wrap .center_con .info_txt .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  margin-bottom: 1rem;
}
.certification_wrap .center_con .info_txt .btn_s {
  display: inline-block;
  margin-top: 1rem;
  font-weight: initial;
}
.certification_wrap .picslide_img {
  aspect-ratio: 1;
  overflow: hidden;
  margin-top: 10svh;
}
.certification_wrap .picslide_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.certification_wrap .prograss_bar {
  width: calc(100% - 1rem);
  background-color: #F5F5F5;
  height: 2px;
  left: 0.5rem;
  position: absolute;
  top: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2px;
}
.certification_wrap .prograss_bar .bar {
  left: 0;
  width: 100%;
  height: 2px;
  position: relative;
}
.certification_wrap .prograss_bar .bar::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  -webkit-animation: prograssbar 5s linear;
          animation: prograssbar 5s linear;
  background-color: #00B400;
  top: 0;
}
.certification_wrap .btn_wrap {
  position: absolute;
  bottom: 0;
  z-index: 3;
}
.certification_wrap .claps_ani {
  position: absolute;
  z-index: 2;
  bottom: 0;
  width: 100%;
}
.certification_wrap .msg_wrap {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-left: 2.5rem;
}
.certification_wrap .msg_wrap .fire_ani {
  position: absolute;
  left: -1.5rem;
  top: -1.875rem;
}
.certification_wrap .msg_wrap .meg {
  background-color: #00B400;
  color: #fff;
  padding: 0.375rem 0.625rem;
  border-radius: 3rem;
}
.certification_wrap .closeBtn {
  position: absolute;
  top: 1rem;
  right: 1rem;
}
.certification_wrap .close_tBtn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  color: #9F9F9F;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.certification_wrap .clap_ani {
  width: 10.125rem;
  margin: 10svh auto 1.5rem;
}
.certification_wrap .clg_txt {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #fff;
  text-align: center;
}
.certification_wrap .cer_water {
  text-align: center;
  margin-top: 30svh;
}
.certification_wrap .cer_water .txt {
  color: #fff;
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.certification_wrap .cer_water .img_con {
  background: transparent;
  position: relative;
  z-index: 10;
}
.certification_wrap .cer_water .img_con .img {
  width: 8.4375rem;
  height: 8.4375rem;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin: 4.875rem auto 0;
}
.certification_wrap .cer_water .img_con .img img {
  width: 2.4375rem;
}
.certification_wrap .cer_water .img_con.drag_ani .img {
  position: relative;
  z-index: 5;
}
.certification_wrap .cer_water .img_con.drag_ani .drag_circle {
  -webkit-animation: dragcircle 1.5s linear infinite;
          animation: dragcircle 1.5s linear infinite;
  background: rgba(255, 255, 255, 0.2);
  width: 8.4375rem;
  aspect-ratio: 1;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: -1;
  -webkit-transform-origin: left;
          transform-origin: left;
}
.certification_wrap .full_cover {
  position: fixed;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
  z-index: 9;
}
.certification_wrap .full_cover lottie-player {
  position: absolute;
  left: 0;
  bottom: 0%;
  height: auto;
  width: 240%;
}
.certification_wrap .full_cover .after_bg {
  height: 100%;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #00B400;
  -webkit-transition: all 3s;
  transition: all 3s;
  -webkit-animation: fullcover 3s ease-in-out;
          animation: fullcover 3s ease-in-out;
}
.certification_wrap .clg_cer {
  color: #fff;
  text-align: center;
  width: 100%;
  position: absolute;
  top: calc(50% - 4rem);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.certification_wrap .clg_cer .top {
  margin: 0 auto;
}
.certification_wrap .clg_cer .top .img {
  width: 5.625rem;
  margin: 0 auto 0.75rem;
}
@media (max-device-width: 359px) {
  .certification_wrap .clg_cer .top .img {
    width: 25.0696vw;
  }
}
.certification_wrap .clg_cer .img_center {
  margin: 7svh auto 10svh;
}
.certification_wrap .clg_cer .img_center .img {
  width: 9.5rem;
  margin: 0 auto;
}
@media (max-device-width: 359px) {
  .certification_wrap .clg_cer .img_center .img {
    width: 42.3398vw;
  }
}
.certification_wrap .clg_cer .img_center .reward {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  padding-left: 1.8125rem;
  background: url(../images/icon/icon_ticket.svg) no-repeat;
  background-size: 1.5rem;
  background-position: left center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 1.5rem auto 0;
  line-height: 1;
}
.certification_wrap .clg_cer .clg_bottom .h2_f {
  margin-bottom: 0.625rem;
}

.chat_write {
  position: fixed;
  bottom: 1.5rem;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.8125rem 1rem;
  border-top: 1px solid #F5F5F5;
  background: #fff;
}
.chat_write .input_basic {
  width: calc(100% - 3.125rem);
}
.chat_write .senBtn {
  width: 2.5rem;
  height: 2.5rem;
}
.chat_write .bbpop {
  position: absolute;
  top: -3.125rem;
  left: 1.25rem;
  z-index: 1;
}

.msg_layer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: -1;
  opacity: 0;
}
.msg_layer .overlay {
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  z-index: 0;
  overflow: hidden;
}
.msg_layer.open {
  opacity: 1;
  z-index: 9;
}
.msg_layer .msg_tggle {
  margin: 15svh auto 5svh;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 0.5rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding: 0.375rem 0.5rem;
  gap: 0.375rem;
}
.msg_layer .msg_tggle .tab_link {
  font-size: var(--span2-f);
  color: #9F9F9F;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.msg_layer .msg_tggle .tab_link.active {
  background: #00B400;
  font-weight: var(--bold-f);
  color: #fff;
}
.msg_layer .msg_tab {
  position: absolute;
  width: 100%;
}
.msg_layer .msg_tab .emo_con {
  display: grid;
  grid-template-columns: repeat(3, 3.875rem);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 2rem 1.75rem;
}
.msg_layer .msg_tab .emo_con .msg_emo {
  background: rgba(0, 0, 0, 0.7);
  border-radius: 50%;
  width: 100%;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.msg_layer .msg_tab .emo_con .msg_emo:hover {
  background: rgba(0, 180, 0, 0.7);
}
@media (max-device-width: 359px) {
  .msg_layer .msg_tab .emo_con .msg_emo {
    font-size: 6.6852vw;
  }
}
@media (max-device-width: 359px) {
  .msg_layer .msg_tab .emo_con {
    grid-template-columns: repeat(3, 17.2702vw);
    gap: 8.9136vw 7.7994vw;
  }
}
.msg_layer .msg_tab .txt_con {
  display: grid;
  grid-template-columns: repeat(2, 8.875rem);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1.125rem 1rem;
}
.msg_layer .msg_tab .txt_con .msg_txt {
  font-size: var(--span1-f);
  color: #fff;
  padding: 0.75rem 0;
  text-align: center;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 3rem;
  -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
}
.msg_layer .msg_tab .txt_con .msg_txt:hover {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  background: rgba(0, 180, 0, 0.7);
}
@media (max-device-width: 359px) {
  .msg_layer .msg_tab .txt_con {
    grid-template-columns: repeat(2, 39.5543vw);
    gap: 5.0139vw 4.4568vw;
  }
}

@property --p {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
.certification_wrap + .btn_fix .next_txt {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #fff;
  margin-bottom: 0.75rem;
}
.certification_wrap + .btn_fix .next_info {
  padding: 0.875rem 1rem;
  border-radius: 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.certification_wrap + .btn_fix .next_info .time {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #fff;
  margin-right: 0.5rem;
  padding-left: 1.75rem;
}
.certification_wrap + .btn_fix .next_info.next_sun {
  background: #2F2F2F url(../images/icon/icon_sun.svg) no-repeat;
  background-size: 1.25rem;
  background-position: 1rem center;
}
.certification_wrap + .btn_fix .next_info.next_moon {
  background: #2F2F2F url(../images/icon/icon_moon.svg) no-repeat;
  background-size: 1.25rem;
  background-position: 1rem center;
}

.full_ani {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10;
}
.full_ani .fullpage_circle {
  display: block;
  position: absolute;
  width: 3rem;
  height: 3rem;
  background: #00B400;
  border-radius: 50%;
  left: calc(50% - 1.5rem);
  top: calc(50% - 1.5rem);
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: fullpage 2s linear;
          animation: fullpage 2s linear;
  opacity: 0;
}

.cam_modal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.cam_modal .sample_img {
  aspect-ratio: 1;
  overflow: hidden;
}
.cam_modal .sample_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* ------- 섭취알림전화 ----------- */
.call_wrap {
  background-color: #111;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.call_wrap .wtmark {
  position: absolute;
  top: 1rem;
  left: 1.25rem;
}
.call_wrap .call_txt {
  text-align: center;
  margin: 15svh auto 0;
  color: #fff;
}
.call_wrap .call_txt .img {
  margin: 0 auto 2rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  width: 2rem;
}
.call_wrap .btn_wrap {
  position: absolute;
  bottom: 5rem;
  width: 100%;
  padding: 0 3.6875rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (min-device-width: 480px) {
  .call_wrap .btn_wrap {
    padding: 0 5rem;
  }
}
.call_wrap .btn_wrap .call_btn {
  width: 4.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.call_wrap .btn_wrap .call_btn::after {
  content: "";
  position: absolute;
  font-size: var(--span2-f);
  color: #C9C9C9;
  bottom: -2.375rem;
}
.call_wrap .btn_wrap .call_btn.btn_red img {
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}
.call_wrap .btn_wrap .call_btn.btn_red::after {
  content: "거절";
}
.call_wrap .btn_wrap .call_btn.btn_basic::after {
  content: "응답";
}

.call_modal .modal_block {
  background-color: #111;
}
.call_modal .modal_block .modal_in {
  padding: 1.5rem 1.25rem 0;
}
.call_modal .modal_block .modal_top .btnClose {
  position: absolute;
  top: 1rem;
  right: 1rem;
}
.call_modal .modal_block .call_txt {
  text-align: center;
  color: #fff;
  margin: 1rem 0 0.5rem;
}
.call_modal .modal_block .call_txt .img {
  margin: 0 auto 1.5rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  width: 2rem;
}

/* ----------------- 홈 메인 --------------- */
.home_wrap {
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding: 0 1.25rem;
  position: relative;
  overflow-x: hidden;
}
.home_wrap.bg_black {
  background-color: #2F2F2F;
}
.home_wrap.bg_black .title {
  color: #fff;
}
.home_wrap.bg_primary {
  background-color: #00B400;
  color: #fff;
}
.home_wrap .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  padding-top: 2rem;
  position: relative;
}
.home_wrap .title .ms_cash {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  font-size: var(--span1-f);
  color: #00B400;
}
.home_wrap .title.ms_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.home_wrap .top_userlist {
  padding: 1.5rem 0 2.5rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  border-bottom: 0.5rem solid #F5F5F5;
}
.home_wrap .top_userlist .user_item {
  width: 3.875rem;
  height: 3.875rem;
  border-radius: 50%;
  padding: 0.125rem;
  position: relative;
  z-index: 1;
}
.home_wrap .top_userlist .user_item::before {
  content: "";
  width: 3.875rem;
  height: 3.875rem;
  display: block;
  border-radius: 50%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, #107110), to(#036803));
  background: linear-gradient(#107110 70%, #036803 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.home_wrap .top_userlist .user_item:first-child {
  margin-left: 1rem;
}
.home_wrap .top_userlist .user_item:last-child {
  margin-right: 1rem;
}
.home_wrap .top_userlist .user_item .img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid #fff;
  overflow: hidden;
  background: #747474 url(../images/home_my.png) no-repeat;
  background-size: cover;
  background-position: center center;
}
.home_wrap .top_userlist .user_item .img img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.home_wrap .top_userlist .user_item .name {
  text-align: center;
  font-size: var(--span4-f);
  margin-top: 0.5rem;
}
.home_wrap .top_userlist .user_item.addpic {
  border: 4px solid #F5F5F5;
  background: #F5F5F5 url(../images/icon/home_plus.svg) no-repeat;
  background-position: center;
}
.home_wrap .top_userlist .user_item.addpic::before {
  display: none;
}
.home_wrap .userpop {
  position: absolute;
  background: #00B400;
  top: 1.875rem;
  z-index: 2;
  font-size: var(--span3-f);
  padding: 0.75rem 2.25rem 0.75rem 0.75rem;
  border-radius: 0.5rem 0 0 0;
  left: 10.5rem;
  color: #fff;
}
.home_wrap .userpop .popClose {
  background: url(../images/icon/close_wt.svg) no-repeat;
  position: absolute;
  background-position: center;
  background-size: cover;
  width: 1.5rem;
  height: 1.5rem;
  display: block;
  right: 0.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.home_wrap .userpop::before {
  content: "◆";
  color: #00B400;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  font-size: 1rem;
  left: -0.3125rem;
}
.home_wrap .ms_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.home_wrap .ms_list .ms_item {
  width: 100%;
  border-radius: 0.75rem 0 0 0;
  background: #fff;
  padding: 1rem 0;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.home_wrap .ms_list .ms_item .ms_icon {
  border-radius: 50%;
  width: 2.625rem;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto;
}
.home_wrap .ms_list .ms_item .ms_icon img {
  width: 2rem;
}
@media (max-device-width: 359px) {
  .home_wrap .ms_list .ms_item .ms_icon img {
    width: 1.75rem;
  }
}
.home_wrap .ms_list .ms_item .txt {
  color: #9F9F9F;
  font-size: var(--span3-f);
  margin-top: 0.75rem;
  text-align: center;
}
.home_wrap .ms_list .ms_item.ms_clear .txt {
  color: #2F2F2F;
}
.home_wrap .ms_point {
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0.75rem;
  background: #fff url(../images/icon/right_bk.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  font-size: var(--span2-f);
  color: #9F9F9F;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.home_wrap .pic_cer {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 1rem 0 1.5rem;
  display: grid;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 2px;
  grid-template-columns: repeat(4, 4fr);
}
.home_wrap .home_tip {
  width: 100%;
  margin: 0.75rem 0 1rem;
}
.home_wrap .home_tip .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
}
.home_wrap .home_tip .swiper-wrapper a {
  border-radius: 0.5rem;
  padding: 1rem 1.25rem;
  display: block;
}
.home_wrap .home_tip .swiper-wrapper a .span1_fb {
  margin-bottom: 0.25rem;
}
.home_wrap .home_tip .swiper-wrapper a.home_b1 {
  background: #FFF8DE url(../images/icon/home_banner5.svg) no-repeat;
  background-position: calc(100% - 1.25rem) top;
}
.home_wrap .home_tip .swiper-wrapper a.home_b2 {
  background: #DEF7DE url(../images/icon/home_banner6.svg) no-repeat;
  background-position: calc(100% - 1.25rem) top;
}
.home_wrap .home_tip .swiper-wrapper a.home_b3 {
  background: #FFEAE6 url(../images/icon/home_banner3.svg) no-repeat;
  background-position: calc(100% - 1.25rem) top;
}
.home_wrap.home_banner {
  background: #F5F5F5;
  padding-top: 1rem;
}

.home_noti {
  color: #fff;
  font-size: var(--span3-f);
  padding: 0.75rem 1rem;
  background: #2F2F2F url(../images/icon/rightb_wt.svg) no-repeat;
  display: block;
  background-size: 1.25rem;
  background-position: calc(100% - 1rem) center;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.home_noti span {
  margin-right: 0.25rem;
}

.monthly {
  background: #fff;
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
  border-radius: 1.5rem 0 0 0;
  padding-bottom: 1.5rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  left: 0;
  top: 0;
}
.monthly .title {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  color: #00B400;
  padding: 1rem 1.25rem 0.75rem;
}
.monthly .calender {
  width: 100%;
  position: relative;
  z-index: 1;
}
.monthly .calender .week {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  padding: 0.25rem 0;
}
@media (min-device-width: 480px) {
  .monthly .calender .week {
    gap: 1.5rem;
  }
}
@media (max-device-width: 359px) {
  .monthly .calender .week {
    gap: 0.4rem;
  }
}
.monthly .calender .week .day {
  font-size: var(--span3-f);
  color: #9F9F9F;
  width: 2rem;
  text-align: center;
}
.monthly .calender .week .day.today {
  color: #2F2F2F;
}
.monthly .calender .week .week_item {
  width: 2rem;
  height: 2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  overflow: hidden;
}
.monthly .calender .week .week_item .date {
  --p: 100;
  --b: .3125rem;
  --c: #00B400;
  --w: 2rem;
  width: 2rem;
  aspect-ratio: 1;
  padding: 0;
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: radial-gradient(farthest-side, #DFDFDF 98%, #0000) top/var(--b) var(--b) no-repeat, conic-gradient(#DFDFDF calc(var(--p)*1%), #F5F5F5 0);
  position: relative;
}
.monthly .calender .week .week_item .date .datef {
  position: relative;
  z-index: 1;
  font-size: var(--span2-f);
  color: #C9C9C9;
}
.monthly .calender .week .week_item .date .mask {
  background: #fff;
  aspect-ratio: 1;
  display: block;
  position: absolute;
  top: 0.3125rem;
  left: 0.3125rem;
  width: 22px;
  border-radius: 50%;
  z-index: 0;
}
.monthly .calender .week .week_item .date::before {
  content: "";
  display: block;
  height: 0.3125rem;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0.3125rem;
  background-color: #DFDFDF;
  border-radius: 50%;
}
.monthly .calender .week .week_item .date::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.3125rem;
  height: 0.3125rem;
  background-color: #DFDFDF;
  top: 0;
  border-radius: 50%;
  left: 50%;
  inset: calc(50% - var(--b)/2);
  -webkit-transform: rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
          transform: rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}
.monthly .calender .week .week_item .date.prog_none::before, .monthly .calender .week .week_item .date.prog_none::after {
  background-color: #F5F5F5;
}
.monthly .calender .week .week_item .date.bg_none {
  background: transparent;
}
.monthly .calender .week .week_item .date.bg_none .week_sun {
  color: #F44432;
}
.monthly .calender .week .week_item .date.bg_none::before, .monthly .calender .week .week_item .date.bg_none::after {
  background-color: transparent;
}
.monthly .calender .week .week_item.today .day {
  background-color: rgba(0, 180, 0, 0.1);
  border-radius: 50%;
}
.monthly .calender .week .week_item.today .date.green {
  background: radial-gradient(farthest-side, var(--c) 98%, #0000) top/var(--b) var(--b) no-repeat, conic-gradient(var(--c) calc(var(--p)*1%), #F5F5F5 0);
}
.monthly .calender .week .week_item.today .date.green::before, .monthly .calender .week .week_item.today .date.green::after {
  background-color: var(--c);
}
.monthly .calender .week .week_item.today .date.yellow {
  background: radial-gradient(farthest-side, #FFC710 98%, #0000) top/var(--b) var(--b) no-repeat, conic-gradient(#FFC710 calc(var(--p)*1%), #F5F5F5 0);
}
.monthly .calender .week .week_item.today .date.yellow::before, .monthly .calender .week .week_item.today .date.yellow::after {
  background-color: #FFC710;
}
.monthly .calender .week .week_item.today .datef {
  color: #2F2F2F;
}
.monthly .calender .week .week_item.today.prog_none .date {
  background: #F5F5F5;
}
.monthly .calender .week .week_item.today.prog_none .date::before, .monthly .calender .week .week_item.today.prog_none .date::after {
  background-color: #F5F5F5;
}
.monthly .calender .week.thisWeek .week_item .date .datef.week_sun {
  color: #F44432;
}
.monthly .drag_area {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  position: absolute;
  top: 0;
  right: 1.25rem;
  background: url(../images/icon/right.svg) no-repeat;
  background-size: 1.25rem;
  background-position: right center;
  color: #747474;
  padding-right: 1.375rem;
  bottom: initial;
}

.home_slide .home_bn {
  border: 1px solid #DFDFDF;
  width: 100%;
  border-radius: 0.5rem;
  background-repeat: no-repeat;
  background-size: 7.5rem 8.75rem;
  background-position: calc(100% - 1.25rem) center;
  background-color: #FFFEF9;
}
@media (max-device-width: 359px) {
  .home_slide .home_bn {
    background-size: 33.4262vw;
    background-position: calc(100% - 1.25rem) bottom;
  }
}
.home_slide .home_bn .bn_title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.4375rem;
}
.home_slide .home_bn.bn01 {
  background-image: url(../images/home_slide01.svg);
}
.home_slide .home_bn.bn02 {
  background-image: url(../images/home_slide02.svg);
}
.home_slide .home_bn.bn03 {
  background-image: url(../images/home_slide03.svg);
}
.home_slide .swiper-pagination-fraction {
  background: rgba(47, 47, 47, 0.6);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  right: 1rem;
  bottom: 1rem;
  left: initial;
  color: #fff;
  padding: 0.25rem 0.625rem;
  border-radius: 3rem;
  font-size: var(--span3-f);
}

.home_quick {
  padding: 2rem 0 0;
}
.home_quick .quick_block {
  padding-bottom: 2rem;
}
.home_quick .quick_block .title {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
}
.home_quick .quick_block .quick_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  padding-top: 0.9375rem;
}
.home_quick .quick_block .quick_list a {
  display: block;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  padding: 1.25rem 0;
  border-radius: 0.75rem 0 0 0;
  text-align: center;
  border: 1px solid #F5F5F5;
}

/* 0418 추가 */
.n_monthly {
  background: #fff;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  border-radius: 1.5rem 0 0 0;
  padding-bottom: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  position: relative;
}
.n_monthly .title {
  padding: 0 1.25rem 1rem;
  color: #2F2F2F;
}
.n_monthly .calender .week {
  overflow: hidden;
  gap: 0.875rem;
  position: relative;
}
.n_monthly .calender .week .day {
  width: 1.875rem;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .day {
    width: 8.3102vw;
  }
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week {
    gap: 3.3241vw;
  }
}
.n_monthly .calender .week .week_item {
  width: 1.875rem;
  height: 1.875rem;
  overflow: initial;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item {
    width: 8.3102vw;
  }
}
.n_monthly .calender .week .week_item .date {
  --w: 0;
  position: relative;
  font-size: var(--span2-f);
  width: 1.875rem;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: transparent;
  color: #C9C9C9;
}
.n_monthly .calender .week .week_item .date .week_sun {
  color: #F44432;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date {
    width: 8.3102vw;
  }
}
.n_monthly .calender .week .week_item .date::before {
  -webkit-transform: initial;
          transform: initial;
  border-radius: initial;
  background: initial;
}
.n_monthly .calender .week .week_item .date::after {
  inset: initial;
  border-radius: initial;
  background: initial;
}
.n_monthly .calender .week .week_item .date.today_done {
  background: #00B400;
  color: #fff;
  border-radius: 3rem;
  width: 1.875rem;
}
.n_monthly .calender .week .week_item .date.today_done .week_sun {
  color: #fff;
}
.n_monthly .calender .week .week_item .date.today_none {
  border: 2px solid #00B400;
  color: #2F2F2F;
  border-radius: 3rem;
  width: 1.875rem;
}
.n_monthly .calender .week .week_item .date.startweek {
  color: #fff;
  background: #00B400;
}
.n_monthly .calender .week .week_item .date.startweek:before {
  content: "";
  height: 100%;
  left: -2.8125rem;
  top: 0;
  width: 3.75rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.startweek:before {
    left: -12.4654vw;
    width: 16.6205vw;
  }
}
.n_monthly .calender .week .week_item .date.endweek {
  color: #fff;
  background: #00B400;
}
.n_monthly .calender .week .week_item .date.endweek .week_sun {
  color: #fff;
}
.n_monthly .calender .week .week_item .date.endweek::after {
  content: "";
  height: 100%;
  right: -2.8125rem;
  top: 0;
  width: 3.75rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.endweek::after {
    right: -12.4654vw;
    width: 16.6205vw;
  }
}
.n_monthly .calender .week .week_item .date.startday {
  background: #00B400;
  border-radius: 3rem 0 0 3rem;
  color: #fff;
}
.n_monthly .calender .week .week_item .date.startday .week_sun {
  color: #fff;
}
.n_monthly .calender .week .week_item .date.startday::after {
  content: "";
  position: absolute;
  background: #00B400;
  height: 100%;
  width: 1.5rem;
  right: -1.125rem;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.startday::after {
    width: 6.6482vw;
    right: -4.9861vw;
  }
}
.n_monthly .calender .week .week_item .date.startday::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  left: -3px;
  border-radius: 3rem;
  background: #00B400;
}
.n_monthly .calender .week .week_item .date.endday {
  background: #00B400;
  color: #fff;
  border-radius: 0 3rem 3rem 0;
}
.n_monthly .calender .week .week_item .date.endday .week_sun {
  color: #fff;
}
.n_monthly .calender .week .week_item .date.endday::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  right: -3px;
  border-radius: 3rem;
  background: #00B400;
}
.n_monthly .calender .week .week_item .date.endday::before {
  content: "";
  position: absolute;
  background: #00B400;
  height: 100%;
  width: 1.5rem;
  left: -1.125rem;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.endday::before {
    width: 6.6482vw;
    left: -4.9861vw;
  }
}
.n_monthly .calender .week .week_item .date.doingday {
  background: #00B400;
  color: #fff;
}
.n_monthly .calender .week .week_item .date.doingday::before {
  content: "";
  position: absolute;
  top: 0;
  left: -1rem;
  background: #00B400;
  z-index: -1;
  height: 100%;
  width: 3.75rem;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.doingday::before {
    left: -4.4321vw;
    width: 16.6205vw;
  }
}
.n_monthly .calender .week .week_item .date.endweek.startday::after {
  content: "";
  height: 100%;
  right: -2.8125rem;
  top: 0;
  width: 3.75rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.endweek.startday::after {
    right: -12.4654vw;
    width: 16.6205vw;
  }
}
.n_monthly .calender .week .week_item .date.startweek.endday::before {
  content: "";
  height: 100%;
  left: -2.8125rem;
  top: 0;
  width: 3.75rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
  border-radius: 0;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.startweek.endday::before {
    left: -12.4654vw;
    width: 16.6205vw;
  }
}
.n_monthly .calender .week .week_item .date.startweek.doingday::before {
  content: "";
  height: 100%;
  left: -2.5rem;
  top: 0;
  width: 5rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.startweek.doingday::before {
    left: -11.0803vw;
    width: 22.1607vw;
  }
}
.n_monthly .calender .week .week_item .date.endweek.doingday::before {
  content: "";
  height: 100%;
  left: -1rem;
  top: 0;
  width: 5rem;
  background: #00B400;
  position: absolute;
  z-index: -1;
}
@media (min-device-width: 361px) {
  .n_monthly .calender .week .week_item .date.endweek.doingday::before {
    right: -11.0803vw;
    width: 22.1607vw;
  }
}
.n_monthly .calender .week .week_item .date.pastnone::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../images/icon/past_none.svg) no-repeat;
  background-size: 1.25rem;
  background-position: center;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
}

.level_box {
  -webkit-box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.07);
  padding: 1.5rem 1rem 1.5rem;
  margin: 2rem 0 0;
}
.level_box .level_no {
  position: relative;
  margin-bottom: 1rem;
}
.level_box .level_no .level_link {
  position: absolute;
  top: 0;
  right: 0;
  font-size: var(--p5-f);
  color: #747474;
  padding-right: 1.25rem;
  background: url(../images/icon/right.svg) no-repeat;
  background-size: 1.25rem;
  background-position: right center;
}
.level_box .level_icon {
  position: absolute;
  top: 4.125rem;
  right: 2.5rem;
  width: 3rem;
}
@media (max-device-width: 359px) {
  .level_box .level_icon {
    width: 13.3705vw;
  }
}
.level_box .level_icon img {
  width: 100%;
}
.level_box .level_bar {
  padding-top: 2.625rem;
  position: relative;
}
.level_box .level_bar .bar_wrap {
  margin-top: 0.3125rem;
}
.level_box .level_bar .bar_wrap .bar_bg {
  background: #DFDFDF;
  border-radius: 3rem;
  position: relative;
  width: calc(100% - .875rem);
  height: 0.375rem;
  margin: 0 0.125rem;
}
.level_box .level_bar .bar_wrap .bar_bg .bar_g {
  background: #00B400;
  height: 100%;
  border-radius: 3rem;
}
.level_box .level_bar .bar_wrap .bar_bg .fitple_icon {
  position: absolute;
  right: -0.4375rem;
  top: -1.5rem;
}
.level_box .level_bar .bar_wrap .bar_bg .fitple_icon .lvmax {
  position: relative;
  bottom: 0.25rem;
  left: 0.25rem;
  width: 2rem;
}
@media (max-device-width: 359px) {
  .level_box .level_bar .bar_wrap .bar_bg .fitple_icon .lvmax {
    width: 8.9136vw;
    bottom: 1px;
  }
}
.level_box .level_bar .bar_wrap .bar_bg .fitple_icon .lvmax img {
  width: 100%;
}
.level_box .level_bar .bar_wrap .bar_date {
  margin-top: 0.25rem;
  position: relative;
}
.level_box .level_bar .bar_wrap .bar_date p {
  font-size: 10px;
  color: #9F9F9F;
  font-weight: var(--bold-f);
  position: absolute;
}
.level_box .level_bar .bar_wrap .bar_date p.first_lv {
  left: 2px;
}
.level_box .level_bar .bar_wrap .bar_date p.last_lv {
  right: 0;
}
.level_box .level_bar .bar_wrap .bar_date p.lv_2 {
  left: 1.875rem;
}
@media (min-device-width: 361px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_2 {
    left: 8.3102vw;
  }
}
@media (max-device-width: 359px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_2 {
    left: 8.3565vw;
  }
}
.level_box .level_bar .bar_wrap .bar_date p.lv_3 {
  left: 4.625rem;
}
@media (min-device-width: 361px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_3 {
    left: 20.4986vw;
  }
}
@media (max-device-width: 359px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_3 {
    left: 20.6128vw;
  }
}
.level_box .level_bar .bar_wrap .bar_date p.lv_4 {
  left: 7.875rem;
}
@media (min-device-width: 361px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_4 {
    left: 34.903vw;
  }
}
@media (max-device-width: 359px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_4 {
    left: 35.0975vw;
  }
}
.level_box .level_bar .bar_wrap .bar_date p.lv_5 {
  left: 12.25rem;
}
@media (min-device-width: 361px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_5 {
    left: 54.2936vw;
  }
}
@media (max-device-width: 359px) {
  .level_box .level_bar .bar_wrap .bar_date p.lv_5 {
    left: 54.5961vw;
  }
}
.level_box .level_bar .bar_wrap .bar_date p.bar_day {
  position: absolute;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.month_fold {
  z-index: 1;
}
.month_fold .overlay {
  opacity: 0;
  z-index: -1;
}

.footer_banner {
  padding-bottom: 2rem;
}
.footer_banner .cardround {
  background: #fff url(../images/icon/home_banner7.svg) no-repeat;
  margin: 0;
  padding: 2.625rem 1.25rem 2.25rem;
  background-size: 6.5rem;
  background-position: calc(100% - 1rem) 2.375rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
}
@media (max-device-width: 359px) {
  .footer_banner .cardround {
    background-size: 28.9694vw;
  }
}
.footer_banner .cardround .title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding: 0.3125rem 0 1rem;
}
.footer_banner .cardround .round_btn {
  font-size: var(--span3-f);
  color: #fff;
  padding: 0.5625rem 1.875rem 0.5625rem 0.75rem;
  display: inline-block;
  border-radius: 3rem;
  background: #00B400 url(../images/icon/right_wt.svg) no-repeat;
  background-position: calc(100% - .5rem) center;
}

.footer {
  background: #F5F5F5;
}
.footer .social {
  padding: 2rem 0 1rem;
}
.footer .social a {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  display: inline-block;
  margin-right: 0.3rem;
}
.footer .social .social_kakao {
  background: url(../images/icon/social_kakao.svg) no-repeat;
  background-size: cover;
}
.footer .social .social_insta {
  background: url(../images/icon/social_insta.svg) no-repeat;
  background-size: cover;
}
.footer .social .social_blog {
  background: url(../images/icon/social_blog.svg) no-repeat;
  background-size: cover;
}
.footer .footer_info {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.footer .footer_info .title {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #747474;
  padding: 0 0 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.footer .footer_info .txt {
  font-size: var(--span3-f);
  color: #9F9F9F;
  margin-bottom: 0.25rem;
}
.footer .footer_info .txt:last-child {
  margin-bottom: 1.25rem;
}
.footer .footer_info .txt span {
  margin-right: 0.25rem;
}
.footer .footer_info.info_fold .title {
  padding-bottom: 0.625rem;
}
.footer .footer_info.info_fold .slideDown {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.footer .footer_info.info_fold .slideDown.slideup {
  -webkit-transform: rotate(-180deg);
          transform: rotate(-180deg);
}
.footer .footer_info.info_fold .inner_info {
  display: none;
}
.footer .footer_link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span3-f);
  color: #9F9F9F;
}
.footer .footer_link a {
  display: block;
  position: relative;
  padding-right: 0.5rem;
  margin-right: 0.5rem;
}
.footer .footer_link a::after {
  content: "";
  width: 1px;
  height: 0.75rem;
  background-color: #C9C9C9;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}
.footer .footer_link a:last-child::after {
  display: none;
}

/* 로딩애니메이션 */
.loading_ani {
  background: rgba(255, 255, 255, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 999;
}
.loading_ani .ld_in {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 4rem;
  border-radius: 50%;
}
@media (max-device-width: 359px) {
  .loading_ani .ld_in {
    width: 17.8273vw;
  }
}

/* --------- 클리어 ----------- */
.clear_wrap {
  text-align: center;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding-top: 28svh;
}
.clear_wrap .clear_ani {
  width: 7.375rem;
  margin: 0 auto;
}
@media (max-device-width: 359px) {
  .clear_wrap .clear_ani {
    width: 32.8691vw;
  }
}
.clear_wrap .clear_title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.clear_wrap .clear_sub {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  margin-top: 0.75rem;
}
.clear_wrap .btn_s {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 1rem auto 0;
}
.clear_wrap .closeBtn {
  position: absolute;
  top: 1rem;
  right: 1rem;
}
.clear_wrap .clear_slide {
  position: fixed;
  bottom: 1rem;
  width: calc(100% + .5rem);
  -webkit-transform: translateX(-0.25rem);
          transform: translateX(-0.25rem);
}
.clear_wrap .clear_slide .span2_fb {
  padding-left: 1.25rem;
}
.clear_wrap .clear_slide .review_slide {
  margin-top: 0.75rem;
}
.clear_wrap .clear_slide .review_slide .slide_list {
  background: rgba(0, 180, 0, 0.1) url(../images/icon/right.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  padding: 0.75rem 2.75rem 0.75rem 1rem;
  border-radius: 0.5rem;
  width: 17.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-device-width: 359px) {
  .clear_wrap .clear_slide .review_slide .slide_list {
    width: 77.9944vw;
  }
}
.clear_wrap .clear_slide .review_slide .slide_list .img {
  width: 1.25rem;
  margin-right: 0.5rem;
}
@media (max-device-width: 359px) {
  .clear_wrap .clear_slide .review_slide .slide_list .img {
    width: 5.571vw;
  }
}
.clear_wrap .clear_slide .review_slide .slide_list .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  width: calc(100% - 1.75rem);
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.clear_wrap .clear_slide .review_slide .slide_list:first-child {
  margin-left: 1.25rem;
}
.clear_wrap .clear_slide .review_slide .slide_list:last-child {
  margin-right: 1.25rem;
}

/* -------- 상단 메세지 -------- */
.top_meg {
  background: #00B400;
  color: #fff;
  font-size: var(--span2-f);
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  position: relative;
  padding: 0.75rem 1.25rem;
  z-index: 5;
}
.top_meg.msg_fix {
  position: sticky;
  top: var(--header-height);
  background: rgba(0, 180, 0, 0.9);
}

/* -------------- 챌린지 ---------------- */
.clg_top {
  padding: 1rem 0.25rem 2rem;
  position: relative;
}
.clg_top .title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
}
.clg_top .btn_s {
  display: inline-block;
}
.clg_top .level_pf {
  position: absolute;
  top: 1.875rem;
  right: 1.0625rem;
  display: none;
}
.clg_top .level_pf .lv_img {
  width: 3rem;
  margin-right: 0.75rem;
}
.clg_top .level_pf .pf_img {
  position: absolute;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #fff;
  bottom: -0.25rem;
  right: 0;
}
.clg_top .level_pf .pf_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.clg_top .my_info {
  padding: 1.75rem 0 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: none;
}
.clg_top .my_info .btn_m {
  padding: 0.625rem 0.75rem;
}
.clg_top .my_info .data_block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 53.4819vw;
}
.clg_top .my_info .data_block .info_data {
  width: 100%;
}
.clg_top .my_info .data_block .info_data:first-child {
  border-right: 1px solid #DFDFDF;
}
.clg_top .my_info .data_block .info_data .data_t {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
  margin-bottom: 0.25rem;
}
.clg_top .my_info .data_block .info_data .data_t img {
  width: 1.25rem;
  margin-right: 0.25rem;
}
.clg_top .my_info .data_block .info_data .data_s {
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  text-align: center;
}
.clg_top .btn_m.btn_white {
  border-radius: 0.5rem;
  display: block;
  padding: 0.75rem 1rem;
  color: #9F9F9F;
  background: url(../images/icon/right_bk.svg) no-repeat;
  background-position: calc(100% - 1rem) center;
  display: none;
}
.clg_top .btn_m.btn_white span {
  font-weight: var(--bold-f);
  margin-right: 0.5rem;
  color: #2F2F2F;
}
.clg_top.clg_lgn {
  padding: 1.875rem 0.25rem 1.75rem;
}
.clg_top.clg_lgn .title {
  font-size: var(--p1-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.clg_top.clg_lgn .title span {
  color: #FFA82E;
}
.clg_top.clg_lgn .level_pf,
.clg_top.clg_lgn .btn_white {
  display: block;
}
.clg_top.clg_lgn .my_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.clg_con {
  padding: 2rem 0;
}
.clg_con .con_bn {
  margin-bottom: 1.5rem;
}
.clg_con .banner {
  border-radius: 0.625rem;
  border: 2px solid transparent;
  position: relative;
  padding: 2.625rem 1.5rem 1.25rem;
  background-repeat: no-repeat;
  margin-bottom: 1rem;
}
.clg_con .banner .type {
  font-size: var(--span3-f);
  font-weight: 600;
  font-family: "Poppins";
  text-transform: uppercase;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.625rem 1rem;
  border-radius: 0.625rem 0;
  color: #fff;
  position: absolute;
  top: -2px;
  left: -2px;
}
.clg_con .banner .b_title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.clg_con .banner .b_s {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  color: #747474;
  padding: 0.4375rem 0 0.75rem;
}
.clg_con .banner .link {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 1.25rem;
  padding-right: 1.25rem;
}
.clg_con .banner.gr {
  border-color: #00B400;
  background-image: url(../images/banner_chance.svg);
  background-position: calc(100% - 1.625rem) calc(100% - 1.5rem);
  background-size: 6.125rem;
}
@media (max-device-width: 359px) {
  .clg_con .banner.gr {
    background-size: 27.2981vw;
  }
}
.clg_con .banner.gr .type {
  background: #00B400;
}
.clg_con .banner.gr .b_title {
  color: #00B400;
}
.clg_con .banner.gr .link {
  color: #006000;
  background-image: url(../images/icon/right_green.svg);
}
.clg_con .banner.yellow {
  border-color: #FFC710;
  background-image: url(../images/banner_mission.svg);
  background-position: calc(100% - 1rem) calc(100% - 1.25rem);
  background-size: 6.0625rem;
}
@media (max-device-width: 359px) {
  .clg_con .banner.yellow {
    background-size: 27.0195vw;
  }
}
.clg_con .banner.yellow .type {
  background: #FFC710;
}
.clg_con .banner.yellow .b_title {
  color: #FFC710;
}
.clg_con .banner.yellow .link {
  color: #6D4813;
  background-image: url(../images/icon/right_blue.svg);
}
.clg_con .banner.fit {
  border-color: #009400;
  background-image: url(../images/banner_fit.svg);
  background-position: calc(100% - 1.6875rem) 2rem;
  background-size: 4.875rem;
  background-color: rgba(6, 143, 6, 0.8);
}
@media (max-device-width: 359px) {
  .clg_con .banner.fit {
    background-size: 21.727vw;
  }
}
.clg_con .banner.fit .type {
  background: #009400;
}
.clg_con .banner.fit .b_title {
  color: #fff;
}
.clg_con .banner.fit .b_s {
  color: #9CE89C;
}
.clg_con .banner.fit .link {
  color: #FFE352;
  background-image: url(../images/icon/right_yellow.svg);
}
.clg_con .banner.soon {
  position: relative;
  overflow: hidden;
  border-color: #826C22;
}
.clg_con .banner.soon::after {
  content: "곧 오픈해요! 조금만 기다려주세요";
  position: absolute;
  background: rgba(47, 47, 47, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #fff;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}

.tickt_wrap {
  padding: 0 0.25rem;
}
.tickt_wrap .chance_top {
  padding: 3.375rem 0 2.5rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, #E5F9E3), to(#fff));
  background: linear-gradient(#E5F9E3 80%, #fff 100%);
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.tickt_wrap .chance_top .chance_bb {
  position: absolute;
  top: 1.625rem;
  right: 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--span4-f);
  color: #747474;
  gap: 0.125rem;
}
.tickt_wrap .chance_top .chance_bb .bbpop {
  position: absolute;
  right: 1rem;
  top: 1.625rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  border-radius: 0.5rem;
  -webkit-animation: none;
          animation: none;
  font-size: var(--span4-f);
  padding: 0.625rem 0.75rem;
  -webkit-filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, 0.1));
          filter: drop-shadow(0px 0px 16px rgba(0, 0, 0, 0.1));
  opacity: 0;
  z-index: -1;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.tickt_wrap .chance_top .chance_bb .bbpop.open {
  opacity: 1;
  z-index: 1;
}
.tickt_wrap .chance_top .chance_title {
  text-align: center;
  margin-bottom: 2.25rem;
}
.tickt_wrap .chance_top .chance_title .bag_icon {
  width: 2.6875rem;
  margin: 0 auto;
}
.tickt_wrap .chance_top .chance_title .title_img {
  width: 8.5rem;
  margin: 0.75rem auto 1rem;
}
.tickt_wrap .chance_top .chance_title .chance_txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.tickt_wrap .chance_top .chance_title .chance_txt span {
  position: relative;
  color: #00B400;
  font-weight: var(--bold-f);
}
.tickt_wrap .chance_top .chance_title .chance_txt span::before {
  content: "";
  display: block;
  position: absolute;
  background: #00B400;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  top: -3px;
  left: calc(50% - 2px);
}
.tickt_wrap .chance_top .chance_my {
  padding: 0 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.tickt_wrap .chance_top .chance_my .exticket_btn {
  background: #00B400;
  color: #fff;
  padding: 0.75rem 1.25rem;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  border-radius: 0.25rem;
}
@media (max-device-width: 359px) {
  .tickt_wrap .chance_top .chance_my .exticket_btn {
    padding: 0.75rem 5.571vw;
  }
}
.tickt_wrap .chance_top .chance_login {
  font-size: var(--span2-f);
  border: 1px solid #DFDFDF;
  border-radius: 0.25rem;
  background: #fff;
  padding: 0.75rem 0;
  width: 11.375rem;
  margin: 0 auto;
  display: block;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.tickt_wrap .ticketBtn {
  display: block;
  margin-top: 1rem;
  padding: 0.75rem;
  background: #fff url(../images/icon/right.svg) no-repeat;
  background-size: 1.25rem;
  background-position: calc(100% - .75rem) center;
  color: #747474;
}
.tickt_wrap .list_blank {
  background: #F5F5F5;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding-top: 30svh;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  color: #9F9F9F;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  justify-items: center;
  gap: 0.5rem;
}
.tickt_wrap .random_b {
  border: 1px solid #DFDFDF;
  border-radius: 0.5rem;
  background: #FFFEF9 url(../images/banner_random.png) no-repeat;
  background-size: 7.75rem;
  background-position: calc(100% - 1rem) bottom;
  padding: 0 1.25rem;
  height: 8.75rem;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  gap: 0.4375rem;
  margin-bottom: 1rem;
}
.tickt_wrap .random_bnoti {
  background: rgba(0, 180, 0, 0.05);
  padding: 0.375rem 0.75rem;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  text-align: center;
  border-radius: 0.25rem;
  margin-bottom: 2rem;
  color: #747474;
}
.tickt_wrap .ticket_goods .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  position: relative;
  margin-bottom: 0.75rem;
}
.tickt_wrap .ticket_goods .title img {
  margin-right: 0.5rem;
}
.tickt_wrap .ticket_goods .title .more {
  position: absolute;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #00B400;
  right: 0;
  padding-right: 1.375rem;
  background: url(../images/icon/right_green2.svg) no-repeat;
  background-position: right center;
  background-size: 1.25rem;
}
.tickt_wrap .ticket_goods .goods_thumb {
  border-radius: 0.5rem;
  overflow: hidden;
  display: block;
  border: 1px solid #DFDFDF;
  position: relative;
  margin-bottom: 1rem;
}
.tickt_wrap .ticket_goods .goods_thumb .soon_txt {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  display: none;
}
.tickt_wrap .ticket_goods .goods_thumb img {
  width: 100%;
}
.tickt_wrap .ticket_goods .goods_thumb .goods_count {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  background: #2F2F2F url(../images/icon/user_wt.svg) no-repeat;
  color: #fff;
  padding: 0.25rem 0.5rem 0.25rem 1.5rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  background-size: 0.875rem;
  background-position: 0.5rem center;
  z-index: 2;
}
.tickt_wrap .ticket_goods .goods_thumb .h3_f {
  margin-top: 0.25rem;
}
.tickt_wrap .ticket_goods .goods_thumb.soon .soon_txt {
  display: block;
}
.tickt_wrap .ticket_goods .goods_thumb.soon .goods_count {
  background: #F44432;
  padding: 0.25rem 0.5rem;
}
.tickt_wrap .ticket_goods .goods_thumb.soon::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(47, 47, 47, 0.6);
  z-index: 1;
}
.tickt_wrap .ticket_goods .span4_f.gray02 {
  padding-bottom: 0.25rem;
}
.tickt_wrap .ticket_goods .btn_border {
  border: 1px solid;
  display: block;
  width: 100%;
  margin: 1rem 0 2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.625rem 0;
  font-weight: var(--bold-f);
}
.tickt_wrap .ticket_goods .price {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding-top: 0.25rem;
  gap: 0.5rem;
}
.tickt_wrap .goods_next .next_list {
  padding: 0.75rem 0 2.375rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem 0.5rem;
}
.tickt_wrap .goods_next .next_list .item {
  border-radius: 0.5rem;
  overflow: hidden;
  background: #2F2F2F;
}
.tickt_wrap .goods_next .next_list .item .thumb {
  background: #2F2F2F;
  position: relative;
}
.tickt_wrap .goods_next .next_list .item .thumb img {
  opacity: 0.6;
  width: 100%;
}
.tickt_wrap .goods_next .next_list .item .thumb .next_time {
  position: absolute;
  z-index: 1;
  color: #fff;
  background: #2F2F2F;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  bottom: 0.5rem;
  left: 0.5rem;
  padding: 0.25rem 0.5rem;
}
.tickt_wrap .goods_next .next_list .item .thumb .next_time.first {
  background-color: #F44432;
}
.tickt_wrap .goods_next .next_list .item .name {
  background: #2F2F2F;
  padding: 0.9375rem 0.75rem 0.75rem;
}
.tickt_wrap .goods_next .next_list .item .name .span4_f {
  margin-bottom: 2px;
}
.tickt_wrap .notice {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding-top: 2rem;
}
.tickt_wrap .ticket_list {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.tickt_wrap .ticket_list .list_item {
  border-top: 0.5rem solid #F5F5F5;
  display: block;
}
.tickt_wrap .ticket_list .list_item .date {
  font-size: var(--span3-f);
  color: #747474;
  padding-left: 1.25rem;
  padding-top: 1.125rem;
}
.tickt_wrap .ticket_list .list_item .list_data {
  padding: 0.75rem 1.25rem 1.125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
  position: relative;
}
.tickt_wrap .ticket_list .list_item .list_data .thumb {
  width: 4.5rem;
  aspect-ratio: 1;
  border: 1px solid #DFDFDF;
  border-radius: 1rem;
  overflow: hidden;
}
@media (max-device-width: 359px) {
  .tickt_wrap .ticket_list .list_item .list_data .thumb {
    width: 20.0557vw;
  }
}
.tickt_wrap .ticket_list .list_item .list_data .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.tickt_wrap .ticket_list .list_item .list_data .data_info {
  width: calc(100% - 5.25rem);
}
.tickt_wrap .ticket_list .list_item .list_data .data_info .txt {
  font-size: var(--span2-f);
  color: #C9C9C9;
  width: 75%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  margin: 0.25rem 0 0.5rem;
}
@media (max-device-width: 359px) {
  .tickt_wrap .ticket_list .list_item .list_data .data_info .txt {
    width: 45.6825vw;
  }
}
.tickt_wrap .ticket_list .list_item .list_data .data_info .data_no {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.tickt_wrap .ticket_list .list_item .list_data .icon_s {
  position: absolute;
  top: 50%;
  right: 1.25rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.tickt_wrap .now_list {
  position: relative;
  padding-top: 0.25rem;
}
.tickt_wrap .now_list .ticket_goods {
  padding-bottom: 2.5rem;
}
.tickt_wrap .now_list .ticket_goods .btn_border {
  margin: 1rem 0 0;
}
.tickt_wrap .end_list .next_list {
  padding: 2rem 0;
  gap: 2rem 0.5rem;
}
.tickt_wrap .end_list .next_list .item {
  background: #fff;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.tickt_wrap .end_list .next_list .item .thumb .next_time,
.tickt_wrap .end_list .next_list .item .thumb .next_time.first {
  background-color: #2F2F2F;
}
.tickt_wrap .end_list .next_list .item .name {
  background: #fff;
}
.tickt_wrap .end_list .next_list .item .name .span4_f {
  margin-bottom: 0;
}
.tickt_wrap .end_list .next_list .item .name .p4_f {
  padding: 0.125rem 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.notiBtn {
  background: transparent;
  margin-top: 2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.notiBtn span {
  background: url(../images/icon/right.svg) no-repeat;
  background-size: 1.25rem;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}

.my_ticket {
  border: 1px solid #00B400;
  background: #fff;
  border-radius: 0.5rem;
  width: calc(100% - 9rem);
  padding: 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.my_ticket .primary {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  background: url(../images/icon/icon_ticket3.svg);
  background-repeat: no-repeat;
  background-position: left -3px;
  padding-left: 1.5rem;
  background-size: 1.375rem;
}
@media (max-device-width: 359px) {
  .my_ticket .primary {
    background-size: 6.1281vw;
  }
}
.my_ticket .span2_fb {
  text-align: right;
}

.draw_detail {
  padding: 1.5rem 0.25rem 2rem;
}
.draw_detail .date {
  font-size: var(--span3-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  color: #747474;
}
.draw_detail .date .icon_s {
  background: #F5F5F5;
}
.draw_detail .date.green {
  color: #00B400;
}
.draw_detail .date.green .icon_s {
  background: rgba(0, 180, 0, 0.1);
  color: #00B400;
}
.draw_detail.red .date {
  color: #F44432;
}
.draw_detail.red .date .icon_s {
  background: rgba(244, 68, 50, 0.05);
  color: #F44432;
}
.draw_detail.red .draw_tc .data .icon.icon_t {
  background-image: url(../images/icon/icon_ticket_gray.svg);
}
.draw_detail.red .draw_tc .data .icon.icon_u {
  background-image: url(../images/icon/icon_user_gray.svg);
}
.draw_detail.red .draw_tc .data .txt {
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-top: 0.125rem;
}
.draw_detail.red .draw_tc .data:first-child {
  border-right: 1px solid #DFDFDF;
}
.draw_detail.red .draw_noti .primary {
  color: #F44432;
}
.draw_detail.gray .date .icon_s {
  background: #DFDFDF;
  color: #747474;
  border: 1px solid #C9C9C9;
}
.draw_detail.gray .draw_noti .primary {
  color: #F44432;
}
.draw_detail.gray .draw_tc .data .icon.icon_t {
  background-image: url(../images/icon/icon_ticket_gray.svg);
}
.draw_detail.gray .draw_tc .data .icon.icon_u {
  background-image: url(../images/icon/icon_user_gray.svg);
}
.draw_detail.gray .draw_tc .data .txt {
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-top: 0.125rem;
}
.draw_detail.gray .draw_tc .data:first-child {
  border-right: 1px solid #DFDFDF;
}
.draw_detail .draw_name {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  text-align: center;
  margin: 0.5rem auto;
}
.draw_detail .brand_name {
  text-align: center;
  font-size: var(--span2-f);
  color: #C9C9C9;
}
.draw_detail .draw_img {
  position: relative;
}
.draw_detail .draw_img .thumb {
  width: 10.875rem;
  aspect-ratio: 1;
  margin: 2.5rem auto 0.75rem;
  overflow: hidden;
  border: 1px solid #F5F5F5;
  border-radius: 50%;
}
@media (max-device-width: 359px) {
  .draw_detail .draw_img .thumb {
    width: 48.468vw;
  }
}
.draw_detail .draw_img .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.draw_detail .draw_img .draw_ani {
  position: absolute;
  top: -18.75rem;
  width: 22.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  height: 34.375rem;
}
.draw_detail .my_ticket {
  margin: 0 auto;
  width: 12.5rem;
}
@media (max-device-width: 359px) {
  .draw_detail .my_ticket {
    width: 55.7103vw;
  }
}
.draw_detail .draw_noti {
  text-align: left;
  border-radius: 0.5rem;
  padding: 1.4375rem 0 0.5rem;
}
.draw_detail .draw_noti .p4_f {
  padding-left: 1rem;
  position: relative;
  color: #2F2F2F;
}
.draw_detail .draw_noti .p4_f::before {
  content: "※";
  position: absolute;
  left: 0;
}
.draw_detail .d_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
  line-height: 1;
  margin-bottom: 0.5rem;
}
.draw_detail .goods_count {
  background: #2F2F2F url(../images/icon/user_wt.svg) no-repeat;
  color: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.25rem 0.5rem 0.25rem 1.5rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  background-size: 0.875rem;
  background-position: 0.5rem center;
  margin-top: 1rem;
  border: 1px solid transparent;
}
.draw_detail .goods_count.border {
  background: #fff url(../images/icon/heart_green.svg) no-repeat;
  background-position: 0.375rem center;
  border: 1px solid #00B400;
  color: #00B400;
  padding-left: 1.375rem;
}
.draw_detail .top_thumb {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  position: relative;
}
.draw_detail .top_thumb .img {
  width: 100%;
}
.draw_detail .top_thumb .img img {
  width: 100%;
}
.draw_detail .top_thumb .draw_time {
  position: absolute;
  bottom: 0;
  padding: 0.5rem 0;
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  text-align: center;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.draw_detail .top_thumb .draw_time.on {
  background: #FF6858;
}
.draw_detail .top_thumb .draw_time.on .txt {
  color: #FDC4BE;
  background: url(../images/icon/clock_line_wt.svg) no-repeat;
  background-position: left center;
  padding-left: 1.125rem;
}
.draw_detail .top_thumb .draw_time.on .time {
  color: #fff;
}
.draw_detail .top_thumb .draw_time.on_y {
  background: #FFD652;
}
.draw_detail .top_thumb .draw_time.on_y .time {
  color: #F44432;
}
.draw_detail .top_thumb .draw_time.on_g {
  background: #00B400;
  color: #fff;
}
.draw_detail .top_thumb .draw_time.on_g span {
  position: relative;
}
.draw_detail .top_thumb .draw_time.on_g span::before {
  content: "";
  width: 1px;
  height: 0.5rem;
  background: #fff;
  opacity: 0.8;
  display: inline-block;
  margin: 0 0.5rem;
}
.draw_detail .top_thumb .draw_time.end {
  background: #2F2F2F;
}
.draw_detail .top_thumb .draw_time.end .txt {
  color: #C9C9C9;
}
.draw_detail .top_thumb .draw_time.end .time {
  color: #fff;
}
.draw_detail .draw_title {
  padding: 1.5rem 0 0;
}
.draw_detail .draw_title .price {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding-top: 0.25rem;
  gap: 0.5rem;
}
.draw_detail .draw_title .cardround {
  padding: 1.75rem 0;
  margin: 1.5rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.draw_detail .draw_title .cardround .data {
  width: 50%;
  text-align: center;
}
.draw_detail .draw_title .cardround .data:first-child {
  border-right: 1px solid #DFDFDF;
}
.draw_detail .draw_title .cardround .data .icon {
  width: 1.5rem;
  margin: 0 auto 0.5rem;
}
.draw_detail .draw_title .cardround .data .txt {
  margin-top: 0.25rem;
  font-size: var(--span1-f);
  font-weight: var(--bold-f);
}
.draw_detail .icon_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
}
.draw_detail .draw_onging {
  margin-top: 1.5rem;
  padding: 2rem 0 3.75rem;
  border-top: 1px solid #DFDFDF;
}
.draw_detail .draw_onging .txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
}
.draw_detail .draw_onging .draw_gage {
  padding: 0 1.25rem;
  width: 100%;
}
.draw_detail .draw_onging .draw_gage .gage_block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  width: 100%;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar {
  width: 50%;
  height: 7.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  position: relative;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar .bbpop {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  position: absolute;
  z-index: 1;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar p {
  width: 2rem;
  min-height: 0.625rem;
  border-radius: 0.25rem 0.25rem 0 0;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar p.bar_green {
  background: #00B400;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar p.bar_red {
  background: #F44432;
}
.draw_detail .draw_onging .draw_gage .gage_block .bar p.bar_fix {
  background: #C9C9C9;
  height: 50%;
}
.draw_detail .draw_onging .draw_gage .gage_block.bar_block {
  position: relative;
}
.draw_detail .draw_onging .draw_gage .gage_block.bar_block::after {
  content: "";
  position: absolute;
  border-top: 1px dotted #DFDFDF;
  width: 100%;
  height: 1px;
  top: 50%;
  left: 0;
  display: block;
}
.draw_detail .draw_onging .draw_gage .gage_block .gage_info {
  width: 50%;
  margin-top: 0.75rem;
}
.draw_detail .draw_onging .draw_gage .gage_block .gage_info .h3_f {
  margin-bottom: 0.25rem;
}
.draw_detail .draw_next {
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  padding: 2rem 0;
  border-bottom: 0.5rem solid #DFDFDF;
}
.draw_detail .draw_next .d_title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-bottom: 2rem;
  padding: 0 1.25rem;
  position: relative;
}
.draw_detail .draw_next .d_title .ticket_al {
  position: absolute;
  right: 1.25rem;
  top: -0.5rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  color: #F44432;
  background: url(../images/icon/clock_red.svg) no-repeat;
  background-position: center top;
  background-size: 1.5rem;
  padding-top: 1.75rem;
}
.draw_detail .draw_next .next_slide {
  width: 100%;
}
.draw_detail .draw_next .next_slide .next_item {
  width: 11.25rem;
}
.draw_detail .draw_next .next_slide .next_item .img {
  border-radius: 0.5rem;
  overflow: hidden;
  position: relative;
  background: #2F2F2F;
  margin-bottom: 0.5rem;
}
.draw_detail .draw_next .next_slide .next_item .img .next_time {
  position: absolute;
  bottom: 0.5rem;
  left: 0.5rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  color: #fff;
  padding: 0.25rem 0.5rem;
  background: #2F2F2F;
}
.draw_detail .draw_next .next_slide .next_item .img img {
  opacity: 0.6;
}
.draw_detail .draw_next .next_slide .next_item:first-child {
  margin-left: 1.25rem;
}
.draw_detail .draw_next .next_slide .next_item:last-child {
  margin-right: 1.25rem;
}
.draw_detail .draw_next .next_slide .p4_fb {
  margin-top: 0.125rem;
}
.draw_detail .lottery {
  color: #00B400;
  text-align: center;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05);
  border-radius: 1rem;
  padding: 1.5rem 1rem;
  margin: 1.5rem 0;
}
.draw_detail .lottery.none {
  color: #9F9F9F;
}
.draw_detail .lottery .lo_list p {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  background: #F5F5F5;
  border-radius: 0.5rem;
  margin: 0.5rem 0;
  padding: 0.5rem 0;
}
.draw_detail .lottery .lo_list p:first-child {
  padding-top: 0.9375rem;
}
.draw_detail .lottery .lo_list p:last-child {
  margin-bottom: 0;
}
.draw_detail .draw_tc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 1.75rem;
}
.draw_detail .draw_tc .data {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.draw_detail .draw_tc .data .icon {
  width: 1.5rem;
  height: 1.5rem;
  margin-bottom: 0.5rem;
  background-position: center;
  background-size: 1.5rem;
  background-repeat: no-repeat;
}
.draw_detail .draw_tc .data .icon.icon_t {
  background-image: url(../images/icon/icon_ticket.svg);
}
.draw_detail .draw_tc .data .icon.icon_u {
  background-image: url(../images/icon/icon_user_gr.svg);
}
.draw_detail .draw_tc .data .txt {
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-top: 0.125rem;
}
.draw_detail .draw_tc .data:first-child {
  border-right: 1px solid #DFDFDF;
}
.draw_detail .draw_tc + .lottery {
  margin: 3.75rem 0 0;
}
.draw_detail .misson_how {
  padding: 2rem 1.25rem 8rem;
  background: #F5F5F5;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
  line-height: 1.5;
}
.draw_detail .misson_how .title {
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  padding-bottom: 0.25rem;
}
.draw_detail .misson_how .how_list .list_txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  background: #fff;
  border: 1px solid rgba(0, 180, 0, 0.2);
  padding: 1rem 0.75rem;
  border-radius: 0.5rem;
  margin-top: 0.75rem;
}
.draw_detail .misson_how .how_list .list_txt .no {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #00B400;
  width: 1rem;
}
.draw_detail .misson_how .how_list .list_txt .txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  width: calc(100% - 1rem);
}
.draw_detail .mission_status {
  padding: 0.5rem 0 0.5rem;
}
.draw_detail .mission_status .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  font-size: var(--p7-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-bottom: 1rem;
}
.draw_detail .mission_status .status_data .data_list {
  position: relative;
  margin-bottom: 1.5rem;
}
.draw_detail .mission_status .status_data .data_list .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  padding-bottom: 0.3125rem;
}
.draw_detail .mission_status .status_data .data_list .bar_bg {
  position: relative;
  border-radius: 3rem;
  background-color: #F5F5F5;
  height: 0.5rem;
  width: 100%;
  overflow: hidden;
}
.draw_detail .mission_status .status_data .data_list .bar_bg .bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 3rem;
}
.draw_detail .mission_status .status_data .data_list .now {
  position: absolute;
  font-size: var(--span3-f);
  color: #9F9F9F;
  right: 0;
  top: 0.25rem;
}
.draw_detail .cl_preview {
  padding: 1.125rem 0 2rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.draw_detail .cl_preview .preview {
  height: 37.5rem;
  overflow: hidden;
}
.draw_detail .cl_preview .preview.open {
  height: auto;
}
.draw_detail .cl_preview .btn_wrap {
  padding: 0.5rem 1rem 0;
}

.draw_not {
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  justify-items: center;
  gap: 1rem;
  z-index: 11;
}
.draw_not .txt {
  color: #fff;
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  width: 100%;
  text-align: center;
  padding: 0.25rem 0;
}

.ticket_input {
  background-color: #F5F5F5;
  border-radius: 0.5rem;
  padding: 1rem 0.75rem;
  width: 100%;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.ticket_input:hover {
  background: rgba(0, 180, 0, 0.05);
}
.ticket_input:hover::before {
  opacity: 0;
  z-index: -1;
}
.ticket_input input {
  padding: 0;
  background: transparent;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  input: valid;
}
.ticket_input input:hover {
  background-color: transparent;
}

.draw_detail + .notice {
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding-top: 2rem;
}
.draw_detail + .notice .cs_block {
  padding: 1.5rem 0 0;
  border-top: 1px solid #DFDFDF;
  margin-top: 2rem;
}

.mission_top {
  padding-top: 1rem;
  padding-bottom: 2rem;
}
.mission_top .title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-bottom: 0.5rem;
}
.mission_top .btn_white {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mission_top .cashbtn {
  border-radius: 0.5rem;
  padding: 0.8125rem 0.75rem 0.8125rem 3rem;
  display: block;
  margin-top: 1.5rem;
  background: #00B400 url(../images/icon/icon_cash.svg) no-repeat;
  background-size: 2rem;
  background-position: 0.75rem center;
  position: relative;
}
.mission_top .cashbtn::after {
  content: "";
  width: 1.25rem;
  height: 1.25rem;
  background: url(../images/icon/right_wt.svg) no-repeat;
  background-size: 1.25rem;
  position: absolute;
  top: 50%;
  right: 1rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.mission_top.ms_lgn .btn_white {
  display: none;
}
.mission_top.ms_lgn .ms_my {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mission_top.ms_lgn .cashbtn {
  margin-top: 1rem;
}
.mission_top .mission_day {
  position: relative;
}
.mission_top .mission_day .date {
  font-size: var(--span2-f);
  color: #C9C9C9;
}
.mission_top .mission_day .name {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  margin-top: 0.5rem;
}
.mission_top .mission_day .alramBtn {
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(../images/icon/noti_green.svg);
  background-repeat: no-repeat;
  background-size: 1.5rem;
  background-position: center top;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #00B400;
  padding-top: 1.75rem;
  width: 2.875rem;
  text-align: center;
}
.mission_top .mission_day .alramBtn.off {
  background-image: url(../images/icon/noti_gray.svg);
  color: #9F9F9F;
}
.mission_top .date_cal {
  padding: 1rem 0 0.5rem;
  width: calc(100% + 2.5rem);
  -webkit-transform: translateX(-1.25rem);
          transform: translateX(-1.25rem);
}
.mission_top .date_cal .swiper-wrapper {
  gap: 0.75rem;
}
.mission_top .date_cal .swiper-wrapper.one_week {
  gap: initial;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.mission_top .date_cal .swiper-slide {
  font-size: var(--span2-f);
  color: #C9C9C9;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: 5px solid #DFDFDF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.mission_top .date_cal .swiper-slide:first-child {
  margin-left: 2rem;
}
.mission_top .date_cal .swiper-slide:last-child {
  margin-right: 2rem;
}
.mission_top .date_cal .swiper-slide.pastdone {
  border-color: #00B400;
}
.mission_top .date_cal .swiper-slide.today {
  border-color: #2F2F2F;
  color: #2F2F2F;
}
.mission_top .mission_ani {
  width: 13.75rem;
  height: 13.75rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  margin: 1.5rem auto;
  padding: 1.25rem;
}
.mission_top .mission_ani .ani_con {
  border-radius: 50%;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-box-shadow: inset 1px 2px 8px rgba(0, 0, 0, 0.07);
          box-shadow: inset 1px 2px 8px rgba(0, 0, 0, 0.07);
  position: relative;
}
.mission_top .mission_ani .ani_con .water_bg {
  position: absolute;
  width: 170%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: waterbg 1.5s ease-out;
          animation: waterbg 1.5s ease-out;
}
.mission_top .mission_ani .ani_con .ani_txt {
  text-align: center;
  position: absolute;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 1.25rem;
  color: #fff;
}

.ms_my {
  border-radius: 0.625rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1.5rem 0;
  margin-top: 0.5rem;
  display: none;
  border: 1px solid #F5F5F5;
}
.ms_my .ms_mydata {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
}
.ms_my .ms_mydata:first-child {
  border-right: 1px solid #DFDFDF;
}
.ms_my .ms_mydata .mydata_t {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.125rem;
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
}

.mission_checklist {
  padding-bottom: 5rem;
  position: relative;
}
.mission_checklist .bb {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: -3rem;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  white-space: nowrap;
}
.mission_checklist .check_data {
  position: relative;
  border-radius: 0.5rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  margin-bottom: 0.75rem;
  padding: 1.5rem 1rem 1.25rem 4.75rem;
  border: 1px solid transparent;
  background-size: 3rem;
  background-repeat: no-repeat;
  background-position: 1rem center;
  background-image: url(../images/icon/water_color.svg);
}
.mission_checklist .check_data .name {
  font-size: var(--span2-f);
  margin-bottom: 0.5rem;
}
.mission_checklist .check_data .time_setting {
  font-size: var(--misc2-f);
  -webkit-text-decoration: var(--line-under);
          text-decoration: var(--line-under);
  color: #9F9F9F;
  position: absolute;
  right: 1rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: right;
}
.mission_checklist .check_data.now {
  border-color: #00B400;
}
.mission_checklist .check_data.done {
  background-image: url(../images/icon/water_gray.svg);
  background-color: #F5F5F5;
  color: #9F9F9F;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.start_overlay {
  position: fixed;
  background: rgba(0, 0, 0, 0.6);
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 999;
}
.start_overlay .overlay_con {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  position: absolute;
  top: 40%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: grid;
  justify-items: center;
}
.start_overlay .overlay_con .txt {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #fff;
  padding: 0.375rem 0 1rem;
}
.start_overlay .overlay_con .btn_white {
  color: #00B400;
  font-weight: initial;
}
.start_overlay .misc2_under {
  color: #fff;
  position: absolute;
  bottom: 3.875rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.clg_visual {
  position: relative;
}
.clg_visual .visual_data {
  position: relative;
  width: 13.75rem;
  height: 18.75rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  background: #fff;
  margin: 0 auto;
  border-radius: 1rem;
  padding-top: 4.75rem;
}
.clg_visual .visual_data .water_bg {
  width: 8.375rem;
  height: 8.375rem;
  border: 0.75rem solid #fff;
  border-radius: 50%;
  overflow: hidden;
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1), inset 1px 2px 8px rgba(0, 0, 0, 0.07);
}
.clg_visual .visual_data .water_bg .water_ani {
  width: 200%;
  height: 200%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  position: absolute;
  left: 50%;
  bottom: -60%;
}
.clg_visual .visual_data .img {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.clg_visual .visual_data::before {
  content: "";
  width: 9.75rem;
  border-radius: 1rem;
  height: 13.375rem;
  position: absolute;
  left: -11.375rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
}
.clg_visual .visual_data::after {
  content: "";
  width: 9.75rem;
  border-radius: 1rem;
  height: 13.375rem;
  position: absolute;
  right: -11.375rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
}
.clg_visual .visual_data .txt {
  font-size: var(--h1-f);
  font-weight: var(--bold-f);
  color: #00B400;
  padding-top: 1.875rem;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.clg_visual .visual_data .txt::after {
  content: "";
  position: absolute;
  width: calc(100% + 1.5rem);
  height: 0.75rem;
  background: rgba(0, 180, 0, 0.05);
  bottom: 0;
  left: -0.75rem;
}

.mission_con .con_bn {
  padding-bottom: 1.25rem;
}
.mission_con .con_bn .banner {
  padding: 2rem 1rem 1rem;
  -webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
  border-radius: 0.625rem;
  margin-bottom: 0.75rem;
  background-size: 8rem;
  background-repeat: no-repeat;
  background-position: calc(100% - .5rem) center;
  position: relative;
  overflow: hidden;
}
@media (max-device-width: 359px) {
  .mission_con .con_bn .banner {
    background-size: 35.6546vw;
  }
}
.mission_con .con_bn .banner .b_title {
  font-size: var(--p6-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding-left: 0.25rem;
}
.mission_con .con_bn .banner .b_s {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin: 0.5rem 0 0.75rem;
  color: #747474;
  padding-left: 0.25rem;
}
.mission_con .con_bn .banner .pre {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(47, 47, 47, 0.6);
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.mission_con .con_bn .banner .ms_enter {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #747474;
  height: 1.25rem;
  background: url(../images/icon/right.svg) no-repeat;
  background-size: 1.25rem;
  background-position: right center;
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-right: 1.25rem;
  line-height: 1.25rem;
  padding-left: 0.25rem;
}
.mission_con .con_bn .banner .btn_icon {
  margin-top: 1.75rem;
  font-size: var(--span4-f);
  font-weight: var(--bold-f);
  padding: 0.5rem 0.5rem 0.5rem 1.625rem;
  background-repeat: no-repeat;
  background-size: 1.25rem;
  background-position: 0.25rem center;
  background-image: url(../images/icon/ms_now.svg);
}
.mission_con .con_bn .banner.gr {
  background-image: url(../images/ms_banner01.svg);
}
.mission_con .con_bn .banner.gr .b_title {
  color: #00B400;
}
.mission_con .con_bn .banner.gr .btn_icon {
  color: #00B400;
  background-color: rgba(0, 180, 0, 0.05);
}
.mission_con .con_bn .banner.bl {
  background-image: url(../images/ms_banner02.svg);
}
.mission_con .con_bn .banner.bl .b_title {
  color: #00ABEA;
}
.mission_con .con_bn .banner.bl .btn_icon {
  color: #00ABEA;
  background-color: rgba(0, 171, 234, 0.05);
}
.mission_con .con_bn .banner.or {
  background-image: url(../images/ms_banner03.svg);
}
.mission_con .con_bn .banner.or .b_title {
  color: #ff8e00;
}
.mission_con .con_bn .banner.or .btn_icon {
  color: #ff8e00;
  background-color: rgba(255, 198, 15, 0.05);
}

.ms_dailycheck .check_list {
  padding: 1.5rem 0 2rem;
  position: relative;
}
.ms_dailycheck .check_list .check_title {
  position: relative;
  margin-bottom: 1rem;
}
.ms_dailycheck .check_list .check_title .title {
  font-size: var(--h3-f);
  font-weight: var(--bold-f);
  padding-bottom: 0.25rem;
}
.ms_dailycheck .check_list .check_title .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  font-size: var(--span2-f);
  color: #9F9F9F;
}
.ms_dailycheck .check_list .check_title .date .icon_now {
  display: block;
  border: 1px solid #00B400;
  color: #00B400;
  background: url(../images/icon/heart_green.svg) no-repeat;
  background-size: 0.75rem;
  background-position: 0.3125rem center;
  padding: 0.3125rem 0.5rem 0.3125rem 1.25rem;
  font-size: var(--span4-f);
}
.ms_dailycheck .check_list .check_title .reward {
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: right;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-left: 1.375rem;
  background: url(../images/icon/icon_ticket.svg) no-repeat;
  background-size: 1.25rem;
  background-position: left center;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #747474;
}
.ms_dailycheck .check_list .check_data {
  background-color: rgba(0, 180, 0, 0.05);
  padding: 1rem;
  border-radius: 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.ms_dailycheck .check_list .check_data .data {
  border: 1px solid #DFDFDF;
  width: 3.625rem;
  height: 3.625rem;
  border-radius: 50%;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #DFDFDF;
}
.ms_dailycheck .check_list .check_data .data.done {
  color: #00B400;
  border-color: #00B400;
}
@media (max-device-width: 359px) {
  .ms_dailycheck .check_list .check_data .data {
    width: 15.0418vw;
    height: 15.0418vw;
  }
}
.ms_dailycheck .check_list .check_data.ms_full {
  padding: 1rem 0.4375rem;
}
.ms_dailycheck .check_list .check_data.ms_full .pre {
  display: grid;
  justify-items: center;
  grid-template-columns: repeat(5, 1fr);
  width: 100%;
  gap: 0.75rem 0.25rem;
}
.ms_dailycheck .check_list .check_data.ms_full .more {
  width: 100%;
  display: none;
}
.ms_dailycheck .check_list .check_data.ms_full .more .list {
  display: grid;
  justify-items: center;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.75rem 0.25rem;
}
.ms_dailycheck .check_list .check_data.ms_full .moreBtn {
  text-align: center;
  border-top: 1px solid #DFDFDF;
  padding-top: 1rem;
  width: 100%;
  margin-top: 0.25rem;
}
.ms_dailycheck .check_list .check_data.ms_full .moreBtn .txt {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  color: #747474;
  background-image: url(../images/icon/down.svg);
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 1.375rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background-size: 1.25rem;
  margin: 0 auto;
  line-height: 1.25rem;
}
.ms_dailycheck .check_list .check_data.ms_full .moreBtn .txt.open {
  background-image: url(../images/icon/top.svg);
}
.ms_dailycheck .check_list.fail .check_title .reward {
  background-image: url(../images/icon/icon_ticket_gray.svg);
}
.ms_dailycheck .check_list.fail .check_data {
  background: #F5F5F5;
}

/* ------------- 채팅상담 ---------------- */
.chat_wrap {
  position: relative;
}
.chat_wrap .chat_top {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #F5F5F5;
  position: relative;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.chat_wrap .chat_top .top_pf {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.chat_wrap .chat_top .top_pf .p_img {
  position: relative;
}
.chat_wrap .chat_top .top_pf .p_img .img {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: 2px solid #C9C9C9;
  overflow: hidden;
  position: relative;
}
.chat_wrap .chat_top .top_pf .p_img .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.chat_wrap .chat_top .top_pf .p_img .now {
  position: absolute;
  display: block;
  width: 0.875rem;
  height: 0.875rem;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #C9C9C9;
  right: 0;
  bottom: 0;
}
.chat_wrap .chat_top .top_pf .p_img .now.online {
  background-color: #00B400;
}
.chat_wrap .chat_top .top_pf .top_name .span2_f {
  margin-bottom: 0.3125rem;
}
.chat_wrap .chat_top .top_pf .top_name .span2_f .gray02 {
  font-weight: initial;
  margin-left: 0.125rem;
}
.chat_wrap .chat_top .chat_icons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
}
.chat_wrap .chat_top .chat_icons .iconBtn {
  background-color: #F5F5F5;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  background-size: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-transition: all 0.1s;
  transition: all 0.1s;
}
.chat_wrap .chat_top .chat_icons .iconBtn.active {
  background-color: #00B400;
}
.chat_wrap .chat_top .chat_icons .iconBtn.active.micBtn {
  background-image: url(../images/icon/mic_wt.svg);
}
.chat_wrap .chat_top .chat_icons .iconBtn.active.camBtn {
  background-image: url(../images/icon/cam_wt.svg);
}
.chat_wrap .chat_top .chat_icons .micBtn {
  background-image: url(../images/icon/mic_gr.svg);
}
.chat_wrap .chat_top .chat_icons .camBtn {
  background-image: url(../images/icon/cam_gr.svg);
}
.chat_wrap .chat_top .chat_icons .errorBtn {
  width: 2rem;
  height: 2rem;
  background: #F44432 url(../images/icon/declaration.svg) no-repeat;
  background-size: 1.25rem;
  border-radius: 50%;
  background-position: center;
}
.chat_wrap .chat_main {
  height: calc(100svh - 9.75rem);
  overflow: auto;
  padding: 0.25rem 1rem 1rem;
  overflow-x: hidden;
}
.chat_wrap .chat_main .chat_info {
  position: relative;
  padding: 0.75rem 0;
}
.chat_wrap .chat_main .chat_info .span3_f {
  color: #9F9F9F;
  padding: 0.25rem 0.625rem;
  margin: 0 auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: #fff;
  position: relative;
  z-index: 1;
  text-align: center;
}
.chat_wrap .chat_main .chat_info .border {
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  background: #C9C9C9;
  top: 50%;
  left: 0;
}
.chat_wrap .chat_main .msg {
  padding: 0.5rem 0;
}
.chat_wrap .chat_main .msg .chat_block {
  padding: 0.375rem 0;
}
.chat_wrap .chat_main .msg .chat_block .msg_group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.chat_wrap .chat_main .msg .chat_block .msg_group .msg_txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  padding: 0.5rem 0.75rem;
  margin: 0.125rem 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 85%;
}
.chat_wrap .chat_main .msg .chat_block .msg_group .msg_time {
  font-size: var(--span4-f);
  color: #9F9F9F;
  padding: 0.125rem 0;
}
.chat_wrap .chat_main .msg .chat_block .msg_loading {
  margin-top: 1rem;
  background: #F5F5F5;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.75rem 0.6875rem;
  font-size: 0.125rem;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
}
.chat_wrap .chat_main .msg .chat_block .msg_loading span {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  background: #DFDFDF;
  border-radius: 50%;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  margin: 0 0.0625rem;
}
.chat_wrap .chat_main .msg .chat_block .msg_loading span.ld_1 {
  -webkit-animation: chat_ld 1s linear infinite;
          animation: chat_ld 1s linear infinite;
}
.chat_wrap .chat_main .msg .chat_block .msg_loading span.ld_2 {
  -webkit-animation: chat_ld 1s 0.3s linear infinite;
          animation: chat_ld 1s 0.3s linear infinite;
}
.chat_wrap .chat_main .msg .chat_block .msg_loading span.ld_3 {
  -webkit-animation: chat_ld 1s 0.6s linear infinite;
          animation: chat_ld 1s 0.6s linear infinite;
}
.chat_wrap .chat_main .msg.chat_l .chat_block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0.5rem;
}
.chat_wrap .chat_main .msg.chat_l .chat_block .l_img {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: 1px solid #DFDFDF;
  overflow: hidden;
  margin-top: 0.125rem;
}
.chat_wrap .chat_main .msg.chat_l .chat_block .l_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.chat_wrap .chat_main .msg.chat_l .chat_block .msg_group {
  width: calc(100% - 2.5rem);
}
.chat_wrap .chat_main .msg.chat_l .chat_block .msg_group .msg_txt {
  background: #F5F5F5;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
}
.chat_wrap .chat_main .msg.chat_r .chat_block .msg_group {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.chat_wrap .chat_main .msg.chat_r .chat_block .msg_group .msg_txt {
  background: #00B400;
  color: #fff;
  border-radius: 0.5rem 0 0.5rem 0.5rem;
  margin: 0.125rem 0;
}
.chat_wrap .chat_main .btn_list {
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
  padding-left: 3.25rem;
  padding-bottom: 1rem;
}
.chat_wrap .chat_main .btn_list .btn_border {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid;
  border-radius: 3rem;
  padding: 0.5rem 0.75rem;
}
.chat_wrap .chat_main .btn_list .btn_border:last-child {
  margin-right: 1rem;
}
.chat_wrap .chat_main .btn_list .btn_type {
  width: 266px;
  border-radius: 0.5rem;
  border: 1px solid #DFDFDF;
  padding: 1rem 0.75rem;
  background-image: url(../images/icon/radioBtn_off.svg);
  background-repeat: no-repeat;
  background-size: 2rem;
  background-position: calc(100% - .75rem) 1rem;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.chat_wrap .chat_main .btn_list .btn_type:last-child {
  margin-right: 1.25rem;
}
@media (max-device-width: 359px) {
  .chat_wrap .chat_main .btn_list .btn_type {
    width: 74.0947vw;
    background-size: 8.9136vw;
  }
}
.chat_wrap .chat_main .btn_list .btn_type .thumb {
  width: 5.375rem;
}
@media (max-device-width: 359px) {
  .chat_wrap .chat_main .btn_list .btn_type .thumb {
    width: 23.9554vw;
  }
}
.chat_wrap .chat_main .btn_list .btn_type .title {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #747474;
  margin-block: 0.625rem 0.4375rem;
}
.chat_wrap .chat_main .btn_list .btn_type .info_txt {
  background-color: #F5F5F5;
  padding: 0.5rem 0.75rem;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #9F9F9F;
}
.chat_wrap .chat_main .btn_list .btn_type.active {
  border-color: #00B400;
  background-image: url(../images/icon/radioBtn_on.svg);
}
.chat_wrap .chat_main .btn_center {
  padding: 1rem 0;
  text-align: center;
}
.chat_wrap .chat_main .btn_center .btn_basic {
  margin: 0 auto;
  background: rgba(0, 180, 0, 0.1);
  color: #00B400;
  padding: 0.5rem 0.75rem;
  font-weight: initial;
}
.chat_wrap .chat_main .btn_center .btn_l {
  padding-top: 1rem;
}
.chat_wrap .chat_main .btn_center .btn_l .btn_basic {
  margin: 0 0.125rem;
}
.chat_wrap .chat_main .chat_wt {
  background: #F5F5F5;
  text-align: center;
  padding: 0.875rem 0.75rem;
  margin: 1rem 0;
}
.chat_wrap .chat_main .chat_wt .system_red {
  padding-top: 0.625rem;
}
.chat_wrap .chat_main .chat_card {
  border: 1px solid #DFDFDF;
  padding: 1rem 0.75rem;
  margin: 0.375rem 0.25rem 1rem;
  border-radius: 0.5rem;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
}
.chat_wrap .chat_main .chat_card .sur_point {
  padding: 0 0.25rem;
}
.chat_wrap .chat_main .chat_card .sur_point .h1_f {
  padding-bottom: 0.125rem;
}
.chat_wrap .chat_main .chat_card .sur_info {
  background: #F5F5F5;
  margin: 1rem 0 1.5rem;
  padding: 1rem 0.75rem;
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75rem;
}
.chat_wrap .chat_main .chat_card .sur_info .info_l {
  color: #9F9F9F;
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
}
.chat_wrap .chat_main .chat_card .sur_info .info_r {
  font-size: var(--span3-f);
}
.chat_wrap .chat_main .chat_card .more_view {
  border-top: 1px solid #DFDFDF;
  padding: 0.75rem 0.25rem 0.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.chat_wrap .chat_main .chat_card .more_view .moreBtn {
  font-size: var(--span3-f);
  font-weight: var(--bold-f);
  color: #00B400;
  background: url(../images/icon/right_green_2.svg) no-repeat;
  background-position: right center;
  background-size: 1.25rem;
  padding-right: 1.5rem;
}
.chat_wrap .chat_main .chat_card .card_title {
  font-size: var(--p2-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  padding: 0 0.25rem 0.5rem 1.75rem;
  background-position: 0.25rem top;
  background-size: 1.25rem;
  background-repeat: no-repeat;
  border-bottom: 1px solid #DFDFDF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.chat_wrap .chat_main .chat_card .card_title.pack {
  background-image: url(../images/icon/icon_bottle.svg);
}
.chat_wrap .chat_main .chat_card .card_title.item {
  background-image: url(../images/icon/icon_pill.svg);
}
.chat_wrap .chat_main .chat_card .card_title.sur {
  background-image: url(../images/icon/icon_sur.svg);
}
.chat_wrap .chat_main .chat_card .item_list {
  padding: 0 0.25rem;
}
.chat_wrap .chat_main .chat_card .item_list .item_data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 1rem;
  gap: 0.5rem;
}
.chat_wrap .chat_main .chat_card .item_list .item_data .img {
  width: 4.125rem;
  height: 3rem;
  background: #F5F5F5;
  border-radius: 0.5rem;
  padding: 0.75rem 1.0625rem;
}
.chat_wrap .chat_main .chat_card .item_list .item_data .data_info {
  width: calc(100% - 4.625rem);
  position: relative;
}
.chat_wrap .chat_main .chat_card .item_list .item_data .data_info .name {
  padding: 0.25rem 0 0.5rem;
  font-size: var(--span2-f);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: calc(100% - 2.5rem);
}
.chat_wrap .chat_main .chat_card .item_list .item_data .check {
  position: absolute;
  top: 50%;
  right: 0;
  font-size: var(--span4-f);
  color: #9F9F9F;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.chat_wrap .chat_main .chat_card .sur_data {
  padding-top: 0.5rem;
}
.chat_wrap .chat_main .chat_card .sur_data .data_t {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 0.5rem;
}
.chat_wrap .chat_main .chat_card .sur_data .data_t .d_l {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #9F9F9F;
  max-width: 5rem;
  width: 25%;
}
.chat_wrap .chat_main .chat_card .sur_data .data_t .d_r {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  width: calc(100% - 5rem);
}
.chat_wrap .chat_main .chat_card .total_title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  margin-bottom: 0.5rem;
  color: #48494D;
}
.chat_wrap .chat_main .chat_card .total_data {
  margin-bottom: 1rem;
}
.chat_wrap .chat_main .chat_card .total_data .data_title {
  background-color: #F5F5F5;
  color: #48494D;
  border-radius: 0.5rem;
  padding: 0.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.125rem;
  font-size: var(--span2-f);
  margin-bottom: 0.75rem;
}
.chat_wrap .chat_main .chat_card .total_data .data_title img {
  width: 1.25rem;
}
.chat_wrap .chat_main .chat_card .total_data .data_item {
  display: grid;
  gap: 0.5rem;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item .item_l {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item .item_l .thumb {
  width: 1.5rem;
  height: 1.5rem;
  padding: 6px 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item .item_l .thumb img {
  width: 100%;
  height: 100%;
  max-width: 1.125rem;
  max-height: 0.625rem;
  -o-object-fit: contain;
     object-fit: contain;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item .item_l .txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  line-height: 1;
}
.chat_wrap .chat_main .chat_card .total_data .data_item .item .price {
  text-align: right;
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #747474;
  line-height: 1;
}
.chat_wrap .chat_main .chat_card .total_price {
  border-top: 1px solid #F5F5F5;
  padding-top: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.chat_wrap .chat_main .chat_card .total_price .title_l {
  display: grid;
  gap: 0.125rem;
}
.chat_wrap .chat_main .chat_card .total_price .title_l .title {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
}
.chat_wrap .chat_main .chat_card .total_price .title_l .sub {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #9F9F9F;
}
.chat_wrap .chat_main .chat_card .total_price .price {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  color: #00B400;
  text-align: right;
}
.chat_wrap .chat_main .chat_cardslid {
  padding: 0.5rem 0 0;
}
.chat_wrap .chat_main .chat_cardslid .p4_f {
  text-align: center;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide {
  padding: 1rem 0;
  width: calc(100% + 2rem);
  -webkit-transform: translateX(-1rem);
          transform: translateX(-1rem);
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card {
  max-width: 16.625rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  background-image: none;
  background-repeat: no-repeat;
  background-size: 2rem;
  background-position: calc(100% - .75rem) 0.75rem;
  margin: 0;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card .h1_f {
  padding-bottom: 0.375rem;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card .p4_f {
  text-align: left;
  margin-top: 0.25rem;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card .more_view {
  border-top: 0;
  padding: 0.5rem 0.25rem 0;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card:first-child {
  margin-left: 1.25rem;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card:last-child {
  margin-right: 1.25rem;
}
.chat_wrap .chat_main .chat_cardslid .sur_slide .chat_card.swiper-slide-active {
  border-color: #00B400;
  background-image: url(../images/icon/radioBtn_on.svg);
}
.chat_wrap .chat_main .chat_cardslid .btn_center {
  padding: 0.25rem 0 1rem;
}
.chat_wrap .chat_main .chat_l + .chat_card {
  margin-top: 1rem;
}
.chat_wrap .chat_main .chat_info + .btn_center {
  padding-top: 0;
}
.chat_wrap .chat_main .chat_wt + .chat_card {
  margin-top: 2rem;
}
.chat_wrap .chat_main .chat_card + .btn_center {
  padding-top: 0.25rem;
}
.chat_wrap .chat_bottom {
  position: relative;
}
.chat_wrap .chat_bottom .chat_write {
  position: relative;
  bottom: 0;
}
.chat_wrap .chat_bottom .chat_write .input_basic .msg_file {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 0.75rem;
}

.mov_chat {
  position: fixed;
  top: 5.75rem;
  right: 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  z-index: 999;
}
.mov_chat .mov_div {
  width: 6.5625rem;
  height: 8.75rem;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid rgba(47, 47, 47, 0.15);
  -webkit-box-shadow: 0px 0px 15px 0px rgba(35, 36, 38, 0.24);
          box-shadow: 0px 0px 15px 0px rgba(35, 36, 38, 0.24);
}

/* 영양제 추가하기 검색 */
.search_block .select_pharm {
  background: #fff;
  width: initial;
  -webkit-transform: initial;
          transform: initial;
  padding: 1rem 0 0;
}

.skeleton_loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  display: none;
}
.skeleton_loading .f12 {
  height: 0.875rem;
  width: 50%;
}
@media (max-device-width: 359px) {
  .skeleton_loading .f12 {
    height: 3.8997vw;
  }
}
.skeleton_loading .f13 {
  height: 0.875rem;
  width: 50%;
}
@media (max-device-width: 359px) {
  .skeleton_loading .f13 {
    height: 3.8997vw;
  }
}
.skeleton_loading .f15 {
  height: 1rem;
  width: 60%;
}
@media (max-device-width: 359px) {
  .skeleton_loading .f15 {
    height: 4.4568vw;
  }
}
.skeleton_loading .f18 {
  height: 1.25rem;
  width: 70%;
}
@media (max-device-width: 359px) {
  .skeleton_loading .f18 {
    height: 5.571vw;
  }
}
.skeleton_loading .f10 {
  height: 0.75rem;
  width: 70%;
}
@media (max-device-width: 359px) {
  .skeleton_loading .f10 {
    height: 3.3426vw;
  }
}
.skeleton_loading .thumb62 {
  width: 3.875rem;
  height: 3.875rem;
}
.skeleton_loading .thumb72 {
  width: 4.5rem;
  height: 4.5rem;
}
.skeleton_loading .btn_ld {
  height: 2.9375rem;
  width: 100%;
  margin: 0.25rem 0;
}
.skeleton_loading .thumb48 {
  width: 3.25rem;
  height: 4rem;
}
.skeleton_loading .thumb22 {
  width: 1.625rem;
  height: 2rem;
}
@media (max-device-width: 359px) {
  .skeleton_loading .thumb22 {
    width: 7.2423vw;
    height: 8.9136vw;
  }
}
.skeleton_loading .icon42 {
  width: 2.625rem;
  height: 2.625rem;
}
.skeleton_loading .icon32 {
  width: 2rem;
  height: 2rem;
}

.skeleton_loading * {
  background: linear-gradient(120deg, #eaeaea 30%, #eee 38%, #eee 40%, #eaeaea 48%);
  -webkit-animation: skeleton 2s infinite;
          animation: skeleton 2s infinite;
  background-position: 100% 0;
  background-size: 200% 100%;
  border-radius: 0.25rem;
}

.skeleton_loading.ld_black * {
  background: linear-gradient(120deg, #111 30%, #333 38%, #333 40%, #111 48%);
  -webkit-animation: skeleton 2s infinite;
          animation: skeleton 2s infinite;
  background-position: 100% 0;
  background-size: 200% 100%;
  border-radius: 0.25rem;
}

.skeleton_loading.ld_green * {
  background: linear-gradient(120deg, #00a800 30%, #00b200 38%, #00b200 40%, #00a800 48%);
  -webkit-animation: skeleton 2s infinite;
          animation: skeleton 2s infinite;
  background-position: 100% 0;
  background-size: 200% 100%;
  border-radius: 0.25rem;
}

.tutorial {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  opacity: 0;
  background-color: #333;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.tutorial .swiper-slide {
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  width: 100svw;
  height: 100svh;
}
.tutorial .btn_fix {
  bottom: 5rem;
}
.tutorial .btn_fix .tutorial_click {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 1rem;
  -webkit-animation: bounce 1.5s ease-in-out infinite;
          animation: bounce 1.5s ease-in-out infinite;
}
.tutorial .tutorial_01 {
  background-image: url(../images/tutorial_01.png);
  position: relative;
}
.tutorial .tutorial_01 .tutorial_link {
  display: block;
  position: absolute;
  left: 50%;
  top: 47svh;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 20.75rem;
  height: 13rem;
}
.tutorial .tutorial_02 {
  background-image: url(../images/tutorial_02.png);
}
.tutorial .tutorial_03 {
  background-image: url(../images/tutorial_03.png);
}
.tutorial .tutorial_04 {
  background-image: url(../images/tutorial_04.png);
}
.tutorial .tutorial_05 {
  background-image: url(../images/tutorial_05.png);
}
.tutorial .bottom_nav {
  position: fixed;
  bottom: 3rem;
  z-index: 100;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding: 0 2rem;
}
.tutorial .bottom_nav .swiper-button-next {
  display: block;
  background: url(../images/icon/rightb_wt.svg) no-repeat;
  width: 2rem;
  height: 2rem;
  position: initial;
  margin: 0;
}
.tutorial .bottom_nav .swiper-button-next::after {
  content: "";
}
.tutorial .bottom_nav .tutorialEndBtn.lastPage {
  bottom: 3.5rem;
}
.tutorial.open {
  opacity: 1;
  z-index: 10000;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.noti_box {
  background-color: #F5F5F5;
  padding: 0.5rem 0.75rem;
  border-radius: 0.75rem;
  margin: 0 0.25rem 1.75rem;
  text-align: center;
}
.noti_box .title {
  font-size: var(--span2-f);
  font-weight: var(--bold-f);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.125rem;
  padding-block: 0.125rem 0.5625rem;
  color: #747474;
}
.noti_box .txt {
  font-size: var(--p5-f);
  line-height: var(--line-h);
  color: #C9C9C9;
}

.notice_full {
  text-align: center;
  position: relative;
}
.notice_full .noti_con {
  position: fixed;
  top: 45%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 100%;
}
.notice_full .noti_con .icon {
  width: 3.125rem;
  height: 3.125rem;
  margin: 0 auto 0.75rem;
  opacity: 0.4;
}
.notice_full .noti_con .icon img {
  width: 100%;
  height: 100%;
}
.notice_full .noti_con .title {
  font-size: var(--h2-f);
  font-weight: var(--bold-f);
  margin-bottom: 1.5rem;
  color: #9F9F9F;
}
.notice_full .noti_con .txt {
  font-size: var(--p4-f);
  line-height: var(--line-h);
  margin-bottom: 1.5rem;
  color: #9F9F9F;
}
.notice_full .noti_con .date {
  font-size: var(--p3-f);
  line-height: var(--line-h);
  font-weight: var(--bold-f);
  line-height: 1;
  border-top: 1px solid #DFDFDF;
  border-bottom: 1px solid #DFDFDF;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  padding-block: 1rem;
  color: #9F9F9F;
}
.notice_full .noti_cs {
  color: #9F9F9F;
  font-size: var(--p4-f);
  line-height: var(--line-h);
  position: fixed;
  bottom: 4rem;
  width: 100%;
}

@media (min-width: 360px) and (min-height: 740px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 47svh;
  }
}
@media (min-height: 780px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 44svh;
  }
}
@media (min-width: 375px) and (min-height: 812px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 45svh;
    width: 22rem;
  }
}
@media (min-width: 410px) and (min-height: 820px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 48svh;
    width: 24rem;
    height: 15rem;
  }
}
@media (min-height: 890px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 45svh;
    width: 24rem;
  }
}
@media (min-width: 450px) and (min-height: 850px) {
  .tutorial .tutorial_01 .tutorial_link {
    top: 54svh;
    width: 29rem;
    height: 17rem;
  }
}