@charset "UTF-8";

/*button component*/
button {
  border: none;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: initial;
}

button.inner {
  position: absolute;
  height: 25px;
  right: 10px;
  top: 13px;
  padding: 7px 9px 8px;
  background-color: #1bbac8;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 1rem;
  border-radius: 4px;
}

button.inner.none-bg {
  background-color: #ffffff;
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #1bbac8;
  line-height: 1rem;
  letter-spacing: -0.041rem;
}

button.inner.ask {
  background-color: rgba(109, 118, 131, 0.1);
  border-radius: 10px;
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #1bbac8;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
  right: 30px;
}

button.inner.address {
  background-color: rgba(33, 220, 236, 0.1);
  border-radius: 4px;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #1bbac8;
  line-height: 1rem;
}

button.inner.change {
  background-color: #ffffff;
  border-radius: 4px;
  border: 1px solid rgba(33, 220, 236, 0.5);
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
  line-height: 1rem;
}

.button {
  text-align: center;
  display: flex;
  justify-content: center;
}
.button.margin-16-20 {
    margin: 16px 20px
}
.button--kakao {
  width: 100%;
  min-height: 50px;
  background-color: #fee500;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.button--kakao img {
  content: url(../images/kakao@2x.png);
  height: 24px;
}
.button--kakao span {
  margin-left: 10px;
  font-size: 1.8rem;
  font-family: "Pretendard-Medium";
  color: rgba(0, 0, 0, 0.85);
  line-height: 1.8rem;
}

.button--text {
  width: 100%;
  min-height: 50px;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #b0b0b0;
}
.button--text.active {
  background-color: #0caab8;
}
.button--text.active span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.4rem;
}
.button--text.lightblue {
  background-color: rgba(125, 254, 254, 0.5);
}
.button--text.lightblue span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
  line-height: 2.4rem;
}
.button--text.change {
  min-height: 0;
  background-color: #ffffff;
  border-radius: 4px;
  border: solid 1px rgba(33, 220, 236, 0.5);
  padding: 8px 13.7px 7px 12.3px;
}
.button--text.change span {
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 1rem;
}
.button--text.close {
  border-radius: 8px;
  border: solid 1px #aeb3b9;
  background-color: #f3f3f3;
}
.button--text.close span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.5rem;
}
.button--text.close-no-border {
  border-radius: 8px;
  background-color: #f3f3f3;
}
.button--text.close-no-border span{
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.5rem;
}
.button--text.modal-close {
  border: solid 1px #e9edf0;
  background-color: rgba(233, 237, 240, 0.2);
}
.button--text.modal-close span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.button--text.inactive {
  background-color: #b0b0b0;
  border: 1px solid #e9edf0;
}
.button--text span {
  font-size: 1.8rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 2.2rem;
}

.button--like {

}
.button--like img {
    width: 24px;
    height: 24px;
    content: url(../images/like-inactive@2x.png);
}
.button--like img.active {
    content: url(../images/like-detail-active@2x.png);
}

.button--order {
  width: 100%;
  min-height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 8px;
  border: solid 1px #0caab8;
  background-color: #f9f9f9;
}
.button--order span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.5rem;
}
.button--order:active {
  background-color: #0caab8;
}
.button--order:active span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #f9f9f9;
  line-height: 2.5rem;
}
.button--order:disabled {
  background-color: #f9f9f9;
  border: solid 1px #868b92;
}
.button--order:disabled span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #868b92;
  line-height: 2.5rem;
}

.button--cancel {
  width: 100%;
  min-height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 8px;
  border: solid 1px #0caab8;
  background-color: #f9f9f9;
}
.button--cancel span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.5rem;
}
.button--cancel.active {
  background-color: #0caab8;
}
.button--cancel.active span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #f9f9f9;
  line-height: 2.5rem;
}

.button--connect {
  width: 100%;
  min-height: 37px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 8px;
  background-color: rgba(33, 220, 236, 0.1);
}
.button--connect span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
  line-height: 25px;
}

.button--start {
  width: 100%;
  min-height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  border: solid 1px #0caab8;
  background-color: #ffffff;
}
.button--start span {
  font-size: 1.8rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.4rem;
  letter-spacing: -0.1rem;
}
.button--start.black {
    border: solid 1px #141414;
}
.button--start.black span{
    color: #141414;
}
.button .button_large_nomal_bg_white {
  width: 100%;
  min-height: 50px;
  font-size: 1.4rem;
  border-radius: 10px;
  border: solid 1px #0caab8;
  background-color: #ffffff;
}
.button .button_large_nomal_bg_white span {
  font-size: 1.8rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.4rem;
  letter-spacing: -0.1rem;
}
.button .button_medium_nomal_bg_white {
  width: 100%;
  min-height: 37px;
  font-size: 1.4rem;
  border-radius: 10px;
  border: solid 1px #0caab8;
  background-color: #ffffff;
}
.button .button_medium_nomal_bg_white span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.4rem;
  letter-spacing: -0.1rem;
}
.button .button_small {
  background-color: #1bbac8;
  color: #ffffff;
  min-width: 80px;
  font-size: 14px;
  line-height: 24px;
  border-radius: 10px;
  padding: 13px 6.6px 13px 6.9px;
}

.button-multi {
  justify-content: space-between;
}
@media (min-width: 768px) {
  .button-multi {
    justify-content: center;
  }
}

:root{
  /* 헤더와 푸터 높이 - login */
  --header-height: 48px;
  --footer-height: 165px;
  --findpassword-footer-height: 139px;
}

html {
  font-size: 62.5%;
}

html, body {
  width: 100%;
  height: 100%;
}
body {
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  font-family: "Pretendard-Medium";
  display: flex;
  flex-direction: column;
}
.body-wrapper_normal {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.body-wrapper_nocheckup {
    height: 100%;
    background-color: #f8f8f8;
    display: flex;
    flex-direction: column;
}
.body-wrapper_maincontents {
    display: flex;
    flex: 1;
    flex-direction: column;
}
.body_wrapper_scroll {
}

/* pc화면 대응 */
@media (min-width: 800px) {
    body {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 800px !important;
    }
    .body_wrapper_scroll {
    }
    .header {
        position: fixed;
        top: 0;
        left: 0;
        transform: none;
    }
    .tabbar {
        width: auto !important;
        margin-left: 0 !important;
    }
    .sub-tabbar {
        width: auto !important;
        margin-left: 0 !important;
    }
    .footer.fixed {
    }
    .toast {
        /* width: calc(100% - 688px) !important; */
    }
    .bottom-sheet-container {
    }
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
body, form, div, p, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, fieldset, th, td, input, textarea, button, select {
    margin: 0;
    padding: 0;
}
ol, ul {
	list-style: none;
}
input {
    vertical-align: middle;
    border-radius: 0px 0px;
    -webkit-appearance: none;
}
input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  outline: 0;
  vertical-align: middle;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type='number'] {
  -moz-appearance: textfield;
}
.header {
  background-color: #ffffff;
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 5;
}
.header.transparent {
  background-color: transparent;
}
.header-onboarding__back-container {
  cursor: pointer;
  padding-top: 40px;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.header-onboarding__back-container-wrapper {
  background-color: #e0f1fd;
  padding-top: 8px;
  padding-bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: fixed;
  z-index: 10;
}
.header-onboarding__back-container span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #118acb;
  letter-spacing: -0.007rem;
}
.header-onboarding__back-container img {
  height: 30px;
  content: url(../images/kmi-wink@2x.png);
  margin-left: 12px;
}
.toolbar {
  height: 48px;
  padding: 0px 20px;
}
.tabbar {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.sub-tabbar-medical-result {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 19px;
  padding-bottom: 19px;
}
.sub-tabbar-medical-result img {
  height: 24px;
}
.sub-tabbar-medical-result img.left {
  content: url(../images/icon-system-24-left@2x.png);
}
.sub-tabbar-medical-result img.right {
  content: url(../images/icon-system-24-right@2x.png);
}
.sub-tabbar-medical-result span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
  margin-left: 22px;
  margin-right: 22px;
}

.toolbar-home {
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.toolbar-home-left {
  display: flex;
}
.toolbar-home-left__logo {
  height: 28px;
  content: url(../images/main-logo-img@2x.png);
}
.toolbar-home-left__title {
  font-size: 2.4rem;
  color: #1bbac8;
  letter-spacing: -0.1rem;
}
.toolbar-home-right {
    display: flex;
    align-items: center;
}
.toolbar-home-right__none {
    display: flex;
}
.toolbar-home-right__none span {
    font-size: 1.4rem;
    line-height: 2.4rem;
    letter-spacing: -0.1rem;
    margin-left: 10px;
}
.toolbar-home-right__member span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
}
.toolbar-home-right__member img {
    width: 28px;
    height: 28px;
    vertical-align: middle;
    content: url(../images/ic-my@2x.png);
}
.toolbar-home-right__alarm {
    width: 28px;
    height: 28px;
    content: url(../images/ic-alarm@2x.png);
}
.toolbar-home-right__alarm.active {
    content: url(../images/alarm-active@2x.png);
}

.toolbar-setting {
  width: 100%;
  height: 46px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.toolbar-setting__back {
  position: absolute;
  z-index: 10;
  height: 25px;
}
.toolbar-setting__back img {
  cursor: pointer;
  height: 25px;
  content: url(../images/left_b@2x.png);
}
.toolbar-setting__title {
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  z-index: 1;
}
.toolbar-setting__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Medium";
  font-weight: 500;
  color: #141414;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.toolbar-setting__title img {
    width: 144px;
    height: 27px;
}
.toolbar-setting__info {
  width: 100%;
  display: flex;
  justify-content: right;
  align-items: end;
  position: absolute;
  z-index: 5;
}
.toolbar-setting__info__member span {
  margin-left: 10px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.4rem;
  letter-spacing: -0.01rem;
}
.toolbar-setting__info__alarm {
  height: 24px;
  margin-left: 10px;
  content: url(../images/alarm@2x.png);
}
.toolbar-setting__share {
    width: 100%;
    position: absolute;
    display: flex;
    justify-content: end;
    z-index: 1;
}
.toolbar-setting__share img {
    width: 28px;
    height: 28px;
    content: url(../images/ic-share@2x.png);
}
.toolbar-setting__close {
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: end;
  z-index: 2;
}
.toolbar-setting__close img {
  width: 28px;
  height: 28px;
  content: url(../images/close_g@2x.png);
}
.toolbar-setting__back {
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: start;
  z-index: 2;
}
.toolbar-setting__back img {
  width: 28px;
  height: 28px;
  content: url(../images/icon-system-28-left@2x.png);
}
.toolbar-new {
  height: 48px;
  padding: 0px 20px;
  box-sizing: border-box;
}
.toolbar-setting-new {
  height: 46px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.toolbar-setting-new__back {
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.toolbar-setting-new__back img {
  width: 100%;
  height: 100%;
  content: url(../images/ic-toolbar-left-arrow@2x.png);
}
.toolbar-setting-new__title {
  width: 148px;
  height: 28px;
}
.toolbar-setting-new__title img {
  width: 100%;
  height: 100%;
}
.toolbar-setting-new__close  {
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.toolbar-setting-new__close img {
  width: 100%;
  height: 100%;
  content: url(../images/close_g@2x.png);
}
.toolbar-setting__inner-close {
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: end;
  z-index: 1;
}
.toolbar-setting__inner-close img {
  width: 28px;
  height: 28px;
  content: url(../images/close_g@2x.png);
}

.hanwha-report-result__card-list-wrapper{
  margin-top: 32px;
}
.hanwha-report-result__card-list-title{
}


/*상품상세 header*/
.toolbar_product-detail {
    width: 100%;
    height: 46px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.toolbar_product-detail_back {
}
.toolbar_product-detail_back img {
    cursor: pointer;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    content: url(../images/left_b@2x.png);
}
.toolbar_product-detail_title {
    width: 100%;
    display: flex;
    justify-content: center;
    overflow: hidden;
    margin-left: 12px;
    visibility: hidden;
}
.toolbar_product-detail_title span {
    font-size: 1.8rem;
    font-family: "Pretendard-SemiBold";
    color: #353D4A;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.toolbar-activity-detail-pay {
  width: 100%;
  height: 46px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.toolbar-activity-detail-pay__back {
  position: absolute;
  z-index: 10;
}
.toolbar-activity-detail-pay__back img {
  height: 25px;
}
.toolbar-activity-detail-pay__back img.back {
  content: url(../images/left_b@2x.png);
}
.toolbar-activity-detail-pay__title {
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
}
.toolbar-activity-detail-pay__title.jc-normal {
  justify-content: normal;
}
.toolbar-activity-detail-pay__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
}
.toolbar-activity-detail-pay__close {
  position: absolute;
  z-index: 10;
  right: 0px;
}
.toolbar-activity-detail-pay__close img {
  height: 25px;
}
.toolbar-activity-detail-pay__close img.close {
  content: url(../images/close_g@2x.png);
}

.tabbar-nav {
  display: flex;
  justify-content: space-evenly;
}
.tabbar-nav__menu {
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: 1px solid #D5DAE3;
}
.tabbar-nav__menu.selected {
    border-bottom: 2px solid #1bbac8;
}
.tabbar-nav__menu span {
    padding: 10px 0px 10px 0px;
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #868B92;
}
.tabbar-nav__menu.selected span{
    font-family: "Pretendard-Bold";
    color: #1bbac8;
}

.sub-tabbar {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.sub-tabbar-nav {
  display: flex;
  justify-content: start;
  padding: 16px 20px;
  background-color: #f9f9f9;
  overflow-x: scroll;
  white-space: nowrap;
  flex-wrap: nowrap;
  scrollbar-width: none;
  padding-right: 48px;
}
.sub-tabbar-nav.expand {
  flex-wrap: wrap;
  padding: 16px 20px 10px 20px;
}
.sub-tabbar-nav__menu {
  display: flex;
  margin-right: 7px;
  background-color: #ffffff;
  border-radius: 27px;
  padding: 2px 12px;
  align-items: center;
}
.sub-tabbar-nav__menu.expand {
  margin-bottom: 6px;
}
.sub-tabbar-nav__menu img {
  width: 12.8px;
  height: 12.8px;
  margin-left: 4px;
  content: url(../images/subtab_star@2x.png);
}
.sub-tabbar-nav__menu:last-child {
  margin-right: 0px;
}
.sub-tabbar-nav__menu span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868B92;
  line-height: 22px;
  text-align: center;
}
.sub-tabbar-nav__menu--selected {
  background-color: #3a62ba;
}
.sub-tabbar-nav__menu--selected span {
  color: #ffffff;
  border-radius: 17px;
}
.custom-products-selected {
  border-radius: 17px;
  background: linear-gradient(105.39deg, #23D7C7, #225AEA) border-box;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.custom-products-selected span{
  color: #ffffff;
}
.sub-tabbar-nav.setting {
  background-color: #ffffff;
}
.sub-tabbar-nav.setting .sub-tabbar-nav__menu {
  border: solid 1px #f8f8f8;
  border-radius: 27px;
  margin-right: 5px;
}
.sub-tabbar-expand-btn {
  position: absolute;
  top: 0px;
  right: 0;
  padding: 17px 12px;
  background: linear-gradient(90deg, rgba(248, 248, 248, 0) 0%, #F8F8F8 20.83%);
}
.sub-tabbar-expand-btn img {
  width: 24px;
  height: 24px;
  content: url(../images/icon-system-down-mini@2x.png);
}
.sub-tabbar-expand-btn img.expand {
  content: url(../images/icon-system-up-mini@2x.png);
}

.search {
}
.search-wrapper {
  padding: 12px 20px 32px 20px;
  display: flex;
  justify-content: space-between;
  background-color: rgba(238, 238, 238, 0.35);
}
.search .input-box {
  flex-basis: 75%;
  margin-top: 0px;
}
.search .input-box input {
  height: 40px;
}
.search .input-box img {
  display: block;
  position: absolute;
  height: 24px;
  right: 10px;
  top: 8px;
  z-index: 10;
}
.search .input-box img.search {
  content: url(../images/icon-system-24-search@2x.png);
}
.search__input {
  width: 100%;
}
.search__filter {
    background-color: #ffffff;
    border-radius: 12px;
    border: solid 1px #D5DAE2;
    margin-right: 8px;
    width: 100px;
}
.activity-selectbox {
    position: relative;
    height: 100%;
    width: 100%;
    cursor: pointer;
}
.activity-selectbox img {
    height: 18px;
    content: url("https://cdn.vitaport.co.kr/images/icon-system-down-mini@2x.png");
}
.activity-selectbox .label {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    border: 0 none;
    outline: 0 none;
    background: transparent;
    cursor: pointer;
    font-family: "Pretendard-Regular";
    font-size: 1.4rem;
    color: #484E56;
    line-height: 21px;
    justify-content: space-between;
    padding: 0px 10px;
    white-space: nowrap;
}
.activity-selectbox ul.optionList {
    position: absolute;
    top: 48px;
    left: -1px;
    background: #ffffff;
    border-radius: 10px;
    z-index: 2;
    list-style-type: none;
    visibility: hidden;
    width: 100%;
    border: 1px solid #D5DAE2;
    padding: 10px 0px;
}
.activity-selectbox .optionList.active {
    visibility: visible;
}
.activity-selectbox .optionList li {
    margin-bottom: 12px;
    margin-left: 12px;
}
.activity-selectbox .optionList li:last-child {
    margin-bottom: 0px;
}
.activity-selectbox .optionList li span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
}
.activity-selectbox .optionItem {
}
.activity-selectbox .optionItem:last-child {
    border-bottom: 0 none;
}

/* 검색 결과가 없습니다. */
.no-search-results {
  display: none;
  flex-direction: column;
  height: 100%;
  align-items: center;
  padding: 120px 100px;
}
.no-search-results img {
  height: 72px;
  width: 72px;
  content: url(../images/icon-90-heart@2x.png);
}
.no-search-results span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868B92;
  line-height: 21px;
}

.contents .message-error {
  display: none;
}

.contents {
  padding-left: 0px !important;
  padding-right: 0px !important;
  padding-bottom: 0px !important;
  flex: 1;
}

.contents.center {
  text-align: center;
  flex: none;
}

.contents-login {
  flex: 1;
  overflow-y: auto;
  height: 100%;
  display: flex;
}

.footer {
  width: 100%;
  border-radius: 20px 20px 0 0;
  padding-bottom: 0px !important;
}
.footer.fixed {
  width: 100%;
  position: sticky;
  bottom: 0;
  border-radius: 20px 20px 0 0;
  z-index: 10;
}
.footer.fixed .log {
  background-color: white;
  display: flex;
  flex-direction: column;
  max-height: 100px;
  overflow-y: auto;
}
.footer.hanwha {
    width: 100%;
    position: fixed;
    bottom: 0;
    border-radius: 20px 20px 0 0;
    z-index: 10;
}

.ask-remember-find-id {
  display: flex;
  justify-content: center;
}
.ask-remember-find-id span:nth-child(1) {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2rem;
}
.ask-remember-find-id span:nth-child(2) {
  margin-left: 12px;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #1bbac8;
  line-height: 2rem;
  cursor: pointer;
}

.registered-id {

}
.registered-id span {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 2.13rem;
}

.input-box {
  margin-top: 15px;
}
.input-box-container {
    margin: 12px 0px 32px 0px;
}
.input-box__label {
  margin-bottom: 5px;
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #1bbac8;
  line-height: 2.4rem;
}
.input-box__label--disabled {
  color: #b0b0b0;
}

.input-box__input {
  display: flex;
  justify-content: space-between;
  position: relative;
  border-radius: 10px;
  border: solid 1px #21dcec;
  background-color: rgba(33, 220, 236, 0.1);
}
.input-box__input.grey {
    border: solid 1px #D5DAE2;
}
.input-box__input label {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 3.4rem;
}
.input-box__input input {
  width: 100%;
  height: 50px;
  border: none;
  border-radius: 10px;
  background-color: rgba(33, 220, 236, 0.1);
  box-sizing: border-box;
  padding-left: 12px;
  padding-right: 44px;
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 3.4rem;
}
.input-box__input input.grey {
    height: 40px;
    background-color: #ffffff;
}
.input-box__input input:focus {
  outline: none;
}
.input-box__input input:disabled {
  color: #b0b0b0;
}
.input-box__input input::placeholder {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #b0b0b0;
  line-height: 3.4rem;
}
.input-box__input img {
  display: none;
  position: absolute;
  height: 24px;
  right: 10px;
  top: 13px;
  z-index: 10;
}
.input-box__input img.input-cancel {
  content: url(../images/input_cancel@2x.png);
}
.input-box__input img.display-block {
  display: block;
}
.input-box__input img.search {
  content: url(../images/icon-system-24-search@2x.png);
}

/*input-white&black*/
.input-box-white {
    display: flex;
    align-items: center;
    position: relative;
    border-radius: 8px;
    border: solid 1px #D5DAE2;
    background-color: #ffffff;
    padding: 0px 12px;
    flex: 1;
}
.input-box-white input {
    width: 100%;
    height: 40px;
    border: none;
    border-radius: 8px;
    box-sizing: border-box;
    padding-right: 4px;
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #141414;
    line-height: 3.4rem;
}
.input-box-white input:focus {
    outline: none;
}
.input-box-white input::placeholder {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 21px;
}
.input-box-white img {
    height: 24px;
}
.input-box-white img.search {
    content: url(../images/ic-search-black@2x.png);
}

.input-box__input div {
  position: relative;
}
.input-box__input--radio {
  display: flex;
  align-items: center;
  position: relative;
  border-radius: 10px;
  background-color: rgba(33, 220, 236, 0.1);
  box-sizing: border-box;
  padding: 8px 10px 8px 7px;
  margin-bottom: 10px;
}
.input-box__input--radio__text {
  width: 100%;
  display: flex;
  justify-content: space-between;
  line-height: 3.4rem;
  letter-spacing: -0.1rem;
  margin-left: 8px;
}
.input-box__input--radio__text div:nth-child(1) span {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #141414;
}
.input-box__input--radio__text div:nth-child(2) span {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #1bbac8;
}



.message-error {
  padding-left: 12px;
  margin-top: 6px;
  margin-bottom: 6px;
}
.message-error span {
  color: #f46b72;
  font-family: "Pretendard-Regular";
  font-size: 12px;
  line-height: 18px;
  letter-spacing: -0.5px;
}

/*구분선*/
.border-vertical {
  width: 2px;
  border: none;
  box-shadow: 0 0 0 1px #1bbac8 inset;
  background-color: #1bbac8;
}
.border-container {
  height: 10px;
  background-color: #f8f8f8;
}
.border-container-24 {
    height: 10px;
    background-color: #f8f8f8;
    margin: 24px 0px;
  }
.border-container-thin {
    height: 1px;
    background-color: #EDEDED;
    border: solid 1px #EDEDED;
}
.border-container-1p {
    background-color: #EDEDED;
    border: solid 1px #EDEDED;
}
.border-container-1p-dgray {
    border-top: solid 1px #B0B0B0;
}
.divide-vertical-line-lightgrey {
    width: 1px;
    height: 10px;
    background-color: #D5DAE2;
    margin: 0px 8px;
}
.divide-vertical-line-lightgrey-12 {
    width: 1px;
    height: 10px;
    background-color: #D5DAE2;
    margin: 0px 12px;
}
.divide-vertical-line-lightgrey-4 {
    width: 1px;
    height: 8px;
    background-color: #AEB3B9;
    margin: 0px 4px;
    display: inline-flex;
}
.divide-vertical-line-gray-nomargin {
    width: 1px;
    background-color: #F3F3F3;
}
.divide-vertical-line-gray {
    width: 1px;
    background-color: #F3F3F3;
    margin: 0px 16px;
}
.divide-vertical-line-darkgrey {
    width: 1px;
    height: 12px;
    background-color: #6D7683;
    margin: 0px 10px;
}
.divide-vertical-line-silvergrey {
    width: 1px;
    height: 8px;
    background-color: #868B92;
    margin: 0px 6px;
}
.divide-horizontal-line-gray {
    height: 1px;
    background-color: #F3F3F3;
    margin: 16px 0px;
}
.divide-horizontal-line-gray-8 {
    height: 1px;
    background-color: #D6DBE0;
    margin: 8px 0px;
}
.divide-horizontal-line-gray-20 {
  height: 1px;
  background-color: #F3F3F3;
  margin: 0 20px;
}
.divide-horizontal-line-gray-32 {
    height: 1px;
    background-color: #D6DBE0;
    margin: 32px 0px;
}
.divide-horizontal-line-lightblack {
    height: 1px;
    background-color: #2B2E33;
}
.divide-horizontal-line-lightblack-32 {
    height: 1px;
    background-color: #2B2E33;
    margin: 32px 0px;
}
.divide-horizontal-line-lightgray {
    height: 1px;
    background-color: #E3E3E3;
    margin: 16px 0px;
}
.divide-horizontal-line_24_20 {
    height: 1px;
    background-color: #F3F3F3;
    margin: 24px 0px 20px;
}
.divide-horizontal-line {
    height: 1px;
    background-color: #F3F3F3;
    margin: 20px 0px;
}
.divide-horizontal-10-line {
  height: 10px;
  background-color: #F3F3F3;
  margin: 24px 0 0 0;
}
.divide-horizontal-line-24 {
    height: 1px;
    background-color: #F3F3F3;
    margin: 24px 0px;
}
.divide-horizontal-line-24.bg-second-gray {
  height: 1px;
  background-color: #E3E5E7;
  margin: 24px 0px;
}
.divide-horizontal-line-20 {
    height: 1px;
    background-color: #F3F3F3;
    margin: 20px;
}
.divide-horizontal-line-32 {
    height: 1px;
    background-color: #D5DAE2;
    margin: 32px 0px;
}
.divide-horizontal-line-gray-short {
    width: 1px;
    height: 8px;
    background-color: #AEB3B9;
    margin: 0px 6.5px;
}
.divide-horizontal-8-line {
    height: 8px;
    background-color: #F1F3F5;
    margin: 24px 0px;
}

.watch {
  content: url(../images/watch@2x.png);
}

.watch-off {
  content: url(../images/watch-off@2x.png);
}

.modal-background {
  background-color: rgba(0, 0, 0, 0.4);
}

.progress-indicator {
  display: flex;
  justify-content: center;
  padding-top: 20px;
}
.progress-indicator__default {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #e3e3e3;
  margin: 0 5px 0 0;
}
.progress-indicator__active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #13d9ea;
  margin: 0 5px 0 0;
}

/* 모달 딤 */
.modal-dim {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 6;
    background-color: rgba(0, 0, 0, 0.4);
}

/* 하단 모달 팝업 */
@keyframes slidein {
  to {
    transform: translateY(0);
  }
}
.modal {
  display: none;
  min-height: 400px;
  background-color: white;
  border-radius: 20px 20px 0 0;
  transform: translateY(100%);
  animation: slidein 0.5s forwards;
}
.modal__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 28px 13px 32px;
}
.modal__title.setting {
  padding: 18px 28px 13px 3px;
}
.modal__title div {
  display: inline-flex;
  align-items: center;
}
.modal__title div input[type=checkbox] {
  display: none;
}
.modal__title div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}
.modal__title div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.modal__title div label {
  font-size: 18px;
  line-height: 24px;
  color: #484e56;
}
.modal__title img {
  height: 24px;
  width: 24px;
}
.modal__title img.close {
  content: url(../images/close_g@2x.png);
}
.modal__title span {
  margin-left: 5px;
  color: #484e56;
  font-size: 18px;
  line-height: 34px;
}
.modal__contents .modal-select__options {
  height: 25px;
  padding: 10px 0 10px 46px;
}
.modal__contents .modal-select__options span {
  font-size: 16px;
  line-height: 25px;
  color: #868b92;
}
.modal__contents .modal-select__options.selected {
  background-color: rgba(33, 220, 236, 0.1);
}
.modal__contents .modal-select__options.selected span {
  color: #0a1630;
}
.modal__button {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 31px;
}
.modal__button-bar {
  width: 100%;
  padding-top: 10px;
  display: flex;
  justify-content: center;
}
.modal__button-bar div {
  width: 55px;
  height: 4px;
  border-radius: 20px;
  background-color: #e9edf0;
}
.modal__postcode {
  margin-top: 16px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 37px;
  display: block;
  position: absolute;
  top: 40%;
}
.modal__postcode input::placeholder {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #868b92;
  line-height: 3.4rem;
}
.modal__postcode__title {
  display: flex;
  justify-content: center;
}
.modal__postcode__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.modal__postcode__tip {
  padding-left: 10px;
  margin-top: 20px;
  margin-bottom: 35px;
}
.modal__postcode__tip__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #1bbac8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal__postcode__tip__row span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}
.modal__postcode__address-list {
  display: none;
  margin-top: 5px;
}
.modal__postcode__address-list__address {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #e9edf0;
  background-color: rgba(233, 237, 240, 0.2);
}
.modal__postcode__address-list__address span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal__postcode__address-list__address.selected {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #1bbac8;
  background-color: rgba(27, 186, 200, 0.1);
}
.modal__postcode__address-list__address.selected span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}

/* 중간 팝업 모달 */
.modal-container {
  width: 100%;
  height: 100%;
  visibility: hidden;
  position: fixed;
  top: 0%;
  left: 0%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.3);
}
.modal-container-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.modal-container-content-wrapper {
  padding: 0px 30px;
}
.modal-container-wrapper_width280 {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal-container-content-wrapper_width280 {
    width: 100%;
    margin: 0px 20px;
    max-width: 280px;
}
.modal-container-title-button-wrapper {
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}
.modal-container-title {
  text-align: center;
  padding: 40px 28.5px 32px;
}
.modal-container-title span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 24px;
}
.modal-container-title.b_type span {
    font-size: 1.8rem;
}
.modal-container-button {
  padding: 0px 20px 20px 20px;
}
.modal-container-button button {
  min-height: 40px;
}
.modal-container-button button span{
  font-size: 1.4rem !important;
}
.modal-container_signin_loading-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 40px;
}
.modal-container_signin_loading-container img {
    width: 36px;
    height: 36px;
}
.modal-container_signin_loading-container img.document{
    content: url(../images/ic-document@2x.png);
}
.modal-container_signin_loading-container img.logo{
    content: url(../images/main-logo@2x.png);
}

/* 하단 팝업 모달 */
.bottom-sheet-container {
    display: none;
    z-index: 11;
    border-radius: 30px 30px 0 0;
    transform: translateY(100%);
    animation: slidein 0.5s forwards;
    /* max-height: calc(100% - 80px); */
}
.bottom-sheet-container-wrapper {
    display: flex;
    width: 100%;
    /* max-height: calc(100% - 80px); */
    background-color: white;
    border-radius: 20px 20px 0 0;
    flex-direction: column;
}
.bottom-sheet-container-wrapper.maxHeight-200 {
    max-height: calc(100% - 200px);
}
.bottom-sheet-container-header {
  position: sticky;
}
.bottom-sheet-container__bar {
  width: 100%;
  padding-top: 10px;
  display: flex;
  justify-content: center;
}
.bottom-sheet-container__bar div {
  width: 55px;
  height: 4px;
  border-radius: 20px;
  background-color: #e9edf0;
}
.bottom-sheet-container__button {
  margin: 16px 20px;
  position: sticky;
}

/* 한화 보장분석 하단 모달 팝업 */
.bottom-modal-popup-container {
  display: none;
  z-index: 11;
  border-radius: 30px 30px 0 0;
  transform: translateY(100%);
  animation: slidein 0.5s forwards;
}
.bottom-modal-popup-contents-wrapper {
  display: flex;
  width: 100%;
  background-color: white;
  border-radius: 20px 20px 0 0;
  flex-direction: column;
}
.bottom-modal-popup-contents {
  text-align: center;
  padding: 16px 20px 24px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  background: url('../images/hanwha-modal-popup-background-img@3x.png') no-repeat;
  background-size: cover;
  overflow: hidden;
}
.bottom-modal-popup-contents__img {
  display: inline-block;
  width: 150px;
}
.bottom-modal-popup-contents__img img {
  width: 100%;
}
.bottom-modal-popup-contents__text {
  text-align: center;
  margin-top: 7px;
}
.bottom-modal-popup-contents__text strong {
  display: block;
  font-family: "Pretendard-Bold";
  font-size: 24px;
  color: #141414;
  line-height: 36px;
  letter-spacing: -0.25px;
}
.bottom-modal-popup-contents__text strong em {
  font-style: normal;
  position: relative;
  z-index: 0;
}
.bottom-modal-popup-contents__text strong .underline {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 127px;
  height: 8px;
  background: rgba(255, 148, 76, 0.5);
  z-index: -1;
}
.bottom-modal-popup-contents__text .detail {
  font-family: "Pretendard-Medium";
  font-size: 17px;
  color: #2B2E33;
  line-height: 24px;
  margin-top: 4px;
}
.bottom-modal-popup-contents__btn {
  margin-top: 16px;
}
.bottom-modal-popup-contents__btn button {
  width: 100%;
  padding: 11.5px 20px;
  background: #FF6600;
  border-radius: 12px;
}
.bottom-modal-popup-contents__btn button span {
  font-family: "Pretendard-Bold";
  font-size: 18px;
  color: #fff;
  line-height: 27px;
}
.bottom-modal-popup-contents__detail {
  font-family: "Pretendard-Regular";
  font-size: 11px;
  color: #868B92;
  line-height: 15px;
  margin-top: 16px;
}
.bottom-modal-popup-footer {
  position: sticky;
  border-top: 1px solid #E3E5E7;
}
.bottom-modal-popup-footer__btns {
  padding: 17.5px 20px;
  display: flex;
  justify-content: space-between;
}
.bottom-modal-popup-footer__btns button span {
  font-family: "Pretendard-Regular";
  font-size: 14px;
  color: #686D73;
  line-height: 21px;
}
/* // 한화 보장분석 하단 모달 팝업 */

/* 메인화면 히포월렛 하단 모달 팝업 */
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-container {
  display: none;
  z-index: 11;
  border-radius: 30px 30px 0 0;
  transform: translateY(100%);
  animation: slidein 0.5s forwards;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents-wrapper {
  display: flex;
  width: 100%;
  background-color: white;
  border-radius: 20px 20px 0 0;
  flex-direction: column;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents {
  text-align: center;
  padding: 16px 20px 24px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  background: url('../images/hippo-wallet-modal-popup-background-img@3x.png') no-repeat;
  background-size: cover;
  overflow: hidden;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__img {
  display: inline-block;
  width: 104px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__img img {
  width: 100%;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__text {
  text-align: center;
  margin-top: 7px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__text strong {
  display: block;
  font-family: "Pretendard-Bold";
  font-size: 24px;
  color: #141414;
  line-height: 36px;
  letter-spacing: -0.25px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__text strong em {
  font-style: normal;
  position: relative;
  z-index: 0;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__text strong .underline {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 60px;
  height: 8px;
  background: #44DC94;
  z-index: -1;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__text .detail {
  font-family: "Pretendard-Medium";
  font-size: 17px;
  color: #2B2E33;
  line-height: 24px;
  margin-top: 4px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__btn {
  margin-top: 16px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__btn button {
  width: 100%;
  padding: 11.5px 20px;
  background: #00CE73;
  border-radius: 12px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__btn button span {
  font-family: "Pretendard-Bold";
  font-size: 18px;
  color: #fff;
  line-height: 27px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-contents__detail {
  font-family: "Pretendard-Regular";
  font-size: 11px;
  color: #868B92;
  line-height: 15px;
  margin-top: 16px;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-footer {
  position: sticky;
  border-top: 1px solid #E3E5E7;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-footer__btns {
  padding: 17.5px 20px;
  display: flex;
  justify-content: space-between;
}
.bottom-modal-popup-container.hippo_wallet .bottom-modal-popup-footer__btns button span {
  font-family: "Pretendard-Regular";
  font-size: 14px;
  color: #686D73;
  line-height: 21px;
}
/* // 메인화면 히포월렛 하단 모달 팝업 */

.modal-checkbox-list {
  padding: 8px 24px 16px 20px;
}
.modal-checkbox__options {
  display: flex;
  justify-content: space-between;
  padding: 4px 0px;
}
.modal-checkbox__options.setting {
  padding: 10px 28px 10px 10px;
}
.modal-checkbox__options div input[type=checkbox] {
  display: none;
}
.modal-checkbox__options div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  word-break: keep-all;
}
.modal-checkbox__options div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.modal-checkbox__options div label {
  font-size: 1.6rem;
  line-height: 24px;
  color: #868B92;
}
.modal-checkbox_agree-wrapper {
  display: flex;
}
.modal-checkbox-wrapper img {
  height: 24px;
  content: url("../images/check_off@2x.png");
}
.modal-checkbox-wrapper img.on {
  height: 24px;
  content: url("../images/check_on@2x.png");
}
.modal-checkbox_agree-wrapper span{
  word-break: keep-all;
  font-size: 16px;
  line-height: 24px;
  color: #868b92;
}
.modal-checkbox_agree-img-wrapper {
  margin-left: 12px;
}
.modal-checkbox_agree-img-wrapper img {
  height: 24px;
  content: url(../images/chevron-right@2x.png);
}
.modal-checkbox-button {
  padding: 16px 20px;
}

textarea:focus::-webkit-input-placeholder { /* WebKit browsers */
  color: transparent;
}

textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: transparent;
}

textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: transparent;
}

textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: transparent;
}

.setting-order-textarea {
    position: relative;
}
.setting-order-textarea textarea {
    width: 100%;
    min-height: 161px;
    border: 1px solid #D5DAE2;
    border-radius: 8px;
    background-color: #ffffff;
    padding: 18px 22px 23px 18px;
    resize: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.setting-order-textarea textarea.height-88 {
    min-height: 88px;
    padding: 10px 12px;
}
.setting-order-textarea textarea:focus {
    outline: none;
}
.setting-order-textarea textarea::placeholder {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868b92;
}
.setting-order-textarea-error-message {
    display: flex;
    justify-content: space-between;
}
.setting-order-textarea-message-count-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.setting-order-textarea-message {
    visibility: hidden;
}
.setting-order-textarea-message span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #F46B72;
}
.setting-order-textarea-text-count .current-length {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #6d7683;
    line-height: 2.5rem;
}
.setting-order-textarea-text-count .max-length {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: rgba(109, 118, 131, 0.6);
    line-height: 2.5rem;
    margin-left: 2px;
}

.interactive {
  cursor: pointer;
}

.input-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.input-container__label {
  flex-basis: 30%;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
  padding-left: 4px;
}
.input-container__input {
  flex-basis: 70%;
}
.input-container__input input {
  width: 100%;
  height: 50px;
  border: none;
  border-bottom: solid 1px #b0b0b0;
  box-sizing: border-box;
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 1.4rem;
}
.input-container__input input:focus {
  outline: none;
}
.input-container__input input:disabled {
  background-color: #ffffff;
  color: #868b92;
}
.input-container__input input:readonly {
  color: #868b92;
}
.input-container img {
  display: none;
  position: absolute;
  height: 24px;
  right: 10px;
  top: 13px;
  z-index: 10;
}
.input-container img.input-cancel {
  content: url(../images/off@2x.png);
}
.input-container img.display-block {
  display: block;
}

input[type=radio] {
  width: 100%;
  height: 100%;
  position: absolute;
  opacity: 0;
}

input[type=radio] + span {
  display: inline-block;
  background: url(../images/icon-radio-button-radio-unchecked@2x.png) no-repeat 0% 0%/24px 24px;
  cursor: pointer;
  vertical-align: middle;
  font-size: 0;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

input[type=radio]:checked + span {
  background: url(../images/icon-radio-button-radio-checked@2x.png) no-repeat 0% 0%/24px 24px;
}

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

input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}

input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
input::-ms-reveal,
input::-ms-clear {
    display : none;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 20px;
}
/* Hide default HTML checkbox */
.switch input {
    display:none;
}
/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #E3E5E7;
    -webkit-transition: .4s;
    transition: .4s;
}
.slider:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
input:checked + .slider {
    background-color: #2196F3;
}
input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider:before {
    -webkit-transform: translateX(14px);
    -ms-transform: translateX(14px);
    transform: translateX(14px);
}
/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}
.slider.round:before {
    border-radius: 50%;
}

label {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  line-height: 24px;
  color: #0CAAB8;
}
label.black {
  font-family: "Pretendard-Medium"; 
  color: #484e56;
}


img.bmi {
  content: url(../images/btm-cardlist-bmi@2x.png) !important;
}

img.basic {
  content: url(../images/icon-basic-b@2x.png);
}
img.basic.selected {
  content: url(../images/icon-basic-w@2x.png);
}
img.basic.disabled {
  content: url(../images/icon-basic-g@2x.png);
}

img.circulate {
  content: url(../images/icon-circulate-b@2x.png);
}
img.circulate.selected {
  content: url(../images/icon-circulate-w@2x.png);
}
img.circulate.disabled {
  content: url(../images/icon-circulate-g@2x.png);
}

img.thyroid {
  content: url(../images/icon-thyroid-b@2x.png);
}
img.thyroid.selected {
  content: url(../images/icon-thyroid-w@2x.png);
}
img.thyroid.disabled {
  content: url(../images/icon-thyroid-g@2x.png);
}

img.endocrine {
  content: url(../images/icon-endocrine-b@2x.png);
}
img.endocrine.selected {
  content: url(../images/icon-endocrine-w@2x.png);
}
img.endocrine.disabled {
  content: url(../images/icon-endocrine-g@2x.png);
}

img.respiratory {
  content: url(../images/icon-respiratory-b@2x.png);
}
img.respiratory.selected {
  content: url(../images/icon-respiratory-w@2x.png);
}
img.respiratory.disabled {
  content: url(../images/icon-respiratory-g@2x.png);
}

img.stomach {
  content: url(../images/icon-stomach-b@2x.png);
}
img.stomach.selected {
  content: url(../images/icon-stomach-w@2x.png);
}
img.stomach.disabled {
  content: url(../images/icon-stomach-g@2x.png);
}

img.intest {
  content: url(../images/icon-intest-b@2x.png);
}
img.intest.selected {
  content: url(../images/icon-intest-w@2x.png);
}
img.intest.disabled {
  content: url(../images/icon-intest-g@2x.png);
}

img.liver {
  content: url(../images/icon-liver-b@2x.png);
}
img.liver.selected {
  content: url(../images/icon-liver-w@2x.png);
}
img.liver.disabled {
  content: url(../images/icon-liver-g@2x.png);
}

img.kidney {
  content: url(../images/icon-kidney-b@2x.png);
}
img.kidney.selected {
  content: url(../images/icon-kidney-w@2x.png);
}
img.kidney.disabled {
  content: url(../images/icon-kidney-g@2x.png);
}

img.blood {
  content: url(../images/icon-blood-b@2x.png);
}
img.blood.selected {
  content: url(../images/icon-blood-w@2x.png);
}
img.blood.disabled {
  content: url(../images/icon-blood-g@2x.png);
}

img.immune {
  content: url(../images/icon-immune-b@2x.png);
}
img.immune.selected {
  content: url(../images/icon-immune-w@2x.png);
}
img.immune.disabled {
  content: url(../images/icon-immune-g@2x.png);
}

img.bone {
  content: url(../images/icon-bone-b@2x.png);
}
img.bone.selected {
  content: url(../images/icon-bone-w@2x.png);
}
img.bone.disabled {
  content: url(../images/icon-bone-g@2x.png);
}

img.brain {
  content: url(../images/icon-brain-b@2x.png);
}
img.brain.selected {
  content: url(../images/icon-brain-w@2x.png);
}
img.brain.disabled {
  content: url(../images/icon-brain-g@2x.png);
}

img.feminine {
  content: url(../images/icon-feminine-b@2x.png);
}
img.feminine.selected {
  content: url(../images/icon-feminine-w@2x.png);
}
img.feminine.disabled {
  content: url(../images/icon-feminine-g@2x.png);
}

img.mascul {
  content: url(../images/icon-mascul-b@2x.png);
}
img.mascul.selected {
  content: url(../images/icon-mascul-w@2x.png);
}
img.mascul.disabled {
  content: url(../images/icon-mascul-g@2x.png);
}

img.anemia {
  content: url(../images/icon-anemia-b@2x.png);
}
img.anemia.selected {
  content: url(../images/icon-anemia-w@2x.png);
}
img.anemia.disabled {
  content: url(../images/icon-anemia-g@2x.png);
}

img.antioxidants {
  content: url(../images/icon-antioxidants-b@2x.png);
}
img.antioxidants.selected {
  content: url(../images/icon-antioxidants-w@2x.png);
}
img.antioxidants.disabled {
  content: url(../images/icon-antioxidants-g@2x.png);
}

img.bloodtype {
  content: url(../images/icon-bloodtype-b@2x.png);
}
img.bloodtype.selected {
  content: url(../images/icon-bloodtype-w@2x.png);
}
img.bloodtype.disabled {
  content: url(../images/icon-bloodtype-g@2x.png);
}

img.coagulation {
  content: url(../images/icon-coagulation-b@2x.png);
}
img.coagulation.selected {
  content: url(../images/icon-coagulation-w@2x.png);
}
img.coagulation.disabled {
  content: url(../images/icon-coagulation-g@2x.png);
}

img.nutrition {
  content: url(../images/icon-nutrition-b@2x.png);
}
img.nutrition.selected {
  content: url(../images/icon-nutrition-w@2x.png);
}
img.nutrition.disabled {
  content: url(../images/icon-nutrition-g@2x.png);
}

img.petct {
  content: url(../images/icon-petct-b@2x.png);
}
img.petct.selected {
  content: url(../images/icon-petct-w@2x.png);
}
img.petct.disabled {
  content: url(../images/icon-petct-g@2x.png);
}

img.tumormarker {
  content: url(../images/icon-tumormarker-b@2x.png);
}
img.tumormarker.selected {
  content: url(../images/icon-tumormarker-w@2x.png);
}
img.tumormarker.disabled {
  content: url(../images/icon-tumormarker-g@2x.png);
}

img.urine {
  content: url(../images/icon-urine-b@2x.png);
}
img.urine.selected {
  content: url(../images/icon-urine-w@2x.png);
}
img.urine.disabled {
  content: url(../images/icon-urine-g@2x.png);
}

img.gout {
  content: url(../images/icon-gout-b@2x.png);
}
img.gout.selected {
  content: url(../images/icon-gout-w@2x.png);
}
img.gout.disabled {
  content: url(../images/icon-gout-g@2x.png);
}

img.infection {
  content: url(../images/icon-infection-b@2x.png);
}
img.infection.selected {
  content: url(../images/icon-infection-w@2x.png);
}
img.infection.disabled {
  content: url(../images/icon-infection-g@2x.png);
}

img.etc {
  content: url(../images/icon-etc-b@2x.png);
}
img.etc.selected {
  content: url(../images/icon-etc-w@2x.png);
}
img.etc.disabled {
  content: url(../images/icon-etc-g@2x.png);
}

img.bi-abdominal-obesity {
  content: url(../images/body-img-abdominal-obesity@2x.png);
}

img.bi-arteriosclerosis {
  content: url(../images/body-img-arteriosclerosis@2x.png);
}

img.bi-bone-density {
  content: url(../images/body-img-bone-density@2x.png);
}

img.bi-brain {
  content: url(../images/body-img-brain@2x.png);
}

img.bi-carotid {
  content: url(../images/body-img-carotid@2x.png);
}

img.bi-cervical-vertebrae {
  content: url(../images/body-img-cervical-vertebrae@2x.png);
}

img.bi-chin {
  content: url(../images/body-img-chin@2x.png);
}

img.bi-coccyx {
  content: url(../images/body-img-coccyx@2x.png);
}

img.bi-collar-bone {
  content: url(../images/body-img-collar-bone@2x.png);
}

img.bi-elbow {
  content: url(../images/body-img-elbow@2x.png);
}

img.bi-eye {
  content: url(../images/body-img-eye@2x.png);
}

img.bi-female-breast {
  content: url(../images/body-img-female-breast@2x.png);
}

img.bi-foot {
  content: url(../images/body-img-foot@2x.png);
}

img.bi-hand {
  content: url(../images/body-img-hand@2x.png);
}

img.bi-hearing {
  content: url(../images/body-img-hearing@2x.png);
}

img.bi-heart {
  content: url(../images/body-img-heart@2x.png);
}

img.bi-hipjoint {
  content: url(../images/body-img-hipjoint@2x.png);
}

img.bi-humerus {
  content: url(../images/body-img-humerus@2x.png);
}

img.bi-intest {
  content: url(../images/body-img-intest@2x.png);
}

img.bi-kidney {
  content: url(../images/body-img-kidney@2x.png);
}

img.bi-knee {
  content: url(../images/body-img-knee@2x.png);
}

img.bi-liver {
  content: url(../images/body-img-liver@2x.png);
}

img.bi-lower-leg-bone {
  content: url(../images/body-img-lower-leg-bone@2x.png);
}

img.bi-lumbar-spine {
  content: url(../images/body-img-lumbar-spine@2x.png);
}

img.bi-lung {
  content: url(../images/body-img-lung@2x.png);
}

img.bi-male-breast {
  content: url(../images/body-img-male-breast@2x.png);
}

img.bi-metabolic-syndrome {
  content: url(../images/body-img-metabolic-syndrome@2x.png);
}

img.bi-neck {
  content: url(../images/body-img-neck@2x.png);
}

img.bi-paranasal-sinuses {
  content: url(../images/body-img-paranasal-sinuses@2x.png);
}

img.bi-pelvis {
  content: url(../images/body-img-pelvis@2x.png);
}

img.bi-prostate {
  content: url(../images/body-img-prostate@2x.png);
}

img.bi-rib {
  content: url(../images/body-img-rib@2x.png);
}

img.bi-sacrum {
  content: url(../images/body-img-sacrum@2x.png);
}

img.bi-shoulder {
  content: url(../images/body-img-shoulder@2x.png);
}

img.bi-skull {
  content: url(../images/body-img-skull@2x.png);
}

img.bi-stomach {
  content: url(../images/body-img-stomach@2x.png);
}

img.bi-thoracic-spine {
  content: url(../images/body-img-thoracic-spine@2x.png);
}

img.bi-thyroid {
  content: url(../images/body-img-thyroid@2x.png);
}

img.bi-tooth {
  content: url(../images/body-img-tooth@2x.png);
}

img.bi-uterus {
  content: url(../images/body-img-uterus@2x.png);
}

.fs-12 {
  font-size: 1.2rem !important;
}
.fs-14 {
  font-size: 1.4rem !important;
}
.fs-18 {
  font-size: 1.8rem !important;
}
.fs-20 {
  font-size: 2rem !important;
}
.mr-2 {
    margin-right: 2px !important;
}
.mr-4 {
    margin-right: 4px !important;
}
.mr-6 {
    margin-right: 6px !important;
}
.mr-8 {
  margin-right: 8px !important;
}
.mr-15 {
  margin-right: 15px !important;
}
.mr-10 {
  margin-right: 10px !important;
}
.mr-12 {
  margin-right: 12px !important;
}
.mr-16 {
    margin-right: 16px !important;
}
.mr-20 {
  margin-right: 20px !important;
}
.ml-0 {
    margin-left: 0px !important;
}
.ml-2 {
    margin-left: 2px !important;
}
.ml-8 {
    margin-left: 8px !important;
}
.ml-10 {
    margin-left: 10px !important;
}
.ml-12 {
    margin-left: 10px !important;
}
.ml-16 {
    margin-left: 16px !important;
}
.ml-20 {
    margin-left: 20px !important;
}
.ml-24 {
  margin-left: 24px !important;
}
.ml-30 {
    margin-left: 30px !important;
}
.mlr-20 {
    margin: 0px 20px !important;
}
.mb-0 {
    margin-bottom: 0px !important;
}
.mb-1 {
    margin-bottom: 1px !important;
}
.mb-4 {
    margin-bottom: 4px !important;
}
.mb-5 {
    margin-bottom: 5px !important;
}
.mb-8 {
    margin-bottom: 8px !important;
}
.mb-10 {
  margin-bottom: 10px !important;
}
.mb-12 {
  margin-bottom: 12px !important;
}
.mb-16 {
  margin-bottom: 16px !important;
}
.mb-20 {
  margin-bottom: 20px !important;
}
.mb-22 {
  margin-bottom: 22px !important;
}
.mb-24 {
  margin-bottom: 24px !important;
}
.mb-25 {
  margin-bottom: 25px !important;
}
.mb-26 {
  margin-bottom: 26px !important;
}
.mb-30 {
  margin-bottom: 30px !important;
}
.mb-32 {
    margin-bottom: 32px !important;
}
.mb-34 {
  margin-bottom: 34px !important;
}
.mb-36 {
  margin-bottom: 36px !important;
}
.mb-40 {
    margin-bottom: 40px !important;
}
.mb-46 {
    margin-bottom: 46px !important;
}
.mb-48 {
    margin-bottom: 48px !important;
}
.mb-64 {
  margin-bottom: 64px !important;
} 
.mb-68 {
    margin-bottom: 68px !important;
}
.mt-0 {
    margin-top: 0px !important;
}
.mt-2 {
  margin-top: 2px !important;
}
.mt-4 {
  margin-top: 4px !important;
}
.mt-6 {
  margin-top: 6px !important;
}
.mt-8 {
    margin-top: 8px !important;
}
.mt-9 {
    margin-top: 9px !important;
}
.mt-10 {
    margin-top: 10px !important;
}
.mt-12 {
    margin-top: 12px !important;
}
.mt-16 {
    margin-top: 16px !important;
}
.mt-20 {
    margin-top: 20px !important;
}
.mt-24 {
    margin-top: 24px !important;
}
.mt-28 {
  margin-top: 28px !important;
}
.mt-30 {
    margin-top: 30px !important;
}
.mt-32 {
    margin-top: 32px !important;
}
.mt-34 {
    margin-top: 34px !important;
}
.mt-40 {
    margin-top: 40px !important;
}
.mt-42 {
    margin-top: 42px !important;
}
.mt-44 {
    margin-top: 44px !important;
}
.mt-46 {
    margin-top: 46px !important;
}
.mt-48 {
  margin-top: 48px !important;
}
.mt-72 {
  margin-top: 72px !important;
}
.mt-120 {
    margin-top: 120px !important;
}
.padding-20 {
    padding: 20px !important;
}
.padding-17-20 {
    padding: 17px 20px;
}
.pd-0 {
    padding: 0 !important;
}
.pl-5 {
    padding-left: 5px !important;
}
.pl-8 {
    padding-left: 8px !important;
}
.pl-20 {
    padding-left: 20px !important;
}
.pl-24 {
    padding-left: 24px !important;
}
.pr-0 {
    padding-right: 0 !important;
}
.pr-8 {
    padding-right: 8px !important;
}
.pr-20 {
    padding-right: 20px !important;
}
.pr-24 {
    padding-right: 24px !important;
}
.pr-59 {
    padding-right: 59px !important;
}
.pr-130 {
    padding-right: 130px !important;
}
.pb-0 {
    padding-bottom: 0px !important;
}
.pb-4 {
  padding-bottom: 4px !important;
}
.pb-12 {
    padding-bottom: 12px !important;
}
.pb-20 {
    padding-bottom: 20px !important;
}
.pb-24 {
    padding-bottom: 24px !important;
}
.pb-28 {
  padding-bottom: 28px !important;
}
.pb-40 {
    padding-bottom: 40px !important;
}
.pb-48 {
  padding-bottom: 48px !important;
}
.pb-52 {
  padding-bottom: 52px !important;
}
.pb-130 {
    padding-bottom: 130px !important;
}
.pb-140 {
    padding-bottom: 140px !important;
}
.pt-0 {
    padding-top: 0px !important;
}
.pt-4 {
  padding-top: 4px !important;
}
.pt-16 {
    padding-top: 16px !important;
}
.pt-24 {
  padding-top: 24px !important;
}
.pt-36 {
  padding-top: 36px !important;
}
.pt-48 {
  padding-top: 48px !important;
}
.pt-64 {
  padding-top: 64px !important;
}
.pb-20 {
  padding-bottom: 20px !important;
}

.border-bottom-none {
  border-bottom: none !important;
}

.align-items-start {
  align-items: start !important;
}

.top-0 {
  top: 0px !important;
}

.right-0 {
  right: 0px !important;
}

.right-100 {
  right: 100px !important;
}

.width-100p {
  width: 100% !important;
}

.height-1 {
  height: 1px !important;
}

.height-20 {
  height: 20px !important;
}

.height-40 {
  height: 40px !important;
}

.height-180 {
  height: 180px !important;
}

.height-sub116 {
  height: calc(100vh - 116px) !important;
}

.height-sub150 {
  height: calc(100vh - 150px) !important;
}

.height-100p {
  height: 100% !important;
}

.min-height-0 {
  min-height: 0px !important;
}

.min-height-40 {
  min-height: 40px !important;
}

.d-flex {
  display: flex !important;
}

.flex-basis-20 {
    flex-basis: 20% !important;
}
.flex-basis-35 {
    flex-basis: 35% !important;
}
.flex-basis-47 {
    flex-basis: 47% !important;
}
.flex-basis-75 {
    flex-basis: 75% !important;
}
.flex-basis-80 {
    flex-basis: 80% !important;
}

.jc-start {
  justify-content: start !important;
}

.align-items-center {
  align-items: center !important;
}

.text-align-left {
  text-align: left !important;
}

.text-align-center {
  text-align: center !important;
}

.bg-skyblue {
  background-color: #F4FBFF !important;
}
.bg-skyblue-2 {
  background-color: #f6fcff !important;
}
.bg-lightgray {
  background-color: #f8f8f8 !important;
}
.bg-white {
  background-color: #ffffff !important;
}
.font-color-main {
  color: #1bbac8 !important;
}
.font-color-gray050 {
  color: #484e56 !important;
}
.font-bold {
  font-family: "Pretendard-Bold" !important;
}
.font-semibold {
  font-family: "Pretendard-SemiBold" !important;
}
.font-regular {
  font-family: "Pretendard-Regular";
}
.overflow-visible {
  overflow: visible !important;
}

.header__login {
  text-align: center;
  margin-top: 85px;
  margin-bottom: 89px;
}
.header__login img {
  height: 42px;
  content: url(../images/login-vitaport-logo-1@2x.png);
}

.account-find {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  margin-top: 20px;
  font-size: 12px;
  line-height: 12px;
  color: #484e56;
}
.account-find__id {
  margin-right: 12px;
}
.account-find__id span {
  cursor: pointer;
}
.account-find__password {
  margin-left: 12px;
}
.account-find__password span {
  cursor: pointer;
}

.border-or {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.border-or-container {
  width: 100%;
  display: flex;
  justify-content: center;
}
@media (min-width: 768px) {
  .border-or {
    width: 44%;
  }
}
.border-or__line {
  flex-basis: 40%;
  height: 1px;
  background-color: #b0b0b0;
}
.border-or__text {
  flex-basis: 20%;
  text-align: center;
}
.border-or__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.2rem;
}

.bottom-sheet-container__signup {
  position: relative;
  padding: 20px 20px 0px 20px;
}
.bottom-sheet-container__signup__close {
  position: absolute;
  top: 20px;
  right: 28px;
  height: 24px;
  content: url(../images/close@2x.png);
}
.bottom-sheet-container__signup__header {
  margin-bottom: 40px;
}
.bottom-sheet-container__signup__header div.main {
  margin-bottom: 6px;
}
.bottom-sheet-container__signup__header div.main span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 3.4rem;
}
.bottom-sheet-container__signup__header div.sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.1rem;
  letter-spacing: -0.05rem;
}
.bottom-sheet-container__signup div.button {
  margin-bottom: 24px;
}

.autologin-check {
  min-height: 24px;
  margin-top: 15px;
}
.autologin-check label {
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}

.modal-container__mflo000-wrapper {
  margin-left: 30px;
  margin-right: 30px;
  border-radius: 20px;
  background-color: #fff;
}
.modal-container__mflo000__header {
  display: flex;
  align-items: center;
  padding-top: 16px;
  padding-left: 14px;
  padding-right: 14px;
}
.modal-container__mflo000__header img {
  padding: 7.5px;
  border-radius: 13px;
  border: 0.8px solid #aeb3b9;
  height: 27px;
  content: url(../images/main-logo@2x.png);
}
.modal-container__mflo000__header div.text {
  margin-left: 14px;
}
.modal-container__mflo000__header div.text span.main {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
}
.modal-container__mflo000__header div.text span.sub {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
}
.modal-container__mflo000__border {
  padding-left: 20px;
  padding-right: 20px;
  margin: 12px 0px 10px 0px;
  height: 0.8px;
  background-color: #aeb3b9;
}
.modal-container__mflo000__checkbox__title {
  padding-left: 14px;
  padding-right: 14px;
  margin-bottom: 10px;
}
.modal-container__mflo000__checkbox__title input[type=checkbox] {
  display: none;
}
.modal-container__mflo000__checkbox__title input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 30px;
  background: url("../images/icon-24-check-kakao@2x.png") no-repeat 0 0px/contain;
}
.modal-container__mflo000__checkbox__title input[type=checkbox]:checked + label {
  background: url("../images/icon-24-check-kakao-selected@2x.png") no-repeat 0 0px/contain;
}
.modal-container__mflo000__checkbox__title label {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.modal-container__mflo000__checkbox__title label.title-sub {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.4rem;
  padding-left: 30px;
}
.modal-container__mflo000__checkbox__contents {
  padding-left: 20px;
  padding-right: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-container__mflo000__checkbox__contents div {
  margin-left: 24px;
}
.modal-container__mflo000__checkbox__contents input[type=checkbox] {
  display: none;
}
.modal-container__mflo000__checkbox__contents input[type=checkbox] + label {
  display: block;
  height: 18px;
  padding-left: 24px;
  margin-left: -24px;
  background: url("../images/icon-24-check-kakao@2x.png") no-repeat 0 0px/contain;
}
.modal-container__mflo000__checkbox__contents input[type=checkbox]:checked + label {
  background: url("../images/icon-24-check-kakao-selected@2x.png") no-repeat 0 0px/contain;
}
.modal-container__mflo000__checkbox__contents label {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.8rem;
}
.modal-container__mflo000__checkbox__contents label.title-sub {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.8rem;
}
.modal-container__mflo000__checkbox__contents span {
  flex-basis: 8%;
  cursor: pointer;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 3.4rem;
  text-decoration: underline;
}
.modal-container__mflo000__title {
  padding-left: 30px;
}
.modal-container__mflo000__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 3.4rem;
}
.modal-container__mflo000__footer {
  cursor: pointer;
  margin-top: 16px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
  text-align: center;
  background-color: rgba(176, 176, 176, 0.5);
  opacity: 0.5;
}
.modal-container__mflo000__footer.selected {
  background-color: #fee500;
  opacity: 1;
}
.modal-container__mflo000__footer span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: rgba(0, 0, 0, 0.85);
  line-height: 1.4rem;
}
.modal-container__mflo000__cancel {
  margin-top: 26px;
  text-align: center;
}
.modal-container__mflo000__cancel span {
  cursor: pointer;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #aeb3b9;
  line-height: 3.4rem;
  text-decoration: underline;
}

.header-wrapper {
  display: flex;
  flex-direction: column;
}

/* only back btn*/
.header-backbtn {
  padding: 11px 10px;
}
.header-backbtn img{
  height: 24px;
  content: url(../images/icon-system-24-left@2x.png);
}

/* only close btn*/
.header-signup__close {
  display: flex;
  justify-content: right;
  padding: 11px 20px;
}
.header-signup__close img {
  height: 24px;
  content: url(../images/close_g@2x.png);
}

.header-signup {
  margin-top: 57px;
  margin-bottom: 42px;
}
.header-signup__nav {
  display: flex;
  justify-content: space-between;
}
.header-signup__nav--back.login {
  position: absolute;
  margin-top: -28px;
}
.header-signup__nav--back img {
  height: 24px;
  position: relative;
  left: -8px;
  content: url(../images/back@2x.png);
}
.header-signup__nav--pass {
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 11px 20px;
}
.header-signup__nav--pass span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
}
.header-signup__text {
}
.header-signup__text--main {
  padding: 40px 0px;
}
.header-signup__text--main span {
  font-size: 2.1rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 3.0rem;
}
.header-signup__text--main span .highlight {
  background-image: linear-gradient(0, transparent 0.2em, #f9d6d6 0.2em, #f9d6d6 0.8em, transparent 0.8em);
  background-size: 1px 1.6em;
  background-position: 1px center;
  background-repeat: repeat;
}
.header-signup__text--sub {
}
.header-signup__text--sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.header-already-exist__text--sub {
  margin-top: 1px;
}
.header-already-exist__text--sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-already-exist-box {
  height: 60px;
  background-color: #f3f3f3;
  word-break: break-all;
  border-radius: 15px;
}
.contents-already-exist-box span{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100%;
  font-size: 1.7rem;
  font-family: "Pretendard-Regular";
  margin-top: 35px;
}
.contents-already-exist__logo {
  margin-bottom: 31px;
}
.contents-already-exist__logo img {
  height: 300px;
  content: url(../images/email@3x.png);
}
.header-agree {
  margin-top: 50px;
}
.header-agree__text {
  padding-left: 20px;
}
.header-agree__text span {
  font-size: 2.1rem;
  font-family: "Pretendard-Bold";
  color: #1bbac8;
  line-height: 3.4rem;
}

.contents-findaccount {
  padding: 0px 20px 0px 20px;
  padding-top: var(--header-height);
  padding-bottom: var(--footer-height);
  overflow-y: auto;
  height: calc(100% - var(--header-height) - var(--footer-height));
}
.contents-findpassword {
  padding: 0px 20px 0px 20px;
  padding-top: var(--header-height);
  padding-bottom: var( --findpassword-footer-height);
  overflow-y: auto;
  height: calc(100% - var(--header-height) - var( --findpassword-footer-height));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents-login-main {
  padding-left: 20px;
  padding-right: 20px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 6;
  position: relative;
}
.contents-login-email {
  padding-left: 20px;
  padding-right: 20px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.login__input-container {
  padding-bottom: 20px;
}
.login__input-container label {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.4rem;
}
.login__button-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.login__button-container--kakao {
  padding-bottom: 57px;
  background: #ffffff;
}
.login__button-container--kakao .kakao-text {
  margin-top: 20px;
  margin-bottom: 40px;
  text-align: center;
}
.login__button-container--kakao .kakao-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.2rem;
}
.sign-up {
  width: 100%;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  color: #484e56;
  padding-bottom: 54px;
}
.sign-up .button-sign-up {
  margin-left: 11px;
  cursor: pointer;
}
.contents-signup {
  padding: 0px 20px 0px 20px;
  padding-top: var(--header-height);
  padding-bottom: var(--footer-height);
  overflow-y: auto;
  height: calc(100% - var(--header-height) - var(--footer-height));
}
.contents-signup__photo {
  margin-top: 55px;
  text-align: center;
}
.contents-signup__photo img {
  height: 200px;
  margin-bottom: 23px;
}
.contents-signup__photo img.photo-default {
  content: url(../images/profile@2x.png);
}
.contents-signup__photo span {
  font-size: 16px;
  line-height: 24px;
}
.contents-signup-duplicate-check-area {
  display: flex;
}

.contents-agree {
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 100px;
}
.contents-agree.privacy-policy {
  padding-right: 0px;
}

.contents-agree__title {
}
.contents-agree__title span {
  font-size: 2.0rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 30px;
}
.contents-agree__subtitle {
  margin-bottom: 4px;
}
.contents-agree__subtitle span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 22.4px;
}
.contents-agree__text{
}
.contents-agree__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 19.6px;
  word-break: keep-all;
}
.contents-agree__numbering{
  display: flex;
  margin-bottom: 4px;
}
.contents-agree__numbering.two-depth {
  margin-left: 17px;
}
.contents-agree__numbering.two-depth.dash span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 16.8px;
}
.contents-agree__numbering.three-depth {
  margin-left: 37px;
}
.contents-agree__numbering.three-depth span {
  font-size: 1.2rem;
}
.contents-agree__numbering.four-depth {
  margin-left: 46px;
}
.contents-agree__numbering.four-depth span{
  font-size: 1.2rem;
}
.contents-agree__numbering.five-depth {
  margin-left: 54px;
}
.contents-agree__numbering.five-depth span{
  font-size: 1.2rem;
}
.contents-agree__numbering .number {
  margin-right: 10px;
}
.contents-agree__numbering .number_ring {
  margin-right: 5px;
}
.contents-agree__numbering .dash {
  margin-right: 3px;
}
.contents-agree__numbering .no-dash {
  margin-left: 8px;
}
.contents-agree__numbering span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 19.6px;
}
.contents-agree__numbering span.redcolor {
  color: #ff5252;
}
.contents-agree__img{
}
.contents-agree__img.horizon-scroll{
  overflow-x: auto; 
  white-space: nowrap;
}

.contents-agree__img img.agree_1{
  width: 100%;
  content: url(../images/agree_1@2x.png);
}
.contents-agree__img img.agree_2{
  padding-right: 20px;
  width: 801px;
  content: url(../images/agree_2@2x.png);
}
.contents-agree__img img.agree_3{
  padding-right: 20px;
  width: 420px;
  content: url(../images/agree_3@2x.png);
}
.contents-agree__img img.agree_4{
  padding-right: 20px;
  width: 553px;
  content: url(../images/agree_4@2x.png);
}
.contents-agree__img img.agree_5{
  width: 100%;
  content: url(../images/agree_5@2x.png);
}
.contents-agree__img img.agree_6{
  padding-right: 20px;
  width: 477px;
  content: url(../images/agree_6@2x.png);
}
.contents-agree__img img.agree_7{
  padding-right: 20px;
  width: 470px;
  content: url(../images/agree_7@2x.png);
}
.footer__signup {
  padding: 16px 20px 40px 20px;
  background: white;
  position: fixed;
  bottom: 0;
  left: 0;
  width: calc(100% - 40px);
}

.footer-agree {
  padding: 16px 20px;
  display: flex;
  align-items: end;
  background-color: #ffffff;
}
.contents-signup-confirm {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0%;
  left: 0%;
}
.contents-signup-confirm__close {
  display: flex;
  justify-content: right;
  margin-top: 56px;
  margin-right: 20px;
}
.contents-signup-confirm__close img {
  height: 25px;
  content: url(../images/close@2x.png);
}
.contents-signup-confirm-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.contents-signup-confirm-text {
    display: flex;
    flex-direction: column;
}
.contents-signup-confirm-text span.title {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
}
.contents-signup-confirm-text span.subtitle {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 24px;
}
.contents-signup-confirm-text span.subtitle strong{
    font-family: "Pretendard-Bold";
}
.contents-signup-confirm__logo {
  margin-bottom: 72px;
  width: 100%;
}
.contents-signup-confirm__logo img {
    width: 100%;
    content: url(../images/img_complete@2x.png);
}

/* 통합 로그인 SSO */
.contents-sso-confirm__close {
  display: flex;
  justify-content: right;
  margin-top: 56px;
  margin-right: 20px;
}
.contents-sso-confirm__close img {
  height: 25px;
  content: url(../images/close@2x.png);
}
.contents-sso-confirm {
  width: 100%;
  height: 100%;
  position: relative;
}
.contents-sso-confirm-wrapper {
  width: 100%;
}
.contents-sso-confirm-wrapper.middle {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.contents-sso-confirm__img.blue_person {
  display: inline-block;
  width: 55%;
}
.contents-sso-confirm__img.blue_person img {
    width: 100%;
    content: url(../images/img-blue-person@3x.png);
}
.contents-sso-confirm-intro {
  width: 100%;
  background: linear-gradient(#4B6EEE, #2549CD);
  text-align: center;
  padding: 40px 0 24px;
}
.contents-sso-confirm-intro-txt-area {
  font-size: 2rem;
  font-family: "Pretendard-Medium";
  font-weight: 500;
  color: #fff;
  line-height: 3rem;
  letter-spacing: -0.5px;
  text-align: center;
  padding: 0 20px;
}
.contents-sso-confirm-intro-txt-area strong {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  font-weight: 700;
  color: #fff;
  line-height: 3.6rem;
  letter-spacing: -0.5px;
}
.contents-sso-confirm-intro-img-area {
  display: inline-block;
  width: 100%;
  margin-top: 12px;
}
.contents-sso-confirm-intro-img-area img {
  width: 200px;
}
.ico-list li {
  margin-top: 20px;
  display: flex;
  align-items: center;
}
.ico-list .icon {
  display: inline-block;
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  background-size: contain;
}
.ico-list .icon.sso-user {
  background-image: url(../images/ic-sso-user@3x.png);
}
.ico-list .icon.sso-connect {
  background-image: url(../images/ic-sso-connect@3x.png);
}
.ico-list .icon.sso-integration {
  background-image: url(../images/ic-sso-integration@3x.png);
}
.ico-list .txt-area {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #2B2E33;
  line-height: 24px;
  margin-left: 12px;
  letter-spacing: -0.5px;
}
.ico-list .txt-area strong {
  font-family: "Pretendard-Bold";
}
.contents-sso-confirm-detail {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  font-weight: 400;
  color: #2B2E33;
  line-height: 24px;
  padding: 0 20px;
}
.contents-sso-confirm-detail .title {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  font-weight: 700;
  color: #141414;
  line-height: 30px;
  letter-spacing: -0.5px;
}
.contents-sso-confirm-detail .subtitle {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  font-weight: 400;
  color: #484E56;
  line-height: 19.6px;
  letter-spacing: -0.5px;
  margin-top: 8px;
}
.contents-sso-confirm-detail .subtitle strong {
  font-family: "Pretendard-Bold";
  font-weight: 700;
}
.sso-service-introduce-container {
  padding: 24px 20px;
  border: 1px solid #E3E5E7;
  border-radius: 16px;
}
.swiper-sso-introduce-pagination {
  display: flex;
  justify-content: center;
  padding-top: 16px;
}
.swiper-sso-introduce-pagination .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 4px;
  background-color: #D5DAE2;
  opacity: 1;
  margin: 0px 5px 0px 0px !important;
}
.swiper-sso-introduce-pagination .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 4px;
  background-color: #0CAAB8;
  margin: 0px 5px 0px 0px !important;
}
.contents-sso-introduce__img-area {
  width: 100%;
  background: #F2F4F9;
  text-align: center;
  border-radius: 8px;
}
.contents-sso-introduce__img-area img {
  width: 280px;
      vertical-align: top;
}
.contents-sso-introduce__logo-area  {
  width: 100%;
  text-align: center;
  margin-top: 16px;
}
.contents-sso-introduce__logo-area img {
  width: 280px;
}
.contents-sso-introduce__txt-area {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  font-weight: 400;
  color: #2B2E33;
  line-height: 24px;
  letter-spacing: -0.5px;
  text-align: center;
  margin-top: 12px;
}
.contents-sso-introduce__txt-area strong {
  font-family: "Pretendard-Bold";
  font-weight: 700;
}
.dot-list li {
  padding-left: 10px;
  position: relative;
}
.dot-list li + li {
  margin-top: 4px;
}
.dot-list li::before {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #686D73;
  position: absolute;
  top: 10px;
  left: 0;
  content: '';
  display: inline-block;
}
.dot-list li span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  font-weight: 400;
  color: #484E56;
  line-height: 19.6px;
  letter-spacing: -0.25px;
}
.contents-sso-confirm-text {
  margin-bottom: 40px;
}
.contents-sso-confirm-text .title {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 36px;
  letter-spacing: -0.25px;
}
.contents-sso-confirm-text .subtitle {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 24px;
  letter-spacing: -0.25px;
}
.contents-sso-confirm-text .subtitle strong{
  font-family: "Pretendard-Bold";
}
.footer.bottom-fixed {
  width: 100%;
  border-radius: 20px 20px 0 0;
  padding-bottom: 0px !important;
  position: sticky;
  bottom: 0;
  z-index: 10;
}
.footer-btn-container {
  padding: 16px 20px;
  background-color: #fff;
  border: 1px solid #fff;
}
.footer-btn-container-wrapper {
  align-items: center;
}
.footer-btn-container-wrapper button {
  flex-basis: 47%;
}
.button-normal-txt {
  width: 100%;
  height: 50px;
  min-height: 50px;
  border-radius: 10px;
  text-align: center;
  background-color: #b0b0b0;
  padding: 11.5px 12px;
}
.button-normal-txt span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.4rem;
}
.button-normal-txt.active {
  background-color: #0caab8;
}
/* // 통합 로그인 SSO */

.contents-signup-confirm_thatsok-text {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}
.contents-signup-confirm_thatsok-text span{
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #868B92;
    line-height: 24px;
}
.contents-email-verification-code {
  margin-bottom: 8px;
}
.contents-email-verification-code-wrapper {
  padding: 36px 24px;
}
.verification-code-title {
  margin-bottom: 16px;
}
.verification-code-title span {
  font-size: 2.4rem;
  font-family: "Pretendard-Regular";
  color: #000000;
  line-height: 150%;
  letter-spacing: -0.4px;
}
.verification-code-subtitle {
  margin-bottom: 36px;
}
.verification-code-subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 150%;
  letter-spacing: -0.5px;
}
.email-verification-code {

}
.email-verification-code span{
  font-size: 3.6rem;
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
  line-height: 150%;
  letter-spacing: 3px;
}
.email-verification-noti {

}
.email-verification-noti span{
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #787878;
  line-height: 150%;
  letter-spacing: -0.4px;
}
.modal-container__signup-confirm {
  padding-left: 30px;
  padding-right: 30px;
}
.modal-container__signup-confirm-wrapper {
  padding-top: 24px;
  border-radius: 20px;
  background-color: #fff;
}
.modal-container__signup-confirm__title {
  text-align: center;
}
.modal-container__signup-confirm__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 2.4rem;
  letter-spacing: -0.041rem;
}
.modal-container__signup-confirm__img {
  text-align: center;
  margin-bottom: 8px;
}
.modal-container__signup-confirm__img img {
  height: 150px;
  content: url(../images/icon-document@2x.png);
}
.modal-container__signup-confirm__button {
  text-align: center;
  background-color: #0CAAB8;
  padding-top: 14px;
  padding-bottom: 15px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}
.modal-container__signup-confirm__button span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #ffffff;
}

/* 더보기> 버튼 있는 타이틀 */
.title-with-more-btn {
  display: flex;
  justify-content: space-between;
}
.item-title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.title-more {
  align-items: center;
  display: flex;
}
.title-more span{
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 24px;
  color: #484E56;
}
.title-more img {
  height: 16px;
  content: url(../images/my_archive_right@3x.png);
}

.contents-home {
  display: flex;
  flex-direction: column;
}
.contents-home .banner {
  padding: 32px 20px 16px 20px;
}
.contents-home .banner-wrapper, 
.contents-custom-management .banner-wrapper {
  height: 140px;
}
.contents-home .banner-type-b_1 {
  border-radius: 12px;
  /* box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1); */
  display: flex;
  align-items: center;
  height: 100%;
}
.contents-home .banner-type-b_1 .banner-type-b_1-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0px 20px 0px 20px;
}
.contents-home .banner-type-b_1__refresh {
  height: 18px;
  position: absolute;
  top: 16px;
  right: 12px;
  content: url(../images/refresh@2x.png);
}
.contents-home .banner-type-b_1-category_date-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  width: 100%;
}
.contents-home .banner-type-b_1__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.contents-home .banner-type-b_1__category {
}
.contents-home .banner-type-b_1__category span {
  font-size: 1.1rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 150%;
}
.contents-home .banner-type-b_1__date span{
  font-size: 1.1rem;
  font-family: "Pretendard-SemiBold";
  color: #484E56;
  line-height: 150%;
}
.contents-home .banner-type-b_1__date span.date_value {
  font-family: "Pretendard-Regular";
}
.contents-home .banner-type-b_1__row__result-container {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.contents-home .banner-type-b_1__row__result-container__title {
  padding-bottom: 4px;
}
.contents-home .banner-type-b_1__row__result-container__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 120%;
  letter-spacing: -0.05rem;
}
.contents-home .banner-type-b_1__row__result-container__value {
  padding-right: 4px;
}
.contents-home .banner-type-b_1__row__result-container__value span{
  font-size: 3.6rem;
  font-family: "Pretendard-SemiBold";
  color: #141414;
  line-height: 120%;
}
.contents-home .banner-type-b_1__row__result-container__unit {
  display: flex;
  align-items: end;
}
.contents-home .banner-type-b_1__row__result-container__unit span{
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #000000;
  line-height: 120%;
  margin-bottom: 9.5px;
}
.contents-home .banner-type-b_1__row__img { 
  margin-left: 12px;
}
.contents-home .banner-type-b_1__row__img img {
  height: 90px;
}
.banner-type-b_2-wrapper {
  display: flex;
}
.contents-home .banner-type-b_2__row__result-container__value {
  margin-right: 4px;
}
.contents-home .banner-type-b_2__row__result-container__value span{
  font-size: 4.8rem;
  font-family: "Pretendard-SemiBold";
  color: #141414;
  line-height: 120%;
}
.contents-home .banner-type-b_1__row__img img.basic-check {
  content: url(../images/slide-health-21@2x.png);
}
.contents-home .banner-type-b_1__row__img img.cholesterol {
  content: url(../images/cholesterol@2x.png);
}
.contents-home .banner-type-b_1__row__img img.blood-pressure {
  content: url(../images/slide-health-21@2x.png);
}
.contents-home .banner-type-b_1__row__img img.intraocular-pressure {
  content: url(../images/slide-health-14@2x.png);
}
.contents-home .banner-type-b_1__row__img img.hearing {
  content: url(../images/slide-health-17@2x.png);
}
.contents-home .banner-type-b_1__row__img img.tachycardia {
  content: url(../images/slide-health-11@2x.png);
}
.contents-home .banner-type-b_1__row__img img.thyroid {
  content: url(../images/slide-health-3@2x.png);
}
.contents-home .banner-type-b_1__row__img img.internal-secretion {
  content: url(../images/slide-health-6@2x.png);
}
.contents-home .banner-type-b_1__row__img img.ventilator {
  content: url(../images/slide-health-20@2x.png);
}
.contents-home .banner-type-b_1__row__img img.gastrointestina {
  content: url(../images/slide-health-16@2x.png);
}
.contents-home .banner-type-b_1__row__img img.bowel {
  content: url(../images/slide-health-10@2x.png);
}             
.contents-home .banner-type-b_1__row__img img.urinary-tract {
  content: url(../images/slide-health-12@2x.png);
}
.contents-home .banner-type-b_1__row__img img.blood {
  content: url(../images/slide-health-19@2x.png);
}
.contents-home .banner-type-b_1__row__img img.gout {
  content: url(../images/slide-health-18@2x.png);
}
.contents-home .banner-type-b_1__row__img img.immunity {
  content: url(../images/slide-health-22@2x.png);
}
.contents-home .banner-type-b_1__row__img img.musculoskeleta {
  content: url(../images/slide-health-4@2x.png);
}
.contents-home .banner-type-b_1__row__img img.fasting-blood-sugar {
  content: url(../images/slide-health-7@2x.png);
}
.contents-home .banner-type-b_1__row__img img.male {
  content: url(../images/slide-health-5@2x.png);
}
.contents-home .banner-type-b_1__row__img img.gynecology {
  content: url(../images/slide-health-15@2x.png);
}
.contents-home .banner-type-b_1__row__img img.covid {
  content: url(../images/slide-health-2@2x.png);
}
.contents-home .banner-type-b_1__row__img img.metabolic-syndrome {
  content: url(../images/slide-health-9@2x.png);
}
.contents-home .banner-type-b_1__row__img img.diabetes {
  content: url(../images/slide-health-8@2x.png);
}
.contents-home .banner-type-b_1__page {
  position: absolute;
  right: 15px;
  bottom: 6px;
}
.contents-home .banner-type-b_1__page span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #000000;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-home .banner-type-b_1__page.white span {
  color: #ffffff;
}
.contents-home .banner-type-a {
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1); */
  padding: 0px 20px 0px 20px;
  height: 100%;
}
.contents-home .banner-type-a .banner-type-a-wrapper {
  display: flex;
  align-items: center;
  max-width: 260px;
  width: 100%;
}
.contents-home .banner-type-a__title__contents__wrapper {
  height: 90px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents-home .banner-type-a__title {
  margin-bottom: 6px;
}
.contents-home .banner-type-a__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.2rem;
  letter-spacing: -0.05rem;
}
.contents-home .banner-type-a__contents {
  opacity: 0.8;
}
.contents-home .banner-type-a__contents span {
  font-size: 1.3rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 140%;
}
.contents-home .banner-type-a__tags span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #0029a3;
  line-height: 1.2rem;
  margin-right: 6px;
}
.contents-home .banner-type-a__tags span:last-child {
  margin-right: 0px;
}

/* banner-type-d (보장분석) mhom.html */
.contents-home .banner-type-d {
  border-radius: 12px;
  /* box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1); */
  display: flex;
  justify-content: center;
  height: 100%;
  padding: 0 13px;
}
.contents-home .banner-type-d-flex {
  display: flex;
  align-items: center;
  margin-top: 8px;
}
.contents-home .banner-type-d .banner-type-d-wrapper {
  max-width: 294px;
  width: 100%;
}
.contents-home .banner-type-d__text {
  margin-left: 16px;
}
.contents-home .banner-type-d__title__contents__wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents-home .banner-type-d__title {
  margin-bottom: 6px;
}
.contents-home .banner-type-d__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  letter-spacing: -0.05px;
}
.contents-home .banner-type-d__title.fs-14 span {
  display: block;
  font-size: 1.4rem;
  line-height: 2.1rem;
}
.contents-home .banner-type-d__title span.sub-title {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #2B2E33;
  line-height: 2.1rem;
}
.contents-home .banner-type-d__title span.sub-title.fs-12 {
  font-size: 1.2rem;
  line-height: 1.8rem;
}
.contents-home .banner-type-d.color_0 .banner-type-d__btn {
  background-color: #FF6600;
  border-radius: 8px;
  padding: 4px 12px;
}
.contents-home .banner-type-d__btn span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #fff;
  line-height: 2.1rem;
}
.contents-home .banner-type-d__detail {
  font-size: 1rem;
  font-family: "Pretendard-Regular";
  color: #868B92;
  line-height: 1.4rem;
}
.contents-home .banner-type-d__contents {
  opacity: 0.8;
}
.contents-home .banner-type-d__contents span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 140%;
}
.contents-home .banner-type-d__tags span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #0029a3;
  line-height: 1.2rem;
  margin-right: 6px;
}
.contents-home .banner-type-d__tags span:last-child {
  margin-right: 0px;
}
.contents-home .banner-type-d__img.hanwha-insurance img {
  height: 115px;
}
.contents-home .banner-type-d__img.hippo_wallet img {
  height: 95px;
}
.contents-home .banner-type-d.color_0 {
  background-color: #FFF0E5;
}
.contents-home .banner-type-d.color_1 {
  padding: 0 20px;
}
.contents-home .banner-type-d.color_1 .banner-type-d-flex {
  margin-top: 0;
  padding: 22.5px 0;
}
.contents-home .banner-type-d.color_1 .banner-type-d__title {
  margin-bottom: 0;
}
.contents-home .banner-type-d.color_1 .banner-type-d__title span.sub-title {
  display: block;
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #2B2E33;
  line-height: 2.4rem;
  letter-spacing: -0.5px;
}
.contents-home .banner-type-d.color_1 .banner-type-d__btn {
  background-color: #00CE73;
  border-radius: 8px;
  padding: 4px 12px;
}
.contents-home .banner-type-d.color_1 {
  background-color: #AAF8A6;
}

/* banner-type-d (보장분석) mhth002.html */
.contents-custom-management .banner-wrapper.h-auto {
  height: auto;
}
.contents-custom-management .banner-type-d {
  display: flex;
  justify-content: space-between;
  height: 100%;
  padding: 0 8px;
}
.contents-custom-management .banner-type-d-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.contents-custom-management .banner-type-d .banner-type-d-wrapper {
  width: 100%;
}
.contents-custom-management .banner-type-d__title__contents__wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents-custom-management .banner-type-d__title span {
  display: block;
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.7rem;
  letter-spacing: -0.1px;
}
.contents-custom-management .banner-type-d__title.fs-16 span {
  font-size: 1.6rem;
  line-height: 2.4rem;
  letter-spacing: -0.5px;
  color: #2B2E33;
}
.contents-custom-management .banner-type-d__title span.sub-title {
  font-size: 1.5rem;
  font-family: "Pretendard-Medium";
  color: #2B2E33;
  line-height: 2.1rem;
}
.contents-custom-management .banner-type-d__title span.sub-title.fs-14 {
  font-size: 1.4rem;
  line-height: 2rem;
  color: #484E56;
}
.contents-custom-management .banner-type-d__btn {
  background-color: #FF6600;
  border-radius: 8px;
  padding: 4px 12px;
}
.contents-custom-management .banner-type-d__btn span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #fff;
  line-height: 2.1rem;
}
.contents-custom-management .banner-type-d__detail {
  font-size: 1rem;
  font-family: "Pretendard-Regular";
  color: #868B92;
  line-height: 1.4rem;
}
.contents-custom-management .banner-type-d__title .fc-yellow {
  color: #FDE354;
}
.contents-custom-management .banner-type-d__contents {
  opacity: 0.8;
}
.contents-custom-management .banner-type-d__contents span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 140%;
}
.contents-custom-management .banner-type-d__tags span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #0029a3;
  line-height: 1.2rem;
  margin-right: 6px;
}
.contents-custom-management .banner-type-d__tags span:last-child {
  margin-right: 0px;
}
.contents-custom-management .banner-type-d__img {
  height: 115px;
  margin-left: 8px;
}
.contents-custom-management .banner-type-d__img img {
  height: 100%;
}
.contents-custom-management .banner-type-d.color_0 {
  background-color: transparent;
}

/* 360px 이상일때*/
@media (min-width: 360px) {
  .contents-home .banner-type-a__text {
    min-width: 158px;
  }
}
.contents-home .banner-type-a__text {
}
.contents-home .banner-type-a__img {
  margin-right: 12px;
  
}
.contents-home .banner-type-a__img img {
  height: 90px;
}

.contents-home .banner-type-a.color_0 {
  background-color: #F9F9F9;
}
.contents-home .banner-type-a.color_1 {
  background-color: #DBD8FF;
}
.contents-home .banner-type-a.color_2 {
  background-color: #C9E2FF;
}
.contents-home .banner-type-a.color_3 {
  background-color: #B7F5DA;
}
.contents-home .banner-type-a.color_4 {
  background-color: #FFF2B1;
}
.contents-home .banner-type-b_1.color_1 {
  background-color: #ADEFF4;
}
.contents-home .banner-type-b_1.color_2 {
  background-color: #FFD0D0;
}
.contents-home .banner-type-b_1.color_3 {
  background-color: #FFDAC5;
}
.contents-home .banner-type-b_1.color_4 {
  background-color: #FFF5D0;
}
.contents-home .banner-type-b_1.color_5 {
  background-color: #FBFFD0;
}
.contents-home .banner-type-b_1.color_6 {
  background-color: #E3FFE6;
}
.contents-home .banner-type-b_1.color_7 {
  background-color: #BAF4EA;
}
.contents-home .banner-type-b_1.color_8 {
  background-color: #BAD8F4;
}
.contents-home .banner-type-b_1.color_9 {
  background-color: #ACBBF1;
}
.contents-home .banner-type-b_1.color_10 {
  background-color: #E9CEFF;
}
.contents-home .banner-type-b_1.color_11 {
  background-color: #BAEAF4;
}
.banner-type-c {
  border-radius: 12px;
}
.banner-type-c.color_1 {
  background-color: #FFF0BB;
}
.banner-type-c.color_2 {
  background-color: #C4FBD7;
}
.banner-type-c-check-data {
  padding: 14px 20px 12px 20px;
}
.banner-type-c-category_date-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.banner-type-c__category span {
  font-size: 1.1rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 16px;
}
.banner-type-c__date span {
  font-size: 1.1rem;
  font-family: "Pretendard-SemiBold";
  color: #484E56;
  line-height: 16px;
}
.banner-type-c__date span.date_value {
  font-family: "Pretendard-Regular";
}
.banner-type-c__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.banner-type-c__row__result-container__title {
  margin-bottom: 4px;
}
.banner-type-c__row__result-container__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #141414;
}
.banner-type-c__row__result-container__value span.value {
  font-size: 2.4rem;
  font-family: "Pretendard-SemiBold";
  color: #141414;
  line-height: 28px;
}
.banner-type-c__row__result-container__value span.value-unit {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #000000;
  line-height: 28px;
}
.banner-type-c__row__img img {
  width: 48px;
  height: 48px;
  content: url(../images/banner-warning@2x.png);
}
.banner-type-c__row__img img.warning {
  content: url(../images/banner-warning@2x.png);
}
.banner-type-c__row__img img.good {
  content: url(../images/banner-good@2x.png);
}
.banner-type-c-goto-check {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px 6px 20px;
    background-color: rgba(255, 255, 255, 0.5);
}
.banner-type-c-goto-check-wrapper {
  display: flex;
  align-items: center;
}
.banner-type-c-goto-check-badge {
  padding: 0px 6px;
  margin-right: 8px;
  border-radius: 4px;
}
.banner-type-c-goto-check-badge span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  line-height: 18px;
  color: #ffffff;
}
.banner-type-c-goto-check-badge.low {
  background-color: #FFA826;
}
.banner-type-c-goto-check-badge.good {
  background-color: #1CB2BC;
}
.banner-type-c-goto-check-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 18px;
}
.banner-type-c-goto-check-img img {
  width: 24px;
  height: 24px;
  content: url(../images/RIGHT@2x.png);
}

.contents-home .program {
  padding: 0px 20px 32px 20px;
}
.contents-home .program.myarchive {
  display: none;
  flex-direction: column;
}
.program-myarchive-container {
  display: flex;
}
.home-vitaport-recommend-program-container { 
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.recommend-program-card {
  display: flex;
  width: 100%;
}
.recommend-program-img {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: hidden;
}
.recommend-program-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.recommend-program-info-wrapper {
  flex: 1;
  margin-left: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.program-item-info-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.program-item-info-wrapper span.company-name {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 1.8rem;
  margin-bottom: 2px;
}
.program-item-info-wrapper span.item-name {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 2.1rem;
  margin-bottom: 4px;
}
.recommend-program-name-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.like-img-wrapper img {
  width: 20px;
  height: 20px;
  content: url(../images/like-inactive@2x.png);
}
.like-img-wrapper img.active {
  content: url(../images/like-detail-active@2x.png);
}
.program-item-cost-wrapper span.discount-rate {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #FF5252;
  line-height: 2.4rem;
  margin-right: 4px;
}
.program-item-cost-wrapper span.item-cost {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.recommend-program-tag-wrapper span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  line-height: 1.8rem;
}
.recommend-program-tag-wrapper span.tag-program {
  color: #0085FF;
}
.recommend-program-tag-wrapper span.tag-food {
  color: #0FAB83;
}
.recommend-program-commingsoon-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.recommend-program-commingsoon-wrapper span.company-name {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 18px;
}
.recommend-program-commingsoon-wrapper span.item-name {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 24px;
}

.contents-home .advice {
  padding: 0px 20px 32px 20px;
}
.contents-home .advice-container {
  margin-top: 32px;
}
.advice-status-wrapper {
  display: flex;
}
.advice-container__status {
    flex-basis: 33.3%;
}
.advice-container__status__logo {
    margin: 12px 0px 8px;
}
.advice-container__status__logo div {
    min-width: 45px;
    min-height: 45px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.advice-container__status__logo div img {
    width: 40px;
    height: 40px;
}
.advice-container__status__logo div.warning img {
  content: url(../images/health-warning@2x.png);
}
.advice-container__status__logo div.caution img {
  content: url(../images/health-caution@2x.png);
}
.advice-container__status__logo div.ok img {
  content: url(../images/health-clean@2x.png);
}
.advice-container__status__contents {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.advice-container__status__contents__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.advice-container__status__contents__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.advice-container__status__contents__title img {
  width: 8px;
  height: 12px;
  margin-left: 4px;
  content: url(../images/ic-right-arrow-mini@2x.png);
}
.advice-container__status__contents__title__new {
  display: flex;
  justify-content: center;
  margin-top: 8px;
  margin-bottom: 16px;
}
.advice-container__status__contents__title__new span {
  padding: 0px 8px;
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 21px;
  border-radius: 4px;
}
.advice-container__status__contents__title__new span.warning {
  color: #ff5252;
  background-color: #fff3f3;
}
.advice-container__status__contents__title__new span.caution {
  color: #f99c12;
  background-color: #fff2e5;
}
.advice-container__status__contents__title__new span.ok {
  color: #1bc87f;
  background-color: #f2faff;
}
.advice-container__status__contents__text {
}
.advice-container__status__contents__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 18px;
  letter-spacing: -0.05rem;
}

.contents-home .news {
}
.contents-home .news__text-container {
  padding-top: 20px;
  padding-left: 30px;
  padding-bottom: 18px;
}
.contents-home .news__text-container__cardnews span {
  font-size: 1rem;
  font-family: "Pretendard-Regular";
  color: #113acb;
  line-height: 1.8rem;
  letter-spacing: -0.05rem;
}
.contents-home .news__text-container__title {
  margin-top: 5px;
}
.contents-home .news__text-container__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-home .news__text-container__text {
  margin-top: 9px;
}
.contents-home .news__text-container__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.contents-home .news__image-container {
  display: flex;
  align-items: center;
  padding-top: 20px;
  padding-right: 20px;
}
.contents-home .news__image-container img {
  height: 115px;
}
.contents-home .news__image-container img.insomnia {
  content: url(../images/insomnia@2x.png);
}
.contents-home .myhealth {
  padding: 30px 0px 25px 0px;
}
.contents-home .myhealth-title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-home .swiper-myhealth {
  
}
.contents-home .swiper-myhealth .swiper-slide {
  width: 260px;
  padding: 10px 0px 10px 24px;
}
.contents-home .swiper-myhealth .swiper-slide:last-child {
  padding-right: 35px;
}
.contents-home .myhealth-wrapper {
  max-width: 260px;
  min-height: 341px;
  height: 100%;
  border-radius: 20px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.2);
  background-color: #ffffff;
  padding: 24px 9.5px 20px 9.5px;
}
.contents-home .myhealth-container {
  display: flex;
  flex-direction: column;
  height: 341px;
  justify-content: space-between;
}
.contents-home .myhealth-container__text {
  margin-left: 9px;
}
.contents-home .myhealth-container__text__title {
  display: flex;
}
.contents-home .myhealth-container__text__title span {
  font-size: 1.8rem;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
  color: #141414;
}
.contents-home .myhealth-container__text__title span.nodata {
  color: #484E56;
}
.contents-home .myhealth-container__text__title img {
  height: 24px;
  margin-left: 2px;
  content: url(../images/tip@2x.png);
}
.contents-home .myhealth-container__text__text {
  margin-top: 12px;
}
.contents-home .myhealth-container__text__text span {
  font-size: 1.4rem;
  line-height: 2rem;
  letter-spacing: -0.041rem;
  color: #141414;
  opacity: 0.7;
}
.contents-home .myhealth-container__text__text span.non-member {
  font-size: 1.4rem;
  line-height: 18px;
  color: #3a62ba;
}
.contents-home .myhealth-container__img {
  display: flex;
  justify-content: center;
}
.contents-home .myhealth-container__img img.mindhealth{
  height: 180px;
  content: url(../images/mind-health@2x.png);
}
.contents-home .myhealth-container__img img.bodyhealth{
  height: 180px;
  content: url(../images/body-health@2x.png);
}
.contents-home .myhealth-container__more {
  display: flex;
  align-items: center;
  justify-content: center;
}
.contents-home .myhealth-container__more span {
  font-size: 1.4rem;
  line-height: 25px;
  letter-spacing: -0.041rem;
  color: #868B92;
}
.contents-home .myhealth-container__more div {
  width: 20px;
}
.contents-home .myhealth-container__more img {
  height: 20px;
  content: url(../images/chevron-right@2x.png);
}
.contents-home .myhealth-container__graph{
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  margin-bottom: 10px;
}
.myhealth-container__graph-wrapper {
  filter: blur(1.2px);
}
.contents-home .myhealth-container__graph canvas {
}
.contents-home .myhealth-container__graph span {
  font-size: 1.2rem;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
  color: #6d7683;
}
.contents-home .myhealth-container__graph span.danger {
  color: #5d85ff;
}
.contents-home .myhealth-container__graph.non-member {
  opacity: 0.3;
}
.contents-home .myhealth-container.non-member {
  background-color: #f4fbff;
}
.contents-home .checkup {
  min-height: 120px;
  display: none;
  justify-content: space-between;
  margin: 0px 30px 40px 30px;
  padding: 0px 21px;
  border-radius: 12px;
  background-color: #ddefeb;
  opacity: 0.9;
}
.contents-home .checkup__text-container {
  padding-top: 13px;
  padding-bottom: 20px;
}
.contents-home .checkup__text-container__user span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.4rem;
}
.contents-home .checkup__text-container__title {
  margin-bottom: 4px;
}
.contents-home .checkup__text-container__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-home .checkup__text-container__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 1.8rem;
}
.contents-home .checkup__image-container {
  display: flex;
  align-items: center;
}
.contents-home .checkup__image-container img {
  height: 80px;
}
.contents-home .checkup__image-container img.check-up-logo {
  content: url(../images/weight@2x.png);
}

/*파란색 바탕화면 툴팁*/
.tooltip-pointer {
    position: absolute;
    left: -31px;
    top: 35px;
    z-index: 3;
    display: none;
}
.tooltip-pointer.show {
    display: block;
}
.tooltip-pointer::before {
    content: " ";
    position: absolute;
    border: solid 1px #E6F6F7;
    border-width: 10px;
    top: -17px;
    left: 35px;
    border-color: transparent transparent #F6FCFF transparent;
    z-index: 1;
}
.tooltip-pointer::after {
    content: " ";
    position: absolute;
    border: solid 1px #E6F6F7;
    border-width: 10px;
    top: -19px;
    left: 35px;
    border-color: transparent transparent #118ACB transparent;
}
.tooltip-toast {
    width: calc(100% - 40px);
    position: absolute;
    z-index: 2;
    left: 20px;
    top: 63px;
    display: none;
}
.tooltip-toast.show {
    display: block;
}
.tooltip-toast-container {
    border-radius: 16px;
    background-color: #F6FCFF;
    border: 1px solid #118ACB;
    padding: 15px 16px;
}
.tooltip-toast__title {
    margin-bottom: 12px;
}
.tooltip-toast__title span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    line-height: 17px;
    color: #118ACB;
}
.tooltip-toast__contents {
    display: flex;
}
.tooltip-toast__contents span{
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 17px;
}

/* home > 상단 롤링콘텐츠 배너 */
.swiper-banner .swiper-wrapper {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}
.swiper-banner .swiper-banner-pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
.swiper-banner .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: #aeb3b9;
  margin: 0 5px 0 0;
}
.swiper-banner .swiper-pagination-bullet-active {
  width: 14.9px;
  height: 8px;
  border-radius: 4px;
  background-color: #959595;
  margin: 0 5px 0 0;
}

.contents-home-swiper-pagination {
  display: flex;
  justify-content: center;
  margin-top: 12px;
}
.contents-home-swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #D5DAE2;
    opacity: 1;
    margin: 0px 5px 0px 0px !important;
}
.contents-home-swiper-pagination .swiper-pagination-bullet-active {
    width: 14.9px;
    height: 8px;
    border-radius: 4px;
    background-color: #0CAAB8;
    margin: 0px 5px 0px 0px !important;
}
.recommend-card {
  width: 100%;
  position: relative;
  border-radius: 12px;
  height: 172px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.recommend-card-text-wrapper {
}
.recommend-card-wrapper {
  height: 100%;
  padding: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.recommend-card-category {
  margin-bottom: 4px;
}
.recommend-card-category span{
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #0FAB83;
  line-height: 16.8px;
  letter-spacing: -0.25px;
}
.recommend-card-category span.recommend-program {
  color: #0FAB83;
}
.recommend-card-category span.recommend-product {
  color: #4B7CE3;
}
.recommend-card__title {
}
.recommend-card__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 19.6px;
  display: -webkit-box;
  letter-spacing: -0.25px;
  -webkit-line-clamp: 2; /* 텍스트 라인 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: keep-all;
}
.recommend-card__img {
  display: flex;
  justify-content: end;
}
.recommend-card__img img {
  height: 72px;
}
.recommend-card__more {
  padding-bottom: 8px;
}
.recommend-card__more span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}

.recommend-card--program {
  margin-right: 16px;
  background-color: #E7F7F1;
  border: solid 1px #DEE3E7;
}
.recommend-card--program.bg-1 {
  background-color: #D3F8FB;
  border: 0.5px solid #D1F0FF;
}
.recommend-card--program.bg-2 {
  background-color: #FFF3F3;
  border: 0.5px solid #D1F0FF;
}
.recommend-card--program.bg-3 {
  background-color: rgba(129, 146, 169, 0.2);
  border: 0.5px solid #DEDEDE;
}
.recommend-card--program img.recommend-card__refresh {
  content: url(../images/refresh_program@2x.png);
}
.recommend-card--program div.recommend-card__category span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.recommend-card--program div.recommend-card__img img {
  content: url(../images/dumbbell@2x.png);
}
.recommend-card--program div.recommend-card__img img.body {
  content: url(../images/slide-health-13@2x.png);
}
.recommend-card--program div.recommend-card__img img.blood-sugar {
  content: url(../images/slide-health-8@2x.png);
}
.recommend-card--program div.recommend-card__img img.stress {
  content: url(../images/card-news-12@2x.png);
}
.recommend-card--program div.recommend-card__img img.preparing {
  height: 56px;
  content: url(../images/puzzle@2x.png);
}
.recommend-card--program div.recommend-card__img img.sale {
  height: 56px;
  content: url(../images/sale@2x.png);
}

.recommend-card--food {
  background-color: #E7F5FF;
  border: solid 1px #DEE3E7;
}
.recommend-card--food img.recommend-card__refresh {
  content: url(../images/refresh_food@2x.png);
}
.recommend-card--food div.recommend-card__category span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #f46b72;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.recommend-card--food div.recommend-card__img img {
  content: url(../images/pill@2x.png);
}
.recommend-card--food div.recommend-card__img img.preparing {
  height: 56px;
  content: url(../images/puzzle@2x.png);
}
.recommend-card--food div.recommend-card__img img.customer {
  height: 56px;
  content: url(../images/custom@2x.png);
}
.my-archive-card {
  width: 100%;
  position: relative;
  border-radius: 12px;
  min-height: 140px;
  height: 140px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  border: solid 1px #DEE3E7;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}
.my-archive-card.bg1 {
  background-color: #f4faff;
  margin-right: 20px;
}
.my-archive-card.bg2 {
  background-color: #f0faed;
}
.my-archive-card .title-area {
  margin-top: 20px;
  margin-left: 10px;
}
.my-archive-card .graph-area {
  margin-bottom: 28px;
  margin-left: 10px;
}
.my-archive-card .company {
  font-size: 1.1rem;
  color: #484E56;
  margin-bottom: 5px;
}
.my-archive-card .program-name {
  font-size: 1.6rem;
}
.my-archive-card .percentage-noti {
  font-size: 1.1rem;
  color: #484E56;
  margin-bottom: 8px;
}
.my-archive-card .percentage-graph {
  margin-right: 10px;
}
.percentage-graph .graph-wrapper {
  position: relative;
}
.percentage-graph .graph-basic {
  width: 100%;
  position: absolute;
  background-color: #F1F1F1;
  height: 10px;
  border-radius: 8px;
}
.percentage-graph .graph-basic.progress {
  width: 50%;
  background-color: #0caab8;
}

/* 추천드립니다 카드배너 */
.recommend-noti-card {
  display: flex;
  margin: 12px 20px 32px 20px;
  opacity: 0.9;
  border-radius: 12px;
  background-color: #DDE8FF;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
}
.recommend-noti-card.mycheckup {
    margin: 32px 20px;
}
.recommend-noti-text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 21px;
}
.recommend-noti-text span strong{
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  line-height: 24px;
}
.recommend-noti-img img{
  width: 60px;
  height: 60px;
}

.contents-activity {
    background-color: #f9f9f9;
}
.product-container {
    margin-bottom: 40px;
}
.contents-activity .swiper-wrapper {
    display: flex;
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    margin-left: 20px !important;
}
.contents-activity .swiper-wrapper .swiper-slide {
    margin-right: 16px;
    width: 140px;
}
.contents-activity .swiper-wrapper .swiper-slide:last-child {
    padding-right: 24px;
}
.product-list {
    padding: 0px 20px 40px 20px;
}
.product-list__title {
    margin: 0px 20px 16px 20px;
}
.product-list__title span {
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 2.4rem;
}
.product-item-inline-container {
    margin-right: 20px;
    flex-basis: 50%;
    overflow: hidden;
}
.product-item-inline-container:last-child {
    margin-right: 0px;
}
.product-item-line-wrapper {
    display: flex;
    margin-bottom: 24px;
}
.product-item-line-wrapper:last-child {
    margin-bottom: 0px;
}
.product-img-wrapper {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}
.product-img {
    width: 140px;
    height: 140px;
}
.product-img.inline {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
}
.product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product-tag-badge {
  
}
.product-tag-badge div {
  position: absolute;
  width: 40px;
  border-radius: 8px 0px;
  padding: 2px 0px;
  display: flex;
  justify-content: center;
}
.product-tag-badge div:nth-child(1) {
    z-index: 3;
}
.product-tag-badge div:nth-child(2) {
    z-index: 2;
    left: 34px;
}
.product-tag-badge div:nth-child(3) {
    z-index: 1;
    left: 68px;
}
.product-tag-badge div.best-badge {
  background-color: #000000;
}
.product-tag-badge div.recommend-badge {
  background-color: #3A92FB;
}
.product-tag-badge div.discount-badge {
  background-color: #20BB8D;
}
.product-tag-badge div span {
  color: #ffffff;
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  line-height: 18px;
}
.product-info-wrapper {
    margin-top: 8px;
}
.product-company-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.product-company-name span{
    color: #484E56;
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    line-height: 21px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.product-company-name img {
    width: 20px;
    height: 20px;
    content: url(../images/like-inactive@2x.png);
}
.product-company-name img.active {
    content: url(../images/like-detail-active@2x.png);
}
.product-name {
    margin-top: 2px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.product-name span {
    color: #141414;
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    line-height: 21px;
}
.product-cost-info span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    line-height: 24px;
}
.product-cost-info span.item-rate {
    color: #FF5252; 
}
.product-cost-info span.item-cost {
    color: #141414;
}
.product-grade {
    display: flex;
    align-items: center;
}
.product-grade img {
    width: 20px;
    height: 20px;
    content: url(../images/ic-star@2x.png);
}
.product-grade span {
    color: #868B92;
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    line-height: 21px;
    margin-left: 2px;
}
.product-category-wrapper {
    display: flex;
    margin-top: 8px;
}
.product-category {
    border-radius: 4px;
    background-color: #E5E6EA;
    padding: 2px 8px;
}
.product-category span{
    font-family: "Pretendard-SemiBold";
    font-size: 1.2rem;
    line-height: 18px;
    color: #61677D;
}

.header-activity-detail {
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
.header-activity-detail img {
  height: 25px;
}
.header-activity-detail img.back {
  content: url(../images/chevron-left@2x.png);
}
.swiper-activity-detail {
    height: 100%;
}
.contents-activity-detail {
}

/*이런사람에게추천해요*/
.recommend-this-container {
    padding: 16px 20px 0px 20px;
}
.recommend-this-title {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}
.recommend-this-title img {
    width: 20px;
    height: 20px;
    content: url(../images/ic-recommend@2x.png);
}
.recommend-this-title span {
    color: #484E56;
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    line-height: 21px;
    margin-left: 2px;
}
.recommend-this-disease-list {
    display: flex;
    flex-wrap: wrap;
}
.disease-text-wrapper {
    border-radius: 4px;
    background-color: rgba(12, 170, 184, 0.12);
    padding: 2px 8px;
    margin: 0px 4px 4px 0px;
}
.disease-text-wrapper span{
    color: #0CAAB8;
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    line-height: 18px;
}

.contents-activity-detail__img-area {
  position: relative;
  border-bottom: 1px solid #F3F3F3;
}
.contents-activity-detail__img-area__banner-container img {
  width: 100%;
  object-fit: contain;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.contents-activity-detail__img-area .swiper-activity-detail-page-number {
  width: 37px;
  height: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 18px;
  right: 20px;
  border-radius: 20px;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 10;
}
.contents-activity-detail__img-area .swiper-activity-detail-page-number__current {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #ffffff;
  line-height: 2.2rem;
}
.contents-activity-detail__img-area .swiper-activity-detail-page-number__total {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: rgba(255, 255, 255, 0.6);
  line-height: 2.2rem;
}
.contents-activity-detail__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
.contents-activity-detail-tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding-right: 12px;
}
.contents-activity-detail-tags-wrapper {
  display: flex;
  align-items: center;
}
.contents-activity-detail__nav__name span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.9rem;
  letter-spacing: -0.041rem;
}

.product-detail-info-container {
  margin-bottom: 20px;
  margin-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
.product-detail-company-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}
.product-detail-company-name span{
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
    line-height: 21px;
}
.product-detail-item-name {
    margin-bottom: 4px;
}
.product-detail-item-name span{
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 21px;
}
.product-detail-company-img-wrapper img {
    width: 24px;
    height: 24px;
}
.product-detail-company-img-wrapper img.like {
    content: url(../images/like-inactive@2x.png);
}
.product-detail-company-img-wrapper img.like.active {
    content: url(../images/like-detail-active@2x.png);
}
.product-detail-company-img-wrapper img.share {
    content: url(../images/ic-share@2x.png);
}
.product-detail-review-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}
.product-detail-review {
    display: flex;
    align-items: center;
}
.product-detail-review span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 21px;
}
.product-detail-review img.star {
    width: 20px;
    height: 20px;
    content: url(../images/ic-star@2x.png);
}
.product-detail-review img.right-arrow {
    width: 16px;
    height: 16px;
    content: url(../images/my_archive_right@2x.png);
}
.product-detail-price {

}
.product-detail-before-cost {
    margin-bottom: 2px;
}
.product-detail-before-cost span{
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #AEB3B9;
    line-height: 24px;
    text-decoration: line-through;
}
.product-detail-cost-info {
}
.product-detail-cost-info span.discount-rate {
    font-size: 2.0rem;
    font-family: "Pretendard-Bold";
    color: #FF5252;
    line-height: 30px;
    margin-right: 6px;
}
.product-detail-cost-info span.real-cost {
    font-size: 2.0rem;
    font-family: "Pretendard-Bold";
    color: #000000;
    line-height: 30px;
}
.product-detail-arcodian {
    margin: 0px 20px 24px 20px;
}

.contents-activity-detail__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  flex-wrap: wrap;
}
.contents-activity-detail__interaction {
  display: flex;
  justify-content: right;
}
.contents-activity-detail__interaction__like {
  min-width: 40px;
  text-align: center;
  padding-right: 12px;
}
.contents-activity-detail__interaction__like div img {
  height: 30px;
}
.contents-activity-detail__interaction__like div img.active {
  content: url(../images/like-detail-active@2x.png);
}
.contents-activity-detail__interaction__like div img.inactive {
  content: url(../images/like-detail-inactive@2x.png);
}
.contents-activity-detail__interaction__like div span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #f46b72;
  line-height: 2.2rem;
}
.contents-activity-detail__interaction__share {
  min-width: 40px;
  text-align: center;
}
.contents-activity-detail__interaction__share div img {
  height: 30px;
}
.contents-activity-detail__interaction__share div img.share {
  content: url(../images/icon-share@2x.png);
}
.contents-activity-detail__interaction__share div span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.2rem;
}

.contents-activity-detail__tabs-container {
    border-bottom: 1px solid #D5DAE2;
    position: sticky;
    top: 45px;
    z-index: 3;
}
.contents-activity-detail__tabs {
  display: flex;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #ffffff;
}
.contents-activity-detail__tab {
    padding: 14px 0px;
    display: flex;
    justify-content: center;
}
.contents-activity-detail__tab span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #868B92;
  line-height: 24px;
}
.contents-activity-detail__tab.selected {
  margin-bottom: -2px;
  border-bottom: 2px solid #000000;
}
.contents-activity-detail__tab.selected span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #000000;
  line-height: 24px;
}

.contents-activity-detail__information {
    margin: 32px 0px 20px;
}
.introduce-contents-wrapper {
    margin: 0px 20px;
}
.review-count-grade {
    display: flex;
    justify-content: space-between;
    margin: 0px 20px;
    align-items: center;
}
.review-area-review-count {
    display: flex;
    align-items: center;
}
.review-area-review-count span.review-count-title {
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #000000;
    line-height: 27px;
}
.review-area-review-count-wrapper span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
}
.review-area-review-count span.review-count {
}
.review-grade-wrapper {
    display: flex;
    align-items: center;
}
.review-grade-wrapper span.review-grade {
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.review-grade-star {
    margin-left: 4px;
}
.review-grade-star img {
    width: 20px;
    height: 20px;
}
.review-grade-star img.full {
    content: url(../images/ic-star-full@2x.png);
}
.review-grade-star img.half {
    content: url(../images/ic-star-half@2x.png);
}
.review-grade-star img.empty {
    content: url(../images/ic-star-empty@2x.png);
}
.review-images-container {
    margin: 20px 20px 24px 20px;
}
.review-images-line {
    display: flex;
    margin-bottom: 8px;
}
.review-images-line:last-child {
    margin-bottom: 0px;
}
.review-image {
    margin-right: 8px;
    border-radius: 4px;
    overflow: hidden;
    flex-basis: 33%;
    position: relative;
}
.review-image.view-all {
    border-radius: 0px;
}
.review-image:last-child {
    margin-right: 0px;
}
.review-image-more {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
}
.review-image-more span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
    line-height: 21px;
}
.review-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.no-registered-reviews {
    padding: 0px 20px;
}
.no-registered-reviews span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #868B92;
}
.review-photo-album {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px;
}
.review-photo-album .review-image {
    margin-right: 0px;
}

.detail-program-introduce {
    margin: 0px 20px;
}
.detail-program-introduce-title {
    display: flex;
    align-items: center;
}
.detail-program-introduce-title span {
    font-size: 1.4rem;
    font-family: "Pretendard-SemiBold";
    color: #0CAAB8;
    line-height: 21px;
    margin-left: 2px;
}
.detail-program-introduce-title img {
    width: 16px;
    height: 16px;
    content: url(../images/ic-information-line@2x.png);
}
.detail-program-introduce-contents span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 21px;
}
.detail-program-introduce-img img {
    width: 100%;
}
.review-sort-text-wrapper {
    position: relative;
}
.review-sort-text {
    display: flex;
}
.review-sort-text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 21px;
}
.review-sort-text img {
    width: 20px;
    height: 20px;
    content: url(../images/icon-system-down-mini@2x.png);
}
.review-sort-text img.expand {
    content: url(../images/icon-system-up-mini@2x.png);
}
.review-onlyphoto-swith-wrapper {
    display: flex;
    align-items: center;
}
.review-onlyphoto-swith-text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
}
.review-sort-text-container {
    display: flex;
    justify-content: space-between;
    padding: 32px 20px 0px;
}
.review-sort-text-wrapper ul {
    position: absolute;
    top: 25px;
    width: 74px;
    right: 2px;
    background: #ffffff;
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
    max-height: 0;
    z-index: 2;
    list-style-type: none;
}
.review-sort-text-wrapper .optionList li {
    margin-bottom: 12px;
}
.review-sort-text-wrapper .optionList li:last-child {
    margin-bottom: 0px;
}
.review-sort-text-wrapper .optionList li span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
    line-height: 21px;
}
.review-sort-text-wrapper.active .optionList {
    max-height: 500px;
    border: solid 1px #D5DAE2;
    padding: 10px 12px;
}

@keyframes fade-in {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
}
@keyframes fade-out {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
}
.toast {
    visibility: hidden;
    position: absolute;
    bottom: 25px;
    width: 100%;
    display: flex;
    justify-content: center;
}
.toast.above {
    top: 40px;
    z-index: 5;
}
.toast .toast-interaction-like-container {
    display: flex;
    align-items: center;
    border-radius: 16px;
    background-color: #3a62ba;
    height: 30px;
    padding: 16px 24px;
}
.toast .toast-interaction-like__img {
    margin-right: 12px;
}
.toast .toast-interaction-like__img img {
    content: url(../images/icon-60-img@2x.png);
    height: 60px;
}
.toast .toast-interaction-like__img img.good {
    content: url(../images/icon-good@2x.png);
    height: 60px;
}
.toast .toast-interaction-like__text span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #ffffff;
    line-height: 2.4rem;
}
.toast.show {
    visibility: visible;
    animation: fade-in 700ms, fade-out 700ms 1300ms;
}

.footer-activity-detail {
    padding: 20px;
    background-color: #ffffff;
    display: flex;
    position: absolute;
    bottom: 0;
    width: calc(100% - 40px);
}
.footer-activity-detail-like {
    border-radius: 10px;
    border: 1px solid #D5DAE2;
    margin-right: 8px;
    min-width: 50px;
    min-height: 50px;
    display: flex;
    justify-content: center;
}
.footer-activity-detail-pay {
    text-align: center;
    display: flex;
    justify-content: center;
    flex: 1;
}
.footer-refund-button {
    padding: 20px;
    background-color: #ffffff;
    position: absolute;
    bottom: 0;
    width: calc(100% - 40px);
}

.contents-activity-detail-pay {
}
.contents-activity-detail-pay-order-card-container {
    padding: 32px 20px 24px;
}
.contents-activity-detail-pay__product__info {
  display: flex;
}
.contents-activity-detail-pay__product__info__thumbnail img {
  content: url(../images/icon-60-img@2x.png);
  height: 68px;
}
.contents-activity-detail-pay__product__info__text {
  margin-left: 12px;
}
.contents-activity-detail-pay__product__info__text__from span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #3a62ba;
  line-height: 2rem;
}
.contents-activity-detail-pay__product__info__text__name span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay__product__info__text__contents {
  margin-top: 18px;
}
.contents-activity-detail-pay__product__info__text__contents span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.4rem;
}
.contents-activity-detail-pay__product__period {
  margin-top: 15px;
  border-bottom: 1px solid rgba(33, 220, 236, 0.5);
  text-align: right;
  padding-top: 7px;
  padding-bottom: 7px;
}
.contents-activity-detail-pay__product__period span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #0caab8;
  line-height: 2.5rem;
}
.contents-activity-detail-pay__product__order {
  margin-top: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.contents-activity-detail-pay__product__order__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay__product__order__cost span {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay__total-cost-text span{
  font-size: 1.5rem;
  font-family: "Pretendard-Medium";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay__total-cost span {
  font-size: 1.5rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay__row-border {
  width: 100%;
  height: 1px;
  background-color: #1bbac8;
  margin-top: 9px;
  margin-bottom: 11px;
}

.contents-photoreview-album {
    padding: 0px 1px;
}

.accordian {
    background-color: #ffffff;
}
.accordian__title {
    min-height: 25px;
    padding-top: 18px;
    padding-bottom: 17px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f3f3f3;
}
.accordian__title__text {
}
.accordian__title__text span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.5rem;
}
.accordian__title__btn {
}
.accordian__title__btn img {
    width: 24px;
    height: 24px;
    content: url(../images/icon-system-up-mini@2x.png);
}
.accordian__title__btn.active img {
    content: url(../images/icon-system-down-mini@2x.png);
}
.accordian__pannel {
    display: none;
    border-bottom: 1px solid #F3F3F3;
}
.accordian__pannel.active {
    display: block;
}
.accordian__pannel__text-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.accordian__pannel__short-text {
    display: flex;
    flex-direction: column;
}
.accordian__pannel__short-text span{
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
}
.accordian__pannel__short-text span.bold{
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #484e56;
}
.accordian__pannel__text {
    padding: 16px 0px 24px 0px;
}
.accordian__pannel__text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
    line-height: 21px;
}
.accordian__pannel__text span.bold {
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #484e56;
    line-height: 2.5rem;
}
.accordian__pannel__text-wrapper button.change {
    border-radius: 4px;
    padding: 3.5px 12px;
    background-color: rgba(33, 220, 236, 0.1);
    display: flex;
}
.accordian__pannel__text-wrapper button.change span {
    font-size: 1.2rem;
    font-family: "Pretendard-Bold";
    color: #0CAAB8;
}
.accordian__pannel__ask {
  position: relative;
  margin-top: 10px;
}
.accordian__pannel__ask textarea {
  width: 100%;
  min-height: 90px;
  border: none;
  border-radius: 16px;
  background-color: #f8f8f8;
  padding: 18px 22px 23px 18px;
  resize: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.accordian__pannel__ask textarea::placeholder {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.accordian__pannel__ask__count {
  position: absolute;
  right: 16px;
  bottom: 7px;
}
.accordian__pannel__ask__count .current-length {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.accordian__pannel__ask__count .max-length {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.6);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.accordian__pannel__payment {
  padding-top: 10px;
}
.accordian__pannel__payment__select {
  min-height: 40px;
  display: flex;
  align-items: center;
  position: relative;
}
.accordian__pannel__payment__select input[type=radio] {
  width: 100%;
  height: 100%;
  position: absolute;
  opacity: 0;
}
.accordian__pannel__payment__select input[type=radio] + span {
  display: inline-block;
  background: url(../images/icon-radio-button-radio-unchecked@2x.png) no-repeat 0% 0%/24px 24px;
  cursor: pointer;
  vertical-align: middle;
  font-size: 0;
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.accordian__pannel__payment__select input[type=radio]:checked + span {
  background: url(../images/icon-radio-button-radio-checked@2x.png) no-repeat 0% 0%/24px 24px;
}
.accordian__pannel__payment__select__text {
  display: flex;
  margin-left: 6px;
}
.accordian__pannel__payment__select__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.accordian__pannel__agree {
  padding-bottom: 11px;
}
.accordian__pannel__agree__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 25px;
  padding: 10px 20px 10px 0px;
}
.accordian__pannel__agree__row img {
  content: url(../images/icon-system-down-mini@2x.png);
  height: 24px;
}
.accordian input[type=checkbox] {
  display: none;
}
.accordian input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}
.accordian input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
 .accordian label {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.accordian label.bold {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.5rem;
}

/*border있는 아코디언*/
.border-accordian {
    background-color: #ffffff;
}
.border-accordian__title {
    min-height: 25px;
    padding: 20px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #E3E5E7;
    border-radius: 16px;
}
.border-accordian__title.active {
    border-radius: 16px 16px 0px 0px;
    border-bottom: 0px;
}
.border-accordian__title__text span {
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #273750;
    line-height: 19px;
}
.border-accordian__title-btn img {
    width: 24px;
    height: 24px;
    content: url(../images/icon-system-down-mini@2x.png);
}
.border-accordian__title-btn.active img {
    content: url(../images/icon-system-down-mini@2x.png);
}
.border-accordian__pannel {
    display: none;
    border: 1px solid #E3E5E7;
    border-radius: 0px 0px 16px 16px;
    padding: 20px 16px 24px;
}
.border-accordian__pannel.active {
    display: block;
}
.border-accordian__pannel__text {
}
.border-accordian__pannel__text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484e56;
    line-height: 21px;
}

/*normal 아코디언*/
.normal-accordian {
    background-color: #ffffff;
}
.normal-accordian__title {
    min-height: 25px;
    padding: 20px 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #F3F3F3;
}
.normal-accordian__title.active {
    border-radius: 16px 16px 0px 0px;
    border-bottom: 0px;
}
.normal-accordian__title.sub {
    padding: 13px 0px;
}
.normal-accordian__title__text {
    word-break: keep-all;
}
.normal-accordian__title__text span {
    font-size: 2.0rem;
    font-family: "Pretendard-Medium";
    color: #141414;
    line-height: 30px;
}
.normal-accordian__title__text span.font-14 {
    line-height: 21px;
    font-size: 1.4rem;
}
.normal-accordian__title-btn img {
    width: 24px;
    height: 24px;
    content: url(../images/icon-system-down-mini@2x.png);
}
.normal-accordian__title-btn.active img {
    content: url(../images/icon-system-up-mini@2x.png);
}
.normal-accordian__pannel {
    display: none;
    padding-top: 16px;
}
.normal-accordian__pannel.sub {
    padding-bottom: 24px;
    border-bottom: 1px solid #F3F3F3;
}
.normal-accordian__pannel.active {
    display: block;
}
.normal-accordian__pannel__text {
    display: flex;
}
.normal-accordian__pannel__text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484e56;
    line-height: 21px;
}
.normal-accordian__pannel__text span.title {
    font-family: "Pretendard-Medium";
    color: #141414;
}
.normal-accordian__pannel__text img.check {
    width: 20px;
    height: 20px;
    content: url(../images/ic-check@2x.png);
}
.normal-accordian__pannel__text img {
    width: 20px;
    height: 20px;
}
.normal-accordian__pannel__text img.check {
    content: url(../images/ic-check@2x.png);
}
.normal-accordian__pannel__text img.x {
    content: url(../images/ic-X@2x.png);
}

/* normal 아코디언 - 유전자*/
.normal-accordian.gene {
    margin-bottom: 40px;
}
.normal-accordian.gene:last-child {
    margin-bottom: 0px;
}
.normal-accordian.gene .normal-accordian__title {
    padding: 0px 0px 16px;
}

/*gene-snp 아코디언*/
.gene-snp-accordian {
  background-color: #ffffff;
}
.gene-snp-accordian__main-title {
  background: #F8F9FA;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width:100%;
}
.gene-snp-accordian__main-title span {
  display: block;
  padding: 4px 8px;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #2E3338;
  line-height: 17px;
  text-align: center;
}
.gene-snp-accordian__main-title span:first-of-type {
  /* width: 24%; */
  width: 22%;
}
.gene-snp-accordian__main-title span:nth-of-type(2) {
  width: 16%;
  word-break: keep-all;
}
.gene-snp-accordian__main-title span:nth-of-type(3) {
  width: 60%;
}
.gene-snp-accordian__title {
  min-height: 25px;
  padding: 4px 0px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #F3F3F3;
}
.gene-snp-accordian:last-of-type .gene-snp-accordian__title {
  border-bottom: 0;
}
.gene-snp-accordian__title.active {
  border-radius: 16px 16px 0px 0px;
  border-bottom: 0px;
}
.gene-snp-accordian__title.sub {
  padding: 13px 0px;
}
.gene-snp-accordian__title__text {
  word-break: keep-all;
  display: flex;
  align-items: center;
}
.gene-snp-accordian__title__text.mini {
  width: 100%;
}
.gene-snp-accordian__title__text.mini .left {
  width: 24%;
  display: flex;
  align-items: center;
}
.gene-snp-accordian__title__text.mini .center {
  width: 16%;
}
.gene-snp-accordian__title__text.mini .right {
  width: 60%;
}
.gene-snp-accordian__title__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #2E3338;
  line-height: 17px;
  display: block;
  padding: 4px 8px;
  text-align: center;
  word-break: break-all;
}
.gene-snp-accordian__title__text.mini span.fc-orange {
  color: #FF6600;
  font-family: "Pretendard-Bold";
}
.gene-snp-accordian__title__text.mini span.fc-lgray {
  color: #B5BDC5;
  font-family: "Pretendard-Regular";
}
.gene-snp-accordian__title__text span.tal {
  text-align: left;
}

.gene-snp-accordian__title__text.mini span.tal {
  width: 100%;
}
.gene-snp-accordian__title__text.v2 {
  width: 100%;
}
.gene-snp-accordian__title__text.v2 span {
  width: 33.3%;
}
.gene-snp-accordian__title-btn {
  display: inline-block;
  padding-left: 8px;
}
.gene-snp-accordian__title-btn img {
  width: 20px;
  height: 20px;
  content: url(../images/ico-gene-snp-chevron-down@2x.png);
}
.gene-snp-accordian__title-btn.active img {
  content: url(../images/ico-gene-snp-chevron-up@2x.png);
}
.gene-snp-accordian__pannel {
  display: none;
  padding-top: 16px;
}
.gene-snp-accordian__pannel.v2 {
  display: none;
  padding-top: 0;
}
.gene-snp-accordian__pannel.v2 .gene-snp-accordian__pannel__conts {
  justify-content: initial;
}
.gene-snp-accordian__pannel.v2 .gene-snp-accordian__pannel__conts > span {
  text-align: left;
}
.gene-snp-accordian__pannel.v2 .gene-snp-accordian__pannel__conts > span.fc-gray {
  color: #57616B;
}
.gene-snp-accordian__pannel__conts.half {
  width: 100%;
}
.gene-snp-accordian__pannel__conts.half > div {
  width: 50%;
  display: flex;
  align-items: center;
}
.gene-snp-accordian__pannel.v2 strong.underline {
  font-family: "Pretendard-Regular";
  font-weight: 400;
  text-decoration: underline;
}
.gene-snp-accordian__pannel.sub {
  padding-bottom: 24px;
  border-bottom: 1px solid #F3F3F3;
}
.gene-snp-accordian__pannel.active {
  display: block;
}
.gene-snp-accordian__pannel__text {
  display: flex;
}
.gene-snp-accordian__pannel__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 21px;
}
.gene-snp-accordian__pannel__text span.title {
  font-family: "Pretendard-Medium";
  color: #141414;
}
.gene-snp-accordian__pannel__text img.check {
  width: 20px;
  height: 20px;
  content: url(../images/ic-check@2x.png);
}
.gene-snp-accordian__pannel__text img {
  width: 20px;
  height: 20px;
}
.gene-snp-accordian__pannel__text img.check {
  content: url(../images/ic-check@2x.png);
}
.gene-snp-accordian__pannel__text img.x {
  content: url(../images/ic-X@2x.png);
}

.gene-snp-accordian__pannel__conts {
  background: #F8F9FA;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width:100%;
  border-top: 1px solid #F1F3F5;
}
.gene-snp-accordian__pannel__conts:first-child {
  border-top: none;
  padding-top: 4px;
}
.gene-snp-accordian__pannel__conts:last-child {
  padding-bottom: 4px;
}
.gene-snp-accordian__pannel__conts span {
  display: block;
  padding: 4px 8px;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #2E3338;
  line-height: 17px;
  text-align: center;
}
.gene-snp-accordian__pannel__conts span:first-of-type {
  width: 72px;
}
.gene-snp-accordian__pannel__conts span:nth-of-type(2) {
  width: calc(50% - 72px);
}
.gene-snp-accordian__pannel__conts.half span {
  text-align: left;
}

.contents-activity-detail-pay__law {
    padding: 24px 20px;
}
.contents-activity-detail-pay__law__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}
.contents-activity-detail-pay__law__contents {
  margin-top: 14px;
}
.contents-activity-detail-pay__law__contents span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.contents-activity-detail-pay .button {
  padding: 20px;
}

.contents-change-address-add-wrapper {
  padding-top: 10px;
  padding-left: 24px;
  padding-right: 20px;
}
.contents-change-address__add {
  padding-top: 18px;
  padding-right: 20px;
  padding-bottom: 16px;
  display: flex;
  justify-content: right;
  align-items: center;
  border-bottom: 1px solid #f3f3f3;
}
.contents-change-address__add span {
  border-radius: 4px;
  background-color: rgba(33, 220, 236, 0.1);
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 1rem;
  padding: 7px 8px;
}
.contents-change-address__list {
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 110px;
}
.contents-change-address__basic-check {
  margin-top: 10px;
  display: flex;
  justify-content: right;
  align-items: center;
  padding-right: 15px;
}
.contents-change-address__basic-check label {
  margin-left: 5px;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}

.footer-change-address {
  padding: 16px 20px;
  background-color: #ffffff;
}
.footer-change-address-wrapper {
  align-items: center;
}
.footer-change-address-wrapper button {
  flex-basis: 47%;
}

.address {
  margin-bottom: 28px;
}
.address-wrapper {
  padding-bottom: 10px;
  border-bottom: 1px solid #f3f3f3;
}
.address__basic {
  margin-top: 18px;
  margin-bottom: 15px;
}
.address__basic span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}
.address__name {
  margin-bottom: 10px;
}
.address__name span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.5rem;
}
.address__phone {
  position: relative;
  margin-bottom: 20px;
}
.address__phone span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.address__phone span.phone {
  margin-left: 24px;
}
.address__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.address__button-radio {
  position: absolute;
  top: 17px;
  right: 0;
}
.address__button-change {
  position: absolute;
  top: 17px;
  right: 0;
}
.address__button-change button {
  margin-left: 6px;
}

.health-comparison-nologin-contents {
    padding: 10px 20px 24px 20px;
}
.contents-custom-management {
  padding: 10px 20px 45px 20px;
}
.contents-custom-management-advice {
  visibility: collapse;
  height: 0;
  /* margin-bottom: 30px; */
}
.contents-custom-management-advice-wrapper {
  display: flex;
  align-items: center;
  opacity: 0.9;
  border-radius: 12px;
  background-color: #0caab8;
  padding: 19px 26px 25px 14px;
}
.contents-custom-management-advice-wrapper.stress {
  background-color: #3a62ba;
}
.contents-custom-management-advice__title {
  display: flex;
  align-items: center;
}
.contents-custom-management-advice__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 1.4rem;
}
.contents-custom-management-advice__title span.name {
  padding: 4px;
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 1.4rem;
}
.contents-custom-management-advice__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #ffffff;
  line-height: 1.8rem;
}
.contents-custom-management-advice img {
  margin-right: 12px;
  height: 60px;
  content: url(../images/icon-60-img@2x.png);
}
.contents-custom-management-custom-card-list {
  margin-bottom: 20px;
}
.contents-custom-management-custom-card-list:last-child {
    margin-bottom: 0px;
}
.contents-custom-management-graph {
  margin-bottom: 27px;
}
.contents-custom-management-graph-wrapper {
  padding: 25px 22px 20px 20px;
  border-radius: 16px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  background-color: #ffffff;
}
.contents-custom-management-graph__title {
  margin-bottom: 22px;
  display: flex;
  align-items: center;
}
.contents-custom-management-graph__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-custom-management-graph__title img {
  margin-left: 6px;
  height: 24px;
  content: url(../images/tip@2x.png);
}
.contents-custom-management-graph__title img.gray {
  height: 16px;
  content: url(../images/tip-gray@2x.png);
}
.contents-custom-management-graph__graph-area {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}
.contents-custom-management-graph__subtitle {
  margin-bottom: 11px;
}
.contents-custom-management-graph__subtitle span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.contents-custom-management-graph__legend {
  display: flex;
  justify-content: center;
}
.contents-custom-management-graph__legend span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
}
.contents-custom-management-graph__legend div.avg {
  display: flex;
  align-items: center;
  margin-right: 16px;
}
.contents-custom-management-graph__legend div.avg_label {
  border-radius: 1px;
  background-color: rgba(174, 179, 185, 0.8);
  width: 24px;
  height: 5px;
  margin-right: 5px;
}
.contents-custom-management-graph__legend div.my {
  display: flex;
  align-items: center;
}
.contents-custom-management-graph__legend div.my_label {
  border-radius: 1px;
  background-image: linear-gradient(114deg, #5dbafb 19%, #003eff 100%);
  width: 24px;
  height: 5px;
  margin-right: 5px;
}
.contents-custom-management-checkup-wrapper {
  padding: 10px 16px 10px 20px;
  opacity: 0.9;
  border-radius: 12px;
  background-color: #d5dbfd;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  display: flex;
  align-items: center;
}
.contents-custom-management-checkup-wrapper.stress {
  background-color: #718ef8;
}
.contents-custom-management-checkup__icon {
  margin-right: 14px;
}
.contents-custom-management-checkup__icon img {
  height: 60px;
  content: url(../images/icon-60-img@2x.png);
}
.contents-custom-management-checkup__icon img.stess {
  content: url(../images/emergency-call@2x.png);
}
.contents-custom-management-checkup__title {
  margin-bottom: 6.4px;
}
.contents-custom-management-checkup__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-custom-management-checkup__title span.stress {
  color: #ffffff;
}
.contents-custom-management-checkup__subtitle span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 1.8rem;
}
.contents-custom-management-checkup__subtitle span.stress {
  color: #ffffff;
}
.contents-custom-management-title {
  margin-top: 30px;
  margin-bottom: 20px;
}
.contents-custom-management-title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-custom-management-imoji {
  margin-top: 21px;
  margin-bottom: 21px;
}
.contents-custom-management-imoji-wrapper {
  padding: 14px 26px 11px 18px;
  border-radius: 16px;
  background-color: #f3f3f3;
  display: flex;
}
.contents-custom-management-imoji__icon {
  margin-right: 26px;
}
.contents-custom-management-imoji__icon img {
  height: 93px;
}
.contents-custom-management-imoji__icon img.imoji-1 {
  content: url(../gif/imoji-1.gif);
}
.contents-custom-management-imoji__icon img.imoji-2 {
  content: url(../gif/imoji-2.gif);
}
.contents-custom-management-imoji__icon img.imoji-3 {
  content: url(../gif/imoji-3.gif);
}
.contents-custom-management-imoji__icon img.imoji-4 {
  content: url(../gif/imoji-4.gif);
}
.contents-custom-management-imoji__title {
  margin-top: 10px;
  margin-bottom: 11px;
}
.contents-custom-management-imoji__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.5rem;
}
.contents-custom-management-imoji__subtitle span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 1.8rem;
}
.contents-custom-management-tab-container {
  margin-top: 6px;
  margin-bottom: 35px;
  display: flex;
  justify-content: center;
}
.contents-custom-management-tab-wrapper {
  display: flex;
  align-items: center;
  border-radius: 22.5px;
  background-color: #f3f3f3;
}
.contents-custom-management-tab {
  background-color: #f3f3f3;
  border-radius: 22.5px;
  padding: 8px 22px;
}
.contents-custom-management-tab span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.contents-custom-management-tab.selected {
  background-color: #0caab8;
}
.contents-custom-management-tab.selected span {
    font-size: 1.6rem;
    font-family: "Pretendard-SemiBold";
    color: #ffffff;
    line-height: 2.2rem;
    letter-spacing: -0.041rem;
}
.contents-custom-management-button {
    padding: 16px 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 18.9%);
    position: sticky;
    bottom: 0px;
    z-index: 2;
}

.opinion-graph {
  margin-bottom: 20px;
  background-color: rgba(33, 220, 236, 0.1);
  border-radius: 10px;
  height: 150px;
  text-align: center;
}

.custom-card {
  margin-bottom: 10px;
}
.custom-card-wrapper {
  display: flex;
  align-items: center;
  border-radius: 16px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  background-color: #ffffff;
  padding: 15px 10px 10px 20px;
}
.custom-card-row {
  width: 100%;
  display: flex;
  align-items: center;
}
.custom-card-row.right {
  width: 70%;
  justify-content: space-between;
}
.custom-card__icon img {
  height: 60px;
}
.custom-card__icon img.mind-1 {
  content: url(../images/icon-mind-1@2x.png);
}
.custom-card__icon img.mind-2 {
  content: url(../images/icon-mind-2@2x.png);
}
.custom-card__icon img.mind-3 {
  content: url(../images/icon-mind-3@2x.png);
}
.custom-card__icon img.mind-4 {
  content: url(../images/icon-mind-4@2x.png);
}
.custom-card__icon img.mind-5 {
  content: url(../images/icon-mind-5@2x.png);
}
.custom-card__icon img.body-1 {
  content: url(../images/icon-body-1@2x.png);
}
.custom-card__icon img.body-2 {
  content: url(../images/icon-body-2@2x.png);
}
.custom-card__icon img.body-3 {
  content: url(../images/icon-body-3@2x.png);
}
.custom-card__icon img.body-4 {
  content: url(../images/icon-body-4@2x.png);
}
.custom-card__icon img.body-5 {
  content: url(../images/icon-body-5@2x.png);
}
.custom-card__icon img.body-6 {
  content: url(../images/icon-body-6@2x.png);
}
.custom-card__icon img.body-7 {
  content: url(../images/icon-body-7@2x.png);
}
.custom-card__icon img.body-8 {
  content: url(../images/icon-body-8@2x.png);
}
.custom-card__icon img.body-9 {
  content: url(../images/icon-body-9@2x.png);
}
.custom-card__icon img.body-10 {
  content: url(../images/icon-body-10@2x.png);
}
.custom-card__icon img.brain-1 {
  content: url(../images/icon-brain-1@2x.png);
}
.custom-card__icon img.brain-2 {
  content: url(../images/icon-brain-2@2x.png);
}
.custom-card__icon img.stress-1 {
  content: url(../images/icon-stress-1@2x.png);
}
.custom-card__icon img.stress-2 {
  content: url(../images/icon-stress-2@2x.png);
}
.custom-card__icon img.stress-3 {
  content: url(../images/icon-stress-3@2x.png);
}
.custom-card__icon img.stress-4 {
  content: url(../images/icon-stress-4@2x.png);
}
.custom-card__icon img.stress-5 {
  content: url(../images/icon-stress-5@2x.png);
}
.custom-card__icon img.stress-6 {
  content: url(../images/icon-stress-6@2x.png);
}
.custom-card__icon img.stress-7 {
  content: url(../images/icon-stress-7@2x.png);
}
.custom-card__icon img.job-1 {
  content: url(../images/icon-job-1@2x.png);
}
.custom-card__icon img.job-2 {
  content: url(../images/icon-job-2@2x.png);
}
.custom-card__icon img.job-3 {
  content: url(../images/icon-job-3@2x.png);
}
.custom-card__icon img.job-4 {
  content: url(../images/icon-job-4@2x.png);
}
.custom-card__icon img.job-5 {
  content: url(../images/icon-job-5@2x.png);
}
.custom-card__icon img.job-6 {
  content: url(../images/icon-job-6@2x.png);
}
.custom-card__icon img.job-7 {
  content: url(../images/icon-job-7@2x.png);
}
.custom-card__icon img.job-8 {
  content: url(../images/icon-job-8@2x.png);
}
.custom-card__icon img.job-9 {
  content: url(../images/icon-job-9@2x.png);
}
.custom-card__icon img.job-10 {
  content: url(../images/icon-job-10@2x.png);
}
.custom-card__icon img.job-11 {
  content: url(../images/icon-job-11@2x.png);
}
.custom-card__icon img.job-12 {
  content: url(../images/icon-job-12@2x.png);
}
.custom-card__title {
  width: 100%;
  margin-left: 15px;
}
.custom-card__title span.name {
  margin-bottom: 12px;
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}
.custom-card__title span.last-date {
  font-size: 1rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.8rem;
}
.custom-card__value {
  width: 100%;
  padding-left: 10px;
}
.custom-card__value span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #0caab8;
  line-height: 2.2rem;
}
.custom-card__more img {
  height: 24px;
  content: url(../images/icon-system-24-right@2x.png);
}

.bottom-sheet-container__mhth {
  overflow-y: scroll;
  padding: 20px;
  max-height: 400px;
}
.bottom-sheet-container__mhth__title {
  padding: 16px 20px;
}
.bottom-sheet-container__mhth__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.5rem;
}
.bottom-sheet-container_agree_title {
  display: flex;
  padding: 24px 28px 16px 20px;
  justify-content: space-between;
}
.bottom-sheet-container_agree_title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.5rem;
}
.bottom-sheet-container_agree_title img {
  height: 24px;
  content: url(../images/close_g@2x.png);
}
.bottom-sheet-container__mhth__graph {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 9px;
}
.bottom-sheet-container__mhth__graph.brain {
  align-items: normal;
}
.bottom-sheet-container__mhth__graph-container {
  width: 300px;
  height: 300px;
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-bottom: 13px;
}
.bottom-sheet-container__mhth__graph-container canvas{
}
.bottom-sheet-container__mhth__information-wrapper {
  padding-left: 10px;
  padding-top: 10px;
}
.bottom-sheet-container__mhth__information-graph-container {
  padding-left: 20px;
  padding-right: 20px;
}
.bottom-sheet-container__mhth__tip {
  text-align: center;
  padding: 10px 16px;
}
.bottom-sheet-container__mhth__tip span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.4rem;
}
.bottom-sheet-container__mhth__row {
  display: flex;
  margin-bottom: 10px;
}
.bottom-sheet-container__mhth__row div {
  width: 100%;
}
.bottom-sheet-container__mhth__row__name {
  flex-basis: 30%;
}
.bottom-sheet-container__mhth__row__name span {
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.bottom-sheet-container__mhth__row__short-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.2rem;
}
.bottom-sheet-container__mhth__row__short-text span.medium {
  font-family: "Pretendard-Medium";
}
.bottom-sheet-container__mhth__row__full-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #868b92;
  line-height: 1.8rem;
  letter-spacing: -0.03rem;
}
.bottom-sheet-container__mhth__card {
  margin-bottom: 20px;
}
.bottom-sheet-container__mhth__card-wrapper {
  display: flex;
  align-items: center;
  padding: 10px 19px 10px 20px;
  opacity: 0.9;
  border-radius: 16px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
}
.bottom-sheet-container__mhth__card-wrapper.imoji-1 {
  background-color: #b7f4de;
}
.bottom-sheet-container__mhth__card-wrapper.imoji-2 {
  background-color: #c3bafb;
}
.bottom-sheet-container__mhth__card-wrapper.imoji-3 {
  background-color: #718ef8;
}
.bottom-sheet-container__mhth__card-wrapper.imoji-4 {
  background-color: #f88971;
}
.bottom-sheet-container__mhth__card__icon {
  margin-right: 17px;
}
.bottom-sheet-container__mhth__card__icon img {
  height: 60px;
}
.bottom-sheet-container__mhth__card__icon img.imoji-1 {
  content: url(../gif/imoji-1.gif);
}
.bottom-sheet-container__mhth__card__icon img.imoji-2 {
  content: url(../gif/imoji-2.gif);
}
.bottom-sheet-container__mhth__card__icon img.imoji-3 {
  content: url(../gif/imoji-3.gif);
}
.bottom-sheet-container__mhth__card__icon img.imoji-4 {
  content: url(../gif/imoji-4.gif);
}
.bottom-sheet-container__mhth__card__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.bottom-sheet-container__mhth__card__value span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 2.4rem;
}
.bottom-sheet-container__mhth__card__value span.status {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
  padding: 3px 6px;
}
.bottom-sheet-container__mhth__card__value span.imoji-1 {
  background-color: #B7F4DE;
}
.bottom-sheet-container__mhth__card__value span.imoji-2 {
  background-color: #C3BAFB;
}
.bottom-sheet-container__mhth__card__value span.imoji-3 {
  background-color: #718EF8;
}
.bottom-sheet-container__mhth__card__value span.imoji-4 {
  background-color: #F88971;
}
.bottom-sheet-container__mhth__opinion {
  padding-left: 10px;
  padding-right: 10px;
  margin-top: 16px;
}
.bottom-sheet-container__mhth__opinion__where {
  margin-bottom: 10px;
}
.bottom-sheet-container__mhth__opinion__where span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #3a62ba;
  line-height: 2rem;
  letter-spacing: -0.041rem;
}
.bottom-sheet-container__mhth__opinion__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2rem;
  letter-spacing: -0.041rem;
}

.border-container.stress {
  height: 10px;
  background-color: #f3f3f3;
}

.chart-bottomsheet-expected {
  margin-bottom: 19px;
}
.chart-bottomsheet-expected-container {
  width: 100%;
  height: 102px;
  position: relative;
  z-index: 1;
}
.chart-bottomsheet-expected__health {
  position: absolute;
  bottom: 0;
}
.chart-bottomsheet-expected__health-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background-image: linear-gradient(to right, #6ef2e8 0%, #6079ea 100%);
  z-index: 5;
}
.chart-bottomsheet-expected__health-border {
  width: 100%;
  height: 29px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 54px;
  border-right: 1px solid #6078ea;
}
.chart-bottomsheet-expected__health-text {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 83px;
}
.chart-bottomsheet-expected__health-text .wrapper {
  position: absolute;
  right: -30px;
  padding: 3px 7px 3px 6px;
  border-radius: 16px;
  background-color: #6078ea;
  display: flex;
  align-items: center;
}
.chart-bottomsheet-expected__health-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-expected__health-text span.value {
  margin-left: 6px;
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-expected__health-text img {
  position: absolute;
  right: -9px;
  bottom: -28px;
  height: 11px;
  content: url(../images/polygon-11@3x.png);
}
.chart-bottomsheet-expected__real {
  position: absolute;
  bottom: 0;
}
.chart-bottomsheet-expected__real-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background-color: #aeb3b9;
  z-index: 3;
}
.chart-bottomsheet-expected__real-border {
  width: 100%;
  height: 25px;
  position: absolute;
  left: -0.5px;
  right: 0;
  bottom: 0px;
  border-right: 1px solid #868b92;
}
.chart-bottomsheet-expected__real-text {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 62px;
}
.chart-bottomsheet-expected__real-value {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
}
.chart-bottomsheet-expected__real-value .wrapper {
  display: flex;
  align-items: center;
  position: absolute;
  right: -30px;
  padding: 3px 7px 3px 6px;
  border-radius: 16px;
  background-color: #868b92;
  display: flex;
  align-items: center;
}
.chart-bottomsheet-expected__real-value span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-expected__real-value span.value {
  margin-left: 6px;
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-expected__real-value img {
  position: absolute;
  right: -7px;
  bottom: 28px;
  height: 9px;
  content: url(../images/polygon-12@3x.png);
}
.chart-bottomsheet-expected__basic {
  width: 100%;
  background-color: #f1f1f1;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
}
.chart-bottomsheet-expected__basic-text {
  width: 100%;
  position: absolute;
  bottom: 17px;
}
.chart-bottomsheet-expected__basic-text span {
  font-size: 1rem;
  font-family: "Pretendard-SemiBold";
  color: #868b92;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-expected__basic-text span.end {
  position: absolute;
  right: -10px;
}
.chart-bottomsheet-brain {
  margin-bottom: 19px;
}
.chart-bottomsheet-brain-container {
  width: 100%;
  height: 91px;
  position: relative;
  z-index: 1;
}
.chart-bottomsheet-brain__title {
}
.chart-bottomsheet-brain__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-brain__avg {
  width: 30%;
  position: absolute;
  bottom: 0;
  z-index: 5;
}
.chart-bottomsheet-brain__avg-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background-color: #AEB3B9;
}
.chart-bottomsheet-brain__avg-value {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
}
.chart-bottomsheet-brain__avg-value img {
  position: absolute;
  right: -8px;
  bottom: 19px;
  height: 11px;
  content: url(../images/polygon-12@3x.png);
}
.chart-bottomsheet-brain__avg-value span {
  position: absolute;
  right: -16px;
  bottom: 0px;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.chart-bottomsheet-brain__my {
  width: 50%;
  position: absolute;
  bottom: 0;
  z-index: 3;
}
.chart-bottomsheet-brain__my-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background: linear-gradient(90deg, #6EF2E8 0%, #6079EA 100.11%);
  border-right: 1px solid #5B8CF2
}
.chart-bottomsheet-brain__my-border {
  width: 100%;
  height: 19px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 54px;
  border-right: 1px solid #5B8CF2;
}
.chart-bottomsheet-brain__my-text {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 73px;
}
.chart-bottomsheet-brain__my-text div {
  min-width: 29px;
  position: absolute;
  right: -22px;
  padding: 5px 8px;
  border-radius: 16px;
  background-color: #6078EA;
  text-align: center;
}
.chart-bottomsheet-brain__my-text span {
  font-size: 1.1rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 1.2rem;
}
.chart-bottomsheet-brain__my-text span .point {
  font-size: 1.4rem;
}
.chart-bottomsheet-brain__basic {
  width: 100%;
  background-color: #f3f3f3;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
}
.chart-bottomsheet-brain__basic-text {
  width: 100%;
  position: absolute;
  bottom: 15px;
}
.chart-bottomsheet-brain__basic-text span {
  font-size: 1rem;
  font-family: "Pretendard-SemiBold";
  color: #868b92;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
  opacity: 0.7;
}
.chart-bottomsheet-brain__basic-text span.end {
  position: absolute;
  right: -5px;
}
.chart-bottomsheet-brain-labels {
  position: absolute;
  top: -15px;
  right: 0;
  display: flex;
  justify-content: right;
  align-items: center;
}
.chart-bottomsheet-brain-labels div {
  display: flex;
  align-items: center;
}
.chart-bottomsheet-brain-labels__bar {
  margin-left: 16px;
  width: 10px;
  height: 5px;
}
.chart-bottomsheet-brain-labels__bar.avg {
  background-color: #5e7cea;
}
.chart-bottomsheet-brain-labels__bar.my {
  background-color: #ffc61e;
}
.chart-bottomsheet-brain-labels__text {
  margin-left: 5px;
}
.chart-bottomsheet-brain-labels__text span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}

.contents-custom-management-detail-program-wrapper {
    padding: 32px 20px;
}
.contents-custom-management-detail-program__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-custom-management-detail-program__subtitle {
    margin-top: 4px;
    margin-bottom: 24px;
}
.contents-custom-management-detail-program__subtitle span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
}
.contents-custom-management-detail-program__card-container {
  display: flex;
}
.contents-custom-management-detail-compare-wrapper {
  padding: 30px 20px 20px 20px;
}
.contents-custom-management-detail-compare__title {
  margin-bottom: 7px;
}
.contents-custom-management-detail-compare__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-custom-management-detail-compare__subtitle {
  margin-left: 6px;
}
.contents-custom-management-detail-compare__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.contents-custom-management-detail-compare__subtitle span.high {
  color: #f46b72;
}
.contents-custom-management-detail-compare__subtitle span.low {
  color: #f46b72;
}
.contents-custom-management-detail-compare__graph {
  margin-top: 20px;
}
.contents-custom-management-detail-compare__graph-wrapper {
  padding: 25px 22px 20px 20px;
}
.contents-custom-management-detail-compare__graph__title {
  margin-bottom: 22px;
  display: flex;
  align-items: center;
}
.contents-custom-management-detail-compare__graph__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-custom-management-detail-compare__graph__title img {
  margin-left: 6px;
  height: 24px;
  content: url(../images/tip@2x.png);
}
.contents-custom-management-detail-compare__graph__subtitle {
  margin-bottom: 11px;
}
.contents-custom-management-detail-compare__graph__subtitle span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.contents-custom-management-detail-record {
  padding-bottom: 30px;
}
.contents-custom-management-detail-record-wrapper {
  padding: 30px 20px;
}
.contents-custom-management-detail-record__title {
  margin-bottom: 12px;
}
.contents-custom-management-detail-record__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-custom-management-detail-record__graph {
  display: flex;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph {
  position: relative;
  min-height: 148px;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  flex-basis: 100%;
  border-bottom: solid 1px #aeb3b9;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.border {
  height: 36px;
  border-bottom: dashed 1px #e1e8f3;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.border.none {
  border-bottom: 0px;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0px;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .text {
  margin-bottom: 4px;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .text span {
  font-size: 1.8rem;
  font-family: "NotoSansKR-Regular";
  color: #484e56;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .text span.current {
  color: #000000;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .bar-container {
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .bar-container div.bar {
  position: relative;
  width: 34px;
  height: 60%;
  background-color: #e1e8f3;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .bar-container div.bar.current {
  background-color: #7ED6DD;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .bar-container div.bar div.point {
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background-color: #aeb3b9;
  margin: 0 auto;
  margin-top: -4px;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .bar-container div.bar div.point.current {
  background-color: #141414;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .year-container {
  text-align: center;
  margin-top: 5px;
}
.contents-custom-management-detail-record__graph .type-b-bar-graph div.graph-bar-container .year-container span {
  font-size: 1.6rem;
  font-family: "NotoSansKR-Regular";
  color: #484e56;
}
.contents-custom-management-detail-record__graph__reference {
  text-align: center;
  margin-top: 40px;
  padding-left: 20px;
  padding-right: 20px;
}
.contents-custom-management-detail-record__graph__reference .wrapper {
  background: linear-gradient(0deg, #F3F3F3 0%, #F3F3F3 100%);
  padding-top: 5px;
  padding-bottom: 4px;
}
.contents-custom-management-detail-record__graph__reference span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 1.6rem;
}
.card-news {
  padding: 20px 16px 20px 30px;
}
.card-news.mind {
  background: linear-gradient(180deg, rgba(145, 246, 216, 0.33) 0%, #5CC9D2 100%);
}
.card-news.body {
  background: linear-gradient(180deg, rgba(246, 145, 145, 0.33) 0%, #F69191 100%);
}
.card-news.lightgrey {
  background-color: #F9F9F9;
}  
.card-news.yellow {
  background-color: #FFFEDA;
}  
.card-news.orange {
  background-color: #FFF3D4;
}  
.card-news.red {
  background-color: #FFF0EF;
} 
.card-news.green {
  background-color: #EAFFED;
} 
.card-news.sky {
  background-color: #E6F9FF;
} 
.card-news.blue {
  background-color: #E7EFFF;
} 
.card-news.purple {
  background-color: #F2EAFF;
} 
.card-news.mildgrey {
  background-color: #DEDEDE;
} 
.card-news.mint {
  background-color: #E4FFFC;
} 
.card-news-wrapper {
  display: flex;
  justify-content: center;
}
.card-news-textarea-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.card-news-title-wrapper {
  margin-top: 12px;
}
.card-news__img {
  text-align: right;
}
.card-news__img img {
  height: 160px;
}
.card-news__img img.cardnews-icon-background {
  position: absolute;
  right: 24px;
  bottom: 20px;
  content: url(../images/cardnews-icon-background@2x.png);
}
.card-news__img img.xray {
  position: absolute;
  right: 6px;
  bottom: 38px;
  content: url(../images/cardnews-xray@2x.png);
}
.card-news__img img.heart {
  position: absolute;
  right: 6px;
  bottom: 38px;
  content: url(../images/heart@2x.png);
}
.card-news__img img.virus {
  position: absolute;
  right: 6px;
  bottom: 38px;
  content: url(../images/slide-health-2@2x.png);
}
.card-news__header {
  margin-bottom: 8px;
}
.card-news__header span {          
  font-size: 1.1rem;
  font-family: "Pretendard-SemiBold";
  color: #4C4C4C;
  line-height: 150%;
}
.card-news__header span.mind {
  color: #113acb;
}
.card-news__header span.body {
  color: #ff5252;
}
.card-news__title {
}
.card-news__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.card-news__subtitle {
  margin-bottom: 12px;
}
.card-news__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 150%;
}
.card-news__review {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.card-news__review div {
  padding: 0 8px 0 2px;
  border-radius: 23px;
  background-color: rgba(255, 255, 255, 0.7);
  display: flex;
  align-items: center;
}
.card-news__review div.card-news__review__star {
  margin-left: 10px;
}
.card-news__review img {
  height: 18px;
  margin-right: 4px;
}
.card-news__review img.like {
  content: url(../images/icon-heart-18@2x.png);
}
.card-news__review img.star {
  content: url(../images/icon-star-18@2x.png);
}
.card-news__review span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #252525;
  line-height: 2.2rem;
}
.card-news__review span.number {
  font-family: "Pretendard-SemiBold";
}

.modal-card-news {
  margin-left: 30px;
  margin-right: 30px;
}
.modal-card-news-wrapper {
  border-radius: 10px;
  display: flex;
  justify-content: center;
}
.modal-card-news img {
  width: 100%;
  height: 300px;
  border-radius: 10px;
  object-fit: contain;
}
.modal-container__close {
  display: flex;
  justify-content: right;
  margin-top: 56px;
  margin-right: 20px;
}
.modal-container__close img {
  height: 25px;
  content: url(../images/close_w@2x.png);
}
.swiper-custom-management-detail__card-news-pagination {
  display: flex;
  justify-content: center;
  margin-top: 18px;
  margin-bottom: 15px;
}
.swiper-custom-management-detail__card-news .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #d9d9d9;
  margin: 0 5px 0 0;
}
.swiper-custom-management-detail__card-news .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #959595;
  margin: 0 5px 0 0;
}

.swiper-custom-management-detail__modal-card-news-pagination {
  display: flex;
  justify-content: center;
  padding-top: 49px;
}
.swiper-custom-management-detail__modal-card-news .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #868b92;
  margin: 0 5px 0 0;
}
.swiper-custom-management-detail__modal-card-news .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #ffffff;
  margin: 0 5px 0 0;
}

.custom-management-bar-graph {
  margin-bottom: 19px;
}
.custom-management-bar-graph-container {
  width: 100%;
  height: 102px;
  position: relative;
  z-index: 1;
}
.custom-management-bar-graph__avg {
  width: 30%;
  position: absolute;
  bottom: 0;
  z-index: 5;
}
.custom-management-bar-graph__avg-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background-color: #C8D0EB;
  border-right: 1px solid #6078EA;
}
.custom-management-bar-graph__avg-border {
  width: 100%;
  height: 30px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 54px;
  border-right: 1px solid #6078EA;
}
.custom-management-bar-graph__avg-text {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 84px;
}
.custom-management-bar-graph__avg-text div {
  min-width: 29px;
  position: absolute;
  right: -28px;
  padding: 3px 12px 3px 12px;
  border-radius: 16px;
  background-color: #6078EA;
  text-align: center;
}
.custom-management-bar-graph__avg-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.2rem;
}
.custom-management-bar-graph__avg-value {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.custom-management-bar-graph__avg-value img {
  position: absolute;
  right: -8px;
  bottom: 19px;
  height: 11px;
  content: url(../images/polygon-11@3x.png);
  transform: rotate(180deg);
}
.custom-management-bar-graph__avg-value span {
  position: absolute;
  right: -16px;
  bottom: -7px;
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #6078EA;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.custom-management-bar-graph__my {
  width: 50%;
  position: absolute;
  bottom: 0;
  z-index: 3;
}
.custom-management-bar-graph__my-age {
  width: 100%;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  background-color: #FFE4E4;
  border-right: 1px solid #FF7070;
}
.custom-management-bar-graph__my-border {
  width: 100%;
  height: 8px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 54px;
  border-right: 1px solid #FF7070;
}
.custom-management-bar-graph__my-text {
  width: 100%;
  height: 8px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 72px;
}
.custom-management-bar-graph__my-text div {
  min-width: 29px;
  position: absolute;
  right: -28px;
  padding: 3px 12px 3px 12px;
  border-radius: 16px;
  background-color: #FF7070;
  text-align: center;
}
.custom-management-bar-graph__my-text span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 1.2rem;
}
.custom-management-bar-graph__my-text span .point {
  font-size: 1.4rem;
}
.custom-management-bar-graph__my-value {
  width: 100%;
  height: 18px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.custom-management-bar-graph__my-value img {
  position: absolute;
  right: -7px;
  bottom: 22px;
  height: 9px;
  content: url(../images/polygon-13@3x.png);
}
.custom-management-bar-graph__my-value span {
  position: absolute;
  right: -16px;
  bottom: 6px;
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #FF7070;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.custom-management-bar-graph__basic {
  width: 100%;
  background-color: #F1F1F1;
  height: 22px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
}
.custom-management-bar-graph__basic-text {
  width: 100%;
  position: absolute;
  bottom: 15px;
}
.custom-management-bar-graph__basic-text span {
  font-size: 1rem;
  font-family: "Pretendard-SemiBold";
  color: #868B92;
  line-height: 1.2rem;
  letter-spacing: -0.041rem;
}
.custom-management-bar-graph__basic-text span.end {
  position: absolute;
  right: -5px;
}
.custom-management-bar-graph-labels {
  width: 100%;
  position: absolute;
  bottom: -40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.custom-management-bar-graph-labels div {
  display: flex;
  align-items: center;
}
.custom-management-bar-graph-labels__bar {
  width: 24px;
  height: 5px;
}
.custom-management-bar-graph-labels__bar.avg {
  background-color: #4470F6;
}
.custom-management-bar-graph-labels__bar.my {
  background-color: #FF7070;
}
.custom-management-bar-graph-labels__text {
  margin-left: 5px;
}
.custom-management-bar-graph-labels__text span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}

.contents-medical-result {
}
.contents-medical-result__tab-container {
  margin-top: 10px;
  margin-bottom: 35px;
  display: flex;
  justify-content: center;
}
.contents-medical-result__tab-wrapper {
  display: flex;
  align-items: center;
  border-radius: 18px;
  background-color: #f3f3f3;
}
.contents-medical-result__tab {
  background-color: #f3f3f3;
  border-radius: 18px;
  min-width: 100px;
  min-height: 36px;
  align-items: center;
  display: flex;
  justify-content: center;
}
.contents-medical-result__tab span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.contents-medical-result__tab.selected {
  background-color: #0caab8;
}
.contents-medical-result__tab.selected span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #ffffff;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}

.contents-medical-result__general {
    padding: 0px 20px 20px;
}
.contents-medical-result__general__opinion-container {
  margin-bottom: 32px;
}
.contents-medical-result__general__opinion-container__title {
  margin-bottom: 14px;
}
.contents-medical-result__general__opinion-container__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-medical-result__general__opinion-container__status {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 17px;
}
.contents-medical-result__general__opinion-container__status__text span {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-medical-result__general__opinion-container__status__icon {
  position: absolute;
  right: 0;
}
.contents-medical-result__general__opinion-container__status__icon img {
  height: 70px;
}
.contents-medical-result__general__opinion-container__status__icon .status__icon--caution {
  content: url(../images/status-icon-caution@2x.png);
}
.contents-medical-result__general__opinion-container__status__icon .status__icon--care {
  content: url(../images/status-icon-care@2x.png);
}
.contents-medical-result__general__opinion-container__status__icon .status__icon--manage {
  content: url(../images/status-icon-manage@2x.png);
}
.contents-medical-result__general__opinion-container__status__icon .status__icon--ok {
  content: url(../images/weather-clean@2x.png);
}
.contents-medical-result__general__opinion-container__graph {
  position: relative;
  display: flex;
  justify-content: space-around;
  height: 20px;
  margin-bottom: 16px;
}
.contents-medical-result__general__opinion-container__graph__container {
  position: absolute;
}
.contents-medical-result__general__opinion-container__graph__container--warning {
  z-index: 3;
  width: 30%;
  right: 0px;
}
.contents-medical-result__general__opinion-container__graph__container--warning__bar-graph {
  height: 20px;
  background: linear-gradient(90deg, #FF8C89 5.1%, #FFD8A0 100%);
  width: 100%;
  border-radius: 4px;
}
.contents-medical-result__general__opinion-container__graph__container--warning__text {
  text-align: right;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #f46b72;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-medical-result__general__opinion-container__graph__container--caution {
  z-index: 2;
  width: 60%;
  right: 0px;
}
.contents-medical-result__general__opinion-container__graph__container--caution__bar-graph {
  height: 20px;
  background: linear-gradient(90deg, #FFD27B 29.46%, rgba(245, 220, 155, 0) 99.62%);
  width: 100%;
  border-radius: 4px;
  left: 0px;
}
.contents-medical-result__general__opinion-container__graph__container--caution__text {
  text-align: right;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #f99c12;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-medical-result__general__opinion-container__graph__container--ok {
  z-index: 1;
  width: 100%;
  left: 0px;
}
.contents-medical-result__general__opinion-container__graph__container--ok__bar-graph {
  height: 20px;
  background: linear-gradient(90deg, #8AE2EC 0%, #8AE2EC 0.01%, #DAEF8A 33.33%);
  width: 100%;
  border-radius: 4px;
  left: 0px;
}
.contents-medical-result__general__opinion-container__legend {
  display: flex;
  align-items: center;
  justify-content: center;
}
.contents-medical-result__general__opinion-container__legend span {
  font-size: 1.1rem;
  line-height: 1.8rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
}
.contents-medical-result__general__opinion-container__legend .legend_wrapper {
  display: flex;
  align-items: center;
  padding-right: 12px;
}
.contents-medical-result__general__opinion-container__legend div.label_color {
  border-radius: 1px;
  width: 5px;
  height: 5px;
  margin-right: 8px;
}
.contents-medical-result__general__opinion-container__legend div.label_color.ok {
  background: linear-gradient(180deg, #8AE2EC 0%, #8AE2EC 5.00%, #DAEF8A 95.00%);
}
.contents-medical-result__general__opinion-container__legend div.label_color.caution {
  background: linear-gradient(180deg, #FFD27B 0%, #FFD27B 5.00%, #F2DD87 95.00%);
}
.contents-medical-result__general__opinion-container__legend div.label_color.warning {
  background: linear-gradient(180deg, #FF8C89 0%, #FF8C89 0%, #FFD8A0 95.00%);
}
.contents-medical-result__general__health-card-container {
  margin-bottom: 44px;
}
.contents-medical-result__general__health-card-container-title {
  margin-bottom: 20px;
}
.contents-medical-result__general__health-card-container-title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-medical-result__general__compare {
  min-height: 260px;
  border-radius: 15px;
  background-color: #F8F8F8;
  padding: 22px 20px 18px 21px;
  margin-bottom: 36px;
}
.contents-medical-result__general__compare__main {
  margin-bottom: 5px;
}
.contents-medical-result__general__compare__main span {
  font-size: 1.5rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-medical-result__general__compare__sub {
  margin-bottom: 10px;
}
.contents-medical-result__general__compare__sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #3a62ba;
  line-height: 1.4rem;
}
.contents-medical-result__general__compare__index {
  display: flex;
  justify-content: right;
  align-items: center;
}
.contents-medical-result__general__compare__index__row {
  margin-left: 11px;
  display: flex;
  align-items: center;
}
.contents-medical-result__general__compare__index__row__bar {
  width: 24px;
  height: 5px;
  border-radius: 1px;
  margin-right: 10px;
}
.contents-medical-result__general__compare__index__row__bar.before {
  background-color: #d0d4da;
}
.contents-medical-result__general__compare__index__row__bar.now {
  background-color: #3a62ba;
}
.contents-medical-result__general__compare__index__row__text {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}
.contents-medical-result__general__compare__graph {
  min-height: 160px;
  margin-top: 25px;
  position: relative;
}
.contents-medical-result__general__compare__graph__container {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #868b92;
  position: absolute;
  width: 100%;
  height: 100%;
  max-height: 140px;
  bottom: 0;
  margin-bottom: 25px;
}
.contents-medical-result__general__compare__graph__container__row {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: end;
}
.contents-medical-result__general__compare__graph__text-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: absolute;
  width: 100%;
  bottom: 0;
}
.contents-medical-result__general__compare__graph__text-container div {
  width: 56px;
  display: flex;
  justify-content: center;
}
.contents-medical-result__general__compare__graph__text-container span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
  letter-spacing: -0.05rem;
}
.contents-medical-result__general__record {
  min-height: 260px;
  border-radius: 15px;
  background-color: rgba(249, 249, 249, 0.6);
  padding: 22px 20px 18px 21px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
}
.contents-medical-result__general__record__main {
  margin-bottom: 5px;
}
.contents-medical-result__general__record__main span {
  font-size: 1.5rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-medical-result__general__record__sub {
  margin-bottom: 10px;
}
.contents-medical-result__general__record__sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #ff5252;
  line-height: 1.4rem;
}
.contents-medical-result__general__record__graph {
  min-height: 180px;
  margin-top: 25px;
  position: relative;
}
.contents-medical-result__general__record__graph__container {
  display: flex;
  border-bottom: 1px solid #868b92;
  position: absolute;
  height: 100%;
  max-height: 140px;
  bottom: 0;
  margin-bottom: 25px;
  padding-left: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.contents-medical-result__general__record__graph__container__row {
  display: flex;
  justify-content: space-evenly;
  align-items: end;
  margin-right: 10px;
}
.contents-medical-result__general__record__graph__text-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: absolute;
  width: 100%;
  bottom: 0;
}
.contents-medical-result__general__record__graph__text-container div {
  width: 56px;
  display: flex;
  justify-content: center;
}
.contents-medical-result__general__record__graph__text-container span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
  letter-spacing: -0.05rem;
}
.contents-medical-result__detail {
  display: none;
  margin-top: 11px;
}
.contents-medical-result__detail__category-lg {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  column-gap: 9px;
  row-gap: 17px;
  margin-bottom: 46px;
}
.contents-medical-result__detail__category-md {
  margin-bottom: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.contents-medical-result__detail__category-md-wrapper {
  display: flex;
  align-items: center;
  overflow-x: scroll;
  -ms-overflow-style: none; /* 인터넷 익스플로러 */
  scrollbar-width: none; /* 파이어폭스 */
  border-radius: 10px;
  padding: 0px 9px;
}
.contents-medical-result__detail__category-md-wrapper div:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.contents-medical-result__detail__category-md-wrapper div:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.contents-medical-result__detail__category-md-wrapper::-webkit-scrollbar {
  display: none; /* 크롬, 사파리, 오페라, 엣지 */
}
.contents-medical-result__detail__category-md__tab {
  display: flex;
  text-align: center;
  box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  background-color: #f9f9f9;
  padding: 5px 10px;
}
.contents-medical-result__detail__category-md__tab span {
  min-width: 80px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.contents-medical-result__detail__category-md__tab.selected {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  background-color: #0caab8;
}
.contents-medical-result__detail__category-md__tab.selected span {
  color: #ffffff;
}
.contents-medical-result-nologin {
    margin: 16px 20px;
}

/* 검진결과 페이지 대응*/
.detail-menu-container {
  border-bottom: solid 1px #0caab8 !important;
  overflow-x: scroll !important;
  scrollbar-width: thin !important;
  width: auto !important;
  margin-left: 0px !important;
}
.detail-menu-container .detail-menu-nav {
  overflow-x: initial !important;
}
.detail-menu__icon.active {
  background-color: #0caab8 !important;
}
.detail-menu__text.active span {
  color: #0caab8 !important;
}
.detail-card__title__main-right span {
  color: #0caab8 !important;
}
.health-card {
  border-radius: 16px;
  box-shadow: 0 0 8px 0 rgba(48, 48, 48, 0.1);
  background-color: #ffffff;
  padding: 15px 20px 12px 20px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}
.health-card__icon img {
  height: 45px;
}
.health-card__icon img.warning {
  content: url(../images/health-warning@2x.png);
}
.health-card__icon img.caution {
  content: url(../images/health-caution@2x.png);
}
.health-card__icon img.ok {
  content: url(../images/health-clean@2x.png);
}
.health-card__text {
  width: 100%;
  margin-left: 15px;
}
.health-card__text__main {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.health-card__text__main__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}
.health-card__text__main__count span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.2rem;
}
.health-card__text__sub {
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.health-card__text__sub--warning span {
  color: #f46b72 !important;
}
.health-card__text__sub--caution span {
  color: #f99c12 !important;
}
.health-card__text__sub--ok span {
  color: #0caab8 !important;
}
.health-card__text__sub__percent span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.2rem;
}
.health-card__text__sub__list span {
  font-size: 1.2rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.2rem;
}

.vertical-bar {
  width: 16px;
  position: relative;
}
.vertical-bar__graph {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #d9d9d9;
  bottom: 0;
}
.vertical-bar__graph--blue {
  background-color: #3a62ba;
}
.vertical-bar__graph--red {
  background-color: #ff5252;
}
.vertical-bar__value {
  width: 100%;
  text-align: center;
  position: absolute;
  top: -25px;
}
.vertical-bar__value span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.vertical-bar__value--red {
  width: 200%;
  top: -30px;
  left: -7px;
  border-radius: 10px;
  background-color: rgba(255, 112, 112, 0.1);
}
.vertical-bar__value--red span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #ff7070;
}
.vertical-bar__year {
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: -20px;
  right: 3px;
}
.vertical-bar__year span {
  font-size: 1rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.4rem;
  letter-spacing: -0.05rem;
}
.vertical-bar__year--red span {
  font-size: 1rem;
  font-family: "Pretendard-Regular";
  color: #ff5252;
}

.category-lg-cell {
  cursor: pointer;
}
.category-lg-cell-wrapper {
  position: relative;
  padding-top: 6px;
}
.category-lg-cell__noti {
  position: absolute;
  top: 0px;
  right: 0px;
}
.category-lg-cell__noti img {
  height: 14px;
  display: none;
}
.category-lg-cell__noti img.noti-a {
  display: block;
  content: url(../images/noti-a-14@2x.png);
}
.category-lg-cell__noti img.noti-t {
  display: block;
  content: url(../images/noti-t-14@2x.png);
}
.category-lg-cell__noti img.noti-e {
  display: block;
  content: url(../images/noti-e-14@2x.png);
}
.category-lg-cell__icon {
  text-align: center;
}
.category-lg-cell__icon img {
  border-radius: 10px;
  background-color: rgba(33, 220, 236, 0.1);
  margin-bottom: 5px;
  padding: 10px;
  height: 30px;
}
.category-lg-cell__icon.selected img {
  background-color: #0caab8;
}
.category-lg-cell__icon.disabled img {
  background-color: #f3f3f3;
}
.category-lg-cell__text {
  text-align: center;
}
.category-lg-cell__text span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.055rem;
}
.category-lg-cell__text.disabled span {
  color: #aeb3b9;
}

.opinion-card {
  margin-bottom: 11px;
}
.opinion-card-wrapper {
  border-radius: 8px;
  border: solid 1px #e1e8f3;
  background-color: #ffffff;
}
.opinion-card__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #118acb;
  padding-top: 12px;
  padding-bottom: 12px;
}
.opinion-card__title__text {
  padding-left: 26px;
  display: flex;
  align-items: center;
}
.opinion-card__title__text span {
  font-size: 1.4rem;
  font-family: "NotoSansKRRegular";
  color: #484e56;
  letter-spacing: -0.014rem;
}
.opinion-card__title__noti {
  display: flex;
  align-items: center;
  margin-left: 5px;
}
.opinion-card__title__noti img {
  height: 14px;
}
.opinion-card__title__noti img.noti-t {
  content: url(../images/noti-t-14@2x.png);
}
.opinion-card__title__noti img.noti-e {
  content: url(../images/noti-e-14@2x.png);
}
.opinion-card__title__noti img.noti-a {
  content: url(../images/noti-a-14@2x.png);
}
.opinion-card__title__noti span {
  margin-left: 3px;
  border-radius: 10px;
  font-size: 1rem;
  font-family: "NotoSansKRMedium";
  color: #ffffff;
  letter-spacing: -0.05rem;
  padding: 3px 6px;
}
.opinion-card__title__noti span.noti-t {
  color: #ff5252;
  background-color: #fff3f3;
}
.opinion-card__title__noti span.noti-e {
  color: #f99c12;
  background-color: #fff7e1;
}
.opinion-card__title__noti span.noti-a {
  color: #0caab8;
  background-color: #f2faff;
}
.opinion-card__title__more {
  padding-right: 26px;
}
.opinion-card__title__more span {
  font-size: 1rem;
  font-family: "NotoSansKRRegular";
  color: #0caab8;
  line-height: 1.8rem;
  letter-spacing: -0.05rem;
}
.opinion-card__contents {
  padding: 20px 26px;
}
.opinion-card__contents div:first-child {
  margin-top: 6px;
}
.opinion-card__contents div:last-child {
  margin-bottom: 6px;
}
.opinion-card__contents__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.opinion-card__contents__row span {
  font-size: 1.3rem;
  font-family: "NotoSansKRRegular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.opinion-card__contents__text span {
  font-size: 1.3rem;
  font-family: "NotoSansKRRegular";
  color: #484e56;
  letter-spacing: -0.013rem;
}

.bottom-sheet-container__mrec001 {
  margin-top: 22.4px;
  margin-bottom: 25px;
}
.bottom-sheet-container__mrec001__title {
  margin-bottom: 10px;
  border-bottom: 1px solid #0caab8;
  padding-bottom: 4px;
}
.bottom-sheet-container__mrec001__title-flex {
  display: flex;
  justify-content: space-between;
  margin-bottom: 3px;
  padding-left: 30px;
  padding-right: 17px;
}
.bottom-sheet-container__mrec001__title__text span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.2rem;
}
.bottom-sheet-container__mrec001__title__noti {
  display: flex;
  align-items: center;
  margin-left: 5px;
}
.bottom-sheet-container__mrec001__title__noti img {
  height: 14px;
}
.bottom-sheet-container__mrec001__title__noti img.noti-t {
  content: url(../images/noti-t-14@2x.png);
}
.bottom-sheet-container__mrec001__title__noti img.noti-e {
  content: url(../images/noti-e-14@2x.png);
}
.bottom-sheet-container__mrec001__title__noti img.noti-a {
  content: url(../images/noti-a-14@2x.png);
}
.bottom-sheet-container__mrec001__title__noti span {
  margin-left: 3px;
  border-radius: 10px;
  font-size: 1rem;
  font-family: "NotoSansKRMedium";
  color: #ffffff;
  letter-spacing: -0.05rem;
  padding: 3px 6px;
}
.bottom-sheet-container__mrec001__title__noti span.noti-t {
  color: #ff5252;
  background-color: #fff3f3;
}
.bottom-sheet-container__mrec001__title__noti span.noti-e {
  color: #f99c12;
  background-color: #fff7e1;
}
.bottom-sheet-container__mrec001__title__noti span.noti-a {
  color: #0caab8;
  background-color: #f2faff;
}
.bottom-sheet-container__mrec001__title__last-date {
  padding-left: 30px;
  padding-right: 30px;
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.bottom-sheet-container__mrec001__contents {
  padding-left: 20px;
  padding-right: 20px;
}
.bottom-sheet-container__mrec001__contents__row-container {
  display: none;
}
.bottom-sheet-container__mrec001__contents__opinion-container {
  display: none;
}
.bottom-sheet-container__button.mrec001 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 27px;
  padding-right: 27px;
}
.bottom-sheet-container__button.mrec001 div {
  flex-basis: 100%;
}
.bottom-sheet-container__button.mrec001 div button.active {
  margin-left: 14px;
}
.bottom-sheet-container__button.mrec001 div button.active span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2rem;
}
.bottom-sheet-quantity-container {
    padding: 16px 20px 0px;
}
.bottom-sheet-quantity-wrapper {
    background-color: #F8F8F8;
    padding: 16px 20px;
    border-radius: 8px;
}
.bottom-sheet-quantity-btn-area {
    display: flex;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #AEB3B9;
    display: flex;
    justify-content: space-between;
    background-color: #ffffff;
}
.bottom-sheet-quantity-btn-area button{
    display: flex;
}
.bottom-sheet-quantity-btn-area button img{
    width: 32px;
    height: 32px;
}
.bottom-sheet-quantity-btn-area button.increase {
    border-left: 1px solid #AEB3B9;
}
.bottom-sheet-quantity-btn-area button.increase img{
    content: url(../images/ic-plus@2x.png);
}
.bottom-sheet-quantity-btn-area button.decrease {
    border-right: 1px solid #AEB3B9;
}
.bottom-sheet-quantity-btn-area button.decrease img{
    content: url(../images/ic-minus@2x.png);
}
.bottom-sheet-quantity-btn-area span.count{
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
    line-height: 24px;
}
.bottom-sheet-select-option-container {
    padding: 16px 20px;
    position: relative;
}
.bottom-sheet-select-option-wrapper {
    display: flex;
    align-items: center;
    border: 1px solid #D5DAE2;
    border-radius: 8px;
    justify-content: space-between;
    padding: 8px 12px;
}
.bottom-sheet-select-option-wrapper.expand {
    border-radius: 0px 0px 8px 8px;
}
.bottom-sheet-select-option-list-wrapper {
    border-radius: 8px 8px 0px 0px;
    border: 1px solid #D5DAE2;
    padding: 12px 16px;
    position: absolute;
    width: calc(100% - 74px);
    left: 20px;
    bottom: 59px;
    background-color: #ffffff;
    display: none;
}
.bottom-sheet-select-option-list-wrapper.expand {
    display: block;
}
.bottom-sheet-select-option-list-wrapper ul {
    list-style-type: none;
}
.bottom-sheet-select-option-list-wrapper li {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #141414;
    margin-bottom: 16px;
}
.bottom-sheet-select-option-list-wrapper li:last-child {
    margin-bottom: 0px;
}
.bottom-sheet-select-option-text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 21px;
}
.bottom-sheet-select-option-img img {
    width: 24px;
    height: 24px;
    content: url(../images/icon-system-down-mini@2x.png);
}
.bottom-sheet-select-option-img img.expand {
    content: url(../images/icon-system-up-mini@2x.png);
}
.bottom-sheet-selected-option-list-container {
    overflow-y: scroll;
    max-height: 500px;
}
.bottom-sheet-selected-option-list-wrapper {
    padding: 0px 20px;
}
.bottom-sheet-selected-option-list-wrapper ul{
    list-style-type: none;
}
.bottom-sheet-selected-option-list-wrapper li{
    margin-bottom: 12px;
}
.bottom-sheet-selected-option-list-wrapper li:last-child{
    margin-bottom: 0px;
}
.bottom-sheet-selected-option-item-wrapper {
    background-color: #F8F8F8;
    border-radius: 8px;
    padding: 20px 16px;
}
.bottom-sheet-selected-option-item-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bottom-sheet-selected-option-item-title span {
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #141414;
    line-height: 24px;
}
.bottom-sheet-selected-option-item-title img {
    width: 32px;
    height: 32px;
    content: url(../images/ic-cancle@2x.png);
}
.bottom-sheet-selected-option-item-cost {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bottom-sheet-selected-option-item-cost span.text {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #868B92;
    line-height: 21px;
}
.bottom-sheet-selected-option-item-cost span.cost {
    font-size: 1.6rem;
    font-family: "Pretendard-SemiBold";
    color: #141414;
    line-height: 24px;
}
.bottom-sheet-total-cost-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 20px 16px;
}
.bottom-sheet-total-cost-text span {
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
    line-height: 24px;
}
.bottom-sheet-total-cost span {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #FF5252;
    line-height: 36px;
}

.graph-normal-record {
  min-height: 260px;
  border-radius: 15px;
  background-color: #F8F8F8;
  padding: 22px 20px 18px 21px;
}
.graph-normal-record__main {
  margin-bottom: 5px;
}
.graph-normal-record__main span {
  font-size: 1.5rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.graph-normal-record__sub {
  margin-bottom: 10px;
}
.graph-normal-record__sub span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #ff5252;
  line-height: 1.4rem;
}
.graph-normal-record__graph {
  min-height: 180px;
  margin-top: 25px;
  position: relative;
}
.graph-normal-record__graph__container {
  display: flex;
  border-bottom: 1px solid #868b92;
  position: absolute;
  height: 100%;
  max-height: 140px;
  bottom: 0;
  margin-bottom: 25px;
  padding-left: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.graph-normal-record__graph__container__row {
  display: flex;
  justify-content: space-evenly;
  align-items: end;
  margin-right: 10px;
}
.graph-normal-record__graph__text-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: absolute;
  width: 100%;
  bottom: 0;
}
.graph-normal-record__graph__text-container div {
  width: 56px;
  display: flex;
  justify-content: center;
}
.graph-normal-record__graph__text-container span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
  letter-spacing: -0.05rem;
}

.detail-card-container {
  display: none;
}

.detail-card-container.active {
  display: block;
}

.detail-card {
  background-color: #ffffff;
  border-radius: 8px;
  border: solid 1px #e1e8f3;
  margin-bottom: 24px;
}
.detail-card__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: solid 0.5px #0caab8 !important;
  padding: 12px 26px;
}
.detail-card__title__left {
  display: flex;
  align-items: center;
}
.detail-card__title__left div {
  margin-right: 5px;
}
.detail-card__title__left__name span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.014rem;
}
.detail-card__title__left__status-icon img {
  height: 20px;
}
.detail-card__title__left__status-icon img.noti-t-20 {
  content: url(../images/noti-t-20@2x.png);
}
.detail-card__title__left__status-icon img.noti-e-20 {
  content: url(../images/noti-e-20@2x.png);
}
.detail-card__title__left__status-icon img.noti-c-20 {
  content: url(../images/noti-c-20@2x.png);
}
.detail-card__title__left__status-icon img.noti-b-20 {
  content: url(../images/noti-b-20@2x.png);
}
.detail-card__title__left__status-icon img.noti-a-20 {
  content: url(../images/noti-a-20@2x.png);
}
.detail-card__title__left__status-icon img.noti-f-20 {
  content: url(../images/noti-f-20@2x.png);
}
.detail-card__title__left__status-text span {
  font-size: 1.1rem;
  font-family: "NotoSansKRMedium";
  color: #484e56;
  letter-spacing: -0.05rem;
  line-height: 1.8rem;
  padding: 3px 8px;
  border-radius: 10px;
}
.detail-card__title__right span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #118acb;
  line-height: 1.8rem;
  letter-spacing: -0.05rem;
}
.detail-card__contents {
  padding: 20px 26px;
}
.detail-card__contents__type-a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.detail-card__contents__type-a__category span {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.detail-card__contents__type-a__contents {
  text-align: right;
}
.detail-card__contents__type-a__contents span.value {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.detail-card__contents__type-a__contents span.unit {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.01rem;
}
.detail-card__contents__type-b span {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.detail-card__contents__type-c {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.detail-card__contents__type-c__category span {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.detail-card__contents__type-c__contents {
  display: flex;
  align-items: center;
}
.detail-card__contents__type-c__contents span.value-high {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #F46B72;
  letter-spacing: -0.011rem;
}
.detail-card__contents__type-c__contents span.value-low {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #118ACB;
  letter-spacing: -0.011rem;
}
.detail-card__contents__type-c__contents img.none {
  height: 4px;
  content: url(../images/arrow-none@2x.png);
}
.detail-card__contents__type-c__contents img.high {
  height: 12px;
  content: url(../images/arrow-hi@2x.png);
}
.detail-card__contents__type-c__contents img.low {
  height: 12px;
  content: url(../images/arrow-low@2x.png);
}
.detail-card__contents__type-c__contents span.value {
  font-size: 1.3rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  letter-spacing: -0.013rem;
}
.detail-card__contents__type-c__contents__unit {
  margin-right: 16px;
  display: flex;
  align-items: center;
}
.detail-card__contents__type-c__contents__unit img {
  margin-left: 4px;
}

/*건강비교 > 유전자 카드*/
.gene-card {
    background-color: #ffffff;
    border-radius: 16px;
    border: solid 1px #DDDDDD;
    margin-bottom: 10px;
    box-shadow: 0px 0px 8px 0px rgba(48, 48, 48, 0.1);
}
.gene-card:last-child {
    margin-bottom: 0px;
}
.gene-card-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: solid 1px #E3E5E7;
    padding: 16px 10px 12px 20px;
    position: relative;
}
.gene-card-title.no-contents {
    border-bottom: 0px;
}
.gene-card-title_left {
    display: flex;
    align-items: center;
}
.gene-card-title_left img {
    width: 45px;
    height: 45px;
    margin-right: 16px;
}
.gene-card-title_left img.tooltip {
    width: 20px;
    height: 20px;
    margin-right: 0px;
    margin-left: 4px;
    content: url(../images/tooltip_gray@2x.png);
}
.gene-card-title_left img.liver {
    content: url(../images/icon-body-9@2x.png);
}
.gene-card-title_left img.stomach {
    content: url(../images/icon-body-11@2x.png);
}
.gene-card-title_left img.lung {
    content: url(../images/icon-body-4@2x.png);
}
.gene-card-title_left img.colon {
    content: url(../images/icon-body-12@2x.png);
}
.gene-card-title_left img.pancreas {
    content: url(../images/icon-body-7@2x.png);
}
.gene-card-title_left img.alzheimers-dementia {
    content: url(../images/icon-gene-1@2x.png);
}
.gene-card-title_left img.stroke {
    content: url(../images/icon-gene-2@2x.png);
}
.gene-card-title_left img.brain-aneurysm {
    content: url(../images/icon-gene-3@2x.png);
}
.gene-card-title_left img.coronary-heart-disease {
    content: url(../images/icon-gene-4@2x.png);
}
.gene-card-title_left img.aortic-valve-sclerosis {
    content: url(../images/icon-gene-5@2x.png);
}
.gene-card-title_left img.type2-diabetes {
    content: url(../images/icon-gene-6@2x.png);
}
.gene-card-title_left img.depression {
    content: url(../images/icon-mind-1@2x.png);
}
.gene-card-title_left img.neurosis {
    content: url(../images/icon-gene-7@2x.png);
}
.gene-card-title_left img.mood-disorder {
    content: url(../images/icon-mind-2@2x.png);
}
.gene-card-title_left img.adhd {
    content: url(../images/icon-gene-8@2x.png);
}
.gene-card-title_left img.anorexia-nervosa {
    content: url(../images/icon-gene-9@2x.png);
}
.gene-card-title_left img.panic-disorder {
    content: url(../images/icon-gene-10@2x.png);
}
.gene-card-title_left img.myocardial-infarction {
    content: url(../images/icon-gene-11@2x.png);
}
.gene-card-title_left img.duodenal-ulcer {
    content: url(../images/icon-gene-12@2x.png);
}
.gene-card-title_left img.irritable-bowel-syndrome {
    content: url(../images/icon-gene-13@2x.png);
}
.gene-card-title_left img.alcoholic-cirrhosis {
    content: url(../images/icon-gene-14@2x.png);
}
.gene-card-title_left img.alcoholic-chronic-pancreatitis {
    content: url(../images/icon-gene-15@2x.png);
}
.gene-card-title_left img.insomnia {
    content: url(../images/icon-stress-1@2x.png);
}


.gene-card-title_left span.title {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #484e56;
}
.gene-card-title_right {
    display: flex;
    align-items: center;
}
.gene-card-title-incidence-rate-wrapper {
    display: flex;
    flex-direction: column;
    align-items: end;
}
.gene-card-title-incidence-rate-wrapper span {
    font-size: 1.2rem;
    font-family: "Pretendard-SemiBold";
    color: #0CAAB8;
}
.gene-card-title-incidence-rate-wrapper span.incidence-rate {
    font-size: 1.4rem;
    font-family: "Pretendard-SemiBold";
}
.gene-card-title_right-img {
    margin-left: 6px;
}
.gene-card-title_right-img img {
    width: 24px;
    height: 24px;
    content: url(../images/icon-system-24-right@2x.png);
}
.gene-card-contents {
    padding: 45px 31px 35px 25px;
}

/*유전자 그래프*/
.gene-card-contents-graph {
    position: relative;
    margin-bottom: 4px;
}
.gene-card-contents-graph-container {
    position: relative;
}
.gene-card-contents-graph-my {
    position: absolute;
    bottom: 0;
    z-index: 1;
}
.gene-card-contents-graph-bar {
    position: absolute;
    height: 8px;
    width: 100%;
    bottom: 0;
    left: 0;
    border-radius: 8px;
    background-color: #20B3FF;
}
.gene-card-contents-graph-bar.green {
    background-color: #10CF8A;
}
.gene-card-contents-graph-bar.orange {
    background-color: #F99C12;
}
.gene-card-contents-graph-bar.red {
    background-color: #FF5252;
}
.gene-card-contents-graph-point {
    position: absolute;
    right: -9px;
    bottom: -5px;
}
.gene-card-contents-graph-point div {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #20B3FF;
    border: 1px solid #FFFFFF;
}
.gene-card-contents-graph-point div.green {
    background-color: #10CF8A;
}
.gene-card-contents-graph-point div.orange {
    background-color: #F99C12;
}
.gene-card-contents-graph-point div.red {
    background-color: #FF5252;
}
.gene-card-contents-graph-text {
    position: absolute;
    bottom: 43px;
    right: 25px;
}
.gene-card-contents-graph-text-wrapper {
    position: absolute;
    padding: 4px 0px;
    background-color: #20B3FF;
    display: flex;
    justify-content: center;
    min-width: 50px;
    border-radius: 15px;
}
.gene-card-contents-graph-text-wrapper.green {
    background-color: #10CF8A;
}
.gene-card-contents-graph-text-wrapper.orange {
    background-color: #F99C12;
}
.gene-card-contents-graph-text-wrapper.red {
    background-color: #FF5252;
}
.gene-card-contents-graph-text-wrapper::after {
    content: " ";
    position: absolute;
    border: solid 1px #E6F6F7;
    border-width: 5px;
    top: 25px;
    left: 20px;
    border-color: #20B3FF transparent transparent transparent;
}
.gene-card-contents-graph-text-wrapper.green::after {
    border-color: #10CF8A transparent transparent transparent;
}
.gene-card-contents-graph-text-wrapper.orange::after {
    border-color: #F99C12 transparent transparent transparent;
}
.gene-card-contents-graph-text-wrapper.red::after {
    border-color: #FF5252 transparent transparent transparent;
}
.gene-card-contents-graph-text-wrapper span{
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
    line-height: 18px;
}
.gene-card-contents-graph-avg {
    position: absolute;
    bottom: 0;
    z-index: 1;
}
.gene-card-contents-graph-avg-point {
    position: absolute;
    right: -3px;
    bottom: 1px;
}
.gene-card-contents-graph-avg-point div {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #ffffff;
}
.gene-card-contents-graph-avg-text {
    position: absolute;
    right: -10px;
    margin-top: 4px;
}
.gene-card-contents-graph-avg-text-wrapper {
    min-width: 20px;
}
.gene-card-contents-graph-avg-text-wrapper span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 18px;
}
.gene-card-contents-graph-not-fill {
    width: 100%;
    height: 8px;
    border-radius: 8px;
    background-color: #E3E5E7;
}

.gene-detail-constitution-graph {
    padding: 60px 20px;
}
.gene-detail-constitution-graph-container {
  position: relative;
}
.gene-detail-constitution-graph-my {
  position: absolute;
  bottom: 0;
  z-index: 1;
}
.gene-detail-constitution-graph-bar {
  position: absolute;
  height: 20px;
  width: 100%;
  bottom: 0;
  left: 0;
  border-radius: 20px;
  background-color: #20B3FF;
}
.gene-detail-constitution-graph-bar.green {
  background-color: #10CF8A;
}
.gene-detail-constitution-graph-bar.orange {
  background-color: #F99C12;
}
.gene-detail-constitution-graph-bar.red {
  background-color: #FF5252;
}
.gene-detail-constitution-graph-point {
  position: absolute;
  right: 5px;
  bottom: 5px;
}
.gene-detail-constitution-graph-point div {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #ffffff;
}
.gene-detail-constitution-graph-point div.blue {
  background-color: #21B3FF;
}
.gene-detail-constitution-graph-point div.red {
  background-color: #FF5252;
}
.gene-detail-constitution-graph-text {
  position: absolute;
  bottom: 55px;
  right: 48px;
}
.gene-detail-constitution-graph-text-wrapper {
  position: absolute;
  padding: 4px 12px;
  background-color: #20B3FF;
  display: flex;
  justify-content: center;
  min-width: 50px;
  border-radius: 15px;
}
.gene-detail-constitution-graph-text-wrapper.blue {
  background-color: #21B3FF;
}
.gene-detail-constitution-graph-text-wrapper.red {
  background-color: #FF5252;
}
.gene-detail-constitution-graph-text-wrapper::after {
  content: " ";
  position: absolute;
  border: solid 1px #E6F6F7;
  border-width: 5px;
  top: 25px;
  left: 33px;
  border-color: #20B3FF transparent transparent transparent;
}
.gene-detail-constitution-graph-text-wrapper.green::after {
  border-color: #10CF8A transparent transparent transparent;
}
.gene-detail-constitution-graph-text-wrapper.orange::after {
  border-color: #F99C12 transparent transparent transparent;
}
.gene-detail-constitution-graph-text-wrapper.red::after {
  border-color: #FF5252 transparent transparent transparent;
}
.gene-detail-constitution-graph-text-wrapper span{
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #ffffff;
  line-height: 18px;
}
.gene-detail-constitution-graph-avg {
  position: absolute;
  bottom: 0;
  z-index: 1;
}
.gene-detail-constitution-graph-avg-point {
  position: absolute;
  right: 5px;
  bottom: 5px;
}
.gene-detail-constitution-graph-avg-point div {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
}
.gene-detail-constitution-graph-avg-text {
    position: absolute;
    right: -30px;
    margin-top: 4px;
    bottom: -35px;
}
.gene-detail-constitution-graph-avg-text-wrapper {
  min-width: 20px;
  padding: 4px 12px;
  background-color: #E3E5E7;
  display: flex;
  justify-content: center;
  min-width: 50px;
  border-radius: 15px;
}
.gene-detail-constitution-graph-avg-text-wrapper::after {
    content: " ";
    position: absolute;
    border: solid 1px #E6F6F7;
    border-width: 5px;
    top: -10px;
    left: 35px;
    border-color: transparent transparent #E3E5E7 transparent;
}
.gene-detail-constitution-graph-avg-text-wrapper span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 18px;
}
.gene-detail-constitution-graph-fill-wrapper {
    position: relative;   
}
.gene-detail-constitution-graph-not-fill {
    width: 100%;
    height: 20px;
    border-radius: 20px;
    background-color: #E3E5E7;
}
.gene-detail-constitution-graph-fill-wrapper span {
    position: absolute;
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #AEB3B9;
    bottom: -20px;
}
.gene-detail-constitution-graph-fill-wrapper span.low {
    left: -13px;
}
.gene-detail-constitution-graph-fill-wrapper span.high {
    right: -13px;
}

.gene-service-info-card {
    display: flex;
    border-radius: 12px;
    background-color: #DDE8FF;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
}
.gene-service-info-card span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #141414;
    line-height: 21px;
}
.gene-service-info-card span strong{
    font-size: 1.6rem;
    font-family: "Pretendard-SemiBold";
    line-height: 24px;
}
.gene-service-info-img {
    width: 60px;
    height: 60px;
    content: url(../images/ic-question@2x.png);
}
.gene-subtitle span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    line-height: 24px;
    color: #141414;
}

.gene-detail-contents {
}
.gene-detail-contents-container {
    margin: 0px 20px;
}
.gene-detail-contents-container.mglr-0 {
    margin-left: 0;
    margin-right: 0;
}
.gene-detail-contents-incidence-risk-container {
    margin: 0px 20px 40px;
}
.gene-detail-title-container {
    display: flex;
    flex-direction: column;
    margin-bottom: 24px;
}
.gene-detail-title-container span.title {
    font-size: 2.0rem;
    font-family: "Pretendard-Medium";
    color: #141414;
}
.gene-detail-title-container span.title a.status,
.gene-detail-title-container span.title a.group{
    font-family: "Pretendard-Bold";
}
.gene-detail-title-container span.title a.verylow{
    color: #15A0E8;
}
.gene-detail-title-container span.title a.low{
    color: #02C47E;
}
.gene-detail-title-container span.title a.high{
    color: #FE9800;
}
.gene-detail-title-container span.title a.veryhigh{
    color: #F43D3D;
}
.gene-detail-title-container span.sub-title {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    line-height: 21px;
    color: #484E56;
}

.gene-incidence-risk-graph-container {
    width: 100%;
}
.gene-incidence-risk-graph {
    width: 100%;
    justify-content: center;
    display: flex;
}
.gene-incidence-risk-graph canvas {
    height: 300px;
}
.gene-detail-explan-container {
    display: flex;
}
.gene-detail-explan-container span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    line-height: 21px;
    color: #484E56;
}
.gene-detail-explan-container span strong{
    font-family: "Pretendard-Bold";
}

.status-t {
  color: #ff6d6d !important;
  background-color: #fff2f2 !important;
}

.status-e {
  color: #ee953b !important;
  background-color: #fff4ea !important;
}

.status-c {
  color: #ffbe00 !important;
  background-color: #fff9e9 !important;
}

.status-b {
  color: #96d0f1 !important;
  background-color: #eff9ff !important;
}

.status-a {
  color: #0085c9 !important;
  background-color: #e8f7ff !important;
}

.status-f {
  color: #a09f9c !important;
  background-color: #efefef !important;
}

.contents-medical-result-detail-header.ok {
  background-image: linear-gradient(111deg, #eff0b6 2%, #87ebe5 100%);
}
.contents-medical-result-detail-header.caution {
  background-image: linear-gradient(111deg, rgba(255, 221, 99, 0.6) 2%, #ffb979 100%);
}
.contents-medical-result-detail-header.warning {
  background-image: linear-gradient(111deg, #ffd9a0 2%, #f88 100%);
}
.contents-medical-result-detail-header.recent {
  background-color: rgba(33, 220, 236, 0.1);
}
.contents-medical-result-detail-header-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 18px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 14px;
}
.contents-medical-result-detail-header__sub {
  margin-bottom: 1px;
}
.contents-medical-result-detail-header__sub span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 1.6rem;
}
.contents-medical-result-detail-header__sub span.ok {
  color: #0caab8;
}
.contents-medical-result-detail-header__sub span.caution {
  color: #fb202c;
}
.contents-medical-result-detail-header__sub span.warning {
  color: #851109;
}
.contents-medical-result-detail-header__title {
  margin-bottom: 32px;
}
.contents-medical-result-detail-header__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.5rem;
}
.contents-medical-result-detail-header__date {
  margin-bottom: 2px;
}
.contents-medical-result-detail-header__date span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 1.6rem;
}
.contents-medical-result-detail-header__where span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.6rem;
}
.contents-medical-result-detail-header__count span {
  font-size: 2.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-medical-result-detail-header img {
  height: 45px;
  margin-bottom: 21px;
}
.contents-medical-result-detail-header img.ok {
  content: url(../images/health-clean@2x.png);
}
.contents-medical-result-detail-header img.caution {
  content: url(../images/health-caution@2x.png);
}
.contents-medical-result-detail-header img.warning {
  content: url(../images/health-warning@2x.png);
}
.contents-medical-result-detail-header__recent {
  display: flex;
  align-items: center;
  padding-top: 2px;
  padding-bottom: 6px;
}
.contents-medical-result-detail-header__recent img {
  margin-bottom: 0px;
  height: 45px;
  content: url(../images/group-427321999@2x.png);
}
.contents-medical-result-detail-header__recent span {
  margin-left: 15px;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #353d4a;
  line-height: 2.1rem;
}
.contents-medical-result-detail-header__recent span.name {
  margin-left: 0px;
}
.contents-medical-result-detail-accordion-wrapper {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-medical-result-detail-opinion-list-wrapper {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 50px;
}
.contents-medical-result-detail-tab {
  display: flex;
}
.contents-medical-result-detail-tab-wrapper {
  padding: 24px 20px;
  float: left;
}
.contents-medical-result-detail-tab span {
  float: left;
  padding: 4px 12px;
  border-radius: 16px;
  border: solid 1px rgba(33, 220, 236, 0.5);
  margin-left: 8px;
  margin-bottom: 7px;
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  cursor: pointer;
}
.contents-medical-result-detail-tab span.selected {
  color: #ffffff;
  background-color: #0caab8;
}
.contents-medical-result-detail-contents-wrapper {
  padding-top: 22px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 50px;
}
.contents-medical-result-detail-contents__title {
  margin-bottom: 15px;
}
.contents-medical-result-detail-contents__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #141414;
  line-height: 2.5rem;
}
.contents-medical-result-detail-contents__tag {
  margin-bottom: 9px;
}
.contents-medical-result-detail-contents__tag span {
  margin-right: 5px;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.5rem;
}
.contents-medical-result-detail-contents__text {
  margin-bottom: 20px;
}
.contents-medical-result-detail-contents__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.8rem;
}
.contents-medical-result-detail-contents__graph-container {
  padding-bottom: 50px;
}
.contents-medical-result-detail-contents__graph-container__title {
  margin-top: 30px;
}
.contents-medical-result-detail-contents__graph-container__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-medical-result-detail-contents__graph-container__subtitle {
  margin-top: 7px;
  margin-bottom: 40px;
}
.contents-medical-result-detail-contents__graph-container__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.contents-medical-result-detail-contents__graph-container__subtitle span.high {
  color: #f46b72;
}

.medical-result-detail-opinion-wrapper {
  margin-top: 25px;
  margin-bottom: 35px;
}
.medical-result-detail-opinion__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 7px;
  border-bottom: 1px solid #0caab8;
}
.medical-result-detail-opinion__title div {
  display: flex;
  align-items: center;
}
.medical-result-detail-opinion__title img {
  margin-right: 3px;
  content: url(../images/icon-solid-pencil-alt@2x.png);
  height: 20px;
}
.medical-result-detail-opinion__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.2rem;
}
.medical-result-detail-opinion__title span.date {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.2rem;
}
.medical-result-detail-opinion__text {
  min-height: 131px;
  margin-top: 11px;
  padding: 11px;
  background-color: #f3f3f3;
}
.medical-result-detail-opinion__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2rem;
}

.bottom-sheet-container__mrec002 {
  margin-top: 38px;
  margin-bottom: 17px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
.bottom-sheet-container__mrec002__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}
.bottom-sheet-container__mrec002__title img {
  height: 24px;
}
.bottom-sheet-container__mrec002__title img.left {
  content: url(../images/chevron-left@2x.png);
}
.bottom-sheet-container__mrec002__title img.right {
  content: url(../images/chevron-right@2x.png);
}
.bottom-sheet-container__mrec002__title span {
  font-size: 2.2rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.bottom-sheet-container__mrec002__reference {
  background: linear-gradient(0deg, #F3F3F3 0%, #F3F3F3 100%);
  padding-top: 5px;
  padding-bottom: 4px;
  margin: 10px 20px 0px 20px;
}
.bottom-sheet-container__mrec002__reference span {
  font-size: 1.1rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 1.6rem;
  letter-spacing: -0.041rem;
}
.bottom-sheet-container__mrec002__reference span.value {
  margin-left: 11px;
}
.bottom-sheet-container__mrec002__graph {
    height: 200px;
    justify-content: center;
    display: flex;
}

.accordion__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 18px;
  padding-bottom: 12px;
}
.accordion__title__main {
  margin-bottom: 1px;
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #141414;
}
.accordion__title__sub {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.accordion__title img {
  content: url(../images/icon-system-up-mini@2x.png);
  height: 24px;
}
.accordion__title img.closed {
  content: url(../images/icon-system-down-mini@2x.png);
}
.accordion__title img.more {
  content: url(../images/more_b_small@2x.png);
}
.accordion__border {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  height: 1px;
  background-color: #f3f3f3;
}
.accordion__pannel {
  display: none;
  padding-top: 10px;
}
.accordion__pannel__row {
  display: flex;
  align-items: center;
  padding: 3px 2px 2px 10px;
}
.accordion__pannel__row div {
  flex-basis: 50%;
  display: flex;
  align-items: center;
}
.accordion__pannel__row div.right {
  justify-content: right;
}
.accordion__pannel__row__title {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
}
.accordion__pannel__row__status {
  font-size: 1rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  border-radius: 10px;
  padding: 2px 5px;
}
.accordion__pannel__row__status.ok {
  background-color: #e2f2f3;
  font-size: 1rem;
  font-family: "Pretendard-Bold";
  color: #1bbac8;
}
.accordion__pannel__row__status.high {
  background-color: #fff3f3;
  font-size: 1rem;
  font-family: "Pretendard-SemiBold";
  color: #ff5252;
}
.accordion__pannel__row__status.low {
  background-color: #fff7e1;
  font-size: 1rem;
  font-family: "Pretendard-SemiBold";
  color: #f99c12;
}
.accordion__pannel__row__value {
  margin-left: 10px;
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
}
.accordion__pannel__row img {
  margin-left: 10px;
  content: url(../images/icon-system-more-s@2x.png);
  height: 24px;
}

.contents-onboarding {
  margin-top: 100px;
}
.contents-onboarding .onboarding-container {
  padding-left: 10px;
  padding-right: 10px;
}
.contents-onboarding .onboarding-container__text {
  text-align: center;
}
.contents-onboarding .onboarding-container__text span {
  font-size: 2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 3.2rem;
  letter-spacing: -0.041rem;
}
.contents-onboarding .onboarding-container__image {
  margin-top: 25px;
  text-align: center;
}
.contents-onboarding .onboarding-container__image img.onboarding_1 {
  height: 300px;
  content: url(../gif/onboarding_1.gif);
}
.contents-onboarding .onboarding-container__image img.onboarding_2 {
  height: 300px;
  content: url(../gif/onboarding_2.gif);
}
.contents-onboarding .onboarding-container__image img.onboarding_3 {
  height: 300px;
  content: url(../gif/onboarding_3.gif);
}
.contents-onboarding .onboarding-container__image img.onboarding_4 {
  height: 300px;
  content: url(../gif/onboarding_4.gif);
}
.contents-onboarding .onboarding-container__image img.onboarding_5 {
  height: 313px;
  content: url(../gif/onboarding_5.gif);
}
.contents-onboarding .swiper-onboarding .swiper-wrapper {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}
.contents-onboarding .swiper-onboarding .swiper-onboarding-pagination {
  display: flex;
  justify-content: center;
  bottom: 30px;
  margin-top: 63px;
}
.contents-onboarding .swiper-onboarding .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #d9d9d9;
  margin: 0 5px 0 0;
}
.contents-onboarding .swiper-onboarding .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #0caab8;
  margin: 0 5px 0 0;
}
.contents-onboarding-button {
  visibility: hidden;
  padding: 20px 20px 40px 20px;
}

.skip-onboarding {
  margin-top: 81px;
  display: flex;
  justify-content: space-evenly;
}
.skip-onboarding__left span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.skip-onboarding__right span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #0caab8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
  cursor: pointer;
}

.footer-onboarding {
  height: 91px;
  background-color: #0caab8;
  display: none;
  justify-content: center;
  align-items: center;
}
.footer-onboarding span {
  font-size: 2.2rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.2rem;
  letter-spacing: -0.041rem;
  cursor: pointer;
}

.contents-alarm {
    border-top: 1px solid #b0b0b0;
}
.row-alarm {
    display: flex;
    align-items: center;
    padding-right: 20px;
    min-height: 80px;
    height: 80px;
    min-height: 80px;
}
.row-alarm.long {
    height: unset;
}
.row-alarm-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
}
.row-alarm-list {
}
.row-alarm__icon {
    height: 100%;
    flex-basis: 30%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.row-alarm__icon img {
  width: 20px;
  height: 20px;
}
.row-alarm__icon img.ok {
  content: url(../images/alarm-clean@2x.png);
}
.row-alarm__icon img.caution {
  content: url(../images/alarm-caution@2x.png);
}
.row-alarm__icon img.warning {
  content: url(../images/alarm-warning@2x.png);
}
.row-alarm__icon img.truck {
  content: url(../images/alarm-truck@2x.png);
}
.row-alarm__icon img.box {
  content: url(../images/alarm-box@2x.png);
}
.row-alarm__icon img.sale {
  content: url(../images/alarm-sale@2x.png);
}
.row-alarm__text {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #eceaea;
    justify-content: center;
}
.row-alarm__text.long {
    padding: 12px 0px;
}
.row-alarm__text__date {
    text-align: left;
}
.row-alarm__text__date span {
    font-size: 1rem;
    font-family: "Pretendard-Regular";
    color: #0caab8;
}
.row-alarm__text__contents {
    margin-top: 4px;
}
.row-alarm__text__contents span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
    margin-top: 11px;
}

.row-empty {
  display: none;
  text-align: center;
}
.row-empty__image {
  margin-top: 126px;
  margin-bottom: 42px;
}
.row-empty__image img {
  height: 90px;
  content: url(../images/icon-90-heart@2x.png);
}
.row-empty__text span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.6rem;
}

.footer-setting {
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 50px;
}

.setting-list {
  min-height: 60px;
  cursor: pointer;
  padding: 0px 20px;
}
.setting-list__category {
  width: 100%;
  min-height: 60px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.setting-list__category span {
  width: 100%;
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.setting-list__subcategory {
  width: 100%;
  min-height: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
  position: relative;
}
.setting-list__subcategory span {
  width: 100%;
  padding-left: 4px;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.setting-list__subcategory span strong {
    font-size: 1.2rem;
    font-family: "Pretendard-Bold";
    line-height: 18px;
    color: #141414;
}

.review-tooltip-container {
    position: absolute;
    padding: 4px 6px 2px 6px;
    border-radius: 4px;
    background-color: #E6F6F7;
    left: 85px;
    top: 9px;
    z-index: 1;
}
.review-tooltip-container::after {
    content: " ";
    position: absolute;
    border: solid 1px #E6F6F7;
    border-width: 10px;
    border-right-width: 15px;
    top: 2px;
    left: -17px;
    z-index: -1;
    border-color: transparent #E6F6F7 transparent transparent;
}
.review-tooltip-container-wrapper {
    display: flex;
    align-items: center;
}
.review-tooltip-container-wrapper span{
    font-size: 1.2rem;
    font-family: "NotoSansKR-Medium";
    color: #0CAAB8;
    line-height: 18px;
    padding-left: 0px;
}

.setting-list__agree {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 4px;
  margin-bottom: 15px;
  cursor: pointer;
}
.setting-list__agree:last-child {
  margin-bottom: 0px;
}
.setting-list__agree span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.setting-list__agree img.more {
  cursor: pointer;
  height: 24px;
  content: url(../images/chevron-right@2x.png);
}
.setting-list__more img {
  height: 24px;
  content: url(../images/more_b_small@2x.png);
}

.setting-information-wrapper {
    padding: 0px 20px;
}
.setting-information__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0px;
}
.setting-information__left {
  flex-basis: 30%;
}
.setting-information__left span {
  padding-left: 4px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
}
.setting-information__right {
  flex-basis: 70%;
}
.setting-information__right span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}
.setting-information_cancel-membership {
    padding: 8px 0px;
}
.setting-information_cancel-membership span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #484e56;
}

.download-list {
  min-height: 60px;
  cursor: pointer;
}
.download-list__category {
  width: 100%;
  min-height: 60px;
  display: flex;
  align-items: center;
}
.download-list__category__text span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #484e56;
  line-height: 2.5rem;
}
.download-list__category__tooltip {
  height: 24px;
  position: relative;
  margin-left: 7px;
}
.download-list__category__tooltip-icon {
  content: url(../images/tip@2x.png);
  height: 24px;
}
.download-list__category__tooltip .tooltip {
  visibility: hidden;
  width: 280px;
  z-index: 1;
  display: flex;
  position: absolute;
  box-shadow: 0 0 10px 0 rgba(144, 144, 144, 0.25);
  border: solid 1px #118acb;
  border-radius: 10px;
  background-color: #f6fcff;
  top: 35px;
  left: -70px;
  padding-left: 10px;
  padding-top: 14px;
  padding-bottom: 16px;
  padding-right: 14px;
}
.download-list__category__tooltip .tooltip__text {
  margin-left: 10px;
}
.download-list__category__tooltip .tooltip__text__title {
  margin-bottom: 11px;
}
.download-list__category__tooltip .tooltip__text__title span {
  font-size: 1.2rem;
  font-family: "NotoSansKRMedium";
  color: #118acb;
}
.download-list__category__tooltip .tooltip__text__contents span {
  font-size: 1.2rem;
  font-family: "NotoSansKRRegular";
  color: #484e56;
}
.download-list__category__tooltip .tooltip::before {
  content: " ";
  position: absolute;
  border: solid 1px #118acb;
  border-width: 10px;
  top: -20px;
  left: 70px;
  z-index: 1;
  border-color: transparent transparent #118acb transparent;
}
.download-list__category__tooltip .tooltip::after {
  content: " ";
  position: absolute;
  border: solid 1px #118acb;
  border-width: 10px;
  top: -18.5px;
  left: 70px;
  z-index: 2;
  border-color: transparent transparent #f6fcff transparent;
}
.download-list__tooltip {
  height: 24px;
  margin-left: 7px;
}
.download-list__tooltip img {
  height: 24px;
}
.download-list__subcategory {
  width: 100%;
  min-height: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.download-list__subcategory span {
  width: 100%;
  padding-left: 10px;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.5rem;
}
.download-list__more img {
  height: 24px;
  content: url(../images/more_b_small@2x.png);
}

.disabled-status {
  opacity: 0.6;
}

.modal-container__mset001 {
  padding-left: 30px;
  padding-right: 30px;
}
.modal-container__mset001-wrapper {
  border-radius: 20px;
  background-color: #fff;
  padding: 12px 12px 41px 12px;
}
.modal-container__mset001__cancel {
  text-align: right;
  margin-bottom: 24px;
}
.modal-container__mset001__cancel img {
  height: 24px;
  content: url(../images/input_cancel@2x.png);
}
.modal-container__mset001__logout {
  display: block;
}
.modal-container__mset001__logout__title {
  text-align: center;
  margin-bottom: 30px;
}
.modal-container__mset001__logout__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 3.2rem;
}
.modal-container__mset001__logout__button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 32px;
  padding-right: 32px;
}
.modal-container__mset001__logout__button button {
  width: 100%;
  min-height: 38px;
  padding: 0px 30px 0px 30px;
}
.modal-container__mset001__logout__button .button {
  flex-basis: 47%;
}
.modal-container__mset001__logout__button .button--text.active {
  background-color: #0caab8;
}
.modal-container__mset001__logout__button .button--text.active span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.4rem;
}
.modal-container__mset001__logout__button .button--text.inactive {
  margin-top: 0px;
  background-color: rgba(233, 237, 240, 0.2);
  border: 1px solid #e9edf0;
}
.modal-container__mset001__logout__button .button--text.inactive span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
}

.contents-setting {
}
.contents-setting-private {
  margin-top: 30px;
  margin-bottom: 30px;
  padding-left: 20px;
  padding-right: 20px;
}
.contents-setting-private .message-error {
  justify-content: right;
  padding-left: 4px;
}
.contents-setting-private .message-error span {
  flex-basis: 70%;
}
.contents-setting-private__title {
  padding: 20px 0px;
}
.contents-setting-private__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-private__profile {
  margin-top: 30px;
}
.contents-setting-private__profile__photo {
  text-align: center;
  margin-bottom: 30px;
}
.contents-setting-private__profile__photo img {
  height: 100px;
}
.contents-setting-private__profile__photo img.photo-default {
  content: url(../images/profile@2x.png);
}
.contents-setting-private__profile__select {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 19px;
  position: relative;
}
.contents-setting-private__profile__select div {
  text-align: center;
}
.contents-setting-private__profile__select div span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #787878;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-private__profile__select div.select-main-color {
  flex-basis: 20%;
  text-align: center;
}
.contents-setting-private__profile__select div.select-main-color span {
  cursor: pointer;
  text-align: center;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
}
.contents-setting-private__profile__select div.text-right span {
  cursor: pointer;
}
.contents-setting-private__inform {
  margin-top: 20px;
  margin-bottom: 19px;
}
.contents-setting-private__inform span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-setting-private__phone-agree__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0px 13px 0px;
}
.contents-setting-private__phone-agree__title div {
  display: flex;
  align-items: center;
}
.contents-setting-private__phone-agree__title div input[type=checkbox] {
  display: none;
}
.contents-setting-private__phone-agree__title div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 34px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}
.contents-setting-private__phone-agree__title div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.contents-setting-private__phone-agree__title div label {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 25px;
  padding: 10px 0px 10px 7px;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container div {
  display: flex;
  align-items: center;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container div input[type=checkbox] {
  display: none;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 34px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container div label {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.4rem;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container img {
  content: url(../images/icon-system-down-mini@2x.png);
  height: 24px;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-container img.up {
  content: url(../images/icon-system-up-mini@2x.png);
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-contents {
  display: none;
  padding-left: 7px;
}
.contents-setting-private__phone-agree__contents .phone-agree-checkbox__options .option-contents span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.4rem;
}
.contents-setting-private__phone-input {
  margin-top: 40px;
  padding-left: 4px;
}
.contents-setting-private__phone-input__input-container {
  position: relative;
}
.contents-setting-private__phone-input__input-container__label {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
}
.contents-setting-private__phone-input__input-container__input {
  position: relative;
}
.contents-setting-private__phone-input__input-container__input input {
  width: 100%;
  height: 50px;
  border: none;
  border-bottom: solid 1px #b0b0b0;
  box-sizing: border-box;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.5rem;
}
.contents-setting-private__phone-input__input-container__input input:focus {
  outline: none;
}
.contents-setting-private__phone-input__input-container img {
  display: none;
  position: absolute;
  height: 24px;
  right: 0px;
  top: 13px;
  z-index: 10;
}
.contents-setting-private__phone-input__input-container img.input-cancel {
  content: url(../images/off@2x.png);
}
.contents-setting-private__phone-input__input-container img.display-block {
  display: block;
}
.contents-setting-private__phone-input__message-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.contents-setting-private__phone-input__message-container .message-time {
  display: none;
}
.contents-setting-private__phone-input__message-container .message-time span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #1bbac8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-private__phone-input__message-container .message-error-right {
  display: none;
  justify-content: right;
  padding-left: 4px;
}
.contents-setting-private__phone-input__message-container .message-error-right span {
  flex-basis: 100%;
  text-align: right;
}

.contents-setting-my-archive {
  margin-left: 20px;
  margin-right: 20px;
}
.contents-setting-my-archive .my-archive-list{
  display: flex;
  flex-direction: column;
  margin-bottom: 25px;
}
.contents-setting-my-archive .my-archive-list .company-name{
  font-size: 1.3rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
}
.contents-setting-my-archive .my-archive-list .inspection-name{
  margin-top: 5px;
  display: flex;
  justify-content: space-between;
}
.contents-setting-my-archive .my-archive-list .inspection-name .name-wrapper{
  display: flex;
  align-items: center;
}
.contents-setting-my-archive .my-archive-list .inspection-name .name-wrapper span{
  font-size: 2rem;
  font-family: "Pretendard-Medium";
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-wrapper{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: end;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper{
  display: flex;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-wrapper .percent{
  font-size: 1.8rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-wrapper .progress-rate{
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  margin-top: 7px;
}

.my-archive-list__more img {
  display: flex;
  height: 30px;
  margin-left: 10px;
  content: url(../images/my_archive_right@2x.png);
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more{
  align-items: center;
  display: flex;
  margin-left: 5px;
  position: relative;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more img{
  height: 35px;
  content: url(../images/my_archive_more@2x.png);
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container {
  display: none;
  width: 70px;
  position: absolute;
  top: 49px;
  left: -53px;
  padding: 14px 13px;
  border-radius: 10px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
  background-color: #f6fcff;
  border: solid 1px #0caab8;
  z-index: 1;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container ul {
  list-style-type: none;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container li {
  margin-bottom: 9px;
  text-align: end;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container li span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container li:last-child {
  margin-bottom: 0px;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container::before {
  content: " ";
  position: absolute;
  border: solid 1px #0caab8;
  border-width: 10px;
  top: -20px;
  left: 60px;
  z-index: 1;
  border-color: transparent transparent #0caab8 transparent;
}
.contents-setting-my-archive .my-archive-list .inspection-name .date-more-wrapper .more .tip-container::after {
  content: " ";
  position: absolute;
  border: solid 1px #0caab8;
  border-width: 10px;
  top: -18px;
  left: 60px;
  z-index: 1;
  border-color: transparent transparent #f6fcff transparent;
}

.contents-my-program-detail-route {
  padding: 20px;
  align-items: center;
  display: flex;
}
.contents-my-program-detail-route span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 14px;
}
.contents-my-program-detail-route span.productName {
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
}
.contents-my-program-detail-route img {
  height: 12px;
  padding: 0px 4px;
  content: url(../images/icon-system-24-right@2x.png);
}
.contents-my-program-detail iframe{
  border: none;
  width: 100%;
  height: 100dvh;
}

.modal-postcode-container {
  width: 100%;
  height: 100%;
  display: none;
  position: fixed;
  top: 0%;
  left: 0%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
}
.modal-postcode {
  width: 100%;
  display: block;
  min-height: 370px;
  background-color: white;
  border-radius: 20px 20px 0 0;
  position: absolute;
  bottom: 0;
  transform: translateY(100%);
  animation: slidein 0.5s forwards;
}
.modal-postcode__button-bar {
  width: 100%;
  padding-top: 10px;
  display: flex;
  justify-content: center;
}
.modal-postcode__button-bar div {
  width: 55px;
  height: 4px;
  border-radius: 20px;
  background-color: #e9edf0;
}
.modal-postcode__postcode {
  margin-top: 16px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 37px;
}
.modal-postcode__postcode input::placeholder {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #868b92;
  line-height: 3.4rem;
}
.modal-postcode__postcode__title {
  display: flex;
  justify-content: center;
}
.modal-postcode__postcode__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.modal-postcode__postcode__tip {
  padding-left: 10px;
  margin-top: 20px;
  margin-bottom: 35px;
}
.modal-postcode__postcode__tip__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #1bbac8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal-postcode__postcode__tip__row span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}
.modal-postcode__postcode__address-list {
  display: none;
  margin-top: 5px;
}
.modal-postcode__postcode__address-list__address {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #e9edf0;
  background-color: rgba(233, 237, 240, 0.2);
}
.modal-postcode__postcode__address-list__address span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal-postcode__postcode__address-list__address.selected {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #1bbac8;
  background-color: rgba(27, 186, 200, 0.1);
}
.modal-postcode__postcode__address-list__address.selected span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}

.setting-private-password-edit-wrapper {
  overflow: hidden;
  height: 0px;
  transition: height 0.25s ease-out;
}
.setting-private-password input {
  height: 30px;
}
.toast.setting-private {
}
.contents-setting-cs {
  margin-bottom: 58px;
  padding-left: 20px;
  padding-right: 20px;
}

.contents-setting-out {
  margin-bottom: 58px;
}
.contents-setting-out__intro {
  background-color: #f8f8f8;
  text-align: center;
  padding-top: 43px;
  padding-bottom: 30px;
}
.contents-setting-out__intro span {
  font-size: 2.1rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 3.2rem;
  letter-spacing: -0.05rem;
}
.contents-setting-out__graph {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-setting-out__graph__title {
  margin-top: 35px;
  margin-bottom: 17px;
}
.contents-setting-out__graph__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2rem;
}
.contents-setting-out__graph__contents {
  margin-bottom: 20px;
}
.contents-setting-out__graph__contents .graph-container__image {
  text-align: center;
}
.contents-setting-out__graph__contents .graph-container__image img {
  height: 330px;
}
.contents-setting-out__program {
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 40px;
}
.contents-setting-out__program__title {
  margin-top: 30px;
  margin-bottom: 30px;
}
.contents-setting-out__program__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2rem;
}
.contents-setting-out__cardnews__title {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 35px;
  margin-bottom: 30px;
}
.contents-setting-out__cardnews__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2rem;
}
.contents-setting-out__last {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 50px;
  margin-bottom: 30px;
  text-align: center;
}
.contents-setting-out__last span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #353d4a;
  line-height: 2.4rem;
}
.contents-setting-out__button {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-setting-out-popup-container {
  width: 100%;
  height: 100%;
  visibility: hidden;
  position: fixed;
  top: 0%;
  left: 0%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
  display: flex;
  justify-content: center;
}
.contents-setting-out-popup {
  min-width: 300px;
  min-height: 152px;
  border-radius: 20px;
  background-color: #ffffff;
  margin: 0 auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 12px;
  padding-bottom: 36px;
  display: block;
  position: absolute;
  top: 40%;
}
.contents-setting-out-popup__cancel {
  text-align: right;
}
.contents-setting-out-popup__cancel img {
  height: 24px;
}
.contents-setting-out-popup__cancel img.close {
  content: url(../images/input_cancel@2x.png);
}
.contents-setting-out-popup__ask {
  display: block;
}
.contents-setting-out-popup__ask__text {
  text-align: center;
}
.contents-setting-out-popup__ask__text span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 3.2rem;
}
.contents-setting-out-popup__ask__button {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin-top: 30px;
  padding-left: 16px;
  padding-right: 16px;
}
.contents-setting-out-popup__ask__button button {
  min-height: 38px;
  padding: 0px 30px 0px 30px;
}
.contents-setting-out-popup__ask__button .button--text.active {
  background-color: #0caab8;
}
.contents-setting-out-popup__ask__button .button--text.active span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.4rem;
}
.contents-setting-out-popup__ask__button .button--text.inactive {
  margin-top: 0px;
  background-color: rgba(233, 237, 240, 0.2);
  border: 1px solid #e9edf0;
}
.contents-setting-out-popup__ask__button .button--text.inactive span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
}
.contents-setting-out-popup__result {
  display: none;
}
.contents-setting-out-popup__result__image {
  text-align: center;
}
.contents-setting-out-popup__result__image img {
  height: 90px;
}
.contents-setting-out-popup__result__image img.heart {
  content: url(../images/heart@2x.png);
}
.contents-setting-out-popup__result__text {
  text-align: center;
}
.contents-setting-out-popup__result__text span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}

.swiper-graph .swiper-graph-pagination {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.swiper-graph .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #d9d9d9;
  margin: 0 5px 0 0;
}
.swiper-graph .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #959595;
  margin: 0 5px 0 0;
}

.contents-setting-wishlist {

}
.contents-setting-order {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 50px;
}
.contents-setting-order__title {
  margin-top: 20px;
  margin-bottom: 36px;
}
.contents-setting-order__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order__search {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin-bottom: 30px;
}
.contents-setting-order__search .input-box img {
  display: block;
  position: absolute;
  height: 24px;
  right: 10px;
  top: 8px;
  z-index: 0;
}
.contents-setting-order__search__input {
  width: 100%;
}
.contents-setting-order__search__filter {
  flex-basis: 30%;
  background-color: #0caab8;
  border-radius: 10px;
  margin-left: 11px;
}
.contents-setting-order__like-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.order-card__product-container {
}
.order-card__record {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}
.order-card__record__left {
    display: flex;
    align-items: end;
}
.order-card__record__date {
}
.order-card__record__date span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
}
.order-card__record__status {
    margin-right: 8px;
}
.order-card__record__status span {
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #0caab8;
}
.order-card__record__more {
  display: flex;
  align-items: center;
}
.order-card__record__more span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 21px;
}
.order-card__record__more img {
  height: 24px;
}
.order-card__record__more img.more {
  content: url(../images/RIGHT@2x.png);
}
.order-card__product {
    display: flex;
}
.order-card__product__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.order-card__product__text__from {
    margin-bottom: 2px;
}
.order-card__product__text__from span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
    line-height: 18px;
}
.order-card__product__text__name {
    margin-bottom: 4px;
}
.order-card__product__text__name span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #141414;
}
.order-card__product__text__name span.payment-completed {
    font-family: "Pretendard-Bold";
}
.order-card__product__text__cost {
    display: flex;
    align-items: center;
}
.order-card__product__text__cost-amount span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 24px;
}
.order-card__product__text__cost-bar {
    width: 1px;
    height: 12px;
    background-color: #6d7683;
    margin-left: 8px;
    margin-right: 8px;
}
.order-card__product__text__cost-period span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #868b92;
    line-height: 18px;
}
.order-card__product__text__copy {
    margin-bottom: 4px;
}
.order-card__product__text__copy span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #6D7683;
    line-height: 19.6px;
    letter-spacing: -0.041rem;
}
.order-card__product-copy {
    display: flex;
    align-items: center;
    margin-left: 12px;
}
.order-card__product-copy img {
    height: 24px;
    content: url(../images/ic-copy@2x.png);
}
.order-card__product-copy img.small {
    height: 20px;
}
.order-card__product__text__code {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.order-card__product__text__code span {
    font-size: 1.6rem;
    font-family: "Pretendard-SemiBold";
    color: #484E56;
    line-height: 24px;
    letter-spacing: -0.41px;
}
.order-card__product__thumbnail {
    width: 72px;
    height: 72px;
    border-radius: 4px;
    overflow: hidden;
    margin-right: 12px;
}
.order-card__product__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.order-card__product-progress {
    margin-top: 16px;
}
.order-card__product-progress__text {
    display: flex;
    justify-content: space-between;
}
.order-card__product-progress__text-status span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #6d7683;
    line-height: 2.5rem;
}
.order-card__product-progress__text-date span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    line-height: 18px;
    color: #868B92;
}
.order-card__product-progress__graph {
    position: relative;
    margin-bottom: 4px;
}
.order-card__product-progress__graph-fill {
    height: 4px;
    border-radius: 8px;
    position: absolute;
    left: 0;
    background-image: linear-gradient(to right, #17ead9 0%, #6078ea 100%);
    z-index: 1;
}
.order-card__product-progress__graph-not-fill {
    width: 100%;
    height: 4px;
    border-radius: 8px;
    background-color: #e3e5e7;
}

.like-card {
  position: relative;
  flex-basis: 48%;
}
.like-card__icon-like {
  position: absolute;
  top: 8px;
  right: 11px;
}
.like-card__icon-like img {
  content: url(../images/like-inactive@2x.png);
  height: 24px;
}
.like-card__icon-like img.active {
  content: url(../images/like-active@2x.png);
}
.like-card__thumbnail {
  text-align: center;
  border-radius: 16px;
}
.like-card__thumbnail img {
  width: 100%;
  border-radius: 16px;
}
.like-card__text {
  margin-top: 6px;
}
.like-card__text__from span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #21dcec;
  line-height: 2.5rem;
}
.like-card__text__name {
  margin-top: 2px;
}
.like-card__text__name span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.1rem;
  letter-spacing: -0.041rem;
}

.contents-setting-order-detail {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 40px;
}
.contents-setting-order-detail_date {
    padding-top: 16px;
}
.contents-setting-order-detail_refund {
    padding: 16px 20px 0px;
}
.contents-setting-order-detail__title {
  display: none;
  margin-top: 20px;
  margin-bottom: 20px;
}
.contents-setting-order-detail__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order-detail__subtitle {
}
.contents-setting-order-detail__subtitle span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 24px;
}
.contents-setting-order-detail-gray-container {
    background-color: #F8F8F8;
    border-radius: 16px;
    padding: 20px 16px;
}
.setting-order-detail__record {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.setting-order-detail__record__left {
    display: flex;
    align-items: center;
}
.setting-order-detail__record__left span.oreder-number-text {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484e56;
    line-height: 18px;
}
.setting-order-detail__record__left span.oreder-number {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
}
.setting-order-detail__record__date span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 18px;
}
.contents-setting-order-detail__status span{
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #0CAAB8;
}
.contents-setting-order-detail-copy-wrapper {
    overflow: hidden;
}
.contents-setting-order-detail__product {
}
.contents-setting-order-detail__delivery-status-graph {
}
.contents-setting-order-detail__reason-refund-area {
  margin-bottom: 20px;
}
.contents-setting-order-detail__reason-holding-refund {
  margin-bottom: 20px; 
}
.contents-setting-order-detail__holding-refund-notice {
  margin-bottom: 20px;
}
.contents-setting-order-detail__holding-refund-notice span{
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
}
.contents-setting-order-detail__holding-refund-notice .middle-dot {
  font-size: 1.2rem !important;
}
.contents-setting-order-detail__holding-refund-seller-information {

}
.contents-setting-order-detail__holding-refund-seller-information span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
}
.contents-setting-order-detail__holding-refund-seller-info-wrapper {
  display: flex;
  padding: 13px 0px;
  align-items: center;
}
.contents-setting-order-detail__refund-ok-noti {
  margin-bottom: 20px;
}
.contents-setting-order-detail__refund-ok-noti-wrapper {
  display: flex;
  flex-direction: column;
}
.contents-setting-order-detail__refund-ok-noti-wrapper span{
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  word-break: keep-all;
}
.contents-setting-order-detail__reason-refund {
  display: flex;
  flex-direction: column;
  margin-top: 8px;
}
.contents-setting-order-detail__reason-refund span{
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 24px;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.contents-setting-order-detail__collect-address-info {
  margin-bottom: 20px;
}
.contents-setting-order-detail__payment {
  margin-top: 20px;
}
.contents-setting-order-detail__payment--default {
  margin-bottom: 20px;
}
.contents-setting-order-detail__payment--default__title {
  margin-bottom: 16px;
}
.contents-setting-order-detail__payment--default__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__payment--default__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}
.contents-setting-order-detail__payment--default__row__left {
  display: flex;
  align-items: center;
}
.contents-setting-order-detail__payment--default__row__left span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
  margin-right: 7px;
}
.contents-setting-order-detail__payment--default__row__left span.medium {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
  margin-right: 7px;
}
.contents-setting-order-detail__payment--default__row__left span.small {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
  margin-right: 7px;
}
.contents-setting-order-detail__payment--default__row__left div.border {
  width: 1px;
  height: 12px;
  background-color: #6d7683;
  margin-right: 7px;
}
.contents-setting-order-detail__payment--default__row__right span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__payment--cancel {
  display: none;
}
.contents-setting-order-detail__payment--cancel__title {
  margin-bottom: 18px;
}
.contents-setting-order-detail__payment--cancel__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__payment--cancel__row {
  display: flex;
  margin-bottom: 10px;
  padding-left: 10px;
}
.contents-setting-order-detail__payment--cancel__row span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.8rem;
}
.contents-setting-order-detail__payment--cancel__row span.medium {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-detail__payment--cancel__row__left {
  flex-basis: 50%;
}
.contents-setting-order-detail__payment--cancel__row__right {
  flex-basis: 50%;
}
.contents-setting-order-detail__refund-info {
  margin-bottom: 20px;
}
.contents-setting-order-detail__address {
  margin-bottom: 20px;
}
.contents-setting-order-detail__address__name span {
  font-size: 1.6rem;
  font-family: "Pretendard-SemiBold";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__address__postcode span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.1rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__address__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.1rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__address__phone {
  margin-top: 5px;
}
.contents-setting-order-detail__address__phone span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__address__delivery-ask span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__address__delivery-contents span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #6d7683;
  line-height: 2.1rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-detail__buttons {
  display: flex;
  justify-content: center;
}
.contents-setting-order-detail__buttons .button {
  width: 31%;
  margin-right: 5px;
}
.contents-setting-order-detail__buttons .button:last-child {
  margin-right: 0px;
}
.contents-setting-order-detail__buttons-seller-connect {
  margin-top: 120px;
}
.contents-setting-order-detail__notice {
  display: none;
  margin-top: 14px;
}
.contents-setting-order-detail__notice span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 2.1rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-detail__row-border {
  width: 100%;
  height: 1px;
  background-color: #1bbac8;
  margin-top: 5.5px;
  margin-bottom: 5.5px;
}
.contents-setting-order-detail_bottom-modal-wrapper {
    padding: 24px 20px 16px;
}
.contents-setting-order-detail_bottom-modal-title-wrapper {
    display: flex;
    flex-direction: column;
    text-align: center;
}
.contents-setting-order-detail_bottom-modal-title {
    margin-bottom: 8px;
}
.contents-setting-order-detail_bottom-modal-title span {
    font-size: 2rem;
    font-family: "Pretendard-SemiBold";
    color: #484e56;
    line-height: 24px;
}
.contents-setting-order-detail_bottom-modal-subtitle {
}
.contents-setting-order-detail_bottom-modal-subtitle span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
    line-height: 20px;
}
.bottom-modal-title-goto_write-review {
    display: flex;
    justify-content: space-between;
}
.bottom-modal-title-goto_write-review span{
    font-family: "Pretendard-Bold";
    font-size: 1.8rem;
    color: #484e56;
    text-align: start;
}
.bottom-modal-title-goto_write-review img {
    width: 24px;
    height: 24px;
    content: url(../images/close_g@2x.png);
}

.modal-order-confirm-container {
  width: 100%;
  height: 100%;
  visibility: hidden;
  position: fixed;
  top: 0%;
  left: 0%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
}
.modal-order-confirm {
  width: 100%;
  min-height: 370px;
  display: block;
  background-color: white;
  border-radius: 20px 20px 0 0;
  position: absolute;
  bottom: 0%;
}
.modal-order-confirm__button-bar {
  width: 100%;
  padding-top: 10px;
  display: flex;
  justify-content: center;
}
.modal-order-confirm__button-bar div {
  width: 55px;
  height: 4px;
  border-radius: 20px;
  background-color: #e9edf0;
}
.modal-order-confirm__product {
  padding-left: 20px;
  padding-right: 20px;
}
.modal-order-confirm__button {
  margin-top: 23px;
  padding-left: 20px;
  padding-right: 20px;
}
.modal-order-confirm__postcode {
  margin-top: 16px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 37px;
}
.modal-order-confirm__postcode input::placeholder {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #868b92;
  line-height: 3.4rem;
}
.modal-order-confirm__postcode__title {
  display: flex;
  justify-content: center;
}
.modal-order-confirm__postcode__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.modal-order-confirm__postcode__tip {
  padding-left: 10px;
  margin-top: 20px;
  margin-bottom: 35px;
}
.modal-order-confirm__postcode__tip__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #1bbac8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal-order-confirm__postcode__tip__row span {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.8rem;
}
.modal-order-confirm__postcode__address-list {
  display: none;
  margin-top: 5px;
}
.modal-order-confirm__postcode__address-list__address {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #e9edf0;
  background-color: rgba(233, 237, 240, 0.2);
}
.modal-order-confirm__postcode__address-list__address span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.4);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.modal-order-confirm__postcode__address-list__address.selected {
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 5px;
  border: solid 1px #1bbac8;
  background-color: rgba(27, 186, 200, 0.1);
}
.modal-order-confirm__postcode__address-list__address.selected span {
  margin-left: 12px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #0caab8;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}

.contents-setting-order-confirm {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-setting-order-confirm__title {
  margin-top: 28px;
  margin-bottom: 20px;
}
.contents-setting-order-confirm__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order-confirm__lottie__text {
  text-align: center;
  margin-top: 30px;
}
.contents-setting-order-confirm__lottie__text span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order-confirm .button {
  margin-top: 50px;
}

.contents-setting-order-review {
    margin: 0px 20px;
}
.contents-setting-order-review__title {
    margin-bottom: 12px;
    display: flex;
    justify-content: center;
}
.contents-setting-order-review__title span {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-setting-order-review__rating {
}
.contents-setting-order-review__rating__title-sub {
  margin-bottom: 25px;
}
.contents-setting-order-review__rating__title-sub span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.1rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-review__rating__main {
  text-align: center;
}
.contents-setting-order-review__contents {
  margin-top: 60px;
}
.contents-setting-order-detail-refund-reason-imgs {
    overflow-x: scroll;
}
.contents-setting-order-detail-refund-reason-imgs ul {
    display: flex;
    list-style-type: none;
}
.contents-setting-order-detail-refund-reason-imgs ul li{
    margin-right: 8px;
}
.contents-setting-order-detail-refund-reason-imgs ul li:last-child{
    margin-right: 0px;
}
.refund-reason-img {
    width: 72px;
    height: 72px;
    border-radius: 4px;
    overflow: hidden;
}
.refund-reason-img img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.contents-setting-order-review__contents__title__text {
  margin-bottom: 17px;
}
.contents-setting-order-review__contents__title__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.1rem;
  letter-spacing: -0.05rem;
}
.review-img-list {
    overflow-x: scroll;
    margin-left: 20px;
}
.review-img-list ul{
    display: inline-flex;
    list-style-type: none;
    margin-right: 20px;
}
.review-img-list li {
    margin-right: 8px;
}
.review-img-list li:last-child {
    margin-right: 0px;
}
.review-selected-img-wrapper {
    position: relative;
    height: 72px;
    width: 72px;
    border-radius: 4px;
    overflow: hidden;
}
.review-selected-img {
    height: 100%;
    width: 100%;
}
.review-selected-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.review-selected-img-cancel {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    top: 0px;
    right: 0px;
    border-radius: 0px 4px 0px 4px;
    padding: 3px;
    display: flex;
}
.review-selected-img-cancel img {
    height: 10px;
    width: 10px;
    content: url(../images/close_w@2x.png);
}
.review-add-img-wrapper {
}
.review-add-img {
    background-color: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.review-add-img img {
    height: 24px;
    width: 24px;
    content: url(../images/ic-add@2x.png);
}

.contents-setting-order-review__contents__textarea {
  position: relative;
}
.contents-setting-order-review__contents__textarea textarea {
  width: 100%;
  min-height: 161px;
  border: none;
  border-radius: 16px;
  background-color: #f8f8f8;
  padding: 18px 22px 23px 18px;
  resize: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.contents-setting-order-review__contents__textarea textarea:focus {
    outline: none;
}
.contents-setting-order-review__contents__textarea textarea::placeholder {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #868B92;
  line-height: 21px;
}
.contents-setting-order-review__contents__textarea__count {
    justify-content: end;
    display: flex;
}
.contents-setting-order-review__contents__textarea__count .current-length {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #6d7683;
    line-height: 2.5rem;
}
.contents-setting-order-review__contents__textarea__count .max-length {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.6);
  line-height: 2.5rem;
}
.review-add-btn {
    margin: 16px 20px;
}

.contents-setting-review {
    margin-bottom: 40px;
}
.setting-review-title-wrapper {
    display: flex;
    align-items: center;
}
.setting-review-contents {
    margin: 0px 20px;
}
.setting-review-count span.title{
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 27px;
}
.setting-review-count span.count{
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 21px;
    margin-left: 8px;
}
.goto-write-review-btn {
    margin-top: 16px;
}
.my-review-grade-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 20px 12px 20px;
}
.my-review-grade {
    display: flex;
    align-items: center;
}
.my-review-grade img {
    width: 20px;
    height: 20px;
    content: url(../images/ic-star-full@2x.png);
}
.my-review-grade span {
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.my-review-grade span.user-id {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    margin-left: 8px;
}
.my-review-date span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 18px;
}
.my-review-purchase-info {
    display: flex;
    align-items: center;
    margin: 0px 20px 8px 20px;
    flex-wrap: wrap;
}
.my-review-purchase-info span.text {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 18px;
    white-space: normal;
}
.my-review-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical; /* 플렉스 방향을 수직으로 설정 */
    -webkit-line-clamp: 3;
    margin: 0px 20px 4px 20px;
}
.my-review-text.expand {
    -webkit-line-clamp: unset; 
    overflow: visible;
}
.my-review-text span{
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #141414;
    line-height: 21px;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}
.my-review-more {
    display: flex;
    align-items: center;
    margin: 0px 20px 12px 20px;
}
.my-review-more span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #868B92;
    line-height: 24px;
}
.my-review-more img {
    width: 20px;
    height: 20px;
    content: url(../images/icon-system-down-mini@2x.png);
}
.my-review-more img.expand {
    content: url(../images/icon-system-up-mini@2x.png);
}
.my-review-imgs {
    margin: 0px 0px 12px 20px;
    overflow-x: scroll;
}
.my-review-imgs ul {
    display: inline-flex;
    list-style-type: none;
    margin-right: 20px;
}
.my-review-imgs li {
    width: 80px;
    height: 80px;
    border-radius: 4px;
    margin-right: 8px;
    overflow: hidden;
}
.my-review-imgs li:last-child {
    margin-right: 0px;
}
.my-review-img img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.my-review-btns button {
    background-color: #F3F3F3;
    border-radius: 4px;
    padding: 5px 12px;
}
.my-review-btns button span{
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 18px;
}
.my-review-ishelpful-container {
    display: flex;
    justify-content: space-between;
    margin: 0px 20px;
}
.is-review-helpful-wrapper {
    border-radius: 4px;
    border: 1px solid #D5DAE2;
    padding: 5px 14px;
}
.is-review-helpful-wrapper span {
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
}
.is-review-helpful-wrapper span.helpfultext {
    margin-right: 4px;
}
.is-review-helpful-wrapper span.helpfulcount {
    font-family: "Pretendard-Bold";
}
.is-review-helpful-wrapper.active {
    border: 1px solid #0CAAB8;
}
.is-review-helpful-wrapper.active span.helpfulcount {
    color: #0CAAB8;
}
.my-review-btns-text {
    display: flex;
    align-items: center;
    justify-content: end;
}
.my-review-btns-text span {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
    line-height: 21px;
}

.rate-rwapper {
    display: flex;
    justify-content: center;
}
.rate-rwapper.second {
    margin-bottom: 45px;
}
.rate {
    float: left;
}
.rate:not(:checked) > input {
    position: absolute;
    top: -9999px;
}
.rate:not(:checked) > label {
    float: right;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 4rem;
    width: 32px;
    height: 32px;
    content: url(../images/ic-star-empty@3x.png);
}
.rate:not(:checked) > label:before {
}
.rate > input:checked ~ label {
    content: url(../images/ic-star@3x.png);    
}

.contents-setting-order-change {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-setting-order-change__title {
  margin-top: 28px;
  margin-bottom: 20px;
}
.contents-setting-order-change__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order-change__contents {
  margin-bottom: 20px;
}
.contents-setting-order-change__contents span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
}
.contents-setting-order-change__product {
  margin-bottom: 30px;
}
.contents-setting-order-change__category {
    margin: 32px 20px 0px;
}
.contents-setting-order-change__category__title {
  margin-bottom: 8px;
}
.contents-setting-order-change__category__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-change__category__subnoti {
  display: none;
  margin-left: 5px;
  margin-top: 5px;
}
.contents-setting-order-change__category__subnoti span {
  font-size: 1.1rem;
  font-family: "Pretendard-Regular";
  color: #f46b72;
}
.contents-setting-order-change__category__buttons {
  display: flex;
  justify-content: space-between;
}
.contents-setting-order-change__category__buttons label {
  flex-basis: 31%;
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #0caab8;
  line-height: 2.5rem;
  border-radius: 10px;
  border: solid 1px #0caab8;
  background-color: #f9f9f9;
}
.contents-setting-order-change__category__buttons label span {
  text-align: center;
  padding: 6px 10px;
  display: block;
}
.contents-setting-order-change__category__buttons label input {
  position: absolute;
  display: none;
}
.contents-setting-order-change__category__buttons label input + span {
  color: #0caab8;
  border-radius: 10px;
  background-color: #f9f9f9;
}
.contents-setting-order-change__category__buttons input:checked + span {
  color: #ffffff;
  border-radius: 8px;
  background-color: #0caab8;
}
.contents-setting-order-change__reason {
  margin-top: 24px;
  margin-bottom: 25px;
}
.contents-setting-order-change__reason__textarea {
  position: relative;
}
.contents-setting-order-change__reason__textarea textarea {
  width: 100%;
  min-height: 161px;
  border: none;
  border-radius: 16px;
  background-color: #f8f8f8;
  padding: 18px 22px 23px 18px;
  resize: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.contents-setting-order-change__reason__textarea textarea::placeholder {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
}
.contents-setting-order-change__reason__textarea__count {
  position: absolute;
  right: 22px;
  bottom: 10px;
}
.contents-setting-order-change__reason__textarea__count .current-length {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-change__reason__textarea__count .max-length {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: rgba(109, 118, 131, 0.6);
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-change-address-input-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.contents-setting-order-change-address-input-container-label {
  flex-basis: 30%;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 1.4rem;
  padding-left: 4px;
}
.contents-setting-order-change-address-input-container-label label {
  color: #484e56;
}
.contents-setting-order-change-address-input-container-input {
  flex-basis: 70%;
}
.contents-setting-order-change-address-input-container-input input {
  width: 100%;
  height: 40px;
  border: none;
  border-bottom: solid 1px #b0b0b0;
  box-sizing: border-box;
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 1.4rem;
}
.contents-setting-order-change-address-input-container-input button {
  top: 8px;
  right: 0px;
}
.contents-setting-order-change-address-input-container-input input:focus {
  outline: none;
}
.contents-setting-change-address {
    margin: 20px 20px 0px 20px;
}
.contents-setting-change-order-detail__payment {
  margin: 20px 20px 0px 20px;
}
.contents-setting-change-order-detail__payment--default {
  padding: 20px 20px 20px 16px;
  border-radius: 16px;
  background-color: #f8f8f8;
}
.contents-setting-change-order-button {
  padding: 16px 0px;
}
.contents-setting-show-order-detail_button {
  background-color: #0caab8;
  min-height: 50px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 50px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contents-setting-show-order-detail_button span {
  color: #ffffff;
  font-size: 1.6rem;
}

.footer-setting-order-change {
  padding: 24px 20px 100px 20px;
}
.contents-setting-order-cancel {
  padding: 24px 20px 0px 20px;
}
.contents-setting-order-cancel__title {
  margin-top: 28px;
}
.contents-setting-order-cancel__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-setting-order-cancel__category {
}
.contents-setting-order-cancel__category__title {
  margin-bottom: 8px;
}
.contents-setting-order-cancel__category__title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-cancel__category__buttons {
  display: flex;
  justify-content: space-between;
}
.contents-setting-order-cancel__category__buttons label {
    flex-basis: 24%;
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #0caab8;
    line-height: 2.5rem;
    border-radius: 10px;
    border: solid 1px #0caab8;
    background-color: #f9f9f9;
    margin-right: 5px;
}
.contents-setting-order-cancel__category__buttons label:last-child {
    margin-right: 0px;
}
.contents-setting-order-cancel__category__buttons label span {
  text-align: center;
  padding: 6px 10px;
  display: block;
}
.contents-setting-order-cancel__category__buttons label input {
  position: absolute;
  display: none;
}
.contents-setting-order-cancel__category__buttons label input + span {
  color: #0caab8;
  border-radius: 10px;
  background-color: #f9f9f9;
}
.contents-setting-order-cancel__category__buttons input:checked + span {
  color: #ffffff;
  border-radius: 8px;
  background-color: #0caab8;
}
.contents-setting-order-cancel__reason {
  margin-top: 24px;
  margin-bottom: 32px;
}
.contents-setting-order-cancel__reason__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.contents-setting-order-cancel__reason__title__text span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.1rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-cancel-complete {
    margin: 32px 0px 16px 0px;
}
.contents-setting-order-cancel-complete img {
    width: 36px;
    height: 36px;
    content: url(../images/ic-complete@2x.png);
}
.contents-setting-order-cancel-complete img.warning {
    content: url(../images/ic-warning@2x.png);
}
.contents-setting-order-cancel-complete-status {
    display: flex;
    align-items: center;
}
.contents-setting-order-cancel-complete-title {
}
.contents-setting-order-cancel__result {
    padding: 8px 13px 8px 16px;
}
.contents-setting-order-cancel__result__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.contents-setting-order-cancel__result__row__left {
}
.contents-setting-order-cancel__result__row__left span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #6d7683;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-cancel__result__row__right {
}
.contents-setting-order-cancel__result__row__right span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #353d4a;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-cancel__notice {
  margin-top: 22px;
  margin-bottom: 10px;
}
.contents-setting-order-cancel__notice__title span {
    font-size: 2rem;
    font-family: "Pretendard-Medium";
    color: #141414;
}
.contents-setting-order-cancel__notice__inform {
  margin-top: 8px;
}
.contents-setting-order-cancel__notice__inform span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 1.8rem;
  letter-spacing: -0.05rem;
}
.contents-setting-order-cancel__notice__inform-item {
  display: flex;
}
.contents-setting-order-cancel__notice__inform-item div.middle-dot{
  min-width: 10px;
  font-size: 1.5rem;
  margin-right: 5px;
  display: flex;
  justify-content: center;
}
.contents-setting-order-cancel__notice__sub {
  margin-top: 42px;
}
.contents-setting-order-cancel__notice__sub span {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.contents-setting-order-cancel__notice__date {
  margin-top: 8px;
}
.contents-setting-order-cancel__notice__date span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
}

.footer-setting-order-cancel {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 50px;
}

.contents-empty {
  background-color: #f9f9f9;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.contents-empty-wrapper {
  text-align: center;
  /* flex: 1; */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contents-empty__title {
  margin-bottom: 12px;
}
.contents-empty__title span {
  font-size: 2.1rem;
  font-family: "Pretendard-Bold";
  color: #f46b72;
  line-height: 2.5rem;
}
.contents-empty__title span.result {
  color: #3A62BA;
}
.contents-empty__title span.brain {
  color: #F06B88;
}
.contents-empty__logo {
  margin-bottom: 12px;
}
.contents-empty__logo img {
  height: 200px;
}
.contents-empty__logo img.mind {
  content: url(../gif/mind_motion_1.gif);
}
.contents-empty__logo img.body {
  content: url(../gif/body_motion_1.gif);
}
.contents-empty__logo img.brain {
  content: url(../gif/brain_motion_1.gif);
}
.contents-empty__logo img.stress {
  content: url(../gif/stress_motion_1.gif);
}
.contents-empty__logo img.activity {
  content: url(../gif/activity_motion.gif);
}
.contents-empty__logo img.result {
  content: url(../gif/result_motion.gif);
}
.contents-empty__logo img.rev {
  content: url(../gif/icon-rev.gif);
}
.contents-empty__logo-body-wrapper {
  margin-bottom: 30px !important;
}
.contents-empty__subtitle {
}
.contents-empty__subtitle span {
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
    letter-spacing: -0.41px;
}
.contents-empty-popup {
  height: 100%;
  background-color: #f6fcff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.contents-empty-popup__close {
  display: flex;
  justify-content: right;
  padding: 11px 20px 0px 0px;
  background-color: #f6fcff;
}
.contents-empty-popup__close img {
  height: 25px;
  content: url(../images/close@2x.png);
  z-index: 1;
}
.contents-empty-popup-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}
.contents-empty-popup-bottom-wrapper {
  width: 100%;
}
.contents-empty-popup-footer-button {
  text-align: center;
  display: flex;
  justify-content: center;
  padding: 16px 20px;
  visibility: hidden;
}
.contents-empty-popup__swiper {
  text-align: center;
}
.contents-empty-popup__swiper__title {
  margin-bottom: 49px;
}
.contents-empty-popup__swiper__title span {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #484e56;
  line-height: 2.5rem;
}
.contents-empty-popup__swiper__logo {
  margin-bottom: 39px;
}
.contents-empty-popup__swiper__logo img {
  height: 200px;
}
.contents-empty-popup__swiper__logo img.mind-1 {
  content: url(../gif/mind_motion_2.gif);
}
.contents-empty-popup__swiper__logo img.mind-2 {
  content: url(../gif/mind_motion_3.gif);
}
.contents-empty-popup__swiper__logo img.mind-3 {
  content: url(../gif/mind_motion_4.gif);
}
.contents-empty-popup__swiper__logo img.body-1 {
  content: url(../gif/body_motion_2.gif);
}
.contents-empty-popup__swiper__logo img.body-2 {
  content: url(../gif/body_motion_3.gif);
}
.contents-empty-popup__swiper__logo img.body-3 {
  content: url(../gif/body_motion_4.gif);
}
.contents-empty-popup__swiper__logo img.brain-1 {
  content: url(../gif/brain_motion_2.gif);
}
.contents-empty-popup__swiper__logo img.brain-2 {
  content: url(../gif/brain_motion_3.gif);
}
.contents-empty-popup__swiper__logo img.brain-3 {
  content: url(../gif/brain_motion_4.gif);
}
.contents-empty-popup__swiper__logo img.stress-1 {
  content: url(../gif/stress_motion_2.gif);
}
.contents-empty-popup__swiper__logo img.stress-2 {
  content: url(../gif/stress_motion_3.gif);
}
.contents-empty-popup__swiper__logo img.stress-3 {
  content: url(../gif/stress_motion_4.gif);
}
.contents-empty-popup__swiper__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 2.5rem;
}
.footer-empty-popup {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 50px;
  display: none;
}
.footer-empty-button {
  text-align: center;
  display: flex;
  justify-content: center;
  padding: 16px 20px;
}
.swiper-empty-popup-pagination {
  display: flex;
  justify-content: center;
  padding-bottom: 40px;
}
.contents-empty-popup .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #aeb3b9;
  margin: 0 5px 0 0;
}
.contents-empty-popup .swiper-pagination-bullet-active {
  width: 13px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #21dcec;
  margin: 0 5px 0 0;
}
.header-health-functional-food {
  position: absolute;
  display: flex;
  align-items: center;
  margin-top: 46px;
  z-index: 5;
  left: 20px;
}
.header-health-functional-food img {
  height: 25px;
}
.header-health-functional-food img.back {
  content: url(../images/icon-system-24-left-b@2x.png);
}

.contents-health-functional-food {
  padding-bottom: 40px;
}
.contents-health-functional-food__img-area {
  position: relative;
}
.contents-health-functional-food__img-area__banner-container img.sample-1 {
  width: 100%;
  content: url(../images/sobun-sample-img.png);
  border-bottom: 5px solid #0caab8;
}
.contents-health-functional-food__img-area__title {
  position: absolute;
  left: 20px;
  bottom: 42px;
}
.contents-health-functional-food__img-area__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-health-functional-food__title {
  margin-top: 42px;
  padding-left: 20px;
  padding-right: 20px;
}
.contents-health-functional-food__title span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.contents-health-functional-food__contents {
  padding-left: 20px;
  padding-right: 20px;
}
.contents-health-functional-food__contents span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 2.4rem;
}
.contents-health-functional-food__contents img.sample-2 {
  width: 100%;
  content: url(../images/sobun-sample-img-2.png);
}
.contents-health-functional-food__contents img.sample-3 {
  width: 100%;
  content: url(../images/sobun-sample-img-3.png);
}
.contents-health-functional-food img.vita-mix {
  content: url(../images/vita-mix@2x.png);
}
.contents-health-functional-food img.vita-a {
  content: url(../images/vita-a@2x.png);
}
.contents-health-functional-food img.vita-b {
  content: url(../images/vita-b@2x.png);
}
.contents-health-functional-food img.background-img {
  width: 100%;
  content: url(../images/sobun-background-img.png);
}

.company-button {
  cursor: pointer;
  text-align: center;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 10px;
}
.company-button-container span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 1.8rem;
}
.company-button-img {
  margin-bottom: 5px;
}
.company-button-img img {
  border-radius: 10px;
  background: #FFF;
  /* 배너_그림자 */
  box-shadow: 0px 0px 8px 0px rgba(48, 48, 48, 0.1);
  height: 60px;
}

.footer-health-functional-food {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
}

.bottom-sheet-container__health-functional-food {
}
.bottom-sheet-container__health-functional-food__title {
  text-align: center;
  margin-bottom: 19px;
}
.bottom-sheet-container__health-functional-food__title span {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 3.2rem;
}
.bottom-sheet-container__health-functional-food__img {
  text-align: center;
  margin-bottom: 24px;
}
.bottom-sheet-container__health-functional-food__img img.data-medis {
  height: 94px;
  content: url(../images/data-medis@2x.png);
}
.bottom-sheet-container__health-functional-food__button{
  padding: 20px;
}
.health-functional-food-checkbox__options {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 25px;
  padding: 10px 28px 10px 46px;
}
.health-functional-food-checkbox__options.setting {
  padding: 10px 28px 10px 10px;
}
.health-functional-food-checkbox__options div {
  display: inline-flex;
  align-items: center;
}
.health-functional-food-checkbox__options div input[type=checkbox] {
  display: none;
}
.health-functional-food-checkbox__options div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  background: url("../images/check_off@2x.png") no-repeat 0 0px/contain;
}
.health-functional-food-checkbox__options div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.health-functional-food-checkbox__options div label {
  font-size: 16px;
  line-height: 24px;
  color: #868B92;
}
.health-functional-food-checkbox__options span {
  font-size: 16px;
  line-height: 25px;
  color: #868b92;
}
.health-functional-food-checkbox__options img {
  height: 24px;
}
.health-functional-food-checkbox__options img.more {
  content: url(../images/chevron-right@2x.png);
}

.contents-footer-company-info {
}
.contents-footer-company-info-wrapper {
  padding: 32px;
}
.contents-footer-company-info-wrapper.bg-gray {
  background-color: #f8f8f8;
}
.contents-footer-company-info-wrapper.bg-white {
  background-color: #ffffff;
}
.contents-footer-company-info-wrapper span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
}
.contents-footer-company-info-checkup span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #484e56;
}
.contents-footer-company-info-logo img {
  height: 13px;
  content: url(../images/saluscare_logo@2x.png);
}
.contents-footer-company-info-checkup {
  padding: 15px 0px 15px 0px;
  display: flex;
}
.contents-footer-company-info-information span {
  line-height: 1.57;
}
.contents-footer-company-info-copyright {
  padding-top: 15px;
}
.contents-footer-company-info-copyright span {
  color: #868b92;
}

@keyframes loading {
    0%, 100%{
        opacity: 0.3;
        transform: scale(0.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.0);
    }
}
.loading {
    display: flex;
    flex-direction: column;
}
.loading img {
    width: 20px;
    height: 15px;
    animation: loading 1.2s linear infinite;
    margin-bottom: 10px;
    opacity: 0.3;
    transform: scale(0.3);
    content: url(../images/loading-polygon@2x.png);
}
.loading img:last-child {
    margin-bottom: 0px;
}
.loading img:nth-child(1) {
    animation-delay: 0s;
}
.loading img:nth-child(2) {
    animation-delay: 0.1s;
}
.loading img:nth-child(3) {
    animation-delay: 0.2s;
}
.loading img:nth-child(4) {
    animation-delay: 0.3s;
}
.loading img:nth-child(5) {
    animation-delay: 0.4s;
}

@keyframes loading-horizontal {
    0%, 100%{
        opacity: 0.3;
        transform: scale(0.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.0);
    }
}
.loading-horizontal {
}
.loading-horizontal img {
    width: 12px;
    height: 18px;
    margin-right: 8px;
    animation: loading 1.2s linear infinite;
    opacity: 0.3;
    transform: scale(0.3);
    content: url(../images/loading-polygon-horizontal@2x.png);
}
.loading-horizontal img:last-child {
    margin-right: 0px;
}
.loading-horizontal img:nth-child(1) {
    animation-delay: 0s;
}
.loading-horizontal img:nth-child(2) {
    animation-delay: 0.1s;
}
.loading-horizontal img:nth-child(3) {
    animation-delay: 0.2s;
}
.loading-horizontal img:nth-child(4) {
    animation-delay: 0.3s;
}

.loading-content-container {
    width: 100%;
    height: 100%;
}
.loading-content-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 0px 90px;
}
.loading-title-customer {
    border-radius: 4px;
    background-color: #F3F3F3;
    padding: 4px 6px;
    margin-bottom: 16px;
}
.loading-title-customer span {
    font-family: "Pretendard-Medium";
    font-size: 1.6rem;
    line-height: 24px;
    color: #2B2E33;
}
.loading-kmi-logo-wrapper {
    margin-bottom: 40px;
}
.loading-kmi-logo-wrapper img {
    width: 100%;
    content: url(../images/logo-kmi@2x.png);
}
.loading-title {
    text-align: center;
    margin-bottom: 8px;
}
.loading-title span {
    font-family: "Pretendard-Medium";
    font-size: 1.6rem;
    line-height: 20px;
    color: #2B2E33;
}
.loading-vitaport-logo {
}
.loading-vitaport-logo img {
    width: 160px;
    content: url(../images/main-logo-img@2x.png);
}

/* cgm 이벤트 페이지 */
.cgm-event-page_content-container {
}
.cgm-event-page_content-container img{
    width: 100%;
    vertical-align: middle;
}
.cgm-event-page_content-wrapper {
    background-color: #D2E7FF;
    padding: 48px 30px 40px;
}
.cgm-event-page-product-card {
    background-color: #ffffff;
    border-radius: 12px;
    border: 2px solid #9FCBFF;
    padding: 16px;
}
.cgm-event-page-title {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.cgm-event-page-title span.title {
    font-family: "GmarketSansMedium";
    font-size: 1.8rem;
    color: #2B2E33;
}
.cgm-event-page-title span.highlight {
    font-family: "GmarketSansBold";
    font-size: 2.4rem;
    color: #2B2E33;
}
.program-item-event-name-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.program-item-event-info-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.program-item-event-info-wrapper span.company-name {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
    line-height: 1.8rem;
    margin-bottom: 2px;
}
.program-item-event-info-wrapper span.item-name {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #141414;
    line-height: 2.1rem;
    margin-bottom: 4px;
}

/* 공동마케팅 이벤트 페이지 */
.contents-co-marketing_wrapper {
    position: relative;
    justify-content: center;
    display: flex;
}
.contents-co-marketing {
    position: absolute;
    left: 20px;
    right: 20px;
}
.co-marketing_event-page_content-container {
}
.co-marketing_event-page_content-container img{
    width: 100%;
    vertical-align: middle;
}
.co-marketing-quiz-title-container {
    display: flex;
    justify-content: space-between;
}
.co-marketing-quiz-title {
    display: flex;
    flex-direction: column;
}
.co-marketing-quiz-title span.bold {
    font-size: 2.8rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.co-marketing-quiz-title span.smallbold {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.co-marketing-quiz-title span.subtitle {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #484E56;
}
.co-marketing-quiz-img img {
    width: 88px;
    height: 88px;
}
.co-marketing-quiz-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 32px;
}

@keyframes selected {
    to {
        opacity: 1;
    }
}
.answer-container {
    visibility: hidden;
    position: absolute;
    width: 100%;
    overflow: hidden;
    background: #fff;
}
.answer-container.visible {
    opacity: 0.3;
    animation: selected 0.7s forwards;
}
.co-marketing-detail {
    width: 100%;
}
.co-marketing-quiz-item-container {
    transform: translateY(0px);
    transition: transform 0.7s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}
.co-marketing-quiz-item-wrapper {
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 11px 24px;
    background-color: #D2EAFC;
    border-radius: 20px;
    border: 1px solid #95D1FF;
    align-items: center;
}
.co-marketing-quiz-item-wrapper.horizontal {
    transition: transform 0.7s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    flex-basis: 50%;
    justify-content: center;
    padding: 20px 0px;
    max-width: 152px;
    min-width: 152px;
}
.co-marketing-quiz-item-wrapper.result {
    border: 4px solid #3F80FF !important;
}
.co-marketing-quiz-item-wrapper.result_wrong {
    border: 4px solid #FF6969 !important;
}
.co-marketing-quiz-item-wrapper.type-b {
    background-color: #FFF6D7;
    border: 1px solid #EEDC9E;
}
.co-marketing-quiz-item-wrapper.type-c {
    background-color: #E4FFE2;
    border: 1px solid #ABDFA7;
}
.co-marketing-quiz-item-wrapper.type-d {
    background-color: #FFEBEB;
    border: 1px solid #FFC0C0;
}
.co-marketing-quiz-item-wrapper.type-e {
  background-color: #FFEBEB;
  border: 1px solid #FFC9C9;
}
.co-marketing-quiz-item-wrapper img.right-arrow {
    width: 20px;
    height: 28px;
    vertical-align: middle;
    margin: 0px 4px;
    content: url(../images/ic-right-arrow@2x.png);
}
.co-marketing-quiz-text {
    border-radius: 50px;
    padding: 6px 12px;
    background-color: rgba(56, 155, 247, 0.2);
    display: inline-flex;
}
.co-marketing-quiz-text span{
    font-size: 2.1rem;
    font-family: "Pretendard-Bold";
    color: #389BF7;
}
.co-marketing-quiz {
    text-align: center;
}
.co-marketing-quiz span {
    font-size: 2.0rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.co-marketing-quiz span a{
    color: #389BF7;
}
.quiz-item-element {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.quiz-item-element-img {
    margin-bottom: 3px;
}
.quiz-item-element-img img {
    width: 100%;
    height: 100%;
    max-width: 100px;
    max-height: 100px;
    vertical-align: middle;
}
.quiz-item-element-img img.apple {
    content: url(../images/ic-apple@2x.png);
}
.quiz-item-element-img img.egg {
    content: url(../images/ic-egg@2x.png);
}
.quiz-item-element-img img.rice {
    content: url(../images/ic-rice@2x.png);
}
.quiz-item-element-img img.pasta {
    content: url(../images/ic-pasta@2x.png);
}
.quiz-item-element-img img.juice {
    content: url(../images/ic-juice@2x.png);
}
.quiz-item-element-img img.fulled {
    content: url(../images/ic-fulled@2x.png);
}
.quiz-item-element-img img.empty {
    content: url(../images/ic-empty@2x.png);
}
.quiz-item-element-img img.yes {
    content: url(../images/ic-yes@2x.png);
}
.quiz-item-element-img img.no {
    content: url(../images/ic-no@2x.png);
}
.quiz-item-element-img img.helpful {
  content: url(../images/ic-helpful@2x.png);
}
.quiz-item-element-img img.unhelpful {
  content: url(../images/ic-unhelpful@2x.png);
}
.quiz-item-element-img img.clock-one {
  content: url(../images/ic-clock-one@2x.png);
}
.quiz-item-element-img img.clock-three {
  content: url(../images/ic-clock-three@2x.png);
}
.quiz-item-element-img img.fullbowl {
  content: url(../images/ic-fullbowl@2x.png);
}
.quiz-item-element-img img.emptybowl {
  content: url(../images/ic-emptybowl@2x.png);
}
.quiz-item-element-img img.quiz_correct {
  content: url(../images/img_quiz_correct@2x.png);
}
.quiz-item-element-img img.quiz_incorrect {
  content: url(../images/img_quiz_incorrect@2x.png);
}
.btn-co-marketing-quiz img.quiz_correct {
  content: url(../images/img_quiz_correct@2x.png);
}
.btn-co-marketing-quiz img.quiz_incorrect {
  content: url(../images/img_quiz_incorrect@2x.png);
}

.quiz-item-element-text {
    background-color: #4880EE;
    border-radius: 12px;
    padding: 4px 12px;
}
.quiz-item-element-text.type-b {
    background-color: #FEB64B;
}
.quiz-item-element-text.type-c {
    background-color: #54BC84;
}
.quiz-item-element-text.type-d {
    background-color: #FF9696;
}
.quiz-item-element-text span{
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #ffffff;
}
.quiz-result-area {
    padding: 24px 20px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.quiz-correct-congratulations {
    position: absolute;
    width: 100%;
    height: 400px;
    z-index: 5;
}
.quiz-correct-congratulations canvas{
    width: 100%;
    height: 100%;
}
.co-marketing-quiz-answer-title {
    display: flex;
    justify-content: center;
}
.co-marketing-quiz-answer-title span.smallbold {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #141414;
}
.co-marketing-quiz-result-subtitle {
    display: flex;
    justify-content: center;
    text-align: center;
}
.co-marketing-quiz-result-subtitle span{
    font-size: 1.8rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
}
.co-marketing-quiz-result-subtitle span strong{
    font-family: "Pretendard-Bold";
}
.co-marketing-quiz-result-container {
    background-color: #051725;
    border-radius: 0px 0px 20px 20px;
    padding: 20px 16px 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.co-marketing-quiz-result-container.bg-white {
    background: #fff;
}
.co-marketing-quiz-result-explan-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.co-marketing-noti-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background-color: #F3F4F6;
}
.co-marketing-product-card {
    max-width: 328px;
    display: flex;
    justify-content: center;
}
.co-marketing-product-card-wrapper {
    display: flex;
    align-items: center;
}
.quiz-result-title {
    display: flex;
    justify-content: center;
    text-align: center;
    margin: 20px 0px 24px;
}
.quiz-result-title span {
    font-size: 2.8rem;
    font-family: "Pretendard-Bold";
    color: #BFFF6D;
}
.quiz-result-img {
    max-width: 328px;
}
.quiz-result-img img {
    width: 100%;
    vertical-align: middle;
}
.quiz-result-discount-rate-img {
    display: flex;
    justify-content: center;
}
.quiz-result-discount-rate-img img {
    width: 100%;
    max-width: 250px;
}
.quiz-result-subtitle {
    text-align: center;
    display: flex;
    justify-content: center;
}
.quiz-result-subtitle span {
    font-size: 2.0rem;
    font-family: "Pretendard-Regular";
    color: #AEB3B9;
}
.quiz-result-subtitle span strong{
    font-size: 2.0rem;
    font-family: "Pretendard-Bold";
    color: #ffffff;
}
.co-marketing-product-img {
    max-width: 100px;
    max-height: 100px;
    border-radius: 8px;
    overflow: hidden;
    margin-right: 12px;
    aspect-ratio: 1 / 1;
}
.co-marketing-product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.co-marketing-product-info-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 8px;
}
.co-marketing-product-info-wrapper span.company-name {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #AEB3B9;
    margin-bottom: 2px;
}
.co-marketing-product-info-wrapper span.item-name {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #FFFFFF;
    margin-bottom: 4px;
    word-break: auto-phrase;
}
.co-marketing-product-cost-wrapper {
}
.co-marketing-product-cost-wrapper span.discount-rate {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #BFFF6D;
}
.co-marketing-product-cost-wrapper span.item-cost {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #ffffff;
}
.co-marketing-product-card-right-arrow img.right-arrow {
    width: 32px;
    height: 32px;
    content: url(../images/ic-right-arrow-white@2x.png);
}
.quiz-result-question-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.quiz-result-question-wrapper span {
    font-size: 1.8rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
    margin-bottom: 12px;
}
.quiz-result-question-wrapper img {
    width: 34px;
    height: 20px;
    content: url(../images/ic-double-arrow@2x.png);
}
.goto-buy-product {
    padding: 48px 20px;
    max-width: 328px;
}
.goto-buy-product img {
    width: 100%;
}
.co-marketing-quiz-item-horizontal-container {
    display: flex;
    justify-content: center;
}
.co-marketing-product-discount-time-left {
    padding: 22px 20px 36px;
    border-radius: 20px;
    background: linear-gradient(180deg, #1B3069 0%, #0F2358 100%) border-box;
    border: 1px solid rgba(153, 153, 153, 0.2);
}
.co-marketing-time-left-title {
    display: flex;
    justify-content: center;
    margin-bottom: 14px;
}
.co-marketing-time-left-title span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: rgba(255, 255, 255, 0.5);
}
.time-left-number-container {
    display: flex;
    align-items: center;
    justify-content: center
}
.time-left-number-container img{
    width: 4px;
    height: 12px;
    margin: 0px 4px;
}
.time-block-wrapper {
    position: relative;
}
.block-wrapper {
}
.block-wrapper div.block {
    width: 40px;
    height: 32px;
    background: linear-gradient(180deg, #FFFFFF 0%, #C8D1D6 100%);
    border: 0.5px solid #FFFFFF80;
}
.block-wrapper div.block.up {
    border-radius: 8px 8px 0px 0px;
}
.block-wrapper div.block.down {
    border-radius: 0px 0px 8px 8px;
}
.number-wrapper {
    position: absolute;
    width: 25px;
    top: 11px;
    left: 8px;
    text-align: center;
}
.number-wrapper span {
    font-size: 4rem;
    font-family: "Pretendard-Bold";
    color: #000000;
}

/* 한화손보 페이지*/
.contents-hanwha {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.hanwha-course-description-title-wrapper {
    padding: 32px 24px;
}
.hanwha-course-pagenation-number {
    margin-bottom: 8px;
}
.hanwha-course-pagenation-number span {
    font-size: 1.3rem;
    font-family: "Pretendard-Bold";
    color: #B5BDC5;
}
.hanwha-course-pagenation-number span strong{
    color: #FF6600;
}
.hanwha-course-description-title {
    display: none;
    padding: 32px 24px;
}
.hanwha-course-description-title span {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-course-description-title span.block {
  display: block;
}
.hanwha-course-description-title img {
  width: 40px;
  height: 40px;
}
.hanwha-course-description-title img.ico-course-scan {
  content: url('../images/ico-course-scan@2x.png');
}
.hanwha-course-description-title img.ico-course-apply {
  content: url('../images/ico-course-apply@2x.png');
}
.hanwha-course-description-title img.ico-course-apply-completed {
  content: url('../images/ico-course-apply-cancle@2x.png');
}
.hanwha-course-description-title img.ico-course-deliver {
  content: url('../images/ico-course-deliver@2x.png');
}
.hanwha-course-description-title img.ico-course-inspect {
  content: url('../images/ico-course-inspect@2x.png');
}
.hanwha-course-description-title img.ico-course-complete {
  content: url('../images/ico-course-complete@2x.png');
}
.hanwha-check-course-title span{
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-select-card-container {
    height: auto;
    box-sizing: border-box;
    padding: 0px 24px 10px;
}
.hanwha-select-card-container.fix-height {
  height: 409px;
}
.hanwha-select-card {
    border-radius: 16px;
    border: 1px solid rgba(255, 102, 0, 0.4);
    padding: 24px 20px;
}
.hanwha-select-card-wrapper {
    display: flex;
}
.hanwha-select-card-icon {
    margin-right: 8px;
}
.hanwha-select-card-icon img.womens-diseases {
    width: 44px;
    height: 44px;
    content: url(../images/hanhwa-womens-diseases@2x.png);
}
.hanwha-select-card-icon img.mental-care {
    width: 44px;
    height: 44px;
    content: url(../images/hanhwa-mental-care@2x.png);
}
.hanwha-select-card-icon img.dtc-test {
    width: 44px;
    height: 44px;
    content: url(../images/hanhwa-dtc-test@2x.png);
}
.hanwha-select-card-info {
    width: 100%;
}
.hanwha-select-card-info-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}
.hanwha-select-card-info-category {
    margin-bottom: 4px;
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #111;
}
.hanwha-select-card-info-category span {
    color: #57616B;
}
.hanwha-select-card-info-name span {
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-select-card-right-arrow img {
    width: 16px;
    height: 16px;
    content: url(../images/chevron-right_black@2x.png);
}
.hanwha-select-card-hashtag-list {
    display: flex;
    flex-wrap: wrap;
}
.hanwha-select-card-hashtag {
    border-radius: 2px;
    background-color: #F1F3F5;
    padding: 2px 4px;
    margin-right: 4px;
}
.hanwha-select-card-hashtag:last-child {
    margin-right: 0px;
}
.hanwha-select-card-hashtag span{
    font-size: 1.2rem;
    font-family: "Pretendard-Medium";
    color: #89949F;
}
.hanwha-genetic-testing-noti {
    padding: 0px 24px;
    line-height: 17px;
}
.hanwha-genetic-testing-noti.pdlr-0 {
    padding-left: 0;
    padding-right: 0;
}
.hanwha-genetic-testing-noti span {
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #89949F;
}
.hanwha-genetic-testing-noti-list {
  padding: 0px 24px;
}
.hanwha-genetic-testing-noti-list span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #89949F;
  line-height: 17px;
}
.hanwha-gen-form-wrapper {
    flex: 1;
}
.hanwha-application-form {
    flex: 1;
}
.hanwha-selected-item-writing-infolist {
    padding: 0px 24px;
}
.hanwha-selected-item-writing-item {
    margin-bottom: 32px;
}
.hanwha-selected-item-writing-item:last-child {
    margin-bottom: 0px;
}
.hanwha-selected-item-writing-item p.notice {
  font-family: "Pretendard-Regular";
  font-size: 1.4rem;
  color: #F43D3D;
  line-height: 21px;
  letter-spacing: -0.5px;
  margin-top: 8px;
}
/* 한화손보 인풋 - 유전자 검사 신청서 */
.hanwha-selected-item-writing-item .hanwha-input-area {
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
  border: 1px solid #D6DBE0;
  border-radius: 6px;
  overflow: hidden;
}
.hanwha-selected-item-writing-item .hanwha-input-area > input {
  display: block;
  width: calc(100% - 84px);
  height: 100%;
  border: none;
  background: #F8F9FA;
  padding: 0 14px;
}
.hanwha-selected-item-writing-item .hanwha-input-area.default > input {
  width: 100%;
}
.hanwha-selected-item-writing-item .hanwha-input-area.default {
  background: #F8F9FA;
}
.hanwha-selected-item-writing-item .hanwha-input-area > input::placeholder {
  font-family: "Pretendard-Regular";
  font-size: 1.6rem;
  color: #B5BDC5;
}
.hanwha-selected-item-writing-item .hanwha-input-area .btn-in-field {
  width: 56px;
  height: 56px;
  background: #FF6600;
}
.hanwha-selected-item-writing-item .hanwha-input-area .btn-in-field span {
  font-family: "Pretendard-Regular";
  font-size: 1.6rem;
  color: #fff;
  line-height: 21px;
}
/* // 한화손보 인풋 - 유전자 검사 신청서 */
.hanwha-writing-infolist-label-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.hanwha-writing-infolist-label {
    width: calc(100% - 80px);
    margin-bottom: 8px;
}
.hanwha-writing-infolist-label.initial {
    width: initial;
    margin-bottom: 0;
}
.hanwha-writing-infolist-label span{
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-agree-btn-reload {
    width: 79px;
    vertical-align: middle;
    padding: 7.5px 12px;
    box-sizing: border-box;
    background: #F1F3F5;
    border-radius: 6px;
}
.hanwha-agree-btn-reload span {
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #2E3338;
    line-height: 17px;
}
.hanwha-agree-btn-reload img {
    width: 16px;
    height: 16px;
    content: url(../images/ic-reload@2x.png);
    vertical-align: sub;
}
.hanwha-writing-infolist-value {
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    padding: 16px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hanwha-writing-infolist-value.default {
    background-color: #F8F9FA;
}
.hanwha-writing-infolist-value span{
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
}
.hanwha-writing-infolist-value.default span{
    color: #B5BDC5;
}
.hanwha-writing-infolist-value input{
    border: none;
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    line-height: 24px;
    width: 100%;
    box-sizing: border-box;
}
.hanwha-writing-infolist-value input:focus{
    outline: none;
}
.hanwha-writing-infolist-value input::placeholder{
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #B5BDC5;
}
.hanwha-writing-infolist-value img {
    width: 24px;
    height: 24px;
    content: url(../images/ic-search-darkgray@2x.png);
}
.hanwha-writing-infolist-memo {
    height: 100px;
    padding: 16px 14px;
    border: 1px solid #D6DBE0;
    border-radius: 6px;
    box-sizing: border-box;
}
.hanwha-writing-infolist-memo textarea {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    resize: none;
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
}
.hanwha-textarea-textcount {
    text-align: right;
}
.hanwha-textarea-textcount span {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #AEB3B9;
  line-height: 18px;
}
.hanwha-textarea-textcount strong {
  color: #484E56;
}

.hanwha-writing-infolist-memo textarea::placeholder {
    color: #B5BDC5;
}
.hanwha-writing-infolist-sign {
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    display: flex;
}
.hanwha-writing-infolist-sign canvas{
    width: 100%;
}
.hanwha-writing-infolist-noti {
    margin-top: 8px;
}
.hanwha-writing-infolist-noti span{
    font-size: 1.2rem;
    font-family: "Pretendard-Regular";
    color: #89949F;
}

.hanwha-selectbox-wrapper {
    position: relative;
}
.hanwha-writing-infolist-selectbox {
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    padding: 16px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hanwha-writing-infolist-selectbox.active {
    border-radius: 6px 6px 0px 0px;
}
.hanwha-writing-infolist-selectitem span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
}
.hanwha-writing-infolist-selectbox-arrow img {
    width: 24px;
    height: 24px;
    content: url(../images/ic-down-arrow@2x.png);
}
.hanwha-writing-infolist-selectbox-arrow img.active {
    content: url(../images/ic-up-arrow@2x.png);
}
.hanwha-selectbox-itemlist {
    position: absolute;
    width: 100%;
    max-height: 125px;
    overflow-y: scroll;
    display: none;
    border-radius: 0px 0px 6px 6px;
    border-width: 0 1px 1px 1px;
    border-color: #D6DBE0;
    border-style: solid;
    z-index: 2;
    box-sizing: border-box;
}
.hanwha-selectbox-itemlist.active {   
    display: block;
}
.hanwha-selectbox-itemlist ul {
    background: #ffffff;
    padding: 12px 14px; 
    overflow: visible;
    list-style-type: none;
}
.hanwha-selectbox-itemlist li {
    padding-top: 16px;
}
.hanwha-selectbox-itemlist li:first-of-type {
    padding-top: 0;
}
.hanwha-selectbox-itemlist li span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    line-height: 2.8rem;
}
.hanwha-writing-infolist-datepicker {
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    padding: 16px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hanwha-writing-infolist-datepicker input{
    width:100%;
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    border: none;
}
.hanwha-writing-infolist-datepicker input:focus{
    outline: none;
}
.hanwha-writing-infolist-datepicker img {
    width: 24px;
    height: 24px;
    content: url(../images/ic-calendar@2x.png);
}
.hanwha-loading-bar-container {
    position: sticky;
    top: 48px;
}
.gene-card-contents-graph-my {
    position: absolute;
    bottom: 0;
    z-index: 1;
}
.hanwha-loading-bar {
    position: absolute;
    height: 2px;
    width: 0%;
    bottom: 0;
    left: 0;
    background-color: #FF6600;
    transition: width 0.3s ease-out;
}
.hanwha-loading-bar-notfill {
    width: 100%;
    height: 2px;
    background-color: #D6DBE0;
}
.hanwha-applynotice-container {
    padding: 40px 24px;
}
.hanwha-applynotice-title span {
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #57616B;
}
.hanwha-applynotice-item {
    display: flex;
}
.hanwha-applynotice-item span.applynotice-item-dot {
    font-size: 0.8rem;
    font-family: "Pretendard-Regular";
    color: #57616B;
    margin-right: 8px;
    margin-top: 5px;
}
.hanwha-applynotice-item span.applynotice-item {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #57616B;
    line-height: 20px;
}
.hanwha-inspector-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 24px 24px;
}
.hanwha-inspector-info-wrapper {
    display: flex;
    flex-direction: column;
}
.hanwha-inspector-info-wrapper span.inspector-info{
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #FF6600;
    margin-bottom: 4px;
}
.hanwha-inspector-info-wrapper span.isdifferent-qustion{
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #57616B;
}
.hanwha-personal-info-container {
    padding: 0px 24px;
}
.hanwha-agree-card-list {
}
.hanwha-agree-card {
    display: flex;
    padding: 18px 16px;
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.hanwha-agree-card:last-child {
    margin-bottom: 0px;
}
.hanwha-agree-title-wrapper {
    width: 100%;
    display: flex;
    align-items: center;
}
.hanwha-agree-check input[type=checkbox] {
    width: 20px;
    height: 20px;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #B5BDC5;
}
.hanwha-agree-check input[type=checkbox]:checked {
    background-size: 20px 20px;
    background-color: #FF6600;
    background-image: url(../images/hanwha-check@2x.png);
    border: 0px;
}
.hanwha-agree__txt-area {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.hanwha-agree-name {
    width: calc(100% - 60px);
    padding-left: 10px;
}
.hanwha-agree-name span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
}
.hanwha-agree-name.bold span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
  line-height: 26px;
}
.hanwha-agree-rightarrow img {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    content: url(../images/ic-right-arrow-thin@2x.png);
}
.hanwha-agree-btn-view {
  width: 49px;
  vertical-align: middle;
  padding: 7.5px 12px;
  box-sizing: border-box;
  background: #F1F3F5;
  border-radius: 6px;
}
.hanwha-agree-btn-view span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #2E3338;
  line-height: 17px;
}
.hanwha-select-result-container {
    padding: 0px 24px;
}
.hanwha-select-confirm-category {
    margin-bottom: 24px;
}
.hanwha-select-confirm-category span {
    font-size: 1.8rem;
    font-family: "Pretendard-Bold";
    color: #FF6600;
}
.hanwha-select-confirm-category span.fc-black {
  color: #2E3338;
}
.hanwha-select-confirm-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 16px;
}
.hanwha-select-confirm-wrapper:last-child {
    margin-bottom: 0px;
}
.hanwha-select-confirm-wrapper span {
    word-break: break-word;
}
.hanwha-select-confirm-label span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #89949F;
    line-height: 23px;
    display: block;
    min-width: 71px;
}
.hanwha-select-confirm-value {
    display: flex;
    flex-direction: column;
    text-align: end;
    align-items: end;
}
.hanwha-select-confirm-value span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    line-height: 23px;
}
.hanwha-select-confirm-value span strong {
    font-family: "Pretendard-Bold";
}
.hanwha-confirm-check-form {
    padding: 80px 24px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.hanwha-confirm-check {
    margin-bottom: 48px;
}
.hanwha-confirm-check img {
    width: 64px;
    height: 64px;
    vertical-align: middle;
    content: url(../images/hanwha-confirm-check@2x.png);
}
.hanwha-confirm-title {
    margin-bottom: 8px;
}
.hanwha-confirm-title span {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-confirm-subtitle {
    text-align: center;
}
.hanwha-confirm-subtitle span {
    font-size: 1.6rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    line-height: 24px;
}
.hanwha-confirm-address {
  display: none;
  margin-top: 48px;
}
.hanwha-confirm-address .title {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #57616B;
  line-height: 13px;
}
.hanwha-confirm-address .center_name {
  display: block;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  font-style: normal;
  color: #2E3338;
  line-height: 19px;
  margin-top: 8px;
}
.hanwha-confirm-address .address-area {
  display: flex;
  align-items: center;
  margin-top: 8px;
}
.hanwha-confirm-address .address {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  font-weight: 500;
  color: #2E3338;
  line-height: 19px;
  margin-bottom: 0;
}
.hanwha-confirm-address .hanwha-btn-copy {
  margin-left: 4px;
}
.hanwha-confirm-btn {
    display: flex;
    padding: 32px 24px;
}
.hanwha-confirm-btn.one {
  display: block;
}
.hanwha-confirm-btn.one > button {
  width: 100%;
}
.contents-hanwha-agree {
    padding: 32px 24px 0px;
    flex: 1;
}
.hanwha-agree-form-title-wrapper {
    margin-bottom: 32px;
}

.contents-hanwha-term-list {
  padding: 32px 24px 0px;
  flex: 1;
}
.hanwha-term-list-title span {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
}
.hanwha-term-list-title p {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #2E3338;
}
.hanwha-term-list-title-wrapper {
  margin-bottom: 32px;
}
.hanwha-term-list-subtitle {
  margin-bottom: 4px;
}
.hanwha-term-list-subtitle span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
}
.hanwha-term-list-subtitle span.fc-orange {
display: inline-block;
font-size: 1.4rem;
font-family: "Pretendard-Regular";
color: #FF6600;
}
.hanwha-term-list-contents {
  display: flex;
  flex-direction: column;
  margin-bottom: 40px;
}
.hanwha-term-list-contents:last-child {
  margin-bottom: 0px;
}
.hanwha-term-list-contents .img-area {
  width: 100%;
}
.hanwha-term-list-contents .img-area > img {
  width: 100%;
}
.hanwha-term-list-contents img.term-1{
  content: url(../images/hanhwa-term-list1@2x.png);
}
.hanwha-term-list-contents img.term-2{
  content: url(../images/hanhwa-term-list2@2x.png);
}
.hanwha-term-list-contents img.term-3{
  content: url(../images/hanhwa-term-list3@2x.png);
}
.hanwha-term-list-contents img.term-4{
  content: url(../images/hanhwa-term-list4@2x.png);
}
.hanwha-term-list-contents img.term-5{
  content: url(../images/hanhwa-term-list5@2x.png);
}
.hanwha-term-list-contents img.term-6{
  content: url(../images/hanhwa-term-list6@2x.png);
}
.hanwha-term-list-contents img.term-7{
  content: url(../images/hanhwa-term-list7@2x.png);
}
.hanwha-term-list-contents img.term-8{
  content: url(../images/hanhwa-term-list8@2x.png);
}
.hanwha-term-list-contents img.term-9{
  content: url(../images/hanhwa-term-list9@2x.png);
}
.hanwha-term-list-contents span.normal{
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #2E3338;
  line-height: 145%;
}

.contents-hanwha-gene-list {
  padding: 32px 0 0;
  flex: 1;
}
.hanwha-gene-list-title span {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
}
.hanwha-gene-list-title p {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #2E3338;
}
.hanwha-gene-list-title-wrapper {
  padding: 0 32px;
  margin-bottom: 32px;
}
.hanwha-gene-list-title-wrapper.pdlr-24 {
  padding: 0 24px;
}
.hanwha-gene-list-subtitle {
  margin-bottom: 4px;
}
.hanwha-gene-list-subtitle span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
}
.hanwha-gene-list-subtitle span.fc-orange {
display: inline-block;
font-size: 1.4rem;
font-family: "Pretendard-Regular";
color: #FF6600;
}
.hanwha-gene-list-contents {
  display: flex;
  flex-direction: column;
  margin-bottom: 40px;
}
.hanwha-gene-list-contents:last-child {
  margin-bottom: 0px;
}

.hanwha-requirements-badge {
    border-radius: 20px;
    padding: 2px 12px;
    background-color: #FF6600;
    display: inline-flex;
    margin-bottom: 8px;
}
.hanwha-requirements-badge.choice {
    background-color: #ffffff;
    border: 1px solid #FF6600;
}
.hanwha-requirements-badge span{
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
}
.hanwha-requirements-badge.choice span{
    color: #FF6600;
}
.hanwha-agree-form-title span {
    font-size: 2.4rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-agree-contents {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}
.hanwha-agree-contents:last-child {
    margin-bottom: 0px;
}
.hanwha-agree-contents span.normal{
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #2E3338;
    line-height: 145%;
    word-break: break-all;
}
.hanwha-agree-contents span.normal.fc-dgray {
    color: #484E56;
}
.hanwha-agree-contents .dot-list > li {
  padding-left: 14px;
  position: relative;
}
.hanwha-agree-contents .dot-list > li::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 3px;  
  border-radius: 50%;
  background: #2E3338;
  position: absolute;
  top: 8px;
  left: 4px;
}
.hanwha-agree-contents span.accent{
    font-size: 1.4rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
    line-height: 145%;
}
.hanwha-agree-contents span.normal strong.underline{
    font-family: "Pretendard-Regular";
    font-weight: 400;
    text-decoration: underline;
}
.hanwha-agree-contents img.agree-1{
    content: url(../images/hanwha-agree-cont01@2x.png);
}
.hanwha-agree-contents img.agree-2{
    content: url(../images/hanwha-agree-cont02@2x.png);
}
.hanwha-agree-contents img.agree-3{
    content: url(../images/hanwha-agree-cont03@2x.png);
}
.hanwha-agree-contents img.agree-4{
  content: url(../images/hanwha-agree-cont04@2x.png);
}
.hanwha-agree-contents img.agree-5{
  content: url(../images/hanwha-agree-cont05@2x.png);
}
.hanwha-agree-contents img.agree-6{
  content: url(../images/hanwha-agree-cont06@2x.png);
}
.hanwha-agree-contents img.agree-7{
  content: url(../images/hanwha-agree-cont07@2x.png);
}
.hanwha-agree-contents img.agree-8{
  content: url(../images/hanwha-agree-cont08@2x.png);
}
.hanwha-agree-contents img.agree-9{
  content: url(../images/hanwha-agree-cont09@2x.png);
}
.hanwha-agree-subtitle {
    margin-bottom: 4px;
}
.hanwha-agree-subtitle span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-agree-check-wrapper {
    display: flex;
}
.hanwha-agree-sentence {
    display: flex;
}

.contents-hanwha.bg-gray {
  background-color: #f8f8f8;
}
.contents-hanwha.bg-gray .header.bg-gray {
  background-color: #f8f8f8;
}
.hanhwa-report-result-titlebox-container {
  margin-top: 16px;
  padding: 0 20px;
}
.hanhwa-report-result-titlebox {
  padding: 25px 22px 20px 20px;
  border: 1px solid #FF6600;
  border-radius: 16px;
  background-color: #fff;
}
.hanhwa-report-result__title-sort {
  margin-bottom: 2px;
  display: flex;
  align-items: center;
}
.hanhwa-report-result__title-sort span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #ff6600;
  line-height: 2.1rem;
}
.hanhwa-report-result__title-name {
  margin-bottom: 12px;
  display: flex;
  align-items: center;
}
.hanhwa-report-result__title-name span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 2.4rem;
}
.hanhwa-report-result__card-list-container {
  margin-top: 32px;
  padding: 0 20px;
}
.hanhwa-report-result__subtitle {
  width: 100%;
  max-width: 140px;
  padding: 4px 12px;
  height: 26px;
  background: #FF66001F;
  border-radius: 12px 15px 15px 0;
  margin-bottom: 8px;
}
.hanhwa-report-result__subtitle span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #ff6600;
  line-height: 2.5rem;
  letter-spacing: -0.041rem;
}
.hanhwa-report-result__subtitle span::before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url('../images/icon-recommend-orange@2x.png') no-repeat center / contain;
  vertical-align: middle;
  margin-right: 2px;
}
.hanhwa-report-result__subtitle-bar > span {
  width: 100%;
  height: 4px;
  border-radius: 4px;
  display: block;
  background: linear-gradient(to left, #ffcc00, #ff6600);
}
.hanhwa-report-result__detail-wrapper{
  width:100%;
  margin-top:20px;
  display:flex;
  align-items: center;
}
.hanhwa-report-result__detail{
  width:50%;
  display: flex;
}
.hanhwa-report-result__detail-box{
  width:100%;
  margin-left: 12px;
}
.hanhwa-report-result__detail.left .hanhwa-report-result__detail-box{
  margin-left: 0;
}
.hanhwa-report-result__detail-title{
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #868b92;
  line-height: 1.8rem;
  letter-spacing: -0.041rem;
}
.hanhwa-report-result__detail-desc{
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #484E56;
  line-height: 2.1rem;
  letter-spacing: -0.041rem;
}
.hanhwa-report-result__detail::before{
  content: '';
  display: inline-block;
  width: 1px;
  height: 41px;
  background: #e3e5e7;
  vertical-align: middle;
}
.hanhwa-report-result__detail:nth-of-type(1):before{
  display: none;
}
.custom-card.hanhwa-gene:last-of-type{
  margin-bottom: 0;
}
.custom-card__value .status.fc-gray {
  color: #686d73;
}
.custom-card__value .status.fc-red {
  color: #ff5252;
}
.custom-card__value .status.fc-green {
  color: #0fab83;
}
.custom-card__value .tar {
  text-align: right;
}
.custom-card__more.h22 {
  height: 22px;
}
.custom-card-wrapper.hanhwa-gene{
  padding: 16px 10px 16px 20px;
  border: 1px solid #ddd;
}
.custom-card-wrapper.hanhwa-gene.no-arrow-box{
  padding: 16px 20px;
}
.custom-card-wrapper.hanhwa-gene .custom-card__icon img{
  height: 45px;
}
.custom-card__icon img.gene-my-1 {
  content: url('../images/icon-gene-my-1@2x.png');
}
.custom-card__icon img.gene-my-2 {
  content: url('../images/icon-gene-my-2@2x.png');
}
.custom-card__icon img.gene-my-3 {
  content: url('../images/icon-gene-my-3@2x.png');
}
.custom-card__icon img.gene-my-4 {
  content: url('../images/icon-gene-my-4@2x.png');
}
.custom-card__icon img.gene-my-5 {
  content: url('../images/icon-gene-my-5@2x.png');
}
.custom-card__icon img.gene-my-6 {
  content: url('../images/icon-gene-my-6@2x.png');
}
.custom-card__icon img.gene-my-7 {
  content: url('../images/icon-gene-my-7@2x.png');
}

.custom-card__icon img.gene-my-8 {
  content: url('../images/icon-gene-my-8@2x.png');
}
.custom-card__icon img.gene-my-9 {
  content: url('../images/icon-gene-my-9@2x.png');
}
.custom-card__icon img.gene-my-10 {
  content: url('../images/icon-gene-my-10@2x.png');
}
.custom-card__icon img.gene-my-11 {
  content: url('../images/icon-gene-my-11@2x.png');
}
.custom-card__icon img.gene-my-12 {
  content: url('../images/icon-gene-my-12@2x.png');
}
.custom-card__icon img.gene-my-13 {
  content: url('../images/icon-gene-my-13@2x.png');
}
.custom-card__icon img.gene-my-14 {
  content: url('../images/icon-gene-my-14@2x.png');
}

.custom-card__icon img.gene-my-15 {
  content: url('../images/icon-gene-my-15@2x.png');
}
.custom-card__icon img.gene-my-16 {
  content: url('../images/icon-gene-my-16@2x.png');
}
.custom-card__icon img.gene-my-17 {
  content: url('../images/icon-gene-my-17@2x.png');
}
.custom-card__icon img.gene-my-18 {
  content: url('../images/icon-gene-my-18@2x.png');
}
.custom-card__icon img.gene-my-19 {
  content: url('../images/icon-gene-my-19@2x.png');
}
.custom-card__icon img.gene-my-20 {
  content: url('../images/icon-gene-my-20@2x.png');
}
.custom-card__icon img.gene-my-21 {
  content: url('../images/icon-gene-my-21@2x.png');
}

.custom-card__title.v2 {
}
.custom-card__title.v2 .title {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.custom-card__title.v2 .status {
  font-size: 1.4rem;
  line-height: 22px;
  padding-left: 16px;
  position: relative;
}
.custom-card__title.v2 .status::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 5px;
  border-radius: 50%;
  background: #686D73;
  position: absolute;
  top: 6px;
  left: 0;
}
.custom-card__title.v2 .status.fc-gray {
  color: #686D73;
}
.custom-card__title.v2 .status.fc-gray::before {
  background: #686D73;
}
.custom-card__title.v2 .status.fc-red {
  color: #FF5252;
}
.custom-card__title.v2 .status.fc-red::before {
  background: #FF5252;
}
.custom-card__title.v2 .status.fc-green {
  color: #0FAB83;
}
.custom-card__title.v2 .status.fc-green::before {
  background: #0FAB83;
}
.custom-card__title.v2 span.sort + span.name {
  display: inline-block;
  margin-bottom: 0;
  margin-left: 4px;
}

.custom-card__title span.sort{
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #484e56;
  line-height: 2.5rem;
}
.custom-card__title span.sort.bg-gray {
  display: inline-block;
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #686D73;
  line-height: 21px;
  height: 21px;
  background: #F1F3F5;
  border-radius: 4px;
  padding: 0 6.5px;
} 
.custom-card__value .status {
  white-space: nowrap;
}

.tabbar-scroll {
  border-bottom: 1px solid #D5DAE3;
  height: 45px;
  background: #fff;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
  -webkit-text-size-adjust: none;
}
.tabbar-scroll::-webkit-scrollbar {
  display: none;
}
.tabbar-scroll .tabbar-nav {
  display: table;
  height: 45px;
  padding: 0 20px;
  vertical-align: top;
  box-sizing: border-box;
  margin: 0 auto;
}
.tabbar-scroll .tabbar-nav__menu {
  display: table-cell;
  vertical-align: middle;
  border-bottom: none;
}
.tabbar-scroll .tabbar-nav::-webkit-scrollbar {
  display: none;
}
.tabbar-scroll .tabbar-nav__menu span {
  padding: 0 10px;
  color: #868b92;
  white-space: nowrap;
}
.tabbar-scroll .tabbar-nav__menu.selected {
  border-bottom: 2px solid #141414;
}
.tabbar-scroll .tabbar-nav__menu.selected span {
  color: #141414;
}

.hanhwa-gene-result-page-wrapper {
  padding-bottom: 40px;
}
.hanhwa-gene-result-list-container {
  padding: 0 20px;
  margin-top: 32px;
}
.hanhwa-gene-result-list {
  display: none;
  width: 100%;
}
.hanhwa-gene-result-list.selected {
  display: block;
}
.hanhwa-gene-result-list li {
  width:100%;
  height: auto;
  min-height: 51px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e3e5e7;
}
.hanhwa-gene-result-list li > span {
  display: block;
}
.hanhwa-gene-result-list li .tit {
  width: 60%;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 2.4rem;
  word-break: break-word;
}
.hanhwa-gene-result-list li .status {
  font-size: 1.4rem;
  font-family: "Pretendard-SemiBold";
  color: #686d73;
  background-color: #f8f8f8;
  line-height: 2.9rem;  
  padding: 0 8px;
  border-radius: 0.4rem;
  letter-spacing: -0.041rem;
}
.hanhwa-gene-result-list li .status > span {
  white-space: nowrap;
}
.hanhwa-gene-result-list li .status.caution {
  background-color: rgba(255, 82, 82, 0.16);
  color: #ff5252;
}
.hanhwa-gene-result-list li .status.normal {
  background-color: rgba(15, 171, 131, 0.16);
  color: #0fab83;
}
.hanhwa-gene-result-list li > em {
  display: block;
  font-style: normal;
}
.hanhwa-gene-result-list li .status.hnl > span {
  /* padding-left: 16.5px; */
  position: relative;
  font-style: normal;
  vertical-align: middle;
}
.hanhwa-gene-result-list li .status.hnl > span::before {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
/* .hanhwa-gene-result-list li .status.high > span::before {
  background: url('../images/ico-red-high@2x.png') no-repeat;
  background-size: contain;
}
.hanhwa-gene-result-list li .status.low > span::before {
  background: url('../images/ico-blue-low@2x.png') no-repeat;
  background-size: contain;
} */
.hanhwa-gene-result-notice-list-container {
  padding: 0 20px;
  margin-top: 24px;
}
.hanhwa-gene-result-notice-list li {
  padding-left: 11px;
  position: relative;
}
.hanhwa-gene-result-notice-list li + li {
  margin-top: 8px;
}
.hanhwa-gene-result-notice-list li::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 3px;
  background-color: #484e56;
  border-radius: 3px;
  position: absolute;
  top: 9px;
  left: 0;
}
.hanhwa-gene-result-notice-list li span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #57616B;
  line-height: 2.1rem;
}
.hanhwa-gene-result-notice-list li.bold span {
  font-family: "Pretendard-Bold";
}
.contents-hanhwa-report .gene-detail-contents {
  margin-bottom: 0;
}
.contents-hanhwa-report .gene-detail-contents-container {
  margin-left: 0;
  margin-right: 0;
}

.hanwha-gray-btn {
  border-radius: 5px;
  border: 1px solid #D6DBE0;
  padding: 11.5px 16px;
}

.hanwha-gray-btn > span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #2E3338;

}

.hanwha-light-orange-btn {
  border-radius: 5px;
  padding: 11.5px 16px;
  background: rgba(255, 102, 0, 0.1);
}

.hanwha-light-orange-btn > span {
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #FF6600;
}

.hanwha-contents-signup-confirm {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0%;
  left: 0%;
}

.hanwha-contents-signup-confirm-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.hanwha-contents-signup-confirm__img {
  width: 100%;
} 
.hanwha-contents-signup-confirm__img img {
  width: 100%;
}
/* .hanwha-contents-signup-confirm__img.id-txtimg img {
  content: url('../images/img_genetic_testing_txt@2x.png');
} */
.hanwha-contents-signup-confirm__img.id-verify {
  margin-bottom: 72px;
}
.hanwha-contents-signup-confirm__img.id-verify img {
  content: url('../images/img_genetic_testing_fix@2x.png');
}

.hanwha-select-result-container.gene-detail .hanwha-select-confirm-category span {
  font-size: 1.6rem;
}
.hanwha-select-result-container.gene-detail .hanwha-select-confirm-label span {
  font-size: 1.4rem;
}
.hanwha-select-result-container.gene-detail .hanwha-select-confirm-value span {
  font-size: 1.4rem;
  line-height: 23px;
}
.hanwha-select-result-container.gene-detail .hanwha-select-confirm-value span.underline {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hanwha-select-result-container.gene-detail .hanwha-select-confirm-category {
  margin-bottom: 12px;
}
.hanwha-select-result-container.gene-detail .hanwha-select-confirm-wrapper {
  margin-bottom: 12px;
}
.hanwha-select-confirm-wrapper.block {
  display: block;
}
.hanwha-select-confirm-value.block {
  display: block;
  text-align: left;
  background-color: #F8F9FA;
  border-radius: 8px;
  width: 100%;
  padding: 12px;
  box-sizing: border-box;
}
.hanwha-select-confirm-value.block strong {
  font-size: 1.2rem;
  line-height: 1.7rem;
  color: #2E3338;
}
.hanwha-select-confirm-value.block .hanwha-select-confirm-check-list li {
  position: relative;
  padding-left: 17px;
  margin-top: 4px;
}
.hanwha-select-confirm-value.block .hanwha-select-confirm-check-list li::before {
  content: '';
  display: inline-block;
  width: 1.7rem;
  height: 1.7rem;
  position: absolute;
  top: 3px;
  left: 0;
  background: url('../images/ico-orange-check@2x.png') no-repeat center / 1rem 1rem;
}

.hanwha-sign-container {
  display: flex;
  border: 1px solid #D6DBE0;
}

.hanwha-sign-container .hanwha-sign-box {
  width: 33.33%;
  text-align: center;
}

.hanwha-sign-box .sign-tit {
  /* height: 33px; */
  background-color: #F8F9FA;
  border-left: 1px solid #D6DBE0;
  box-sizing: border-box;
  padding: 8px 8px;
}

.hanwha-sign-box:first-child .sign-tit {
  border-left: none;
}

.hanwha-sign-box .sign-tit span {
  font-size: 1.2rem;
  line-height: 17px;
  word-break: break-word;
}

.hanwha-sign-box .sign-cont {
  height: 97px;
  padding: 8px 4px;
  box-sizing: border-box;
  background-color: #fff;
  border-top: 1px solid #D6DBE0;
  border-left: 1px solid #D6DBE0;
  text-align: center;
}

.hanwha-sign-box:first-child .sign-cont {
  border-left: none;
}

.hanwha-sign-box .sign-cont .sign-cont__name {
  display: block;
  font-size: 1.2rem;
  line-height: 17px;
}

.hanwha-sign-box .sign-cont .sign-cont__img {
  display: inline-block;
  width: 96px;
  height: 60px;
  margin-top: 4px;
}

.hanwha-sign-box .sign-cont .sign-cont__img img {
  width: 100%;
}

.hanwha-sign-box .sign-cont .sign-cont__img img.sign-1 {
  content: url('../images/hanwha-sign-1@2x.png');
}

.hanwha-sign-box .sign-cont .sign-cont__img img.sign-2 {
  content: url('../images/hanwha-sign-2@2x.png');
}

.hanwha-sign-box .sign-cont .sign-cont__img img.sign-3 {
  content: url('../images/hanwha-sign-3@2x.png');
}

.hanwha-agree-contents img.img-responsibility {
  content: url('../images/img-responsibility@2x.png');
}

.hanwha-agree-contents img.img-qc-result {
  content: url('../images/img-qc-result@2x.png');
}
.hanwha-agree-contents.footer strong, 
.hanwha-agree-contents.footer span {
  font-size: 1.2rem;
  line-height: 1.7rem;
  color: #57616B;
}
.hanwha-agree-contents.footer strong {
  margin-top: 4px;
}

.hanwha-error-contents {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0%;
  left: 0%;
}
.hanwha-error-contents-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  top: 46px;
  left: 50%;
  transform: translateX(-50%);
  text-align: left;
}
.hanwha-error-bottom-contents-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  text-align: left;
}
.hanwha-error-bottom-contents {
  padding: 28px 20px 40px;
}
.hanwha-error-bottom__notice span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 21px;
  display: block;
  padding-left: 22px;
  position: relative;
}
.hanwha-error-bottom__notice span::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url('../images/ico-information-grey@2x.png') no-repeat center/contain;
  position: absolute;
  left: 0;
  top: 1.5px;
}
.hanwha-error-bottom__graybox {
  padding: 12px 12px;
  background: #F8F8F8;
  border-radius: 8px;
}
.hanwha-error-bottom__graybox p {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #686D73;
  line-height: 21px;
  text-align: center;
}
.hanwha-error-bottom__graybox p .fc-black {
  display: inline-block;
  font-size: 1.6rem;
  color: #141414;
  line-height: 24px;
  margin-top: 2px;
}
.hanwha-error-bottom__graybox p .fc-black strong {
  font-family: "Pretendard-Bold";
}
.hanwha-error-bottom-contents .dot-list > li {
  padding-left: 14px;
  position: relative;
}
.hanwha-error-bottom-contents .dot-list > li + li {
  margin-top: 4px;
}
.hanwha-error-bottom-contents .dot-list > li::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 3px;  
  border-radius: 50%;
  background: #484E56;
  position: absolute;
  top: 8px;
  left: 4px;
}
.hanwha-error-bottom-contents span.normal {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 18px;
}
.hanwha-error-contents-icon {
  padding: 0 20px;
  margin-top: 32px;
}
.hanwha-error-contents-icon .ico-warning {
  display: inline-block;
  width: 36px;
  height: 36px;
  background: url('../images/ico-warning@2x.png') no-repeat center / contain;
}
.hanwha-error-contents-text {
    padding: 0 20px 25px 20px;
    margin-top: 16px;
    /* border-bottom: 1px solid #F3F3F3; */
}
.hanwha-error-contents-text span.title {
  display: block;
  font-size: 2rem;
  font-family: "Pretendard-Medium";
  color: #141414;
}
.hanwha-error-contents-text span.subtitle {
  display: block;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484e56;
  line-height: 24px;
}
.contents-signup-confirm-text span.subtitle strong{
    font-family: "Pretendard-Bold";
}
.hanwha-error-contents__img {
  margin-bottom: 72px;
  width: 100%;
}
.hanwha-error-contents__img img {
    width: 100%;
}
.hanwha-error-contents-img-cont {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
.hanwha-error-contents-img-cont.h36 {
  height: 36vh;
}
.hanwha-error-contents-img-cont.h30 {
  height: 30vh;
}
.hanwha-error-contents__img.img-error,
.hanwha-error-contents__img.img-fail {
  margin-bottom: 0;
  text-align: center;
}
.hanwha-error-contents__img.img-error img {
  content: url('../images/ico-error@2x.png');
  width: 36%;
  display: inline-block;
}
.hanwha-error-contents__img.img-fail img {
  content: url('../images/ico-fail@2x.png');
  width: 36%;
  display: inline-block;
}
.hanwha-division-button-container {
  margin: 0 24px;
  display: flex;
  align-items: center;
  border: 1px solid #D6DBE0;
  box-sizing: border-box;
  border-radius: 8px;
}

.hanwha-division-gray-btn {
  width: 50%;
  height: 40px;
  font-family: "Pretendard-Medium";
  font-size: 1.4rem;
  line-height: 40px;
  padding: 0 16px;
  color: #2E3338;
  box-sizing: border-box;
  position: relative;
}

.hanwha-division-gray-btn::before {
  content: '';
  width: 1px;
  height: 14px;
  background: #D6DBE0;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.hanwha-division-gray-btn:first-child:before {
  display: none;
}

.hanwha-gene-disease-contents-container {
  margin: 0 20px;
}

.hanwha-gene-disease-title-container {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.hanwha-gene-disease-title-container.bd-gray {
  border: 1px solid #E3E5E7;
  border-radius: 16px;
  padding: 20px 20px;
}

.hanwha-gene-disease-title-container .page-title.fs-16 {
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  line-height: 24px;
  color: #141414;
}
.hanwha-gene-disease-title-container .page-title.fs-20 {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  line-height: 30px;
  color: #141414;
}

.hanwha-gene-disease-title-container span.title {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #141414;
  line-height: 30px;
  word-break: keep-all;
}
.hanwha-gene-disease-title-container span.title.bold {
  font-family: "Pretendard-Bold";
}
.hanwha-gene-disease-title-container span.title a.status,
.hanwha-gene-disease-title-container span.title a.group{
  font-size: 2rem;
  font-family: "Pretendard-Bold";
}
/* .hanwha-gene-disease-title-container span.title a.low{
  color: #FF6600;
}
.hanwha-gene-disease-title-container span.title a.normal{
  color: #FF6600;
}
.hanwha-gene-disease-title-container span.title a.high{
  color: #FF6600;
} */

.hanwha-gene-disease-title-container span.cont-title {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
}

.hanwha-gene-disease-title-container span.sub-title {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
}
.horizontal-divider {
  width: 100%;
  height: 1px;
  background: #E3E5E7;
}

.hanwha-gene-disease-contents-risk-container {
  margin: 0px 20px 24px;
}

.hanwha-gene-risk-graph-container {
  width: 100%;
}
.hanwha-gene-risk-graph-container.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}
.hanwha-gene-risk-graph-container.flex .graph-legend {
  margin-left: 20px;
}
.graph-legend ul li p {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
}
.hanwha-gene-risk-graph {
  height: 160px;
}

.hanwha-gene-disease-explain-container {
  display: flex;
  background: #FFF4E8;
  padding: 12px 12px;
  border-radius: 8px;
}
.hanwha-gene-disease-explain-container > p {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
}
.hanwha-gene-disease-explain-container > p strong {
  font-family: "Pretendard-Bold";
}
.hanwha-gene-disease-explain-container .fs-18 {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  line-height: 27px;
  color: #484E56;
}

.hanwha-gene-disease-marker-col-list li {
  display: flex;
  align-items: center;
  width: 100%;
  border-top: 1px solid #F1F3F5;
  box-sizing: border-box;
}
.hanwha-gene-disease-marker-col-list li span {
  display: block;
  width: 50%;
  text-align: center;
}
.hanwha-gene-disease-marker-col-list li.title {
  height: 33px;
  line-height: 33px;
  background: #F8F9FA;
}
.hanwha-gene-disease-marker-col-list li.title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  line-height: 17px;
  color: #2E3338;
  padding: 4px 8px;
  box-sizing: border-box;
}
.hanwha-gene-disease-marker-col-list li.detail {
  height: 33px;
  line-height: 33px;
}
.hanwha-gene-disease-marker-col-list li.detail span:first-of-type {
  font-family: "Pretendard-Bold";
}

.hanwha-gene-disease-marker-col-list li.detail.active {
  border: 2px solid #FF6600;
}
.hanwha-gene-disease-marker-col-list li.detail.active span {
  font-family: "Pretendard-Bold";
  color: #FF6600;
}

.hanwha-gene-disease-marker-col-list li span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
}

.hanwha-gene-disease-marker-row {
  display: flex;
  align-items: center;
  width: 100%;
  height: 25px;
  line-height: 25px;
  background: #F8F9FA;
  border-top: 1px solid #F1F3F5;
}
.hanwha-gene-disease-marker-row span.tit {
  display: block;
  width: 72px;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  line-height: 17px;
  color: #2E3338;
  padding: 4px 8px;
  box-sizing: border-box;
}
.hanwha-gene-disease-marker-row span.detail {
  display: block;
  width: calc(100% - 72px);
  padding: 4px 4px;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 17px;
  color: #57616B;
  box-sizing: border-box;
}

.hanwha-gene-info-swiper-pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
.hanwha-gene-info-swiper-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: #D5DAE2;
  opacity: 1;
  margin: 0px 5px 0px 0px !important;
}
.hanwha-gene-info-swiper-pagination .swiper-pagination-bullet-active {
  width: 20px;
  height: 7px;
  border-radius: 3.5px;
  background-color: #FF6600;
  margin: 0px 5px 0px 0px !important;
}
.hanwha-all-agree-box {
  display: flex;
  align-items: center;
}
.hanwha-agree-subtitle.h26 span {
  display: inline-block;
  line-height: 26px;
}
.hanwha-agree-subtitle span.hanwha-agree-subtitle-annotation {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  line-height: 26px;
  color: #686D73;
  margin-left: 4px;
}
.hanwha-agree-subtitle span.cont-title {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #141414;
}
.hanwha-agree-contents .dot-list li strong.tit {
  display: block;
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  line-height: 21px;
  color: #484E56;
}

.hanwha-agree-contents .num-list > li {
  padding-left: 14px;
  position: relative;
}
.hanwha-agree-contents .num-list > li .num {
  display: inline-block;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
  position: absolute;
  top: 0;
  left: 0;
}

.hanwha-course-gray-btn {
  display: inline-block;
  padding: 0 16px;
  margin-top: 16px;
  border: 1px solid #D6DBE0;
  box-sizing: border-box;
  border-radius: 6px;
}
.hanwha-course-gray-btn span {
  font-family: "Pretendard-Medium";
  font-size: 1.4rem;
  line-height: 36px;
  color: #2E3338;
}

.hanwha-course-description-title span.hanwha-course-description-subtitle {
  display: block;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 21px;
  color: #484E56;
}
.hanwha-course-tracking-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hanwha-course-tracking span {
  display: block;
}
.hanwha-course-description-title span.hanwha-course-tracking__title {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  line-height: 13px;
  color: #57616B;
}
.hanwha-course-description-title span.hanwha-course-tracking__number {
  display: inline-block;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  line-height: 21px;
  color: #2E3338;
}

.hanwha-course-tracking-number-area {
  display: flex;
  align-items: center;
}
.hanwha-course-tracking-number-area  span.hanwha-course-tracking__number {
  display: inline-block;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  line-height: 21px;
  color: #2E3338;
}

.hanwha-btn-copy {
  height: 20px;
}
.hanwha-btn-copy .ic-copy-h20 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url('../images/ic-copy@3x.png') no-repeat center/contain;
}

.hanhwa-agree-docs-view-btn {
  display: inline-block;
  padding: 0 18px 0 8px;
  border: 1px solid #E3E5E7;
  border-radius: 4px;
  position: relative;
}
.hanhwa-agree-docs-view-btn span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  line-height: 24px;
  color: #484E56;
}
.hanhwa-agree-docs-view-btn::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url('../images/ico-arrow-right-h16@2x.png') no-repeat center/contain;
  position: absolute;
  top: 3px;
  right: 0;
}

/* hanwha button */
.hanwha-button-container {
    display: flex;
    padding: 0px 24px 32px;
}
.hanwha-button-container.v2 {
    padding: 0 0 12px;
}
.hanwah-bottom-sheet-btn-container {
    display: flex;
    padding: 0px 20px 32px;
}
.hanwha-button-container button {
    flex-basis: 50%;
}
.hanwha-button-container.one button {
  flex-basis: 100%;
}
button.hanwha-prev-btn {
    border-radius: 5px;
    border: 1px solid #FF6600;
    padding: 18px 16px;
}
button.hanwha-prev-btn span{
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #FF6600;
}
button.hanwha-next-btn {
    border-radius: 5px;
    border: 1px solid #FF6600;
    background-color: #FF6600;
    padding: 18px 16px;
}
button.hanwha-next-btn span{
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
}
button.hanwha-next-btn.disabled {
    border: 1px solid #E3E5E7;
    background-color: #E3E5E7;
}
button.hanwha-next-btn.disabled span {
    color: #AEB3B9;
}
button.hanwha-edit-btn {
    border-radius: 6px;
    border: 1px solid #D6DBE0;
    padding: 9px 16px;
}
button.hanwha-edit-btn span{
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #2E3338;
}
button.hanwha-datepicker-close-btn {
    background-color: #F3F3F3;
    border-radius: 8px;
    padding: 12px 16px;
    flex: 1;
}
button.hanwha-datepicker-close-btn span{
    font-size: 1.4rem;
    font-family: "Pretendard-Medium";
    color: #686D73;
}
button.hanwha-confirm-ok-btn {
    background-color: #FF6600;
    border-radius: 6px;
    padding: 18px 16px;
    flex: 1;
}
button.hanwha-confirm-ok-btn span{
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #ffffff;
}
button.hanwha-confirm-ok-btn[disabled] {
  background-color: #E3E5E7;
}
button.hanwha-confirm-ok-btn[disabled] span{
  color: #AEB3B9;
}

.hanwha-button--text {
  width: 100%;
  min-height: 50px;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #b0b0b0;
}
.hanwha-button--text.active {
  background-color: #FF6600;
}
.hanwha-button--text.active span {
  font-size: 1.8rem;
  font-family: "Pretendard-SemiBold";
  font-weight: 600;
  color: #ffffff;
  line-height: 2.4rem;
}
.hanwha-button--text.basic {
  background-color: #fff;
  border: 1px solid #ff6600;
}
.hanwha-button--text.basic span {
  font-size: 1.8rem;
  font-family: "Pretendard-SemiBold";
  font-weight: 600;
  color: #ff6600;
  line-height: 2.4rem;
}
.footer__signup .button + .button {
  margin-top: 12px;
}

.contents.hanwha-center {
  height: calc(100% - 106px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: none;
}
.hanwha-contents-certification {
  padding: 0 20px;
  text-align: center;
}
.hanwha-contents-certification_img img {
  width: 100%;
}
.hanwha-contents-certification_img.id-txtimg img {
  content: url('../images/img_genetic_testing_txt@3x.png');
}
.hanwha-contents-certification-border-container {
  display: inline-block;
  border: 1px solid #D6DBE0;
  border-radius: 6px;
  padding: 0 12px;
}
.hanwha-contents-certification-border-container span {
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #686D73;
  line-height: 32px;
}
.hanwha-contents-certification-border-container.orange {
  display: block;
  border: 1px solid rgba(255, 102, 0, 0.4);
  border-radius: 16px;
  padding: 24px 20px;
}
.hanwha-contents-certification_detail span{
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #89948F;
  line-height: 18px;
}
.hanwha-contents-certification-border-box {
  display: flex;
  align-items: center;
}
.hanwha-contents-certification-border-box .ic-hospital img {
  height: 40px;
  content: url('../images/ic-hospital@3x.png');
}
.hanwha-contents-certification-border-box .ic-home img {
  height: 40px;
  content: url('../images/ic-home@3x.png');
}
.hanwha-contents-certification-border-box__detail {
  display: block;
  text-align: left;
  margin-left: 16px;
}
.hanwha-contents-certification-border-box__detail .tit {
  display: block;
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #2E3338;
  line-height: 26px;
}
.hanwha-contents-certification-border-box__detail .contents {
  display: block;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #57616B;
  line-height: 22px;
}
.hanwha-contents-certification-border-box__detail .contents em {
  display: inline-block;
  font-style: normal;
  font-family: "Pretendard-Bold";
}
.hanwha-contents-certification-border-box__detail .tag {
  display: inline-block;
  background-color: #F1F3F5;
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #89949F;
  line-height: 21px;
  padding: 0 4px;
  border-radius: 2px;
}
.divide-horizontal-line-gray-20.dark-gray {
  background-color: #D6DBE0;
  margin: 20px 0 !important;
}
/* 유전자 검사 취소 버튼 */
.hanwha-bottom-button-wrapper {
  display: none;
}
.hanwha-bottom-button-container {
  display: flex;
  padding: 32px 24px;
}
.hanwha-bottom-button-container.v2 {
  padding: 0 0 12px;
}
.hanwha-bottom-button-container button {
  flex-basis: 50%;
  justify-content: center;
}
.hanwha-bottom-button-container.one button {
  flex-basis: 100%;
}
button.hanwha-close-btn {
  border-radius: 5px;
  border: 1px solid #FF6600;
  padding: 18px 16px;
}
button.hanwha-close-btn span{
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #FF6600;
}
button.hanwha-confirm-btn {
  border-radius: 5px;
  border: 1px solid #FF6600;
  background-color: #FF6600;
  padding: 18px 16px;
}
button.hanwha-confirm-btn span{
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #ffffff;
}
button.hanwha-confirm-btn.disabled {
  border: 1px solid #E3E5E7;
  background-color: #E3E5E7;
}
button.hanwha-confirm-btn.disabled span {
  color: #AEB3B9;
}

/* 360px 미만일때*/
@media (max-width: 359px) {
  .contents-home .banner-type-a__text {
    min-width: 0px;
  }

  .hanwha-division-gray-btn {
    height: auto;
    line-height: 17px;
    padding: 11.5px 16px;
  }

  .hanwha-select-card {
    padding: 16px;
  }
  
  .hanwha-select-card-hashtag {
    margin-top: 4px;
  }

  .hanwha-division-gray-btn {
    word-break: keep-all;
  }

  .custom-card__title span.name {
    word-break: keep-all;
  }

  .hanhwa-report-result__title-name span {
    word-break: keep-all;
  }
  
  .hanhwa-report-result__subtitle {
    max-width: 70%;
    height: auto;
    box-sizing: border-box;
    word-break: keep-all;
  }

  .hanhwa-gene-result-list li .status {
    margin-left: 8px;
  }

  .hanwha-gray-btn > span {
    word-break: keep-all;
  }

  .hanwha-agree-contents span.normal {
    word-break: break-word;
  }

  .hanwha-select-result-container.gene-detail .hanwha-select-confirm-value span {
    word-break: break-word;
  }

  .hanwha-sign-box .sign-cont {
    height: auto;
  }

  .hanwha-sign-box .sign-cont .sign-cont__img {
    width: 100%;
    height: auto;
  }

  .hanwha-sign-box .sign-tit {
    padding: 4px 8px;
  }
  
  .hanwha-gene-risk-graph {
    height: 100px;
  }

  .hanwha-gene-disease-marker-col-list li.detail {
    height: auto;
    padding: 4px 4px;
  }
  .hanwha-gene-disease-marker-col-list li span {
    word-break: break-word;
  }

  .gene-snp-accordian__title__text.mini .left {
    width: 26%;
  }

  .gene-snp-accordian__pannel__conts span:first-of-type {
    width: 52px;
  }
}

/* 320px 미만일때*/
@media (max-width: 319px) {
  .hanwha-course-description-title br.mo-sm {
    display: none;
  }
}

/*hanwha datepicker*/
.hanwha-datepicker {
    padding: 24px 16px 20px;
}
.hanwha-datepicker .datepicker-header {
    border-bottom: 1px solid #E3E5E7;
    padding-bottom: 20px;
}
.hanwha-datepicker .datepicker-main {
    padding: 20px 0px 0px 0px;
}
.hanwha-datepicker .datepicker-picker {
    width: 100%;
}
.hanwha-datepicker .datepicker-header .datepicker-controls {
    display: flex;
    align-items: center;
    padding: 0px;
}
.hanwha-datepicker .datepicker-header .datepicker-controls .button:hover {
    background-color: #ffffff;
}
.hanwha-datepicker .datepicker-controls .button.prev-btn,
.hanwha-datepicker .datepicker-controls .button.next-btn {
    background-color: #F3F3F3;
    border-radius: 8px;
    padding: 4px;
}
.hanwha-datepicker .datepicker-controls .button.prev-btn {
    width: 32px;
    height: 32px;
    content: url(../images/ic-left-arrow@2x.png);
}
.hanwha-datepicker .datepicker-controls .button.next-btn {
    width: 32px;
    height: 32px;
    content: url(../images/ic-right-arrow@2x.png);
}
.hanwha-datepicker .datepicker-controls .button.view-switch {
    font-size: 2rem;
    font-family: "Pretendard-Bold";
    color: #2E3338;
}
.hanwha-datepicker .datepicker-view .days-of-week {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin-bottom: 16px;
}
.hanwha-datepicker .days-of-week span.dow {
    font-size: 1.4rem;
    font-family: "Pretendard-Regular";
    color: #868B92;
}
.hanwha-datepicker .datepicker-view .days {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.hanwha-datepicker .datepicker-grid {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0px;
    justify-content: center;
    align-items: center;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell {
    font-size: 1.6rem;
    font-family: "Pretendard-Medium";
    color: #484E56;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 36px;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell.today {
    background-color: #ffffff;
    color: #484e56;
    position: relative;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell.today div.today-highlight{
    border-radius: 50%;
    border: 1px solid #FF6600;
    color: #484e56;
    position: absolute;
    width: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1 / 1;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell.default {
  background-color: #ffffff;
  color: #484e56;
  position: relative;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell div.default-highlight{
  border-radius: 50%;
  border: 1px solid #FF6600;
  color: #484e56;
  position: absolute;
  width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1 / 1;
}
.hanwha-datepicker .datepicker-grid span.datepicker-cell.next,
.hanwha-datepicker .datepicker-grid span.datepicker-cell.prev {
    color: #D5DAE2;
    pointer-events: none;
}
.hanwha-datepicker .datepicker-grid .datepicker-cell.selected {
    background-color: #ffffff;
}
.hanwha-datepicker .datepicker-grid .datepicker-cell.day.selected {
    position: relative;
    color: #FF660000;
    background-color: #ffffff;
}
.hanwha-datepicker .datepicker-grid .datepicker-cell.focused {
    background-color: #ffffff;
}
.hanwha-datepicker .datepicker-grid .datepicker-cell.selected div.selected-highlight,
.hanwha-datepicker .datepicker-grid .datepicker-cell.selected div.selected-highlight:hover {
    position: absolute;
    border-radius: 50%;
    border: 1px solid #FF6600;
    background-color: #FF6600;
    width: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    aspect-ratio: 1 / 1;
}
.hanwha-datepicker .datepicker-grid .datepicker-cell.empty {
  pointer-events: none;
}

/* 히포 월렛 랜딩페이지 */
.contents-hippo-wallet-container {
  padding: 0 20px;
  text-align: center;
}
.contents-hippo-wallet-intro-img-area {
  display: inline-block;
  width: 68.5%;
}
.contents-hippo-wallet-intro-img-area img {
  width: 100%;
}
.contents-hippo-wallet-intro-txt-area {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #000;
  line-height: 36px;
  letter-spacing: -0.5px;
}
.contents-hippo-wallet-content {
  text-align: center;
  margin-top: 72px;
}
.contents-hippo-wallet-content-title-area {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  color: #0CAAB8;
  line-height: 30px;
  letter-spacing: -0.5px;
}
.contents-hippo-wallet-content-img-area {
  display: inline-block;
  width: 40.5%;
}
.contents-hippo-wallet-content-img-area.hippo {
  width: 27.5%;
}
.contents-hippo-wallet-content-img-area img {
  width: 100%;
}
.contents-hippo-wallet-content-txt-area p {
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 18px;
  letter-spacing: -0.5px;
}
.contents-hippo-wallet-content-txt-area strong {
  display: inline-block;
  font-size: 1.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 21px;
  letter-spacing: -0.5px;
}
.hippo-number-list {
  display: inline-block;
}
.hippo-number-list li {
  width: 220px;
  display: flex;
  align-items: center;
}
.hippo-number-list li .num {
  width: 24px;
  font-size: 2.8rem;
  font-family: "Pretendard-Medium";
  color: #0CAAB8;
  line-height: 42px;
  letter-spacing: -0.5px;
}
.hippo-number-list li .txt {
  width: calc(100% - 36px);
  font-size: 1.2rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  line-height: 18px;
  letter-spacing: -0.5px;
  text-align: left;
  margin-left: 12px;
  padding: 3px 0;
}
.gray-box {
  display: inline-block;
  width: calc(100% - 40px);
  background: #f8f8f8;
  border-radius: 16px;
}
.normal-checkbox-list {
  padding: 16px 16px;
}
.normal-checkbox__options {
  display: flex;
  justify-content: space-between;
}
.normal-checkbox__options + .normal-checkbox__options {
  margin-top: 12px;
} 
.normal-checkbox__options div input[type=checkbox] {
  display: none;
}
.normal-checkbox__options div input[type=checkbox] + label {
  display: block;
  height: 24px;
  padding-left: 31px;
  word-break: keep-all;
}
.normal-checkbox__options div input[type=checkbox]:checked + label {
  background: url("../images/check_on@2x.png") no-repeat 0 0px/contain;
}
.normal-checkbox__options div label {
  font-size: 1.6rem;
  line-height: 24px;
  color: #868B92;
}
.normal-checkbox_agree-wrapper {
  display: flex;
}
.normal-checkbox-wrapper img {
  height: 24px;
  content: url("../images/check_off@2x.png");
}
.normal-checkbox-wrapper img.on {
  height: 24px;
  content: url("../images/check_on@2x.png");
}
.normal-checkbox_agree-wrapper p,
.normal-checkbox_agree-wrapper span {
  word-break: break-word;
  font-size: 14px;
  font-family: "Pretendard-Medium";
  line-height: 21px;
  letter-spacing: -0.5px;
  color: #141414;
  text-align: left;
}
.normal-checkbox_agree-wrapper .btn-underline-text {
  display: inline-block;
}
.normal-checkbox_agree-wrapper .fc-gray {
  color: #686D73;
}
.normal-checkbox_agree-wrapper .fc-green {
  display: inline-block;
  color: #0CAAB8;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.footer-normal {
  position: relative;
  width: calc(100% - 40px);
  background-color: #fff;
  padding: 24px 20px 40px;
}
.footer-tooltip {
  position: absolute;
  width: 168px;
  height: 33px;
  padding: 8px 12px;
  background: #5083F2;
  border-radius: 8px;
  box-sizing: border-box;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
}
.footer-tooltip span {
  font-size: 1.2rem;
  font-family: "Pretendard-Bold";
  color: #fff;
  line-height: 17px;
}
.footer-tooltip::before {
  position: absolute;
  display: inline-block;
  content: '';
  width: 0;
  height: 0;
  border-bottom: 6.5px solid #5083F2;
  border-top: 6.5px solid transparent;
  border-left: 6.5px solid transparent;
  border-right: 6.5px solid transparent;
  bottom: 33px;
  left: 50%;
  transform: translateX(-50%);
}

/* 히포 월렛 랜딩페이지 하단 모달 팝업 */
.bottom-sheet-container.hippo-wallet {
  display: none;
  z-index: 11;
  border-radius: 30px 30px 0 0;
  transform: translateY(100%);
  animation: slidein 0.5s forwards;
  position: sticky;
  bottom: 0;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container-wrapper {
  display: flex;
  width: 100%;
  background-color: white;
  border-radius: 20px 20px 0 0;
  flex-direction: column;
  background: linear-gradient(#eafff5, #ffffff);
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container-wrapper.maxHeight-200 {
  max-height: calc(100% - 200px);
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container-header {
  position: sticky;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container__bar {
  width: 100%;
  padding-top: 10px;
  display: flex;
  justify-content: center;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container__bar div {
  width: 55px;
  height: 4px;
  border-radius: 20px;
  background-color: #e9edf0;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-contents-area {
  padding: 24px 20px 16px;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-contents-area .text-area {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 36px;
  text-align: center;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-contents-area .text-area .fc-green {
  color: #0CAAB8;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-contents-area .img-area {
  text-align: center;
  margin-top: 32px;
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-contents-area .img-area img {
  display: inline-block;
  width: 169px;
  content: url("../images/img-hippo-wallet-horizontal@3x.png");
}
.bottom-sheet-container.hippo-wallet .bottom-sheet-container__button {
  margin: 16px 20px;
  position: sticky;
}
.button--text.button-agree-hippo.enabled {
  background-color: #0caab8;
}
.button--text.button-agree-hippo.disabled {
  background-color: #b0b0b0;
}
.button--text.button-agree-hippo.disabled span {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
  line-height: 2.4rem;
}
.normal-checkbox_agree-txt {
  text-align: left;
}
.normal-checkbox_agree-txt .label-txt {
  display: inline;
}
.normal-checkbox_agree-txt .view-more-txt {
  display: inline-block;
}
/* // 히포 월렛 랜딩페이지 */

/* 한화손보 진입화면 추가 */
.contents.hanwha-intro-center {
  height: calc(100% - 130px);
  display: flex;
  flex-direction: column;
  flex: none;
  overflow-x: hidden;
  overflow-y: scroll;
}
@media (min-width: 768px) {
  .contents.hanwha-intro-center {
    overflow-y: auto;
    -ms-overflow-style: none;
  }
  .contents.hanwha-intro-center::-webkit-scrollbar {
    display:none;
  }
}
.hanwha-contents-introduction-container.title {
  padding: 64px 20px 48px;
}
.hanwha-contents-introduction-container.center {
  text-align: center;
}
.hanwha-contents-introduction-container .hanwha-intro-title-detail {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #000;
  line-height: 2.4rem;
  padding: 0 20px;
}
.hanwha-contents-introduction-container span {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #000;
  line-height: 2.4rem;
}
.hanwha-contents-introduction-container .title-bold {
  display: inline-block;
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #000;
  line-height: 3.6rem;
  margin-top: 4px;
}

.hanwha-intro-tab-contents {
  display: none;
}
.hanwha-intro-tab-contents.active {
  display: block;
}
@media screen and (max-width: 375px) {
  .hanwha-intro-tab-contents {
    margin-bottom: 16px;
  }
}
.hanwha-intro-swiper-contatiner p {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #000;
  line-height: 2.4rem;
}
.hanwha-intro-swiper-contatiner strong {
  font-family: "Pretendard-Bold";
}
.swiper-checkup {
  padding: 12px 0;
  min-width: 360px;
}
.swiper-checkup .swiper-wrapper {
  max-width: 832px;
}
.swiper-checkup .swiper-slide {
  flex-shrink: initial;
}
.card-list-cont .card-box {
  width: 112px;
  height: 112px;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  text-align: center;
  padding: 18px 8px;
  box-sizing: border-box;
}

.card-list-grid-wrapper {
  width: 100%;
}
.card-list-cont.grid {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.card-list-cont.grid li {
  width: calc((100% - 16px)/3);
  height: 100px;
  padding: 12px 8px;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  text-align: center;
  box-sizing: border-box;
}
.card-list-cont.grid li + li {
  margin-left: 8px;
}
.card-list-cont.grid li:nth-of-type(3n+1) {
  margin-left: 0;
}
.card-list-cont.grid li:nth-of-type(n+3) {
  margin-top: 8px;
}
.card-list-cont.grid li:nth-of-type(3) {
  margin-top: 0;
}

.card-list-cont .card-img {
  display: inline-block;
  width: 45px;
  height: 45px;
}
.card-list-cont .card-img img {
  width: 100%;
}
.card-list-cont .card-img img.breast {
  content: url('../images/hanwha-breast@3x.png');
}
.card-list-cont .card-img img.dementia {
  content: url('../images/hanwha-dementia@3x.png');
}
.card-list-cont .card-img img.ovarian {
  content: url('../images/hanwha-ovarian@3x.png');
}
.card-list-cont .card-img img.thyroid {
  content: url('../images/hanwha-thyroid@3x.png');
}
.card-list-cont .card-img img.cervical {
  content: url('../images/hanwha-cervical@3x.png');
}
.card-list-cont .card-img img.stroke {
  content: url('../images/hanwha-stroke@3x.png');
}
.card-list-cont .card-img img.endometrium {
  content: url('../images/hanwha-endometrium@3x.png');
}
.card-list-cont .card-img img.depression {
  content: url('../images/hanwha-depression@3x.png');
}
.card-list-cont .card-img img.mood-disorder {
  content: url('../images/hanwha-mood-disorder@3x.png');
}
.card-list-cont .card-img img.colon {
  content: url('../images/hanwha-colon@3x.png');
}
.card-list-cont .card-img img.neurosis {
  content: url('../images/hanwha-neurosis@3x.png');
}
.card-list-cont .card-img img.adhd {
  content: url('../images/hanwha-adhd@3x.png');
}
.card-list-cont .card-img img.no-appetite {
  content: url('../images/hanwha-no-appetite@3x.png');
}
.card-list-cont .card-img img.panic-disorder {
  content: url('../images/hanwha-panic-disorder@3x.png');
}
.card-list-cont .card-img img.biorhythm {
  content: url('../images/hanwha-biorhythm@3x.png');
}
.card-list-cont .card-img img.appetite {
  content: url('../images/hanwha-appetite@3x.png');
}
.card-list-cont .card-img img.period {
  content: url('../images/hanwha-period@3x.png');
}
.card-list-cont .card-img img.skin {
  content: url('../images/hanwha-skin@3x.png');
}
.card-list-cont .card-img img.snoring {
  content: url('../images/hanwha-snoring@3x.png');
}
.card-list-cont .card-img img.alcohol {
  content: url('../images/hanwha-alcohol@3x.png');
}
.card-list-cont .card-img img.muscle {
  content: url('../images/hanwha-muscle@3x.png');
}
.card-list-cont .card-img img.hairloss {
  content: url('../images/hanwha-hairloss@3x.png');
}
.card-list-cont .txt {
  display: block;
  font-size: 1.4rem;
  font-family: "Pretendard-Medium";
  color: #000;
  line-height: 2.1rem;
  margin-top: 10px;
  letter-spacing: -0.4px;
}
.card-list-cont .see-all {
  width: 100%;
  height: 100%;
  display: table;
  text-decoration: none;
}
.card-list-cont .see-all .txt {
  margin-top: 0;
  display: table-cell;
  vertical-align: middle;
  color: #888;
}

.hanwha-intro-tab {
  display: flex;
  align-items: center;
  margin-top: 12px;
  padding: 0 20px;
}
.hanwha-intro-tab li + li {
  margin-left: 8px;
}
.hanwha-intro-tab li .btn-hanwha-intro-tab {
  background: #F3F4F5;
  border-radius: 8px;
  padding: 8px 12px;
}
.hanwha-intro-tab li .btn-hanwha-intro-tab.active {
  background: #353535;
}
.hanwha-intro-tab li .btn-hanwha-intro-tab span {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #888;
  line-height: 2.4rem;
}
.hanwha-intro-tab li .btn-hanwha-intro-tab.active span {
  color: #fff;
}

.footer.hanwha-intro {
  background: transparent;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
  border-radius: 0;
}
.footer-gradient {
  width: 100%;
  height: 52px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 80%);
}
.footer.hanwha-intro .footer-txt {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #000;
  line-height: 2.4rem;
  text-align: center;
  padding: 0 20px;
}
.footer.hanwha-intro .footer__signup {
  z-index: 10;
  padding-top: 0;
  width: calc(100% - 40px);
  padding: 16px 20px 40px 20px;
  position: static;
}
.footer.hanwha-intro .footer__signup .footer-txt + .button {
  margin-top: 12px;
}
/* // 한화손보 진입화면 추가 */

/* 한화손보 모달 팝업 */
.hanwha-modal-container {
  width: 100%;
  height: 100%;
  visibility: hidden;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.3);
}
.hanwha-modal-container-confirm-wrapper {
  background: #fff;
}
.hanwha-modal-container-confirm-title {
  width: calc(100% - 40px);
  background: #fff;
  border-radius: 12px;
  padding: 20px 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  text-align: center;
}
.hanwha-modal-container-confirm-title span {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #111;
  line-height: 21px;
}
.hanwha-modal-container-confirm-title span.title {
  display: block;
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #111;
  line-height: 24px;
  margin-bottom: 12px;
}
.hanwha-modal-container-title.b_type span {
    font-size: 1.8rem;
}
.hanwha-modal-container-button {
  margin-top: 20px;
}
.hanwha-modal-container-button.multi {
  display: flex;
  align-items: center;
}
.hanwha-modal-container-button .btn-txt {
  background: #fff;
  border: 1px solid #FF772A;
  border-radius: 4px;
  padding: 7.5px;
  width: 100%;
  height: 36px;
}
.hanwha-modal-container-button .btn-txt span {
  font-family: "Pretendard-Medium";
  font-weight: 500;
  color: #FF772A;
}
.hanwha-modal-container-button .btn-txt.active {
  background: #FF772A;
}
.hanwha-modal-container-button .btn-txt.active span {
  color: #fff;
}
.hanwha-modal-container-button .btn-txt + .btn-txt {
  margin-left: 8px;
}
.hanwha-modal-container-wrapper_width280 {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.hanwha-modal-container-content-wrapper_width280 {
    width: 100%;
    margin: 0px 20px;
    max-width: 280px;
}
.modal-container-title-button-wrapper {
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}
.hanwha-modal-container-title {
  text-align: center;
}
.hanwha-modal-container-button button {
  min-height: 40px;
}
.hanwha-modal-container-button button span{
  font-size: 1.4rem !important;
}
.hanwha-modal-container_signin_loading-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 40px;
}
.hanwha-modal-container_signin_loading-container img {
    width: 36px;
    height: 36px;
}
.hanwha-modal-container_signin_loading-container img.document{
    content: url(../images/ic-document@2x.png);
}
.hanwha-modal-container_signin_loading-container img.logo{
    content: url(../images/main-logo@2x.png);
}
/* // 한화손보 모달 팝업 */

/* SSO 통해 진입 시 약관 동의 */
/* 약관 페이지 */
.contents-personal-info-agreement {
  padding: 32px 20px 24px;
}
.contents-personal-info-agreement .main-title-area .title {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 30px;
}
.contents-personal-info-agreement .main-title-area .detail {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 19.6px;
}
.contents-personal-info-agreement .main-title-area .detail > span {
  display: block;
  margin-top: 4px;
}
.contents-personal-info-agreement .agreement-list > li + li {
  margin-top: 24px;
}
.contents-personal-info-agreement .agreement-list .title {
  font-style: normal;
  font-size: 1.6rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 22.4px;
}
.contents-personal-info-agreement .agreement-list .detail {
  display: block;
  font-size: 1.4rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 19.6px;
  margin-top: 12px;
}
.contents-personal-info-agreement .agreement-list .appendix {
  font-size: 1.2rem;
  font-family: "Pretendard-Regular";
  color: #484E56;
  line-height: 16.8px;
  margin-top: 4px;
}
.contents-personal-info-agreement .dash-list > li {
  position: relative;
  padding-left: 9px;
}
.contents-personal-info-agreement .dash-list > li + li {
  margin-top: 4px;
}
.contents-personal-info-agreement .dash-list > li::before {
  content: '-';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.footer-personal-info-agreement {
  padding: 16px 20px;
  background-color: #ffffff;
}
.footer-personal-info-agreement .button--text.active {
  border-radius: 8px;
}

/* 개인정보 동의 팝업 */
.bottom-modal-popup-container.personal-info-agreement {
  display: none;
}
.bottom-modal-popup-container.personal-info-agreement .bottom-modal-popup-contents {
  background: #fff;
  padding: 16px 20px;
}
.bottom-modal-popup-container.personal-info-agreement .bottom-modal-popup-contents__text strong {
  font-size: 1.8rem;
  font-family: "Pretendard-Bold";
  color: #484E56;
  line-height: 24px;
  text-align: left;
}
.bottom-modal-popup-container.personal-info-agreement .bottom-modal-popup-contents__btn {
  margin-top: 32px;
}
.bottom-modal-popup-container.personal-info-agreement .bottom-modal-popup-contents__btn button {
  background: #0CAAB8;
  border-radius: 8px;
}

.personal-info-checkbox__options {
  display: flex;
  justify-content: space-between;
}
.personal-info-checkbox__options + .personal-info-checkbox__options {
  margin-top: 12px;
}
.personal-info-checkbox_agree-wrapper {
  display: flex;
}
.personal-info-checkbox-wrapper img.on {
  height: 24px;
  content: url(../images/check-box-rectangle-active@2x.png);
}
.personal-info-checkbox-wrapper img {
  height: 24px;
  content: url(../images/check-box-rectangle-default@2x.png);
}
.personal-info-checkbox_agree-txt p,
.personal-info-checkbox_agree-txt span {
  word-break: break-word;
  font-size: 16px;
  font-family: "Pretendard-Regular";
  line-height: 24px;
  color: #2B2E33;
  text-align: left;
}
.personal-info-checkbox_agree-txt {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.personal-info-checkbox-list-container .btn-view-detail {
  width: 24px;
  height: 24px;
}
.personal-info-checkbox-list-container .view-detail {
  margin-left: 20px;
}
.personal-info-checkbox-list-container .btn-view-detail img {
  height: 24px;
  content: url(../images/ic-arrow-right-detail@2x.png);
}
.bottom-modal-popup-contents__btn.personal-info-agreement.enabled button {
  background-color: #0caab8;
  border-radius: 12px;
}
.bottom-modal-popup-contents__btn.personal-info-agreement.disabled button {
  background-color: #b0b0b0;
  border-radius: 12px;
  cursor: none;
  pointer-events: none;
}
/* // SSO 통해 진입 시 약관 동의 */

/* 공동마케팅 이벤트 페이지(KMI 수검자 대상) */
/* KMI 수검자 할인 문구 */
.kmi-special-discount-area-wrapper {
  display: none;
}
.kmi-special-discount-area-wrapper.show {
  display: block;
}
.kmi-special-discount-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 4px;
  background: #ECF0FA;
  padding: 8px 12px 8px 16px;
  position: relative;
}
.kmi-special-discount-area img {
  content: url(../images/kmi-logo-38@2x.png);
  height: 12px;
}
.kmi-special-discount-area .tit {
  display: inline-block;
  font-family: 'Pretendard-Medium';
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #2B2E33;
  margin-left: 4px;
}
.kmi-special-discount-area .ico-question {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../images/ico-question@2x.png) no-repeat center/contain;
}
.kmi-special-discount-area .tip-container {
  display: none;
  background: #4B5B90;
  padding: 8px 12px;
  border-radius: 8px;
  position: absolute;
  bottom: 37px;
  right: -12px;
  width: 218px;
}
.kmi-special-discount-area .tip-container::before {
  content: '';
  position: absolute;
  border: solid 1px #4B5B90;
  border-width: 5px;
  right: 29px;
  bottom: -10px;
  z-index: 1;
  border-color: #4B5B90 transparent transparent transparent;
}
.kmi-special-discount-area .tip-container span {
  font-family: 'Pretendard-Medium';
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #fff;
}
.kmi-special-discount-area .percent {
  position: relative;
  font-family: 'Pretendard-Medium';
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #2B2E33;
  padding-left: 14px;
}
.kmi-special-discount-area .percent::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: inline-block;
  width: 10px;
  height: 6px;
  background: url(../images/polygon-arrow-down-10@2x.png) no-repeat center/contain;
}

/* 퀴즈 정답, 오답 모달 */
.modal-quiz-container {
  width: 100%;
  height: 100%;
  visibility: hidden;
  position: fixed;
  top: 0%;
  left: 0%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.3);
}
.modal-quiz-container-wrapper {
  width: 100%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.modal-quiz-content-container {
  padding: 0px 20px;
}
.modal-quiz-box {
  border-radius: 20px;
  background-color: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  text-align: center;
  padding: 32px 20px 16px;
}
.modal-quiz-container-title {
  text-align: center;
  padding: 40px 28.5px 32px;
}
.modal-quiz-container-title span {
    font-size: 1.6rem;
    font-family: "Pretendard-Bold";
    color: #141414;
    line-height: 24px;
}
.modal-quiz-btn-container {
  text-align: center;
  display: flex;
  justify-content: center;
  margin-top: 32px;
}
.modal-quiz-btn-container button {
  min-height: 50px;
}
.modal-quiz-btn-container button > span{
  font-family: "Pretendard-Bold";
  font-size: 1.8rem !important;
  line-height: 27px;
  color: #fff;
}
.co-marketing-quiz-button-container {
  display: flex;
  justify-content: center;
}
.modal-quiz-img-area img {
  width: 100px;
  height: 100px;
}
.modal-quiz-img-area img.correct {
  content: url(../images/img-quiz-popup-o@2x.png);
}
.modal-quiz-img-area img.incorrect {
  content: url(../images/img-quiz-popup-x@2x.png);
}
.modal-quiz-txt-area {
  text-align: center;
  margin-top: 16px;
}
.modal-quiz-title {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  margin-top: 16px;
}
.modal-quiz-title em {
  font-style: normal;
}
.modal-quiz-title .fc-blue {
  color: #389BF7;
}
.modal-quiz-title .fc-red {
  color: #FF3F3F;
}
.modal-quiz-detail {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #484E56;
  margin-top: 16px;
  letter-spacing: -0.25px;
  line-height: 24px;
}
.modal-quiz-container-button {
  margin-top: 32px;
}

/* 퀴즈 O, X 버튼 */
.co-marketing-quiz-OX-item-wrapper {
  display: flex;
  flex: 1;
  justify-content: center;
  padding: 11px 24px;
  background-color: #D2EAFC;
  border-radius: 20px;
  border: 1px solid #95D1FF;
  align-items: center;
}
.co-marketing-quiz-OX-item-wrapper.horizontal {
  transition: transform 0.7s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  flex-basis: 50%;
  justify-content: center;
  padding: 20px 0px;
  max-width: 152px;
  min-width: 152px;
}
.co-marketing-quiz-OX-item-wrapper.result {
  border: 4px solid #3F80FF !important;
}
.co-marketing-quiz-OX-item-wrapper.result_wrong {
  border: 4px solid #FF6969 !important;
}
.co-marketing-quiz-OX-item-wrapper.type-b {
  background-color: #FFEBEB;
  border: 1px solid #FFC9C9;
}
.co-marketing-quiz-OX-item-wrapper img.right-arrow {
  width: 20px;
  height: 28px;
  vertical-align: middle;
  margin: 0px 4px;
  content: url(../images/ic-right-arrow@2x.png);
}
.quiz-item-element {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.quiz-item-element-img {
  margin-bottom: 3px;
}
.quiz-item-element-img img {
  width: 100%;
  height: 100%;
  max-width: 100px;
  max-height: 100px;
  vertical-align: middle;
}

/* 이벤트 영역 : 컨텐츠 */
.kmi-event-container {
    visibility: hidden;
    position: absolute;
    width: 100%;
    overflow: hidden;
    background: #fff;
}
.kmi-event-container.visible {
    opacity: 0.3;
    animation: selected 0.7s forwards;
}
.kmi-event-container.d-block {
  height: unset;
  display: block;
  visibility: visible;
}
.kmi-event-result-container {
  border-radius: 0px 0px 20px 20px;
  padding: 20px 16px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.kmi-event-result-container.pt-48 {
  padding: 48px 0 0 !important;
}
.kmi-event-result-container .title-area {
  place-self: flex-start;
}
.kmi-event-result-container .title-area strong {
  font-size: 2.4rem;
  font-family: "Pretendard-Bold";
  color: #000000;
  line-height: 34px;
}
.kmi-event-result-container .title-area.with-ico {
  position: relative;
  padding-left: 64px;
}
.kmi-event-result-container .title-area.with-ico::before {
  content: '';
  display: inline-block;
  width: 56px;
  height: 56px;
  background: url('../images/ico-cross-blood@2x.png') no-repeat center/contain;
  position: absolute;
  top: 50%;
  left:0;
  transform: translateY(-50%);
}
.kmi-event-result-container .img-area {
  width: 100%;
  margin-top: 20px;
}
.kmi-event-result-container .img-area img {
  width: 100%;
}
.kmi-event-result-container .txt-area {
  width: 100%;
  margin-top: 20px;
  font-size: 1.6rem;
  line-height: 24px;
  font-family: "Pretendard-Reugular";
  color: #2B2E33;
  letter-spacing: -0.25px;
}
.kmi-event-result-container .txt-area em {
  font-style: normal;
  font-family: "Pretendard-Bold";
}
.swiper-management {
  width: 100%;
}
.swiper-management .swiper-wrapper {
  width: 100%;
  text-align: center;
}
.swiper-management .swiper-slide {
  border: 1px solid #DBDBDB;
  border-radius: 12px;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12);
  padding: 20px;
  box-sizing: border-box;
}
.swiper-management li strong {
  font-size: 2rem;
  font-family: "Pretendard-Bold";
  color: #141414;
  line-height: 30px;
}
.swiper-management li p {
  font-size: 1.6rem;
  font-family: "Pretendard-Regular";
  color: #141414;
  line-height: 24px;
}
.swiper-management li .img-area.hyperlipidemia {
  width: 100%;
  background: #84C4FF;
  border-radius: 8px;
  padding: 30px 0;
}
.swiper-management li .img-area.hyperlipidemia img {
  max-width: 280px;
}
.swiper-management li img {
  width: 100%;
}
.swiper-management li:nth-of-type(1) img {
  content: url(../images/hyperlipidemia-slide-img-01@2x.png);
}
.swiper-management li:nth-of-type(2) img {
  content: url(../images/hyperlipidemia-slide-img-02@2x.png);
}
.swiper-management li:nth-of-type(3) img {
  content: url(../images/hyperlipidemia-slide-img-03@2x.png);
}
.swiper-management li:nth-of-type(4) img {
  content: url(../images/hyperlipidemia-slide-img-04@2x.png);
}
.contents-management-swiper-pagination {
  display: flex;
  justify-content: center;
  margin-top: 12px;
}
.contents-management-swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #D5DAE2;
    opacity: 1;
    margin: 0px 5px 0px 0px !important;
}
.contents-management-swiper-pagination .swiper-pagination-bullet-active {
    width: 14.9px;
    height: 8px;
    border-radius: 4px;
    background-color: #0CAAB8;
    margin: 0px 5px 0px 0px !important;
}

/* 이벤트 영역 : 할인 상품 */
.kmi-event-product-container {
  background-color: #051725;
  border-radius: 20px 20px 0 0;
  overflow: hidden;
}
.kmi-event-result-container.c-type {
  border-radius: 0;
}
.kmi-event-result-title {
  margin: 20px 0px 24px;
  color: #fff;
  text-align: center;
}
.kmi-event-result-title span {
  font-size: 2.4rem;
  font-family: "Pretendard-Regular";
  line-height: 33.6px;
}
.kmi-event-result-title strong {
  display: block;
  font-size: 2.8rem;
  font-family: "Pretendard-Bold";
  line-height: 39.2px;
}
.kmi-event-result-img {
  max-width: 328px;
}
.kmi-event-result-img img {
  width: 100%;
  vertical-align: middle;
}
.kmi-event-result-discount-rate-img img {
  width: 100%;
}
.kmi-event-result-balloon-img,
.kmi-event-result-discount-rate-img {
  display: flex;
  justify-content: center;
}
.kmi-event-result-balloon-img img {
  width: 138px;
}
.kmi-event-result-discount-rate-img img {
  width: 100%;
}
.kmi-event-result-subtitle {
  text-align: center;
  display: flex;
  justify-content: center;
}
.kmi-event-result-subtitle span {
  font-size: 2.0rem;
  font-family: "Pretendard-Regular";
  color: #AEB3B9;
  line-height: 30px;
}
.kmi-event-result-subtitle span strong{
  font-size: 2.0rem;
  font-family: "Pretendard-Bold";
  color: #ffffff;
}
.kmi-event-result-container.discount {
  width: 100%;
  background: #051725;
  padding: 46px 0 95px;
}
.swiper-kmi-discount-product {
  width: 100%;
}
.swiper-kmi-discount-product .swiper-wrapper {
  width: 100%;
  align-items: center;
}
.swiper-kmi-discount-product .swiper-slide {
  width: 75% !important;
  transform: scale(1) !important;
  transition: transform 0.3s;
}
.swiper-kmi-discount-product .swiper-slide-active {
  transform: scale(1.2) !important;
}
.swiper-kmi-discount-product .img-area,
.swiper-kmi-discount-product .img-area img {
  width: 100%;
}
.swiper-kmi-discount-product .btn-move-to-item.item-01 img {
  content: url('../images/co-marketing-daewoong-milk-thistle@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item[disabled].item-01 img {
  content: url('../images/co-marketing-daewoong-milk-thistle-disabled@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item.item-02 img {
  content: url('../images/co-marketing-daewoong-nutrime-omega@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item[disabled].item-02 img {
  content: url('../images/co-marketing-daewoong-nutrime-omega-disabled@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item.item-03 img {
  content: url('../images/co-marketing-daewoong-nutrime-essential@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item[disabled].item-03 img {
  content: url('../images/co-marketing-daewoong-nutrime-essential-disabled@2x.png');
}
.swiper-kmi-discount-product .btn-move-to-item[disabled] {
  cursor: none;
  pointer-events: none;
}
.kmi-discount-product-swiper-pagination {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.kmi-discount-product-swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #D5DAE2;
    opacity: 1;
    margin: 0px 5px 0px 0px !important;
}
.kmi-discount-product-swiper-pagination .swiper-pagination-bullet-active {
    width: 14.9px;
    height: 8px;
    border-radius: 4px;
    background-color: #0CAAB8;
    margin: 0px 5px 0px 0px !important;
}

/* 종료된 이벤트 blur 영역 */
.kmi-event-end-area {
  visibility: hidden;
  width: 100%;
  position: fixed;
  bottom: 0;
  border-radius: 20px 20px 0 0;
  padding-bottom: 0px !important;
  z-index: 10;
}
.kmi-event-end-container {
  padding: 130px 20px 24px;
  background: linear-gradient(to bottom, rgba(221, 232, 255, 0) 1%, rgba(221, 232, 255, 0.7) 30%, rgba(221, 232, 255, 1) 60%);
}
.kmi-event-end-container .desc {
  font-size: 1.6rem;
  font-family: "Pretendard-Medium";
  color: #2B2E33;
  line-height: 24px;
  text-align: center;
}
.button--text.active.blue {
  background: #2156C1;
}
.kmi-event-end-container .desc + .button--text.active.blue {
  margin-top: 12px;
}

@media (min-width: 800px) {
  .kmi-discount-product-swiper-pagination {
    margin-top: 48px;
  }
  .kmi-event-container {
    position: relative;
  }
  .kmi-event-end-area {
    position: absolute;
  }
  .kmi-event-result-discount-rate-img img {
    max-width: 250px;
  }
}
/* // 공동마케팅 이벤트 페이지(KMI 수검자 대상) */