@charset "UTF-8";
@import url(lib/iosStylePicker.css);
@import url(lib/mobileSelect.css);
@import url(lib/slick-theme.css);
@import url(lib/slick.css);
@import url(lib/swiper-bundle.min.css);
@import url(popup.css);
@font-face {
  font-family: "Spoqa Han Sans";
  font-weight: 700;
  src: local("Spoqa Han Sans Bold"), url("../fonts/SpoqaHanSans-Bold.woff2") format("woff2"), url("../fonts/SpoqaHanSans-Bold.woff") format("woff"), url("../fonts/SpoqaHanSans-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Spoqa Han Sans";
  font-weight: 400;
  src: local("Spoqa Han Sans Regular"), url("../fonts/SpoqaHanSans-Regular.woff2") format("woff2"), url("../fonts/SpoqaHanSans-Regular.woff") format("woff"), url("../fonts/SpoqaHanSans-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Spoqa Han Sans";
  font-weight: 300;
  src: local("Spoqa Han Sans Light"), url("../fonts/SpoqaHanSans-Light.woff2") format("woff2"), url("../fonts/SpoqaHanSans-Light.woff") format("woff"), url("../fonts/SpoqaHanSans-Light.ttf") format("truetype");
}

@font-face {
  font-family: "Spoqa Han Sans";
  font-weight: 100;
  src: local("Spoqa Han Sans Thin"), url("../fonts/SpoqaHanSans-Thin.woff2") format("woff2"), url("../fonts/SpoqaHanSans-Thin.woff") format("woff"), url("../fonts/SpoqaHanSans-Thin.ttf") format("truetype");
}

html,
body,
p,
ul,
li,
button,
a,
input {
  margin: 0;
  padding: 0;
  color: #080808;
}

body {
  font-family: "Spoqa Han Sans", "sans-serif";
  color: #080808;
  background-color: #f2f4fb;
  overflow-y: auto;
}

a,
input,
textarea,
button {
  outline: none;
  border: none;
  background: none;
}

a {
  color: inherit;
  text-decoration: none;
}

a:focus,
input:focus,
textarea:focus,
button:focus {
  outline: none;
}

button {
  cursor: pointer;
}

.clicknone {
  pointer-events: none;
}

/* tab */
.tab-area {
  position: relative;
  margin-top: 11px;
}

.tab-area .tab-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  padding: 0px 16px;
}

.tab-area .tab-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 37px;
  border-bottom: solid 3px transparent;
  font-weight: normal;
  font-size: 15px;
  line-height: 1.47;
  letter-spacing: -0.4px;
  color: #686b73;
  white-space: nowrap;
}

.tab-area li.tab-active {
  font-weight: bold;
  color: #5653ff;
  border-bottom: solid 3px #5653ff;
}

/* banner_detail */
body.banner_detail {
  background-color: #fff;
}

.banner_detail .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.banner_detail .banner-title {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  color: #080808;
  padding: 18px 24px;
}

.banner_detail .banner-title p {
  margin: 1px 0 0;
  font-family: SpoqaHanSans;
  font-size: 12px;
  letter-spacing: -0.32px;
  color: #a4a9b3;
  font-weight: normal;
}

.banner_detail .banner-contents {
  padding: 0 24px 40px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.4px;
  color: #080808;
}

.banner_detail .banner-contents > img {
  width: calc(100% + 48px);
  margin: 0 -24px;
}

/* blood_check*/
body.blood_check {
  background-color: white;
}

.blood_check {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* blood_update */
  /* btn-move */
  /* blood-section */
  /* thick-divider */
  /* list-section */
  /* popup-custom */
  /* common-input */
  /* insert-date */
}

.blood_check input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.blood_check input:-ms-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.blood_check input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.blood_check #blood_check .box-radio-input {
  width: calc((100% - 16px) / 3);
  margin-left: 8px;
  margin-top: 20px;
}

.blood_check #blood_check .box-radio-input:first-child {
  margin-left: 0px;
}

.blood_check #blood_check .box-radio-input input[type="radio"] {
  display: none;
}

.blood_check #blood_check input[type="text"] {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.blood_check #blood_check .box-radio-input input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.blood_check #blood_check .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.blood_check #blood_check .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.blood_check #blood_check .box-radio-input input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.blood_check #blood_update .box-radio-input {
  width: calc((100% - 16px) / 3);
  margin-left: 8px;
  margin-top: 20px;
}

.blood_check #blood_update .box-radio-input:first-child {
  margin-left: 0px;
}

.blood_check #blood_update .box-radio-input input[type="radio"] {
  display: none;
}

.blood_check #blood_update input[type="text"] {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
}

.blood_check #blood_update .box-radio-input input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.blood_check #blood_update .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.blood_check #blood_update .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.blood_check #blood_update .box-radio-input input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.blood_check .btn-move {
  width: 25px;
  height: 25px;
}

.blood_check .blood-section {
  background-color: white;
  padding: 20px 16px 23px 16px;
  text-align: center;
}

.blood_check .blood-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.blood_check .blood-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.blood_check .blood-section .date-selector-container .prev-item {
  left: 0px;
}

.blood_check .blood-section .date-selector-container .next-item {
  right: 0px;
}

.blood_check .blood-section .date-selector-container .date-item {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.blood_check .thick-divider {
  width: 100%;
  height: 6px;
  background-color: #e9edf0;
}

.blood_check .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.blood_check .list-section .list-header {
  background-color: #f5f8fd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 14px 0;
}

.blood_check .list-section .list-header .ic-img {
  width: 15px;
  height: 15px;
}

.blood_check .list-section .list-header .text-item {
  margin-left: 3px;
  font-size: 12px;
  color: #686b73;
}

.blood_check .list-section .list-header .direct {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blood_check .list-section .list-header .healthcare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 6px;
}

.blood_check .list-section .list-header .external {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 6px;
  margin-right: 16px;
}

.blood_check .list-section .blood-list .list-item {
  border-bottom: 1px solid #e9edf0;
}

.blood_check .blood-list .list-item .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 26px 16px 26px 24px;
}

.blood_check .blood-list .list-item .date .days {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.blood_check .blood-list .list-item .date .days p {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
}

.blood_check .blood-list .list-item .date .days .ic-img {
  width: 19px;
  height: 19px;
  margin-left: 7px;
}

.blood_check .blood-list .list-item .more {
  display: none;
}

.blood_check .blood-list .list-item.off .list-on {
  display: block;
}

.blood_check .blood-list .list-item.on .list-off {
  display: block;
}

.blood_check .blood-list .list-item .hidden-area {
  border-top: 1px solid #e9edf0;
  display: none;
}

.blood_check .blood-list .list-item.on .hidden-area {
  display: block;
}

.blood_check .blood-list .list-item .hidden-area .time {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 22px 14px 39px 24px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  color: #686b73;
}

.blood_check .blood-list .list-item .hidden-area .info {
  margin: 0px 16px 40px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blood_check .blood-list .list-item .hidden-area .info .subject {
  margin-right: 17px;
  width: 110px;
}

.blood_check .blood-list .list-item .hidden-area .info .subject .subject-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  color: #363b41;
  margin-top: 33px;
}

.blood_check .blood-list .list-item .hidden-area .info .subject .subject-item:nth-child(1) {
  margin-top: 0px;
}

.blood_check .blood-list .list-item .hidden-area .info .divider {
  width: 1px;
  background-color: #e6e8f2;
}

.blood_check .blood-list .list-item .hidden-area .info .detail {
  width: calc(100% - 90px - 1px);
  margin-left: 18px;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 30px;
  font-size: 14px;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item.nodata .text {
  display: none;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item.nodata .status {
  display: none;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item.nodata::after {
  content: "-";
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: right;
  color: #363b41;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item:nth-child(1) {
  margin-top: 0px;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item .text {
  letter-spacing: -0.23px;
  color: #363b41;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item .status {
  font-weight: bold;
  letter-spacing: -0.23px;
  border-radius: 5px;
  text-align: center;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item .status.normal {
  color: #5653ff;
  width: 65px;
  height: 23px;
  background-color: #eeeefa;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item .status.high {
  color: #ff5151;
  width: 39px;
  height: 23px;
  background-color: #faeef0;
}

.blood_check .blood-list .list-item .hidden-area .info .detail .detail-item .status.low {
  color: #eebf00;
  width: 39px;
  height: 23px;
  background-color: #fafaee;
}

.blood_check .middle-layer .alert-wrapper .text-area {
  overflow-y: scroll;
  height: 70vh;
}

.blood_check .middle-layer .text-wrapper .note {
  width: calc(100% - 44px);
  margin: 20px auto 0;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #686b73;
}

.blood_check .middle-layer .alert-wrapper .alert-text {
  padding: 20px 0 20px;
  border-bottom: 1px solid #e6e8f2;
}

.blood_check .middle-layer .alert-wrapper .alert-area {
  height: 56px;
  line-height: 56px;
  border-top: 1px solid #e6e8f2;
}

.blood_check .middle-layer .alert-wrapper .alert-area .cancle {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.blood_check .middle-layer .alert-wrapper .alert-area .confirm {
  width: 50%;
  color: #a4a9b3;
}

.blood_check .middle-layer .alert-wrapper .divider {
  height: 1px;
  width: calc(100% - 44px);
  margin: 20px auto 0;
  background-color: #e6e8f2;
}

.blood_check .middle-layer .alert-wrapper .text-area .subject {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
  width: 30%;
}

.blood_check .middle-layer .alert-wrapper .text-area .data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 70%;
}

.blood_check .middle-layer .alert-wrapper .text-area .data img {
  margin-left: 5px;
}

.blood_check .middle-layer .alert-wrapper .date {
  width: calc(100% - 53px);
  margin: 15px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blood_check .middle-layer .alert-wrapper .date .input-date {
  text-align: right;
  width: 150px;
}

.blood_check .middle-layer .alert-wrapper .date #check_date {
  margin-left: 5px;
}

.blood_check .middle-layer .alert-wrapper .sugar {
  width: calc(100% - 53px);
  margin: 15px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.blood_check .middle-layer .alert-wrapper .sugar .input-date {
  text-align: right;
}

.blood_check .middle-layer .alert-wrapper .sugar .unit {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
  margin-left: 5px;
}

.blood_check .middle-layer .alert-wrapper .sugar .status {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.blood_check .middle-layer .alert-wrapper .common-input {
  width: calc(100% - 53px);
  margin: 15px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blood_check .middle-layer .alert-wrapper .common-input .subject {
  width: 39%;
}

.blood_check .middle-layer .alert-wrapper .common-input .data {
  width: 61%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.blood_check .middle-layer .alert-wrapper .common-input .data .input-data {
  width: 160px;
  text-align: right;
}

.blood_check .middle-layer .alert-wrapper .common-input .data .unit {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
  margin-left: 5px;
}

.blood_check #blood_update.middle-layer .alert-wrapper .alert-area .confirm {
  color: #5653ff;
}

.blood_check .middle-layer .alert-wrapper .insert-date {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.75px;
  text-align: right;
  color: #686b73;
  width: calc(100% - 53px);
  margin: 15px auto 28px;
}

/* blood_direct */
body.blood_direct {
  background-color: #f5f8fd;
}

.blood_direct {
  /* blood-section */
  /* divider */
  /* select-section */
  /* btn-section */
  /* popup-selection */
}

.blood_direct .blood-direct-section {
  background-color: white;
  padding: 20px 16px;
  text-align: center;
}

.blood_direct .blood-direct-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.blood_direct .blood-direct-section .date-selector-container .date {
  font-size: 14px;
  font-weight: bold;
  color: #363b41;
  margin-left: 24px;
}

.blood_direct .blood-direct-section .date-selector-container .date-time {
  letter-spacing: -0.2px;
  color: #363b41;
  font-size: 14px;
  margin-left: 25px;
}

.blood_direct .divider {
  height: 11px;
  width: 100%;
  background-color: #f5f8fd;
}

.blood_direct .select-section {
  background-color: white;
  position: relative;
}

.blood_direct .select-section .select-wrap .select-options .select-option {
  color: #a4a9b3;
}

.blood_direct .select-section .integer-blood .select-wrap {
  text-align: right;
}

.blood_direct .select-section .integer-blood .select-wrap .select-options .select-option {
  left: -20px;
}

.blood_direct .select-section .integer-blood .highlight .highlight-item {
  margin-right: 20px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.blood_direct .select-section .integer-blood .select-wrap:before {
  content: "/";
  top: 134px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
}

.blood_direct .select-section .float-blood .select-wrap {
  text-align: left;
}

.blood_direct .select-section .float-blood .select-wrap .select-options .select-option {
  margin-left: 10px;
}

.blood_direct .select-section .float-blood .highlight .highlight-item {
  margin-left: 10px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.blood_direct .select-section .float-blood .select-wrap:after {
  content: "mmHg";
  right: -60px;
  top: 132px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
}

.blood_direct .btn-section {
  margin-top: 20px;
}

.blood_direct .btn-section .btn-area {
  text-align: center;
}

.blood_direct .btn-section .btn-area button {
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.18;
  letter-spacing: normal;
  text-align: center;
  padding: 17px 0 19px 0;
  width: 165px;
}

.blood_direct .btn-section .btn-area .cancel {
  background-color: #e6e8f2;
  color: #363b41;
}

.blood_direct .btn-section .btn-area .confirm {
  background-color: #5653ff;
  color: #ffffff;
  margin-left: 13px;
}

.blood_direct .mobileSelect .content .fixWidth {
  width: calc(100% - 32px);
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(1) {
  width: 25% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(2) {
  width: 15% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(4) {
  width: 20% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(5) {
  width: 10% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(6) {
  width: 10% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(7) {
  width: 10% !important;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(1) .selectContainer li {
  text-align: right;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(2) .selectContainer li {
  text-align: center;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(4) .selectContainer li {
  text-align: right;
}

.blood_direct .mobileSelect .content .panel .wheel:nth-child(6) .selectContainer li {
  text-align: left;
}

/* blood */
body.blood {
  background-color: white;
}

.blood {
  /* blood-section */
  /* graph-section */
  /* average-section */
  /* list-section */
}

.blood .blood-section {
  background-color: white;
  padding: 31px 18px 22px 18px;
  text-align: center;
}

.blood .blood-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.blood .blood-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.blood .blood-section .date-selector-container .prev-item {
  left: 0px;
}

.blood .blood-section .date-selector-container .next-item {
  right: 0px;
}

.blood .blood-section .date-selector-container .date-item {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.blood .graph-section {
  background-color: #fff;
}

.blood .graph-section .updated-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 22px 16px 5px 11px;
  border-bottom: solid 1px #e9edf0;
}

.blood .graph-section .updated-area .date-item {
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.blood .graph-section .updated-area .unit-item {
  margin-left: auto;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #c7cad1;
}

.blood .graph-section .graph-area {
  position: relative;
  pointer-events: none;
}

.blood .graph-section .graph-area #chart {
  height: 255px !important;
}

.blood .graph-section .graph-area #chart2 {
  height: 287px !important;
}

.blood .graph-section .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px 5px 15px 5px;
}

.blood .graph-section .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.blood .graph-section .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.blood .graph-section .graph-area .bubble-area {
  display: none;
  position: absolute;
}

.blood .graph-section .graph-area .bubble {
  padding: 7px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: white;
}

.blood .graph-section .graph-area .bubble::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 10%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #5653ff;
}

.blood .graph-section .graph-area .bubble span {
  font-weight: bold;
}

.blood .graph-section .graph-area .bubble-area.grey .bubble {
  background-color: #dbe0e4;
  color: #363b41;
  /* border: solid 1px rgb(156 161 165); */
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
}

.blood .graph-section .graph-area .bubble-area.grey .bubble::after {
  left: 11%;
  bottom: 0px;
  background-color: #dbe0e4;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
}

.blood .graph-section .graph-area .bubble-area.right .bubble::after {
  left: auto;
  right: 5%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
}

.blood .graph-section .section-divider {
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 12px;
}

.blood .graph-section .average-area .day-item {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.47;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 15px;
}

.blood .graph-section .average-area .count-item {
  font-size: 36px;
  font-weight: bold;
  color: #080808;
  text-align: center;
}

.blood .graph-section .average-area .count-item > span {
  font-size: 14px;
}

.blood .graph-section .average-area .section-divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px auto 0;
}

.blood .graph-section .average-area .info-wrapper {
  width: calc(100% - 32px);
  margin: 20px auto 0px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blood .graph-section .average-area .info-wrapper .calory {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.blood .graph-section .average-area .info-wrapper .distance {
  width: 50%;
}

.blood .info-wrapper .text-item {
  font-size: 14px;
  color: #36434c;
  letter-spacing: -0.47px;
}

.blood .info-wrapper .number-item {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
  color: #363b41;
}

.blood .info-wrapper .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  letter-spacing: -0.13px;
  color: #363b41;
}

.blood .graph-section .average-area .thick-divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 18px;
}

.blood .average-section {
  text-align: center;
}

.blood .average-section .title-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 26px;
}

.blood .average-section .time {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.blood .average-section .time .unit {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
}

.blood .average-section .sleep-divider {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
  height: 6px;
  background-color: #e9edf0;
  margin-top: 36px;
}

.blood .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.blood .list-section .list-header {
  background-color: #f5f8fd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 14px 0;
}

.blood .list-section .list-header .ic-img {
  width: 15px;
  height: 15px;
}

.blood .list-section .list-header .text-item {
  margin-left: 3px;
  font-size: 12px;
  color: #686b73;
}

.blood .list-section .list-header .direct {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blood .list-section .list-header .healthcare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 6px;
}

.blood .list-section .list-header .external {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 6px;
  margin-right: 16px;
}

.blood .list-section .blood-list .list-item {
  padding: 15px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

.blood .blood-list .list-item .date {
  /* display:flex;
  justify-content: space-between;
  align-items: center; */
}

.blood .blood-list .list-item .date .days {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.blood .blood-list .list-item .date .days .ic-img {
  width: 19px;
  height: 19px;
  margin-left: 7px;
}

.blood .blood-list .list-item .date .time p {
  font-size: 14px;
  color: #697279;
}

.blood .blood-list .list-item .date .achieve {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.23px;
  color: #5653ff;
  padding: 1px 7px 2px;
  border-radius: 5px;
  background-color: #eeeefa;
  margin-left: 7px;
  display: none;
}

.blood .blood-list .list-item .record.direct {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blood .blood-list .list-item .record .count {
  font-size: 14px;
  color: #697279;
}

.blood .blood-list .list-item .record .while {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  text-align: right;
  letter-spacing: -0.45px;
}

.blood .blood-list .list-item .record .ic-more {
  margin-right: -8px;
}

/* challenge_detail_more */
body.challenge_detail_more {
  background-color: #f5f8fd;
}

.challenge_detail_more {
  /* 팝업 커스텀 */
}

.challenge_detail_more .img-area {
  position: relative;
}

.challenge_detail_more .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.challenge_detail_more .header-area {
  padding: 30px 24px 21px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_detail_more .header-area .deadline-item {
  display: none;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #5653ff;
}

.challenge_detail_more .status.doing .header-area .deadline-item.doing {
  display: block;
}

.challenge_detail_more .status.finish .header-area .deadline-item.finish {
  display: block;
  color: #686b73;
}

.challenge_detail_more .header-area .title-item {
  margin-top: 2px;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  color: #080808;
}

.challenge_detail_more .contents-wrapper {
  padding: 25px 24px;
}

.challenge_detail_more .des-label {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.challenge_detail_more .des-item {
  margin-top: 7px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: -0.43px;
  color: #363b41;
  word-break: keep-all;
}

.challenge_detail_more .comment-item {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: -0.43px;
  color: #363b41;
}

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

.challenge_detail_more .info-area .title-label {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.challenge_detail_more .info-area .value-item {
  margin-left: auto;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
}

.challenge_detail_more .info-item {
  margin-top: 15px;
}

.challenge_detail_more .info-item:first-of-type {
  margin-top: 34px;
}

.challenge_detail_more .footer-area {
  width: 100%;
  padding: 0 24px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 174px 0 34px;
}

.challenge_detail_more .footer-area .residence {
  width: 320px;
  height: 38px;
  line-height: 38px;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #363b41;
  margin: 0 auto;
  color: #ffffff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: center;
  margin-bottom: 17px;
}

.challenge_detail_more .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: white;
}

.challenge_detail_more .middle-layer .confirm-wrapper .confirm-text {
  padding: 37px 0;
}

.challenge_detail_more .finish #challenge #challenge_stop {
  display: none;
}

/* challenge_detail */
body.challenge_detail {
  background-color: #fff;
}

.challenge_detail .img-area {
  position: relative;
}

.challenge_detail .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.challenge_detail .header-area {
  padding: 20px 24px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_detail .header-area .deadline-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #5653ff;
}

.challenge_detail .header-area .title-item {
  margin-top: 2px;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  color: #080808;
}

.challenge_detail .contents-wrapper {
  padding: 20px 24px 0;
  margin-bottom: 150px;
}

.challenge_detail .des-label {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.challenge_detail .des-item {
  margin-top: 7px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: -0.43px;
  color: #363b41;
  word-break: keep-all;
}

.challenge_detail .comment-item {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: -0.43px;
  color: #363b41;
}

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

.challenge_detail .info-area .title-label {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.challenge_detail .info-area .value-item {
  margin-left: auto;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
}

.challenge_detail .info-item {
  margin-top: 15px;
}

.challenge_detail .info-item:first-of-type {
  margin-top: 34px;
}

.challenge_detail .footer-area {
  width: 100%;
  padding: 0 24px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 34px;
}

.challenge_detail .footer-area .residence {
  width: 320px;
  height: 38px;
  line-height: 38px;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #363b41;
  margin: 0 auto;
  color: #ffffff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: center;
  margin-bottom: 17px;
}

.challenge_detail .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: white;
}

/* challenge */
.challenge {
  background-color: #f5f8fd;
}

.challenge .wrapper {
  padding: 0px 10px;
}

.challenge .search-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 38px;
  border-radius: 8px;
  border: solid 1px #e6e8f2;
  padding: 0px 8px 0px 15px;
  margin-top: 22px;
  background-color: white;
  margin: 22px 6px 0px 6px;
}

.challenge .search-container input {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  margin-right: 5px;
}

.challenge .search-container input::-webkit-input-placeholder {
  color: #c7cad1;
}

.challenge .search-container input:-ms-input-placeholder {
  color: #c7cad1;
}

.challenge .search-container input::-ms-input-placeholder {
  color: #c7cad1;
}

.challenge .search-container input::placeholder {
  color: #c7cad1;
}

.challenge .header-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0px 13px;
  margin-top: 25px;
}

.challenge .header-area .total-value {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #363b41;
}

.challenge .header-area .switch-label {
  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.4px;
  color: #363b41;
}

.challenge .header-area .switch-container {
  text-align: left;
  margin-left: auto;
}

.challenge .header-area .switch-container input[type="checkbox"] {
  display: none;
}

.challenge .header-area .switch-container input[type="checkbox"] + label {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #686b73;
}

.challenge .header-area .switch-container input[type="checkbox"] + label span {
  display: inline-block;
  width: 32px;
  height: 18px;
  margin-bottom: 2px;
  margin-left: 6px;
  vertical-align: middle;
  cursor: pointer;
  background: url("../images/switch_off.svg") no-repeat;
  background-size: contain;
}

.challenge .header-area .switch-container input[type="checkbox"]:checked + label span {
  background: url("../images/switch_on.svg") no-repeat;
  background-size: contain;
}

.challenge .challenge-wrapper {
  padding: 23px 0px;
}

.challenge .challenge-wrapper .challenge-list {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
  padding: 0 6px;
}

.challenge .challenge-wrapper .challenge-list li {
  width: calc((100% - 20px) / 2);
  padding-left: 10px;
  margin-bottom: 19px;
}

.challenge .challenge-wrapper .challenge-list li:nth-child(2n-1) {
  padding-left: 0;
  padding-right: 10px;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper {
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
  padding-bottom: 14px;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .img-area {
  position: relative;
  border-radius: 10px;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .category-item {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 55px;
  height: 20px;
  border: solid 1px #5653ff;
  background-color: #5653ff;
  border-radius: 16px;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: white;
  text-align: center;
  display: none;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper.join .category-item {
  display: block;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .img-area .mask {
  display: none;
}

.challenge .challenge-wrapper .challenge-list li .end .img-area .mask {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #ffffff;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  opacity: 0.6;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper.end .img-area:before {
  content: "챌린지 종료";
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: normal;
  color: white;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 83px;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .title-item {
  margin: 10px 5px 0px 15px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.challenge .challenge-wrapper .challenge-list li .item-wrapper .contents-item {
  margin: 1px 5px 0px 15px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  color: #686b73;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.challenge .empty-section {
  position: relative;
}

.challenge .empty-section .text-area {
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: -0.43px;
  text-align: center;
  color: #363b41;
  padding-top: 60px;
}

.challenge .empty-section .text-area .text-item {
  color: #363b41;
}

.challenge .empty-section .text-area .font-item {
  font-weight: bold;
}

.challenge .empty-section .img-area {
  width: 245px;
  margin: 36px auto 220px;
}

.challenge .empty-section .img-area .bg-img {
  width: 100%;
}

/* challenge_ranking */
body.challenge_ranking {
  background: white;
}

.challenge_ranking .tab-list {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 266px;
  margin: 17px auto 0px auto;
  border: solid 1px #c7cad1;
  border-radius: 4px;
}

.challenge_ranking .tab-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  padding: 2px 0 4px;
}

.challenge_ranking .tab-list li:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.challenge_ranking .tab-list li:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.challenge_ranking .tab-list li.active {
  background: #5653ff;
  color: white;
  font-weight: bold;
}

.challenge_ranking .finish .tab-list li.active {
  background-color: #000000;
}

.challenge_ranking .tab-content {
  display: none;
}

.challenge_ranking .tab-content.active {
  display: block;
}

.challenge_ranking .tab-content .header-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 26px 0px 18px 0px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_ranking .tab-content .header-area .item-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.challenge_ranking .tab-content .header-area .label-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: #3f464a;
}

.challenge_ranking .tab-content .header-area .value-item {
  margin-top: 4px;
  font-size: 26px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.15;
  letter-spacing: -0.29px;
  text-align: center;
  color: #5653ff;
}

.challenge_ranking .finish .tab-content .header-area .value-item {
  color: black;
}

.challenge_ranking .tab-content .header-area .value-item span {
  margin-left: 3px;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.13px;
  color: #25282b;
}

.challenge_ranking .tab-content .header-area .divider {
  width: 1px;
  height: 40px;
  background-color: #e9edf0;
}

.challenge_ranking .tab-content .updated-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 22px 16px 5px 16px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_ranking .tab-content .updated-area .date-item {
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.challenge_ranking .tab-content .updated-area .unit-item {
  margin-left: auto;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #c7cad1;
}

.challenge_ranking .tab-content .graph-area {
  position: relative;
  pointer-events: none;
}

.challenge_ranking .tab-content .graph-area #chart {
  height: 255px !important;
}

.challenge_ranking .tab-content .graph-area #chart2 {
  height: 287px !important;
}

.challenge_ranking .tab-content .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0px 5px 15px 5px;
}

.challenge_ranking .tab-content .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.challenge_ranking .tab-content .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.challenge_ranking .tab-content .graph-area .bubble-area {
  display: none;
  position: absolute;
}

.challenge_ranking .tab-content .graph-area .bubble {
  padding: 4px 15px;
  background-color: #5653ff;
  border: 1px solid #5653ff;
  border-radius: 15px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: white;
  word-break: keep-all;
  white-space: pre;
}

.challenge_ranking .finish .tab-content .graph-area .bubble {
  background-color: black;
}

.challenge_ranking .tab-content .graph-area .bubble::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 10%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #5653ff;
}

.challenge_ranking .finish .tab-content .graph-area .bubble::after {
  background-color: black;
}

.challenge_ranking .tab-content .graph-area .bubble span {
  font-weight: bold;
}

.challenge_ranking .tab-content .graph-area .bubble-area.grey .bubble {
  background-color: #e6e8f2;
  color: #363b41;
  border: solid 1px #c7cad1;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
}

.challenge_ranking .tab-content .graph-area .bubble-area.grey .bubble::after {
  left: 11%;
  bottom: 1px;
  background-color: #e6e8f2;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
  border: solid 1px #c7cad1;
  border-top: 0px;
  border-right: 0px;
}

.challenge_ranking .tab-content .graph-area .bubble-area.right .bubble::after {
  left: auto;
  right: 9px;
  -webkit-transform: translate(-50%, 20%) rotate(-45deg);
          transform: translate(-50%, 20%) rotate(-45deg);
}

.challenge_ranking .tab-content .graph-area .bubble-area.grey.right .bubble::after {
  left: auto;
  right: 9px;
  -webkit-transform: translate(-50%, 58%) rotate(-45deg);
          transform: translate(-50%, 58%) rotate(-45deg);
}

.challenge_ranking .tab-content .section-divider {
  background-color: #e6e8f2;
  height: 6px;
}

.challenge_ranking .final-ranking {
  margin-top: 27px;
  margin-left: 16px;
  margin-bottom: 10px;
}

.challenge_ranking .final-ranking .text-item {
  font-weight: bold;
  font-size: 14px;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
}

.challenge_ranking .final-ranking .date-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
}

.challenge_ranking .tab-content .rank-tab-list {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 18px;
  padding: 0px 16px;
}

.challenge_ranking .tab-content .rank-tab-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 35px;
  border-bottom: solid 5px transparent;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.37px;
  color: #686b73;
}

.challenge_ranking .tab-content .rank-tab-list li.active {
  font-weight: bold;
  color: #5653ff;
  border-bottom: solid 5px #5653ff;
}

.challenge_ranking .tab-content .rank-tab-divider {
  height: 1px;
  background-color: #c7cad1;
  margin-top: -1px;
  z-index: -1;
  margin-bottom: 7px;
}

.challenge_ranking .tab-content .rank-tab-content {
  display: none;
}

.challenge_ranking .tab-content .rank-tab-content.active {
  display: block;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list {
  position: relative;
  list-style: none;
  padding: 79px 0 0 0;
}

.challenge_ranking #content-rank-group .rank-list {
  padding: 0 !important;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 14.5px 16px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_ranking #content-rank-group.tab-content .rank-tab-content .rank-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 17.5px 16px;
  border-bottom: solid 1px #e9edf0;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li.active {
  background-color: #f2f2fd;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li.active-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #f2f2fd;
  z-index: 50;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list.active li.active {
  position: fixed;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li.active .rank-area p {
  color: #5653ff;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li.active .value-item {
  color: #5653ff;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .rank-area {
  position: relative;
  width: 48px;
  height: 38px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .rank-area p {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 1px;
  font-weight: bold;
  font-size: 17px;
  line-height: 38px;
  letter-spacing: -0.45px;
  text-align: center;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .rank-area img {
  position: absolute;
  top: 3px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .rank-area .highlight {
  color: #5653ff;
  background: none;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .grade-area {
  position: relative;
  min-width: 44px;
  margin-left: 5px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .grade-area .profile-item {
  width: 44px;
  height: 44px;
  border-radius: 100%;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .grade-area .badge-item {
  position: absolute;
  top: 55%;
  right: -5px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .content-area {
  margin: 0 15px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .content-area .name-item {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  display: block;
  max-width: 130px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .content-area .grade-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: 0.3px;
  color: #686b73;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .value-item {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  margin-left: auto;
  white-space: pre;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area {
  margin-left: 8px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .region-item {
  width: 45px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 5px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area .label-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #363b41;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area.up .label-item {
  color: #5653ff;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area.down .label-item {
  color: #ff5151;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area .img-item {
  width: 10px;
  margin-left: 3px;
  margin-top: 1px;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area .value-item {
  margin-left: 4px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #363b41;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area.up .value-item {
  color: #5653ff;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .top-area .updown-area.down .value-item {
  color: #ff5151;
}

.challenge_ranking .tab-content .rank-tab-content .rank-list li .region-area .value-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
}

.challenge_ranking .graph-area .masking {
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 346px;
  top: -46px;
  left: 0px;
  opacity: 70%;
  background: #fff;
}

.challenge_ranking .graph-area .masking .text-item {
  position: absolute;
  left: 50%;
  top: 44%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: #686b73;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.43px;
  line-height: 24px;
  width: 200px;
  margin: 0 auto;
}

/* coaching_apply_agree */
body.coaching_apply_agree {
  background-color: #fff;
}

.coaching_apply_agree {
  /* agree-divider */
  /* contents-area */
  /* footer-area */
  /* popup custom */
}

.coaching_apply_agree li {
  list-style: none;
}

.coaching_apply_agree .header-divider {
  height: 1px;
  background-color: #e9edf0;
}

.coaching_apply_agree .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  /* border-bottom: solid 1px rgb(233, 237, 240); */
  background-color: #ffffff;
}

.coaching_apply_agree .header-area .title-item {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #363b41;
}

.coaching_apply_agree .header-area .all-agree-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 37px;
  margin-bottom: 26px;
}

.coaching_apply_agree .header-area .all-agree-area .ic-circle-check {
  width: 26px;
  height: 26px;
}

.coaching_apply_agree .header-area .all-agree-area .all-check {
  margin-left: 6.5px;
  height: 24px;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.24px;
  color: #363b41;
}

.coaching_apply_agree .agree-divider {
  width: calc(100% - 32px);
  margin: 0 auto;
  height: 1px;
  background-color: #e6e8f2;
}

.coaching_apply_agree .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.coaching_apply_agree .contents-wrapper .agree-list {
  margin-left: 2px;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 25px;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item .item-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item .item-left .check-item {
  width: 17px;
  height: 12px;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item .item-left .text-item {
  margin-left: 7px;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item .item-left.false .text-item {
  color: #c7cad1;
}

.coaching_apply_agree .contents-wrapper .agree-list .list-item .item-icon {
  cursor: pointer;
}

.coaching_apply_agree .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 17px;
}

.coaching_apply_agree .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: white;
}

.coaching_apply_agree .btn-submit:disabled {
  background-color: #dbe0e4;
  color: #686b73;
}

.coaching_apply_agree .middle-layer .alert-wrapper .alert-text {
  padding: 21px 0 19px;
}

.coaching_apply_agree .middle-layer .alert-wrapper .text-area {
  border-top: 1px solid #e6e8f2;
}

.coaching_apply_agree .middle-layer .alert-wrapper .text-area .text-wrapper {
  padding: 20px 24px 0px 22px;
  max-height: 316px;
  overflow-y: scroll;
}

.coaching_apply_agree .middle-layer .alert-wrapper .alert-area {
  margin-top: 22px;
  cursor: pointer;
}

.coaching_apply_agree .middle-layer .alert-wrapper .text-area .text-wrapper p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.2px;
  color: #080808;
}

/* coaching_apply_more */
body.coaching_apply_more {
  background-color: #f5f8fd;
}

.coaching_apply_more {
  /* 미션 리스트 */
  /* 미션 완료 */
  /* 아직 진행하지 않은 미션 */
}

.coaching_apply_more ul {
  list-style: none;
}

.coaching_apply_more .img-area {
  position: relative;
}

.coaching_apply_more .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.coaching_apply_more .header-area {
  padding: 30px 16px 21px;
  border-bottom: solid 1px #e9edf0;
  background-color: #ffffff;
}

.coaching_apply_more .header-area .deadline-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: -0.2px;
  color: #363b41;
}

.coaching_apply_more .header-area .title-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  color: #080808;
}

.coaching_apply_more .header-area .desc-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: -0.2px;
  color: #363b41;
  margin-top: 10px;
}

.coaching_apply_more .contents-wrapper {
  padding: 25px 0px;
}

.coaching_apply_more .contents-wrapper .thumbnail {
  width: 100%;
}

.coaching_apply_more .missions-area .mission-list {
  position: relative;
  margin-top: 20px;
}

.coaching_apply_more .missions-area .mission-list:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  bottom: 0;
  left: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(white), to(transparent));
  background: linear-gradient(0deg, white 0%, transparent 100%);
}

.coaching_apply_more .missions-area .mission-list .list-item {
  width: calc(100% - 32px);
  margin: 15px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
  position: relative;
}

.coaching_apply_more .missions-area .mission-list .list-item .item-wrapper .left-item p {
  color: #5653ff;
}

.coaching_apply_more .missions-area .mission-list .list-item .item-wrapper {
  padding: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_apply_more .missions-area .mission-list .list-item .item-wrapper .left-item {
  border-radius: 7px;
  background-color: #dfdefb;
  width: 65px;
  height: 65px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #5653ff;
}

.coaching_apply_more .missions-area .mission-list .list-item.doing .item-wrapper .left-item {
  background-color: #5653ff;
}

.coaching_apply_more .missions-area .mission-list .list-item.doing .item-wrapper .left-item p {
  color: #fff;
}

.coaching_apply_more .missions-area .item-wrapper .left-item .text-item {
  margin-top: 10px;
}

.coaching_apply_more .missions-area .item-wrapper .left-item .text-item:nth-child(2) {
  margin-top: 0px;
}

.coaching_apply_more .missions-area .mission-list .list-item .item-wrapper .right-item {
  margin-left: 12px;
}

.coaching_apply_more .missions-area .item-wrapper .right-item .text-item {
  margin-top: 9px;
  width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
}

.coaching_apply_more .missions-area .item-wrapper .right-item .text-item:nth-child(2) {
  margin-top: 3px;
  font-weight: normal;
  color: #363b41;
}

.coaching_apply_more .missions-area .mission-list .list-item .finish-area {
  display: none;
}

.coaching_apply_more .missions-area .mission-list .list-item.finish .finish-area {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url("../images/bg/bg_blue_right_boder.png");
  background-size: 50px 50px;
  width: 50px;
  height: 50px;
}

.coaching_apply_more .missions-area .mission-list .list-item.finish .finish-area .confirm {
  position: absolute;
  top: 7px;
  right: 4px;
  width: 22px;
  height: 18px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  text-align: center;
  color: #ffffff;
}

.coaching_apply_more .missions-area .mission-list .list-item.next .item-wrapper .left-item {
  background-color: #dbe0e4;
}

.coaching_apply_more .missions-area .mission-list .list-item.next .text-item {
  color: #a4a9b3 !important;
}

/* coaching_apply */
body.coaching_apply {
  background-color: #f5f8fd;
}

.coaching_apply {
  /* 미션 리스트 */
  /* 미션 완료 */
  /* 아직 진행하지 않은 미션 */
}

.coaching_apply ul {
  list-style: none;
}

.coaching_apply .img-area {
  position: relative;
}

.coaching_apply .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.coaching_apply .header-area {
  padding: 30px 24px 21px;
  border-bottom: solid 1px #e9edf0;
  background-color: #ffffff;
}

.coaching_apply .header-area .deadline-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: -0.2px;
  color: #363b41;
}

.coaching_apply .header-area .title-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  color: #080808;
}

.coaching_apply .header-area .desc-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: -0.2px;
  color: #363b41;
  margin-top: 10px;
}

.coaching_apply .contents-wrapper {
  padding: 25px 0px 0 0;
  margin-bottom: 134px;
}

.coaching_apply .contents-wrapper .thumbnail {
  width: 100%;
}

.coaching_apply .footer-area {
  width: 100%;
  padding: 0 16px 0px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 17px;
}

.coaching_apply .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: white;
}

.coaching_apply .missions-area .mission-list {
  position: relative;
  margin-top: 20px;
}

.coaching_apply .missions-area .mission-list:after {
  content: "";
  display: block;
  position: fixed;
  height: 200px;
  right: 0;
  bottom: 0;
  left: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(white), to(transparent));
  background: linear-gradient(0deg, white 0%, transparent 100%);
}

.coaching_apply .missions-area .mission-list .list-item {
  width: calc(100% - 32px);
  margin: 15px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
  position: relative;
}

.coaching_apply .missions-area .mission-list .list-item .item-wrapper .left-item p {
  color: #5653ff;
}

.coaching_apply .missions-area .mission-list .list-item .item-wrapper {
  padding: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_apply .missions-area .mission-list .list-item .item-wrapper .left-item {
  border-radius: 7px;
  background-color: #dfdefb;
  width: 65px;
  height: 65px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #5653ff;
}

.coaching_apply .missions-area .mission-list .list-item.doing .item-wrapper .left-item {
  background-color: #5653ff;
}

.coaching_apply .missions-area .mission-list .list-item.doing .item-wrapper .left-item p {
  color: #fff;
}

.coaching_apply .missions-area .item-wrapper .left-item .text-item {
  margin-top: 10px;
}

.coaching_apply .missions-area .item-wrapper .left-item .text-item:nth-child(2) {
  margin-top: 0px;
}

.coaching_apply .missions-area .mission-list .list-item .item-wrapper .right-item {
  margin-left: 12px;
}

.coaching_apply .missions-area .item-wrapper .right-item .text-item {
  margin-top: 9px;
  width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
}

.coaching_apply .missions-area .item-wrapper .right-item .text-item:nth-child(2) {
  margin-top: 3px;
  font-weight: normal;
  color: #363b41;
}

.coaching_apply .missions-area .mission-list .list-item .finish-area {
  display: none;
}

.coaching_apply .missions-area .mission-list .list-item.finish .finish-area {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url("../images/bg/bg_blue_right_boder.png");
  background-size: 50px 50px;
  width: 50px;
  height: 50px;
}

.coaching_apply .missions-area .mission-list .list-item.finish .finish-area .confirm {
  position: absolute;
  top: 7px;
  right: 4px;
  width: 22px;
  height: 18px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  text-align: center;
  color: #ffffff;
}

.coaching_apply .missions-area .mission-list .list-item.next .item-wrapper .left-item {
  background-color: #dbe0e4;
}

.coaching_apply .missions-area .mission-list .list-item.next .text-item {
  color: #a4a9b3 !important;
}

/* coaching_messege */
body.coaching_messege {
  background-color: #f2f4fb;
}

.coaching_messege {
  /* 상단 divider */
  /* 상단 알림창 */
  /* 채팅 영역 */
  /* 채팅 user-coach 공통 */
  /* 채팅 user */
  /* 채팅 coach */
  /* 코칭 status */
  /* 하단 fixed */
}

.coaching_messege ul {
  list-style: none;
}

.coaching_messege .header-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
}

.coaching_messege .header-alert {
  width: calc(100% - 32px);
  margin: 21px auto 0px;
  opacity: 0.9;
  border-radius: 10px;
  background-color: #c7cad1;
}

.coaching_messege .header-alert .text-item {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ffffff;
  width: 284px;
  margin: 0 auto;
  padding: 6px 0;
}

.coaching_messege .chatting-list {
  width: calc(100% - 32px);
  margin: 25px auto 0;
  padding-bottom: 86px;
}

.coaching_messege .chatting-list .date-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  margin-top: 30px;
}

.coaching_messege .chatting-list .date-area .left-border {
  height: 1px;
  background-color: #c7cad1;
  width: calc((100% - 113px) / 2);
}

.coaching_messege .chatting-list .date-area .date-item {
  width: 113px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #686b73;
}

.coaching_messege .chatting-list .date-area .right-border {
  height: 1px;
  background-color: #c7cad1;
  width: calc((100% - 113px) / 2);
}

.coaching_messege .chatting-list .chat-list {
  margin-top: 20px;
}

.coaching_messege .chatting-list .chat-list .writer-id {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #080808;
  margin: 0 12px;
}

.coaching_messege .chatting-list .chat-list .contents .contents-img {
  width: 170px;
}

.coaching_messege .chatting-list .chat-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.coaching_messege .chatting-list .chat-list.user {
  text-align: right;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.coaching_messege .chatting-list .chat-list.user .contents {
  border: solid 1px #dfdefb;
  background-color: #dfdefb;
  border-radius: 10px;
  padding: 15px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.3px;
  color: #080808;
  text-align: left;
  max-width: 170px;
  margin-top: 20px;
  position: relative;
  margin-right: 12px;
}

.coaching_messege .chatting-list .chat-list.user .contents .time {
  display: none;
}

.coaching_messege .chatting-list .chat-list.user .contents:nth-last-child(1) .time {
  display: block;
  position: absolute;
  left: -65px;
  bottom: 0px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
}

.coaching_messege .chatting-list .chat-list.user .contents::after {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  border-bottom: 12px solid transparent;
  border-left: 12px solid #dfdefb;
  top: 12px;
  right: -12px;
}

.coaching_messege .chatting-list .chat-list.user .contents:nth-child(2) {
  margin-top: 9px;
}

.coaching_messege .chatting-list .chat-list.coach {
  text-align: left;
}

.coaching_messege .chatting-list .chat-list.coach .contents {
  border: solid 1px #fff;
  background-color: #fff;
  border-radius: 10px;
  padding: 11px 15px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.3px;
  color: #080808;
  text-align: left;
  max-width: 170px;
  margin-top: 20px;
  position: relative;
  margin-left: 12px;
}

.coaching_messege .chatting-list .chat-list.coach .contents .time {
  display: none;
}

.coaching_messege .chatting-list .chat-list.coach .contents:nth-last-child(1) .time {
  display: block;
  position: absolute;
  right: -65px;
  bottom: 0px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
}

.coaching_messege .chatting-list .chat-list.coach .contents::after {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  border-bottom: 12px solid transparent;
  border-right: 12px solid #fff;
  top: 12px;
  left: -12px;
}

.coaching_messege .chatting-list .chat-list.coach .contents:nth-child(2) {
  margin-top: 9px;
}

.coaching_messege .chatting .status {
  display: none;
}

.coaching_messege .chatting.finish .status {
  display: block;
}

.coaching_messege .chatting.finish .status .end-text {
  width: 171px;
  opacity: 0.9;
  border-radius: 10px;
  background-color: #c7cad1;
  color: #fff;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  padding: 5px 0;
  margin: 24px auto 0;
}

.coaching_messege .chatting.doing .fixed-item.doing {
  display: block;
}

.coaching_messege .chatting.finish .fixed-item.doing {
  display: none;
}

.coaching_messege .chatting.doing .fixed-item.finish {
  display: none;
}

.coaching_messege .chatting.finish .fixed-item.finish {
  display: block;
}

.coaching_messege .fixed-item {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #ffffff;
  z-index: 100;
}

.coaching_messege .comment {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px;
  border-top: 1px solid #e6e8f2;
}

.coaching_messege .comment-input-box {
  margin-left: 10px;
  border-radius: 7px;
  background-color: #f2f4fb;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.coaching_messege .comment-input-box input[type="text"] {
  padding: 5px 0 6px 16px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
}

.coaching_messege .comment-input-box input[type="text"]::-webkit-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.coaching_messege .comment-input-box input[type="text"]:-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.coaching_messege .comment-input-box input[type="text"]::-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.coaching_messege .comment-input-box input[type="text"]::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.coaching_messege .comment .button {
  margin-left: 10px;
}

/* coaching_mission_detail */
body.coaching_mission_detail {
  background-color: #fff;
}

.coaching_mission_detail {
  /*.quiz-prepare-2 .contents-wrapper{
    padding: 0px 24px 30px;
}*/
  /* mission-quiz section */
  /* quiz-2 prepare */
  /* quiz-3 prepare */
  /* mission-finish */
  /* finish quiz-1 */
  /* finish quiz-2 */
  /* finish quiz-3 */
  /* 팝업 커스텀 */
}

.coaching_mission_detail ul {
  list-style: none;
}

.coaching_mission_detail .mission-confirm {
  display: none;
}

.coaching_mission_detail .mission-confirm:first-child {
  display: block;
}

.coaching_mission_detail .mission-quiz {
  display: block;
}

.coaching_mission_detail .mission-confirm.finish {
  display: none;
}

.coaching_mission_detail .img-area {
  position: relative;
}

.coaching_mission_detail .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.coaching_mission_detail .header-area {
  padding: 30px 24px 20px;
  border-bottom: solid 1px #e9edf0;
  background-color: #ffffff;
}

.coaching_mission_detail .header-area .deadline-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.2px;
  color: #5653ff;
}

.coaching_mission_detail .header-area .title-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  color: #080808;
}

.coaching_mission_detail .contents-wrapper {
  padding: 20px 24px 0px;
  margin-bottom: 124px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #080808;
}

.coaching_mission_detail .quiz-prepare-2 .list-style {
  list-style: "- ";
  margin-left: 4px;
}

.coaching_mission_detail .contents-wrapper .text-header .text-item {
  font-weight: bold;
}

.coaching_mission_detail .contents-wrapper .text-content {
  margin-top: 20px;
}

.coaching_mission_detail .btn-area {
  width: 100%;
  text-align: center;
  position: fixed;
  bottom: 0px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: #fff;
}

.coaching_mission_detail .btn-area .confirm {
  width: calc(100% - 30px);
  color: #fff;
  border: 0px;
  background-color: #5653ff;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  padding: 18px 0;
  border-radius: 10px;
  margin-bottom: 17px;
}

.coaching_mission_detail .mission-quiz .quiz-prepare-1 {
  display: none;
}

.coaching_mission_detail .mission-quiz .quiz.step-1 {
  display: none;
}

.coaching_mission_detail .mission-quiz .quiz.step-2 {
  display: none;
}

.coaching_mission_detail .mission-quiz .quiz.step-3 {
  display: none;
}

.coaching_mission_detail .mission-quiz .quiz {
  /* padding:0 24px; */
}

.coaching_mission_detail .mission-quiz .quiz .quiz-title {
  padding: 0 24px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.48px;
  color: #5653ff;
  margin-top: 23px;
}

.coaching_mission_detail .mission-quiz .quiz .question {
  padding: 0 24px;
  font-size: 21px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.48;
  letter-spacing: -0.56px;
  color: #363b41;
  margin-top: 12px;
  width: 229px;
}

.coaching_mission_detail .mission-quiz .five-choice {
  margin-top: 30px;
  margin-bottom: 188px;
  padding: 0 24px;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item {
  margin-top: 10px;
  width: 100%;
  border-radius: 10px;
  border: solid 1px #c7cad1;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 72px;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item.active {
  border: solid 2px #5653ff;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item.active .item-right {
  color: #5653ff;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item.active .item-left {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #5653ff;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item:nth-child(1) {
  margin-top: 0px;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item .item-right {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41;
  letter-spacing: normal;
  color: #363b41;
  margin-left: 19px;
}

.coaching_mission_detail .mission-quiz .five-choice .choice-item .item-left {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-left: 14px;
  width: 261px;
}

.coaching_mission_detail .mission-quiz .ox-choice {
  margin-top: 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 24px;
}

.coaching_mission_detail .mission-quiz .ox-choice .o-area {
  width: calc((100% - 9px) / 2);
  height: 158px;
  border-radius: 10px;
  border: solid 1.5px #c7cad1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.coaching_mission_detail .mission-quiz .ox-choice .o-area .o-img {
  width: 90px;
  height: 90px;
}

.coaching_mission_detail .mission-quiz .ox-choice .o-area.active {
  border: solid 2px #5653ff;
}

.coaching_mission_detail .mission-quiz .ox-choice .x-area {
  margin-left: 9px;
  width: calc((100% - 9px) / 2);
  height: 158px;
  border-radius: 10px;
  border: solid 1.5px #c7cad1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.coaching_mission_detail .mission-quiz .ox-choice .x-area.active {
  border: solid 2px #5653ff;
}

.coaching_mission_detail .mission-quiz .ox-choice .x-area .x-img {
  width: 90px;
  height: 90px;
}

.coaching_mission_detail .mission-quiz .quiz-navi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: -30px;
  left: 0;
  right: 0;
  padding: 0;
  height: 30px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  background: #fff;
}

.coaching_mission_detail .mission-quiz .button-area {
  /* margin:23px auto 34px; */
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  width: 100%;
  /* width:calc(100% - 48px); */
  text-align: center;
}

.coaching_mission_detail .mission-quiz #step_2 .button-area {
  /* margin:196px auto 34px; */
  position: fixed;
  /* bottom:34px;
    width:calc(100% - 48px); */
}

.coaching_mission_detail .mission-quiz .button-area .answer-check {
  border-radius: 10px;
  background-color: #dbe0e4;
  padding: 18px 0;
  font-size: 17px;
  width: 100%;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #686b73;
  margin-top: 19px;
  width: calc(100% - 48px);
  margin-bottom: 34px;
}

.coaching_mission_detail .mission-quiz .button-area .answer-check.active {
  background-color: #5653ff;
  color: #fff;
}

.coaching_mission_detail .mission-quiz .quiz-prepare-2 {
  display: none;
}

.coaching_mission_detail .mission-quiz .quiz-prepare-3 {
  display: none;
}

.coaching_mission_detail .mission-finish {
  display: none;
}

.coaching_mission_detail .mission-finish .quiz.step-1 {
  display: block;
  width: calc(100% - 48px);
  margin: 0 auto;
}

.coaching_mission_detail .mission-finish .quiz.step-1 .quiz-title {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #5653ff;
  margin-top: 23px;
}

.coaching_mission_detail .mission-finish .quiz.step-1 .question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  margin-top: 12px;
}

.coaching_mission_detail .mission-finish .quiz.step-1 .question .title {
  font-size: 21px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.48;
  letter-spacing: -0.56px;
  color: #363b41;
}

.coaching_mission_detail .mission-finish .quiz.step-1 .question .finish-answer-1 {
  /* padding: 2px 10px 4px; */
  border-radius: 5px;
  background-color: #5653ff;
  color: #fff;
  /* display: flex;
    align-items: center; */
  height: 34px;
  line-height: 34px;
  text-align: center;
  min-width: 81px;
}

.coaching_mission_detail .mission-finish .quiz.step-2 {
  display: block;
  width: calc(100% - 48px);
  margin: 0 auto;
}

.coaching_mission_detail .mission-finish.finish .step-2 {
  display: none;
}

.coaching_mission_detail .mission-finish .quiz.step-2 .quiz-title {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #5653ff;
  margin-top: 23px;
}

.coaching_mission_detail .mission-finish .quiz.step-2 .question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  margin-top: 12px;
}

.coaching_mission_detail .mission-finish .quiz.step-2 .question .title {
  font-size: 21px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.48;
  letter-spacing: -0.56px;
  color: #363b41;
  width: 229px;
}

.coaching_mission_detail .mission-finish .quiz.step-2 .question .finish-answer-2 {
  /* padding: 2px 10px 4px; */
  border-radius: 5px;
  background-color: #5653ff;
  color: #fff;
  text-align: center;
  height: 34px;
  line-height: 34px;
  min-width: 67px;
}

.coaching_mission_detail .mission-finish .quiz.step-3 {
  display: none;
  width: calc(100% - 48px);
  margin: 0 auto;
}

.coaching_mission_detail .mission-finish .quiz.step-3 .question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  margin-top: 12px;
}

.coaching_mission_detail .mission-finish .quiz.step-3 .quiz-title {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #5653ff;
  margin-top: 23px;
}

.coaching_mission_detail .mission-finish .quiz.step-3 .question .title {
  font-size: 21px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.48;
  letter-spacing: -0.56px;
  color: #363b41;
}

.coaching_mission_detail .mission-finish .quiz.step-3 .question .finish-answer-3 {
  border-radius: 5px;
  background-color: #5653ff;
  color: #fff;
  text-align: center;
  height: 34px;
  line-height: 34px;
  min-width: 81px;
}

.coaching_mission_detail .mission-finish .five-choice {
  margin-top: 30px;
  margin-bottom: 188px;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item {
  margin-top: 10px;
  width: 100%;
  border-radius: 10px;
  border: solid 1px #c7cad1;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 72px;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item.active {
  border: solid 2px #5653ff;
  background-color: #f2f2fd;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item.active .item-right {
  color: #5653ff;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item.active .item-left {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #5653ff;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item:nth-child(1) {
  margin-top: 0px;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item .item-right {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.41;
  letter-spacing: normal;
  color: #363b41;
  margin-left: 19px;
}

.coaching_mission_detail .mission-finish .five-choice .choice-item .item-left {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-left: 14px;
  width: 261px;
}

.coaching_mission_detail .mission-finish .ox-choice {
  margin-top: 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_mission_detail .mission-finish .ox-choice .o-area {
  width: 159px;
  height: 158px;
  border-radius: 10px;
  border: solid 1.5px #c7cad1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.coaching_mission_detail .mission-finish .ox-choice .o-area .o-img {
  width: 90px;
  height: 90px;
}

.coaching_mission_detail .mission-finish .ox-choice .o-area.active {
  border: solid 2px #5653ff;
  background-color: #f2f2fd;
}

.coaching_mission_detail .mission-finish .ox-choice .x-area {
  margin-left: 9px;
  width: 159px;
  height: 158px;
  border-radius: 10px;
  border: solid 1.5px #c7cad1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.coaching_mission_detail .mission-finish .ox-choice .x-area.active {
  border: solid 2px #5653ff;
  background-color: #f2f2fd;
}

.coaching_mission_detail .mission-finish .ox-choice .x-area .x-img {
  width: 90px;
  height: 90px;
}

.coaching_mission_detail .mission-finish .quiz-navi {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  padding: 20px 24px;
}

.coaching_mission_detail .mission-finish #finish_step_2 .quiz-navi {
  margin-top: 248px;
}

.coaching_mission_detail .middle-layer .alert-wrapper .alert-text .alert-comment {
  max-width: 279px;
  margin: 4px auto 0;
}

.coaching_mission_detail .quiz-navi {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  position: fixed;
  bottom: 0px;
  width: 100%;
  padding: 17px 0px;
  background-color: #fff;
}

.coaching_mission_detail .quiz-navi .navi-wrapper {
  width: calc(100% - 32px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto;
}

/* coaching_mission_list */
body.coaching_mission_list {
  background-color: #f5f8fd;
}

.coaching_mission_list {
  /* 헤더 */
  /* 헤더 진행 이미지 */
  /* 헤더 종료 이미지 */
  /* 헤더 그래프 영역 */
  /* 미션 목록 */
  /* 하단 플로팅 영역 */
  /* 미션 리스트 */
  /* 미션 완료 */
  /* 아직 진행하지 않은 미션 */
}

.coaching_mission_list ul {
  list-style: none;
}

.coaching_mission_list .header-area {
  border-top: solid 1px #e9edf0;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_mission_list .header-area.doing .header-img-doing {
  display: block;
}

.coaching_mission_list .header-area.finish .header-img-doing {
  display: none;
}

.coaching_mission_list .header-area .header-img-doing {
  width: 45.6%;
  max-height: 173px;
  max-width: 171px;
}

.coaching_mission_list .header-area.finish .header-img-finish {
  display: block;
}

.coaching_mission_list .header-area.doing .header-img-finish {
  display: none;
}

.coaching_mission_list .header-area .header-img-finish {
  width: 45.6%;
  max-height: 173px;
  max-width: 171px;
}

.coaching_mission_list .header-area.finish .graph-area .graph-item-area .outer-graph .inner-graph {
  background-color: #080808;
}

.coaching_mission_list .header-area .header-content {
  width: 100%;
  margin-left: 9px;
}

.coaching_mission_list .header-area .header-content .step {
  font-size: 19px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.37;
  letter-spacing: normal;
  color: #080808;
  margin-top: 22px;
}

.coaching_mission_list .header-area .header-content .step-detail {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
  margin-top: 1px;
}

.coaching_mission_list .header-area .header-content .step {
  display: none;
}

.coaching_mission_list .header-area .header-content .step-detail {
  display: none;
}

.coaching_mission_list .header-area.doing .header-content .step.doing {
  display: block;
}

.coaching_mission_list .header-area.doing .header-content .step-detail.doing {
  display: block;
}

.coaching_mission_list .header-area.finish .header-content .step.finish {
  display: block;
}

.coaching_mission_list .header-area.finish .header-content .step-detail.finish {
  display: block;
}

.coaching_mission_list .header-area .graph-area .graph-item-area {
  margin-right: 16px;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .period {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .title-label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  margin-top: 12px;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .title-label.bottom {
  margin-top: 7px;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .outer-graph {
  position: relative;
  width: 55.86%;
  height: 8px;
  background-color: #e6e8f2;
  border-radius: 7px;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .graph-period {
  width: calc(100% - 55.86%);
  text-align: center;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: -0.4px;
  color: #686b73;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .graph-period .doing-date {
  font-weight: bold;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.36;
  letter-spacing: -0.4px;
  color: #25282b;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .outer-graph .inner-graph {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 8px;
  border-radius: 7px;
  background-color: #5653ff;
}

.coaching_mission_list .end .graph-area .graph-item-area .outer-graph .inner-graph {
  background-color: black;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .value-item {
  margin-top: 3px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.4px;
  color: #25282b;
}

.coaching_mission_list .header-area .graph-area .graph-item-area .unit-item {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #686b73;
}

.coaching_mission_list .missions-area {
  padding-bottom: 20px;
}

.coaching_mission_list .missions-area .list-title {
  height: 41px;
  background-color: #e6e8f2;
}

.coaching_mission_list .missions-area .list-title p {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  padding-top: 9px;
  margin-left: 20px;
}

.coaching_mission_list .footer-area {
  width: 64px;
  height: 64px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.08);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.08);
  background-color: #5653ff;
  position: fixed;
  right: 14px;
  bottom: 17px;
  border-radius: 50%;
}

.coaching_mission_list .footer-area .ic-commu {
  position: absolute;
  top: 50%;
  width: 24px;
  height: 22px;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 1.4px;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.coaching_mission_list .footer-area .not-read {
  position: absolute;
  top: 0px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background-color: #ff5151;
  right: 0px;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
}

.coaching_mission_list .missions-area .mission-list {
  margin-top: 20px;
}

.coaching_mission_list .missions-area .mission-list .list-item {
  width: calc(100% - 32px);
  margin: 15px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
  position: relative;
}

.coaching_mission_list .missions-area .mission-list .list-item .item-wrapper .left-item p {
  color: #5653ff;
}

.coaching_mission_list .missions-area .mission-list .list-item .item-wrapper {
  padding: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_mission_list .missions-area .mission-list .list-item .item-wrapper .left-item {
  border-radius: 7px;
  background-color: #dfdefb;
  width: 65px;
  height: 65px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #5653ff;
}

.coaching_mission_list .missions-area .mission-list .list-item.doing .item-wrapper .left-item {
  background-color: #5653ff;
}

.coaching_mission_list .missions-area .mission-list .list-item.doing .item-wrapper .left-item p {
  color: #fff;
}

.coaching_mission_list .missions-area .item-wrapper .left-item .text-item {
  margin-top: 10px;
}

.coaching_mission_list .missions-area .item-wrapper .left-item .text-item:nth-child(2) {
  margin-top: 0px;
}

.coaching_mission_list .missions-area .mission-list .list-item .item-wrapper .right-item {
  margin-left: 12px;
}

.coaching_mission_list .missions-area .item-wrapper .right-item .text-item {
  margin-top: 9px;
  width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
}

.coaching_mission_list .missions-area .item-wrapper .right-item .text-item:nth-child(2) {
  margin-top: 3px;
  font-weight: normal;
  color: #363b41;
}

.coaching_mission_list .missions-area .mission-list .list-item .finish-area {
  display: none;
}

.coaching_mission_list .missions-area .mission-list .list-item.finish .finish-area {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url("../images/bg/bg_blue_right_boder.png");
  background-size: 50px 50px;
  width: 50px;
  height: 50px;
}

.coaching_mission_list .missions-area .mission-list .list-item.finish .finish-area .confirm {
  position: absolute;
  top: 7px;
  right: 4px;
  width: 22px;
  height: 18px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  text-align: center;
  color: #ffffff;
}

.coaching_mission_list .missions-area .mission-list .list-item.next .item-wrapper .left-item {
  background-color: #dbe0e4;
}

.coaching_mission_list .missions-area .mission-list .list-item.next .text-item {
  color: #a4a9b3 !important;
}

/* coaching */
body.coaching {
  background-color: #f5f8fd;
}

.coaching {
  overflow-x: hidden;
  /* the slides */
  /* the parent */
  /* slick 슬라이더 커스텀 */
}

.coaching .slick-list {
  overflow: visible !important;
  height: -webkit-fit-content !important;
  height: -moz-fit-content !important;
  height: fit-content !important;
}

.coaching .slick-slide {
  margin: 0 5px 0 5px;
}

.coaching .slick-list {
  margin: 0 -5px;
}

.coaching .slider-wrapper .swiper-container {
  padding: 20px 10px 80px;
}

.coaching .card-list .swiper-slide {
  width: 95% !important;
  border-radius: 10px;
}

.coaching .swiper-pagination {
  bottom: 30px;
}

.coaching .swiper-pagination .swiper-pagination-bullet-active {
  background: #000;
}

.coaching .item-wrapper {
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 8px 20px 10px rgba(96, 110, 170, 0.06);
  padding: 34px 22px 42px 22px;
}

.coaching .item-wrapper .status-item {
  width: 65px;
  padding: 2px 0px;
  border-radius: 5px;
  background-color: #eeeefa;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: center;
  color: #5653ff;
}

.coaching .end .status-item {
  color: #686b73;
}

.coaching .item-wrapper .title-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 15px;
}

.coaching .item-wrapper .title-item {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: -0.53px;
  color: #21211d;
  position: relative;
}

.coaching .item-wrapper .apply-button {
  display: none;
  min-width: 90px;
  width: 90px;
  height: 30px;
  border-radius: 15.5px;
  background-color: #5653ff;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.4px;
}

.coaching .item-wrapper.apply .apply-button {
  display: block;
}

.coaching .item-wrapper .deadline-item {
  margin-top: 3px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #686b73;
}

.coaching .item-wrapper .img-area {
  position: relative;
  margin-top: 16px;
}

.coaching .item-wrapper .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 10px;
}

.coaching .item-wrapper .img-area .mask {
  display: none;
}

.coaching .end .img-area .mask {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #ffffff;
  opacity: 0.6;
  border-radius: 10px;
}

.coaching .item-wrapper.end .img-area:before {
  content: "코칭 종료";
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.12;
  letter-spacing: normal;
  color: white;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.coaching .item-wrapper .contents-item {
  margin-top: 19px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.69;
  letter-spacing: -0.4px;
  color: #686b73;
  word-break: break-all;
}

.coaching .item-wrapper .divider {
  margin: 25px 0px 25px 0px;
  height: 1px;
  background-color: #e9edf0;
}

.coaching .item-wrapper .graph-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching .item-wrapper .graph-area .graph-item-area {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.coaching .item-wrapper .graph-area .graph-item-area:nth-child(n + 2) {
  padding-left: 30px;
}

.coaching .item-wrapper .graph-area .graph-item-area .title-label {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.coaching .item-wrapper .graph-area .graph-item-area .outer-graph {
  position: relative;
  width: 100%;
  height: 8px;
  background-color: #e6e8f2;
  border-radius: 7px;
  margin-top: 7px;
}

.coaching .item-wrapper .graph-area .graph-item-area .outer-graph .inner-graph {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 8px;
  border-radius: 7px;
  background-color: #5653ff;
}

.coaching .end .graph-area .graph-item-area .outer-graph .inner-graph {
  background-color: black;
}

.coaching .item-wrapper .graph-area .graph-item-area .value-item {
  margin-top: 3px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.4px;
  color: #25282b;
}

.coaching .item-wrapper .graph-area .graph-item-area .unit-item {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #686b73;
}

.coaching .slick-dots {
  bottom: -36px;
  left: -4px;
}

.coaching .slick-dots li button {
  width: 15px;
  height: 15px;
}

.coaching .slick-dots li button:before {
  font-size: 30px;
  color: #a4a9b3;
  opacity: 0.4;
}

.coaching .slick-dots li.slick-active button:before {
  color: #333;
}

.coaching .slick-dots li {
  margin: 0px;
}

/* community_board_detail */
body.community_board_detail {
  background-color: white;
}

.community_board_detail .item-wrapper {
  background-color: white;
  padding-top: 18px;
}

.community_board_detail .item-wrapper.reply {
  padding-bottom: 90px;
}

.community_board_detail .card-header-area {
  padding: 0 18px 0 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.community_board_detail .profile-img-area {
  position: relative;
}

.community_board_detail .profile-img-area .profile-item {
  width: 36px;
  height: 36px;
  border-radius: 100%;
}

.community_board_detail .comment-list .reply .profile-img-area .profile-item {
  width: 28px;
  height: 28px;
  border-radius: 100%;
}

.community_board_detail .profile-img-area .badge-item {
  position: absolute;
  width: 14px;
  top: 59%;
  right: -5px;
}

.community_board_detail .profile-img-area .alert-item {
  width: 30px;
  height: 30px;
}

.community_board_detail .profile-area {
  margin-left: 12px;
}

.community_board_detail .profile-area .name-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
}

.community_board_detail .profile-area .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_board_detail .more-button {
  margin-left: auto;
  display: none;
}

.community_board_detail .item-wrapper.written .card-header-area .more-button {
  display: block;
}

.community_board_detail .card-body-area {
  margin-top: 14px;
}

.community_board_detail .card-body-area .contents {
  padding: 0 16px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
}

.community_board_detail .card-body-area .img-area {
  position: relative;
  margin-top: 15px;
}

.community_board_detail .img-area img {
  width: 100%;
  display: block;
}

.community_board_detail .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #e6e8f2;
}

.community_board_detail .button-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.community_board_detail .button-list li:last-of-type {
  border-bottom-right-radius: 10px;
}

.community_board_detail .button-list li:nth-last-of-type(n + 2) {
  border-bottom-left-radius: 10px;
}

.community_board_detail .like-container,
.community_board_detail .reply-container {
  display: none;
}

.community_board_detail .like .like-container {
  display: block;
}

.community_board_detail .reply .reply-container {
  display: block;
}

.community_board_detail .button-list .switch-container input[type="checkbox"] {
  display: none;
}

.community_board_detail .button-list .switch-container input[type="checkbox"] + label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 43px;
  -webkit-tap-highlight-color: transparent;
}

.community_board_detail .button-list .switch-container input[type="checkbox"] + label::before {
  content: "";
  width: 30px;
  height: 30px;
  background: url("../images/icon_like_off.svg") no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  margin-right: 3px;
}

.community_board_detail .button-list .switch-container input[type="checkbox"]:checked + label {
  color: #5653ff;
}

.community_board_detail .button-list .switch-container input[type="checkbox"]:checked + label::before {
  background: url("../images/icon_like_on.svg") no-repeat;
  background-size: contain;
}

.community_board_detail .button-list .reply-button {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  height: 43px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-tap-highlight-color: transparent;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.community_board_detail .button-list .reply-button img {
  margin-right: 3px;
}

.community_board_detail .like-desc {
  margin-top: 15px;
  padding: 0 16px;
}

.community_board_detail .item-wrapper .like-desc {
  display: none;
}

.community_board_detail .item-wrapper.like .like-desc {
  display: block;
}

.community_board_detail .item-wrapper.like .like-desc.empty {
  display: none;
}

.community_board_detail .item-wrapper.like .like-desc.none {
  display: none;
}

.community_board_detail .like-desc p {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.community_board_detail .item-wrapper .comments {
  display: none;
}

.community_board_detail .item-wrapper.like .comments {
  margin-top: 22px;
}

.community_board_detail .item-wrapper.reply .comments {
  display: block;
}

.community_board_detail .item-wrapper.reply .comments.empty {
  display: none;
}

.community_board_detail .comment-list {
  list-style: none;
}

.community_board_detail .comment-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px 16px 9px 16px;
}

.community_board_detail .comment-list li.written {
  background-color: #f2f2fd;
}

.community_board_detail .comment-list li.update {
  background-color: #f2f2fd;
}

.community_board_detail .comment-list li.reply {
  padding-left: 61px;
  margin-top: 4px;
}

.community_board_detail .comment-list li.removed {
  /* padding-top: 10px;
    padding-bottom: 10px; */
}

.community_board_detail .comment-wrapper {
  margin-left: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.community_board_detail .comment-wrapper .comment-item {
  line-height: 0.9;
}

.community_board_detail li.removed .comment-wrapper {
  margin-left: 14px;
}

.community_board_detail .comment-item .name-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.community_board_detail .comment-item .comment-value {
  margin-left: 6px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  word-break: break-all;
}

.community_board_detail .comment-item .alert-message {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #686b73;
}

.community_board_detail .comment-info {
  margin-top: 1px;
  line-height: 0.9;
}

.community_board_detail .comment-info .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_board_detail .comment-info .reply-item {
  margin-left: 12px;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_board_detail .comment-list .more-button {
  padding-left: 10px;
  display: none;
}

.community_board_detail .comment-list li.written .more-button {
  display: block;
}

.community_board_detail .fixed-item {
  display: none;
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #ffffff;
}

.community_board_detail .item-wrapper.reply + .fixed-item {
  display: block;
}

.community_board_detail .comment {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px;
  border-top: 1px solid #e6e8f2;
}

.community_board_detail .comment-input-box {
  margin-left: 10px;
  border-radius: 7px;
  background-color: #f2f4fb;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.community_board_detail .comment-input-box input[type="text"] {
  padding: 5px 0 6px 16px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  width: 88%;
}

.community_board_detail .comment-input-box input[type="text"]::-webkit-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_board_detail .comment-input-box input[type="text"]:-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_board_detail .comment-input-box input[type="text"]::-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_board_detail .comment-input-box input[type="text"]::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_board_detail .comment .button {
  margin-left: 10px;
}

.community_board_detail .fixed-item .button-area {
  margin-left: 10px;
}

.community_board_detail .fixed-item .button-area button {
  font-weight: bold;
  letter-spacing: 0px;
  line-height: 23px;
  font-size: 14px;
  border-radius: 16px;
  padding: 4px 10px;
}

.community_board_detail .fixed-item .button-area .cancle {
  color: #686b73;
  background-color: #e6e8f2;
}

.community_board_detail .fixed-item .button-area .confirm {
  color: #fff;
  background-color: #5653ff;
  margin-left: 5px;
}

.community_board_detail .fixed-item .button-area .confirm:disabled {
  color: #c7cad1;
  background-color: #e6e8f2;
}

/* community_detail */
body.community_detail {
  background-color: #fff;
}

.community_detail .body-area {
  height: calc(100% - 56px);
  margin-bottom: 56px;
  overflow: auto;
}

.community_detail .body-area.already-regist {
  height: auto;
  margin-bottom: auto;
  overflow: auto;
}

.community_detail .img-area {
  position: relative;
}

.community_detail .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.community_detail .contents-header {
  padding: 20px 16px 19px;
  border-bottom: solid 1px #e9edf0;
}

.community_detail .contents-header .title-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  text-align: center;
  color: #0e0e0e;
}

.community_detail .contents-header .manager {
  margin-top: 4px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: -0.2px;
  text-align: center;
  color: #363b41;
}

.community_detail .contents-header .title-desc {
  margin-top: 12px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.2px;
  text-align: center;
  color: #363b41;
}

.community_detail .contents-wrapper {
  padding: 25px 16px;
}

.community_detail .info-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 10.6vw;
}

.community_detail .info-area li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.community_detail .info-area li.divider {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 1px;
  height: 41px;
  background-color: #e6e8f2;
  z-index: -1;
}

.community_detail .info-area li .info-value {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.59px;
  text-align: center;
}

.community_detail .info-area li .info-label {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  text-align: center;
}

.community_detail .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 34px;
}

.community_detail .footer-area.already-regist {
  display: none;
}

.community_detail .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: white;
}

/* community_notice_detail */
body.community_notice_detail {
  background-color: white;
}

.community_notice_detail .item-wrapper {
  background-color: white;
  padding-top: 18px;
}

.community_notice_detail .item-wrapper.reply {
  padding-bottom: 69px;
}

.community_notice_detail .title-area {
  padding: 0 16px;
}

.community_notice_detail .card-type {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #686b73;
}

.community_notice_detail .important.card-type {
  color: #5653ff;
}

.community_notice_detail .card-title {
  margin-top: 2px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  color: #0e0e0e;
}

.community_notice_detail .card-header-area {
  margin-top: 15px;
  padding: 0 18px 0 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.community_notice_detail .profile-img-area {
  position: relative;
}

.community_notice_detail .profile-img-area .profile-item {
  width: 36px;
  height: 36px;
  border-radius: 100%;
}

.community_notice_detail .profile-img-area .badge-item {
  position: absolute;
  width: 14px;
  top: 59%;
  right: -5px;
}

.community_notice_detail .profile-img-area .alert-item {
  width: 30px;
  height: 30px;
}

.community_notice_detail .profile-area {
  margin-left: 12px;
}

.community_notice_detail .profile-area .name-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
}

.community_notice_detail .profile-area .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_notice_detail .more-button {
  margin-left: auto;
  display: none;
}

.community_notice_detail .item-wrapper.written .card-header-area .more-button {
  display: block;
}

.community_notice_detail .card-body-area {
  margin-top: 14px;
}

.community_notice_detail .card-body-area .contents {
  padding: 0 16px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.community_notice_detail .button-list {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-top: 1px solid #e6e8f2;
  border-bottom: 1px solid #e6e8f2;
}

.community_notice_detail .button-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.community_notice_detail .button-list li:last-of-type {
  border-bottom-right-radius: 10px;
}

.community_notice_detail .button-list li:nth-last-of-type(n + 2) {
  border-bottom-left-radius: 10px;
}

.community_notice_detail .like-container,
.community_notice_detail .reply-container {
  display: none;
}

.community_notice_detail .like .like-container {
  display: block;
}

.community_notice_detail .reply .reply-container {
  display: block;
}

.community_notice_detail .button-list .switch-container input[type="checkbox"] {
  display: none;
}

.community_notice_detail .button-list .switch-container input[type="checkbox"] + label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 42px;
  -webkit-tap-highlight-color: transparent;
}

.community_notice_detail .button-list .switch-container input[type="checkbox"] + label::before {
  content: "";
  width: 30px;
  height: 30px;
  background: url("../images/icon_like_off.svg") no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  margin-right: 3px;
}

.community_notice_detail .button-list .switch-container input[type="checkbox"]:checked + label {
  color: #5653ff;
}

.community_notice_detail .button-list .switch-container input[type="checkbox"]:checked + label::before {
  background: url("../images/icon_like_on.svg") no-repeat;
  background-size: contain;
}

.community_notice_detail .button-list .reply-button {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  height: 42px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-tap-highlight-color: transparent;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.community_notice_detail .button-list .reply-button img {
  margin-right: 3px;
}

.community_notice_detail .like-desc {
  margin-top: 15px;
  padding: 0 16px;
}

.community_notice_detail .item-wrapper .like-desc {
  display: none;
}

.community_notice_detail .item-wrapper.like .like-desc {
  display: block;
}

.community_notice_detail .item-wrapper.like .like-desc.none {
  display: none;
}

.community_notice_detail .like-desc p {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.community_notice_detail .item-wrapper .comments {
  display: none;
}

.community_notice_detail .item-wrapper.like .comments {
  margin-top: 22px;
}

.community_notice_detail .item-wrapper.reply .comments {
  display: block;
}

.community_notice_detail .comment-list {
  list-style: none;
}

.community_notice_detail .comment-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px 16px 9px 16px;
}

.community_notice_detail .comment-list li.written {
  background-color: #f2f2fd;
}

.community_notice_detail .comment-list li.reply {
  padding-left: 61px;
  margin-top: 4px;
}

.community_notice_detail .comment-list li.removed {
  /* padding-top: 4px;
    padding-bottom: 4px; */
}

.community_notice_detail .comment-wrapper {
  margin-left: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.community_notice_detail .comment-wrapper .comment-item {
  line-height: 0.9;
}

.community_notice_detail li.removed .comment-wrapper {
  margin-left: 14px;
}

.community_notice_detail .comment-item .name-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.community_notice_detail .comment-item .comment-value {
  margin-left: 6px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  word-break: break-all;
}

.community_notice_detail .comment-item .alert-message {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #686b73;
}

.community_notice_detail .comment-info {
  margin-top: 1px;
  line-height: 0.9;
}

.community_notice_detail .comment-info .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_notice_detail .comment-info .reply-item {
  margin-left: 12px;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_notice_detail .comment-list .more-button {
  padding-left: 10px;
  display: none;
}

.community_notice_detail .comment-list li.written .more-button {
  display: block;
}

.community_notice_detail .fixed-item {
  display: none;
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #ffffff;
}

.community_notice_detail .item-wrapper.reply + .fixed-item {
  display: block;
}

.community_notice_detail .comment {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px;
  border-top: 1px solid #e6e8f2;
}

.community_notice_detail .comment-input-box {
  margin-left: 10px;
  border-radius: 7px;
  background-color: #f2f4fb;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.community_notice_detail .comment-input-box input[type="text"] {
  padding: 5px 0 6px 16px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  width: 88%;
}

.community_notice_detail .comment-input-box input[type="text"]::-webkit-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_notice_detail .comment-input-box input[type="text"]:-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_notice_detail .comment-input-box input[type="text"]::-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_notice_detail .comment-input-box input[type="text"]::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
}

.community_notice_detail .comment .button {
  margin-left: 10px;
}

.community_notice_detail .fixed-item .button-area {
  margin-left: 10px;
}

.community_notice_detail .fixed-item .button-area button {
  font-weight: bold;
  letter-spacing: 0px;
  line-height: 23px;
  font-size: 14px;
  border-radius: 16px;
  padding: 4px 10px;
}

.community_notice_detail .fixed-item .button-area .cancle {
  color: #686b73;
  background-color: #e6e8f2;
}

.community_notice_detail .fixed-item .button-area .confirm {
  color: #fff;
  background-color: #5653ff;
  margin-left: 5px;
}

.community_notice_detail .fixed-item .button-area .confirm:disabled {
  color: #c7cad1;
  background-color: #e6e8f2;
}

/* community_notice */
.community_notice {
  /* 검색시 빈화면 */
}

.community_notice .card-list {
  margin-top: 13px;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

.community_notice .card-list .card {
  width: 100%;
  cursor: pointer;
}

.community_notice .card-list .card .item-wrapper {
  margin: 8px 16px;
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
  padding-top: 12px;
  padding-bottom: 25px;
}

.community_notice .card-list .card.removed .item-wrapper {
  padding-top: 0px;
}

.community_notice .card-header-area {
  padding: 0 16px;
}

.community_notice .card-header-area .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community_notice .card-header-area .card-title {
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.community_notice .card-title .title-badge {
  display: none;
  margin-right: 2px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  color: #5653ff;
}

.community_notice .card.important .title-badge {
  display: inline;
}

.community_notice .card-title .title-text {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
}

.community_notice .card-body-area {
  margin-top: 2px;
  padding: 0 16px;
}

.community_notice .card-body-area .contents {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.community_notice .info-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 12px;
  padding: 0 18px 0 16px;
}

.community_notice .info-area .item-desc {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #363b41;
}

.community_notice .info-area .item-desc.none {
  display: none;
}

.community_notice .info-area .item-info {
  margin-left: auto;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  text-align: right;
  color: #363b41;
}

.community_notice .empty-feed .empty-text {
  width: 231px;
  letter-spacing: -0.43px;
  line-height: 24px;
  font-size: 15px;
  color: #686b73;
  text-align: center;
  margin: 64px auto 0;
}

.community_notice .empty-feed .empty-img {
  width: 240px;
  margin: 20px auto 0;
}

.community_notice .empty-feed .empty-img img {
  width: 100%;
}

/* community */
.community {
  /* 검색시 빈화면 */
}

.community .notice {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 50px;
  background: #eaeaff;
  padding: 0 16px;
}

.community .notice-icon {
  -o-object-fit: contain;
     object-fit: contain;
}

.community .notice-label {
  margin-left: 4px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #5653ff;
  word-break: keep-all;
}

.community .notice-title {
  width: calc(100% - 120px);
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-left: 5px;
}

.community .detail-link {
  position: absolute;
  top: 50%;
  right: 18px;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  word-break: keep-all;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

.community .detail-link img {
  margin-left: 5px;
}

.community .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.community .tab-area .tab-content {
  display: none;
  padding: 20px 10px 43px 10px;
}

.community .tab-area .tab-content-active {
  display: block;
}

.community .search-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 38px;
  border-radius: 8px;
  border: solid 1px #e6e8f2;
  padding: 0px 8px 0px 15px;
  background-color: white;
  margin: 0px 6px 0px 6px;
}

.community .search-container input {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  margin-right: 5px;
}

.community .search-container input::-webkit-input-placeholder {
  color: #c7cad1;
}

.community .search-container input:-ms-input-placeholder {
  color: #c7cad1;
}

.community .search-container input::-ms-input-placeholder {
  color: #c7cad1;
}

.community .search-container input::placeholder {
  color: #c7cad1;
}

.community .search-result {
  margin: 17px 6px 20px 6px;
  padding: 0 8px;
}

.community .search-result p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #4b5158;
}

.community .card-list {
  margin-top: 14px;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

.community .card-list .card {
  width: 100%;
}

.community .card-list .card .item-wrapper {
  margin: 6px;
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
  padding-top: 18px;
}

.community .card-list .card.removed .item-wrapper {
  padding-top: 0px;
}

.community .card-header-area {
  padding: 0 18px 0 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.community .card-header-area .profile-img-area {
  position: relative;
}

.community .card-header-area .profile-img-area .profile-item {
  width: 43px;
  height: 43px;
  border-radius: 100%;
}

.community .card-header-area .profile-img-area .badge-item {
  position: absolute;
  top: 55%;
  right: -5px;
}

.community .card-header-area .profile-area {
  width: 150px;
  margin-left: 12px;
}

.community .card-header-area .profile-area .name-item {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
}

.community .card-header-area .profile-area .written-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.community .card-header-area .value-item {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  text-align: right;
  color: #a4a9b3;
  margin-left: auto;
  -ms-flex-item-align: baseline;
      align-self: baseline;
}

.community .card-body-area {
  margin-top: 14px;
  padding: 0 18px 0 16px;
}

.community .card-body-area .img-area {
  position: relative;
}

.community .img-area img {
  width: 100%;
  max-height: 168px;
  -o-object-fit: cover;
     object-fit: cover;
}

.community .card-body-area .contents {
  margin-top: 11px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.community .more-button {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  display: block;
}

.community .info-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 15px;
  padding: 0 18px 0 16px;
  margin-bottom: 12px;
}

.community .like .info-area,
.community .reply .info-area {
  margin-top: 18px;
}

.community .info-area .item-desc {
  display: none;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #363b41;
}

.community .like .item-desc {
  display: block;
}

.community .like .item-desc.none {
  display: none;
}

.community .info-area .item-info {
  display: none;
  margin-left: auto;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  text-align: right;
  color: #363b41;
}

.community .reply .item-info {
  display: block;
}

.community .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.community .button-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.community .button-list li:last-of-type {
  border-bottom-right-radius: 10px;
}

.community .button-list li:nth-last-of-type(n + 2) {
  border-bottom-left-radius: 10px;
}

.community .like-container,
.community .reply-container {
  display: none;
}

.community .like .like-container {
  display: block;
}

.community .reply .reply-container {
  display: block;
}

.community .button-list .switch-container input[type="checkbox"] {
  display: none;
}

.community .button-list .switch-container input[type="checkbox"] + label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 45px;
  -webkit-tap-highlight-color: transparent;
}

.community .button-list .switch-container input[type="checkbox"] + label::before {
  content: "";
  width: 30px;
  height: 30px;
  background: url("../images/icon_like_off.svg") no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  margin-right: 3px;
}

.community .button-list .switch-container input[type="checkbox"]:checked + label {
  color: #5653ff;
}

.community .button-list .switch-container input[type="checkbox"]:checked + label::before {
  background: url("../images/icon_like_on.svg") no-repeat;
  background-size: contain;
}

.community .button-list .reply-button {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  height: 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-tap-highlight-color: transparent;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.community .button-list .reply-button img {
  margin-right: 3px;
}

.community .card.removed .item-wrapper {
  height: 125px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.community .card.removed .item-wrapper p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.37px;
  text-align: center;
  color: #686b73;
}

.community .floating-button {
  display: block;
  position: fixed;
  bottom: 10px;
  right: 10px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  background: url("../images/icon_write.svg") no-repeat;
  background-position: center center;
}

.community .removed-text {
  display: none;
}

.community .card-list .card.removed .removed-text {
  display: block;
}

.community .empty-feed .empty-text {
  width: 231px;
  letter-spacing: -0.43px;
  line-height: 24px;
  font-size: 15px;
  color: #686b73;
  text-align: center;
  margin: 64px auto 0;
}

.community .empty-feed .empty-img {
  width: 240px;
  margin: 20px auto 0;
}

.community .empty-feed .empty-img img {
  width: 100%;
}

/* condition_result */
body.condition_result {
  background-color: #fff;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.condition_result {
  /* chrome, opera, safari */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* 결과 리스트 */
  /* 결과 리스트 숨겨진 영역 */
  /* .dynamic-list .element:nth-child(3n+1) {margin-left:48px;}
.dynamic-list .element:nth-child(3n+2) {margin:0 44px;} */
  /* popup custom */
}

.condition_result input {
  font-family: "Spoqa Han Sans", "sans-serif";
}

.condition_result input::-webkit-input-placeholder {
  font-family: "Spoqa Han Sans", "sans-serif";
}

.condition_result input:-ms-input-placeholder {
  font-family: "Spoqa Han Sans", "sans-serif";
}

.condition_result input::-moz-placeholder {
  font-family: "Spoqa Han Sans", "sans-serif";
}

.condition_result .result-section {
  text-align: center;
}

.condition_result .result-section .divider {
  width: 100%;
  height: 2px;
  background-color: #e9edf0;
}

.condition_result .result-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  margin: 20px auto 0;
  width: calc(100% - 32px);
}

.condition_result .result-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.condition_result .result-section .date-selector-container .prev-item {
  left: 0px;
}

.condition_result .result-section .date-selector-container .next-item {
  right: 0px;
}

.condition_result .result-section .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  width: 250px;
}

.condition_result .result-section .thick-divider {
  width: 100%;
  height: 6px;
  background-color: #e9edf0;
  margin-top: 23px;
}

.condition_result .result-list .list-item {
  border-bottom: 1px solid #e9edf0;
}

.condition_result .result-list .list-item .exposure-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 73px;
}

.condition_result .result-list .list-item .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.condition_result .result-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 24px;
}

.condition_result .result-list .list-item .record {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 16px;
}

.condition_result .result-list .list-item .record .icon {
  margin-left: 13px;
}

.condition_result .result-list .list-item .hidden-area {
  display: none;
}

.condition_result .result-list .list-item.on .hidden-area {
  display: block;
  margin-bottom: 15px;
}

.condition_result .result-list .hidden-area .hidden-divider {
  height: 1px;
  background-color: #e9edf0;
  width: 100%;
}

.condition_result .result-list .hidden-area .result {
  width: calc(100% - 48px);
  margin: 0 auto;
}

.condition_result .result-list .hidden-area .result .inner-divider {
  width: 100%;
  height: 1px;
  background-color: #e9edf0;
  margin-top: 7px;
}

.condition_result .result-list .hidden-area .result .result-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 7px;
}

.condition_result .result-list .hidden-area .result .result-item:first-child {
  margin-top: 15px;
}

.condition_result .result-list .hidden-area .result .result-item .item-left {
  width: 108px;
  border-radius: 8px;
  background-color: #f2f4fb;
}

.condition_result .result-list .hidden-area .result .result-item .item-left .title {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  color: #363b41;
  margin-left: 11px;
  text-align: left;
}

.condition_result .result-list .hidden-area .result .result-item .item-left .title .sub {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  color: #686b73;
}

.condition_result .result-list .hidden-area .result .result-item.item1 .item-left .title {
  padding: 6px 0 9px 0;
}

.condition_result .result-list .hidden-area .result .result-item.item2 .item-left .title {
  padding: 127px 0 159px;
}

.condition_result .result-list .hidden-area .result .result-item.item3 .item-left .title {
  padding: 127px 0 159px;
}

.condition_result .result-list .hidden-area .result .result-item.item4 .item-left .title {
  padding: 92px 0 105px;
}

.condition_result .result-list .hidden-area .result .result-item.item5 .item-left .title {
  padding: 68px 0 71px;
}

.condition_result .result-list .hidden-area .result .result-item.item6 .item-left .title {
  padding: 67px 0 72px;
}

.condition_result .result-list .hidden-area .result .result-item.item7 .item-left .title {
  padding: 22px 0 21px;
}

.condition_result .result-list .hidden-area .result .result-item.item8 .item-left .title {
  padding: 6px 0 9px 0;
}

.condition_result .result-list .hidden-area .result .result-item.item9 .item-left .title {
  padding: 6px 0 9px 0;
}

.condition_result .result-list .hidden-area .result .result-item.item10 .item-left .title {
  padding: 6px 0 9px 0;
}

.condition_result .result-list .hidden-area .result .result-item.item11 .item-left .title {
  padding: 22px 0 21px;
}

.condition_result .result-list .hidden-area .result .result-item.item12 .item-left .title {
  padding: 68px 0 89px;
}

.condition_result .result-list .hidden-area .result .result-item.item13 .item-left .title {
  padding: 43px 0 48px;
}

.condition_result .result-list .hidden-area .result .result-item.item14 .item-left .title {
  padding: 85px 0 98px;
}

.condition_result .result-list .hidden-area .result .result-item.item15 .item-left .title {
  padding: 51px 0 54px;
}

.condition_result .result-list .hidden-area .result .result-item.item16 .item-left .title {
  padding: 6px 0 9px;
}

.condition_result .result-list .hidden-area .result .result-item.item17 .item-left .title {
  padding: 95px 0 100px;
}

.condition_result .result-list .hidden-area .result .result-item.item18 .item-left .title {
  padding: 30px 0 33px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right {
  width: calc(100% - 127px);
  margin-left: 19px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .right-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data-title {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  color: #363b41;
  text-align: left;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: right;
  padding: 1px 7px 2px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data.black {
  color: #363b41;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data.red {
  border-radius: 5px;
  background-color: #faeef0;
  color: #ff5151;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data.blue {
  color: #5653ff;
  border-radius: 5px;
  background-color: #eeeefa;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data.yellow {
  color: #eebf00;
  border-radius: 5px;
  background-color: #fafaee;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .detail-divider {
  width: 100%;
  height: 1px;
  background-color: #e9edf0;
  margin: 12px 0;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data-list {
  text-align: right;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data-list div {
  margin-top: 5px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .data-list div:first-child {
  margin-top: 6px;
}

.condition_result .result-list .hidden-area .result .result-item .item-right .right-wrapper .unit {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: right;
  color: #363b41;
  margin-left: 6px;
}

.condition_result .dim-layer {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.condition_result .dim-layer .dimBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.condition_result .dim-layer .pop-layer {
  display: block;
}

.condition_result .pop-container .check-content {
  border-radius: 16px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
}

.condition_result .check-content .static-list {
  margin: 0px 47px 0 47px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 41px;
}

.condition_result .static-list .element .img-item {
  width: 64px;
  height: 64px;
  background-image: url("../images/bg/icon_bg.png");
  background-size: 100% 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 17px;
  text-align: center;
}

.condition_result .static-list .element .img-item .icon {
  width: 38px;
  height: 38px;
  margin-top: 13px;
}

.condition_result .static-list .element .title-item {
  letter-spacing: -0.5px;
  text-align: center;
  color: #363b41;
  font-size: 15px;
  font-weight: bold;
  margin-top: 8px;
}

.condition_result .pop-container .check-content .divider {
  height: 1px;
  margin: 22px 32px 0;
  background-color: #e6e8f2;
}

.condition_result .check-content .dynamic-list {
  margin: 0px 47px 0 47px;
  margin-top: 29px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.condition_result .static-list .element {
  /* flex-grow: 1; */
  /* width:33.33%; */
}

.condition_result .dynamic-list .element .img-item {
  width: 64px;
  height: 64px;
  background-image: url("../images/bg/icon_bg.png");
  background-size: 100% 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 17px;
  text-align: center;
  position: relative;
}

.condition_result .dynamic-list .element .img-item.off {
  background-image: url("../images/bg/icon_bg_off.png");
}

.condition_result .dynamic-list .element .img-item .icon {
  /* width: 28px;
    height: 28px;
    margin-top: 20px; */
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.condition_result .dynamic-list .element .title-item {
  letter-spacing: -0.5px;
  text-align: center;
  color: #363b41;
  font-size: 15px;
  font-weight: bold;
  margin-top: 8px;
}

.condition_result .element {
  width: 65px;
}

.condition_result .dynamic-list .element:nth-child(n + 4) {
  margin-top: 36px;
}

.condition_result .dynamic-list.last {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.condition_result .check-content .description {
  width: 296px;
  margin: 32px auto 0;
}

.condition_result .check-content .description .desc-item {
  font-size: 14px;
  line-height: 1.43;
  letter-spacing: -0.47px;
  text-align: center;
  color: #697279;
}

.condition_result .check-content .btn-area {
  margin: 49px auto 0;
  padding-bottom: 34px;
  text-align: center;
}

.condition_result .check-content .btn-area button {
  padding: 17px 66px 19px 67px;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.18;
  letter-spacing: normal;
}

.condition_result .check-content .btn-area .cancle {
  border-radius: 10px;
  background-color: #e6e8f2;
  color: #363b41;
}

.condition_result .check-content .btn-area .confirm {
  margin-left: 13px;
  border-radius: 10px;
  background-color: #5653ff;
  color: #fff;
}

.condition_result .dynamic-list .element .img-item .check-btn {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 22px;
  height: 22px;
  background-color: #5653ff;
  border-radius: 50%;
  border: 1px solid #5653ff;
}

.condition_result .dynamic-list .element .img-item .check-btn.off {
  border: solid 1px #03070b;
  background-color: #ffffff;
}

.condition_result .dynamic-list .element .img-item .check-btn .check-true {
  margin-bottom: 3px;
}

.condition_result .dynamic-list .element .img-item .check-btn.off .check-true {
  /* margin-top:6px; */
}

.condition_result .dimmedBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.condition_result .bottom-layer .layer {
  display: none;
  position: absolute;
  bottom: 0px;
  left: 50%;
  height: auto;
  z-index: 10;
  width: 100%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.condition_result .bottom-layer {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.condition_result .bottom-layer .layer {
  display: block;
}

.condition_result .popup-conts {
  text-align: left;
  border-top-right-radius: 16px;
  border-top-left-radius: 16px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
  padding-top: 28px;
  padding-bottom: 12px;
}

.condition_result .popup-conts .name-title {
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #c7cad1;
  margin-left: 24px;
}

.condition_result .popup-conts .name {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #c7cad1;
  margin-left: 24px;
  margin-top: 8px;
  height: 22px;
  line-height: 22px;
}

.condition_result .popup-conts .popup-divider {
  height: 1px;
  width: calc(100% - 48px);
  background-color: #e6e8f2;
  margin: 4px auto 0;
}

.condition_result .popup-conts .blue-divider {
  background-color: #5653ff;
  height: 1px;
  width: calc(100% - 48px);
  margin: 4px auto 0;
}

.condition_result .popup-conts .blue-divider.false {
  background-color: #ff5151;
}

.condition_result .popup-conts .id-title {
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #363b41;
  margin-left: 24px;
  margin-top: 17px;
}

.condition_result .popup-conts .id-number {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 8px;
  margin-left: 24px;
}

.condition_result .popup-conts .id-number .id-front {
  width: 55px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
  height: 22px;
  line-height: 22px;
}

.condition_result .popup-conts .id-number .id-back {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
  height: 22px;
  line-height: 22px;
  -webkit-text-security: disc;
  width: 100%;
}

.condition_result .popup-conts .id-number .dash {
  margin-right: 4px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
}

.condition_result .popup-conts .id-alert {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #5653ff;
  margin-top: 2px;
  margin-left: 24px;
}

.condition_result .popup-conts .id-alert.false {
  color: #ff5151;
}

.condition_result .popup-conts .button-area {
  width: calc(100% - 32px);
  margin: 92px auto 0;
}

.condition_result .popup-conts .button-area button {
  width: calc((100% - 13px) / 2);
  margin: 0 auto;
  border-radius: 10px;
  background-color: #e6e8f2;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: normal;
  text-align: center;
  height: 56px;
}

.condition_result .popup-conts .button-area .cancel {
  color: #363b41;
}

.condition_result .popup-conts .button-area .confirm {
  margin-left: 9px;
  color: #a4a9b3;
}

.condition_result .popup-conts .button-area .confirm.active {
  color: #ffffff;
  background-color: #5653ff;
}

/* eating */
body.eating {
  background-color: #fff;
}

.eating {
  /* 음식 섭취 리스트 */
  /* 음식 섭취 리스트 숨겨진 영역 */
  /* 물 섭취 리스트 */
}

.eating .eating-section {
  text-align: center;
}

.eating .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.eating .eating-section .tab-area .tab-content {
  display: none;
}

.eating .eating-section .tab-area .tab-content-active {
  display: block;
}

.eating .eating-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  margin: 20px auto 0;
  width: calc(100% - 32px);
}

.eating .eating-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.eating .eating-section .date-selector-container .prev-item {
  left: 0px;
}

.eating .eating-section .date-selector-container .next-item {
  right: 0px;
}

.eating .eating-section .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.eating .eating-section .tab-content {
  margin-top: 26px;
}

.eating .eating-section .tab-content .average-area .text-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
}

.eating .eating-section .tab-content .average-area .number-item {
  font-size: 36px;
  font-weight: bold;
  line-height: 1.11;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.eating .eating-section .tab-content .average-area .number-item .unit {
  font-size: 14px;
}

.eating .eating-section .tab-content .divider {
  margin-top: 36px;
  height: 6px;
  background-color: #e9edf0;
}

.eating .food-list .list-item {
  /* padding:27px 24px 25px; */
  border-bottom: 1px solid #e9edf0;
}

.eating .food-list .list-item .exposure-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 75px;
}

.eating .food-list .list-item .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.eating .food-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 24px;
}

.eating .food-list .list-item .record {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 16px;
}

.eating .food-list .list-item .record .count {
  font-size: 14px;
  color: #697279;
}

.eating .food-list .list-item .record .kcal {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  letter-spacing: -0.45px;
  margin-left: 5px;
}

.eating .food-list .list-item .record .icon {
  margin-left: 13px;
}

.eating .food-list .list-item .hidden-area {
  display: none;
}

.eating .food-list .list-item.on .hidden-area {
  display: block;
  margin-bottom: 25px;
}

.eating .food-list .hidden-area .hidden-divider {
  height: 1px;
  background-color: #e9edf0;
  width: calc(100% - 32px);
  margin: 0 auto;
}

.eating .food-list .hidden-area .meal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.eating .food-list .hidden-area .meal .meal-img {
  width: 74px;
}

.eating .food-list .hidden-area .meal .meal-img img {
  width: 50px;
  text-align: center;
  margin: 15px 0px 15px 24px;
}

.eating .food-list .hidden-area .meal .meal-info {
  width: 100%;
  min-height: 50px;
  text-align: left;
  margin-left: 15px;
  margin-right: 16px;
  padding: 15px 0;
  border-bottom: 1px solid #e9edf0;
}

.eating .food-list .hidden-area .meal:nth-child(5) .meal-info {
  border-bottom: 0px;
}

.eating .food-list .hidden-area .meal .meal-info .info-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 50px;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.eating .food-list .hidden-area .meal .meal-info .info-detail {
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: -0.4px;
  color: #686b73;
}

.eating .water-list .list-item {
  /* padding:27px 24px 25px; */
  height: 75px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

.eating .water-list .list-item .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.eating .water-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 24px;
}

.eating .water-list .list-item .record {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 16px;
}

.eating .water-list .list-item .record .count {
  font-size: 14px;
  color: #697279;
}

.eating .water-list .list-item .record .ml {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  letter-spacing: -0.45px;
  margin-left: 5px;
}

/* empty */
body.empty {
  background-color: #fff;
}

.empty {
  /* 헬스케어존 */
}

.empty .empty-section {
  position: relative;
}

.empty .empty-section .interlock-area {
  position: absolute;
  top: 0px;
  right: 8px;
  width: 160px;
  height: 47px;
}

.empty .empty-section .interlock-area.blood-check {
  width: 196px;
}

.empty .empty-section .interlock-area .balloon {
  width: 100%;
}

.empty .empty-section .interlock-area::after {
  position: absolute;
  content: "연동 앱을 설정해주세요!";
  display: block;
  height: 13px;
  bottom: 16px;
  left: 13px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.weight::after {
  position: absolute;
  content: "체중을 입력해주세요!";
  display: block;
  height: 13px;
  bottom: 13px;
  left: 22px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.healthcare::after {
  position: absolute;
  content: "헬스케어존을 찾아주세요!";
  display: block;
  height: 13px;
  bottom: 18.5px;
  left: 9px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.blood::after {
  position: absolute;
  content: "혈압을 등록해주세요!";
  display: block;
  height: 13px;
  bottom: 14.5px;
  left: 21px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.sugar::after {
  position: absolute;
  content: "혈당을 등록해주세요!";
  display: block;
  height: 13px;
  bottom: 14.5px;
  left: 21px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.blood-check::after {
  position: absolute;
  content: "혈액검사 결과를 입력해주세요!";
  display: block;
  height: 20px;
  bottom: 9px;
  left: 12px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area.result::after {
  position: absolute;
  content: "건강검진 결과 가져오기!";
  display: block;
  height: 20px;
  bottom: 9px;
  left: 12px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .interlock-area .text-item {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.empty .empty-section .text-area {
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: -0.43px;
  text-align: center;
  color: #363b41;
  padding-top: 148px;
}

.empty .empty-section .text-area .text-item {
  color: #363b41;
}

.empty .empty-section .text-area .font-item {
  font-weight: bold;
}

.empty .empty-section .img-area {
  width: 245px;
  margin: 36px auto 220px;
}

.empty .empty-section .img-area .bg-img {
  width: 100%;
}

.empty .tag-area {
  padding: 21px 0px;
  background-color: #e6e8f2;
  border-bottom: solid 1px #f2f4fb;
}

.empty .tag-area .tag-list {
  list-style: none;
  overflow-x: scroll;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  white-space: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.empty .tag-area .tag-list::-webkit-scrollbar {
  display: none;
}

.empty .tag-area .tag-list li {
  padding: 8px 16px;
  background-color: white;
  border: solid 1px #e6e8f2;
  border-radius: 15px;
  font-weight: 400;
  font-size: 14px;
  line-height: 13px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 10px;
}

.empty .tag-area .tag-list li.selected {
  background-color: #5653ff;
  border: solid 1px #5653ff;
  color: white;
}

.empty .tag-area .tag-list li:first-child {
  margin-left: 16px;
}

.empty .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.empty .eating-section .tab-area .tab-content {
  display: none;
}

.empty .eating-section .tab-area .tab-content-active {
  display: block;
}

/* exercise */
body.exercise {
  background-color: white;
}

.exercise {
  /* exercise-section */
  /* average-section */
  /* thick-divider */
  /* list-section */
}

.exercise .exercise-section {
  background-color: white;
  padding: 31px 18px 0px 18px;
  text-align: center;
}

.exercise .exercise-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.exercise .exercise-section .date-selector-container .button-item {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 48px;
  height: 48px;
}

.exercise .exercise-section .date-selector-container .prev-item {
  left: 0px;
}

.exercise .exercise-section .date-selector-container .next-item {
  left: auto;
  right: 0px;
}

.exercise .exercise-section .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  color: #363b41;
}

.exercise .average-section {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 26px;
}

.exercise .average-section .title-item {
  font-size: 14px;
  font-weight: normal;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  /* margin-top:26px; */
}

.exercise .average-section .time {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.exercise .average-section .time .unit {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
}

.exercise .average-section .average-divider {
  width: 1px;
  background-color: #e6e8f2;
  height: 55px;
}

.exercise .thick-divider {
  margin-top: 29px;
  width: 100%;
  height: 6px;
  background-color: #e9edf0;
}

.exercise .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.exercise .list-section .exercise-list .list-item {
  padding: 15px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

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

.exercise .exercise-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.exercise .exercise-list .list-item .date .achieve {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.23px;
  color: #5653ff;
  padding: 1px 7px 2px;
  border-radius: 5px;
  background-color: #eeeefa;
  margin-left: 7px;
  display: none;
}

.exercise .exercise-list .list-item .record .count {
  font-size: 14px;
  color: #697279;
  text-align: right;
}

.exercise .exercise-list .list-item .record .while {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  text-align: right;
  letter-spacing: -0.45px;
}

/* health_info_detail */
body.health_info_detail {
  background-color: #ffffff;
}

.health_info_detail .img-area {
  position: relative;
}

.health_info_detail .img-area img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.health_info_detail .img-desc {
  padding: 20px 16px 45px 19px;
  background-color: #ffffff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.37px;
  color: #363b41;
}

.health_info_detail .img-desc p {
  color: #363b41;
}

.health_info_detail .footer-area {
  margin: -30px 0 20px;
  padding: 0px 16px 0px 19px;
}

.health_info_detail .tag-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  margin-top: 7px;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 10px;
}

.health_info_detail .tag-list li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
  padding: 2px 7px 2px 8px;
  border-radius: 16px;
  background: #e6e8f2;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.health_info_detail .tag-list li:last-child {
  margin-right: 0px;
}

.health_info_detail .item-info {
  margin-top: 5px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.health_info_detail .item-info.none {
  display: none;
}

.health_info_detail .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.health_info_detail .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.health_info_detail .button-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.health_info_detail .button-list .switch-container input[type="checkbox"] {
  display: none;
}

.health_info_detail .button-list .switch-container input[type="checkbox"] + label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 43px;
}

.health_info_detail .button-list .switch-container input[type="checkbox"] + label::before {
  content: "";
  width: 30px;
  height: 30px;
  background: url("../images/icon_like_off.svg") no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  margin-right: 3px;
}

.health_info_detail .button-list .switch-container input[type="checkbox"]:checked + label {
  color: #5653ff;
}

.health_info_detail .button-list .switch-container input[type="checkbox"]:checked + label::before {
  background: url("../images/icon_like_on.svg") no-repeat;
  background-size: contain;
}

.health_info_detail .button-list .share-button {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  height: 43px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.health_info_detail .button-list .share-button img {
  margin-right: 3px;
}

/* health_info */
body.health_info {
  background-color: #f5f8fd;
}

.health_info {
  /* 검색 아무것도 없을 시 */
}

.health_info .slick-slide {
  height: auto;
}

.health_info .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.health_info .tab-area .tab-content {
  display: none;
  min-height: calc(100vh - 114px);
  padding: 20px 10px 43px 10px;
}

.health_info .tab-area .tab-content-active {
  display: block;
}

.health_info .search-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 38px;
  border-radius: 8px;
  border: solid 1px #e6e8f2;
  padding: 0px 8px 0px 15px;
  background-color: white;
  margin: 0px 6px 0px 6px;
}

.health_info .search-container input {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  margin-right: 5px;
}

.health_info .search-container input::-webkit-input-placeholder {
  color: #686b73;
}

.health_info .search-container input:-ms-input-placeholder {
  color: #686b73;
}

.health_info .search-container input::-ms-input-placeholder {
  color: #686b73;
}

.health_info .search-container input::placeholder {
  color: #686b73;
}

.health_info .search-result {
  margin: 17px 6px 20px 6px;
  padding: 0 8px;
}

.health_info .search-result p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #4b5158;
}

.health_info .card-list {
  margin-top: 14px;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

.health_info .card-list .card {
  width: 100%;
}

.health_info .card-list .card .item-wrapper {
  margin: 6px;
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
  padding: 30px 0;
}

.health_info .card .card-header-area {
  padding: 0 19px;
}

.health_info .card .card-header-area .item-title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
}

.health_info .card .card-header-area .tag-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  margin-top: 7px;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 10px;
}

.health_info .card .card-header-area .tag-list li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: 5px;
  padding: 2px 7px 2px 8px;
  border-radius: 16px;
  background: #e6e8f2;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.health_info .card .card-header-area .tag-list li:last-child {
  margin-right: 0px;
}

.health_info .img-area {
  margin-top: 15px;
  position: relative;
}

.health_info .img-area img {
  width: 100%;
  max-height: 343px;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}

.health_info .slick-slider {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.health_info .slick-prev {
  left: 14px;
  z-index: 2;
}

.health_info .slick-prev:before {
  content: "";
}

.health_info .slick-next {
  right: 14px;
  z-index: 2;
}

.health_info .slick-next:before {
  content: "";
}

.health_info .slick-prev img,
.health_info .slick-next img {
  opacity: 0.75;
}

.health_info .slick-dots {
  bottom: 8px;
}

.health_info .slick-dotted.slick-slider {
  margin-bottom: 0;
}

.health_info .slick-dots li button:before {
  font-size: 24px;
  color: #ffffff;
  opacity: 0.3;
}

.health_info .slick-dots li.slick-active button:before {
  color: #ffffff;
  opacity: 1;
}

.health_info .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.health_info .button-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.health_info .button-list .switch-container input[type="checkbox"] {
  display: none;
}

.health_info .button-list .switch-container input[type="checkbox"] + label {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 43px;
  -webkit-tap-highlight-color: transparent;
}

.health_info .button-list .switch-container input[type="checkbox"] + label::before {
  content: "";
  width: 30px;
  height: 30px;
  background: url("../images/icon_like_off.svg") no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  margin-right: 3px;
}

.health_info .button-list .switch-container input[type="checkbox"]:checked + label {
  color: #5653ff;
}

.health_info .button-list .switch-container input[type="checkbox"]:checked + label::before {
  background: url("../images/icon_like_on.svg") no-repeat;
  background-size: contain;
}

.health_info .button-list .share-button {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 15px;
  letter-spacing: -0.37px;
  height: 43px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-tap-highlight-color: transparent;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.health_info .button-list .share-button img {
  margin-right: 3px;
}

.health_info .footer-area {
  margin: 15px 19px 0;
}

.health_info .footer-area .item-info {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
}

.health_info .footer-area .item-info.none {
  display: none;
}

.health_info .footer-area .item-desc {
  width: 100%;
  height: 66px;
  margin-top: 9px;
  position: relative;
}

.health_info .footer-area .item-desc p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.37px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  color: #686b73;
}

.health_info .more-button {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  display: block;
}

.health_info .header-area {
  margin: 12px 6px 0;
  height: 138px;
  background: url("../images/img_community_header.png") no-repeat;
  background-size: contain;
  background-position: bottom right;
}

.health_info .community-empty .header-area {
  background: url("../images/img_community_header_empty.png") no-repeat;
  background-size: contain;
  background-position: bottom right;
}

.health_info .header-area .header-title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.health_info .header-area .header-info {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #363b41;
}

.health_info .item-wrapper {
  margin: 0 6px;
}

.health_info .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 17px 18px 17px 20px;
  background-color: #ffffff;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
  cursor: pointer;
}

.health_info .item .item-left {
  width: calc(100% - 123px);
}

.health_info .item .item-right {
  width: 110px;
  height: 102px;
  margin-left: 13px;
  text-align: right;
}

.health_info .item .item-right img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.health_info .item .item-left .item-title {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
}

.health_info .item .item-left .item-desc {
  margin-top: 2px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.health_info .item .item-left .item-info {
  margin-top: 17px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.health_info .item .item-left .item-info::before {
  content: "";
  background: url("../images/icon_community_people_together.svg") no-repeat;
  background-size: contain;
  width: 15px;
  height: 15px;
  display: inline-block;
  vertical-align: bottom;
  margin-right: 3px;
}

.health_info .item .item-right img {
  width: 100%;
}

.health_info .body-area {
  margin-top: 45px;
}

.health_info .body-area .body-title {
  margin: 0 6px;
  padding: 0 8px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.health_info .body-area .item-wrapper {
  margin-top: 12px;
}

.health_info .item-wrapper .item:nth-child(n + 2) {
  margin-top: 15px;
}

.health_info .community-empty .body-area {
  display: none;
}

.health_info .tab-area #content-community.tab-content {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.health_info .tab-area #content-community.tab-content-active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.health_info .foot-text {
  margin-top: auto;
  padding: 30px 16px 0;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  color: #363b41;
  background-color: #f5f8fd;
}

.health_info .foot-text span {
  color: #5653ff;
}

.health_info .empty-search {
  margin-top: 64px;
  text-align: center;
}

.health_info .empty-search .text-item {
  font-size: 15px;
  color: #686b73;
}

.health_info .empty-search .bg-item {
  width: 240px;
  height: 195px;
  margin-top: 20px;
  -o-object-fit: contain;
     object-fit: contain;
}

/* healthcare */
body.healthcare {
  background-color: #fff;
}

.healthcare {
  /* btn-move */
  /* healthcare-tab */
  /* date */
  /* graph-section */
  /* thick-divider */
  /* list-section */
  /* bmi */
  /* 상체(우) */
  /* 상체(좌) */
  /* 복부 */
  /* 하체(우) */
  /* 남자 */
  /* 하체(좌) */
  /* responsive */
  /* 체성분 */
  /* position-result */
  /* front-result */
  /* side-result */
  /* neck-result */
  /* grade-area */
  /* grade-detail */
  /* join-divider */
  /* angle-result  */
  /* shoulder */
  /* waist */
  /* .pelvis */
}

.healthcare .btn-move {
  width: 25px;
  height: 25px;
}

.healthcare .tag-area {
  padding: 21px 0px;
  background-color: #e6e8f2;
  border-bottom: solid 1px #f2f4fb;
}

.healthcare .tag-area .tag-list {
  list-style: none;
  overflow-x: scroll;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  white-space: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none;
  /* width:385px; */
}

.healthcare .tag-area .tag-list::-webkit-scrollbar {
  display: none;
}

.healthcare .tag-area .tag-list li {
  padding: 8px 15px;
  background-color: white;
  border: solid 1px #e6e8f2;
  border-radius: 15px;
  font-weight: 400;
  font-size: 14px;
  line-height: 13px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 10px;
}

.healthcare .tag-area .tag-list li.selected {
  background-color: #5653ff;
  border: solid 1px #5653ff;
  color: white;
}

.healthcare .tag-area .tag-list li:first-child {
  margin-left: 16px;
}

.healthcare .tag-area .tag-list .hidden-area {
  visibility: hidden;
  padding: 0 7px;
}

.healthcare .healthcare-tab {
  display: none;
}

.healthcare .healthcare-tab.active {
  display: block;
}

.healthcare .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  width: calc(100% - 32px);
  margin: 30px auto 0;
}

.healthcare .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.healthcare .date-selector-container .prev-item {
  left: 0px;
}

.healthcare .date-selector-container .next-item {
  right: 0px;
}

.healthcare .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
}

.healthcare .graph-section {
  background-color: #fff;
  margin-top: 25px;
}

.healthcare .graph-section .average-area {
  padding: 25px 0px;
}

.healthcare .graph-section .spot-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 18px;
}

.healthcare .graph-section .spot-area .spot {
  width: 6px;
  height: 6px;
  border-radius: 5.5px;
}

.healthcare .graph-section .spot-area .spot-text {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.14px;
  color: #73787e;
}

.healthcare .graph-section .spot-area .height {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.healthcare .graph-section .spot-area .height .spot {
  background-color: #00c69c;
}

.healthcare .graph-section .spot-area .height .spot-text {
  margin-left: 4px;
}

.healthcare .graph-section .spot-area .weight {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.healthcare .graph-section .spot-area .weight .spot {
  background-color: #6d53ff;
  margin-left: 8px;
}

.healthcare .graph-section .spot-area .weight .spot-text {
  margin-left: 4px;
}

.healthcare .graph-section .label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: calc(100% - 32px);
  margin: 7px auto 6px;
}

.healthcare .graph-section .label-area div {
  opacity: 0.8;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.17;
  letter-spacing: normal;
  color: #c7cad1;
}

.healthcare .graph-section .graph-area {
  position: relative;
  pointer-events: none;
  margin-top: 5px;
}

.healthcare .graph-section .section-divider {
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 5px;
}

.healthcare .graph-section .average-area .section-divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px auto 0;
}

.healthcare .graph-section .average-area .info-wrapper {
  width: calc(100% - 32px);
  margin: 0px auto 0px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.healthcare .graph-section .average-area .info-wrapper .average-height {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.healthcare .graph-section .average-area .info-wrapper .average-weight {
  width: 50%;
}

.healthcare .graph-section .average-area .info-wrapper .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: #36434c;
}

.healthcare .graph-section .average-area .info-wrapper .number-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.24px;
  color: #363b41;
  margin-top: 2px;
}

.healthcare .graph-section .average-area .info-wrapper .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.13px;
  color: #363b41;
}

.healthcare .thick-divider {
  height: 6px;
  background-color: #e9edf0;
}

.healthcare .position .thick-divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 31px;
}

.healthcare .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.healthcare .list-section .body-list .list-item {
  padding: 15px 24px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

.healthcare .body-list .list-item .date .days {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.healthcare .body-list .list-item .date .days .day-item {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
}

.healthcare .list-section .body-list .list-item .time .time-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #697279;
  margin-top: 1px;
}

.healthcare .body-list .list-item .record {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.healthcare .body-list .list-item .record .height {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  text-align: right;
  color: #080808;
}

.healthcare .body-list .list-item .record .record-divider {
  width: 2px;
  height: 16px;
  background-color: #a4a9b3;
  margin: 0 9px;
}

.healthcare .body-list .list-item .record .weight {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  text-align: right;
  color: #080808;
}

.healthcare .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.healthcare .tab-area .tab-content {
  display: none;
}

.healthcare .tab-area .tab-content-active {
  display: block;
}

.healthcare .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  margin: 20px auto 0;
  width: calc(100% - 32px);
}

.healthcare .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.healthcare .date-selector-container .prev-item {
  left: 0px;
}

.healthcare .date-selector-container .next-item {
  right: 0px;
}

.healthcare .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.healthcare .tab-content {
  padding-bottom: 34px;
}

.healthcare .tab-content canvas {
  height: 70px !important;
}

.healthcare .tab-content .bmi-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
  margin-top: 31px;
}

.healthcare .tab-content .bmi {
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.healthcare .tab-content .bmi-variation {
  border-radius: 5px;
  width: 52px;
  height: 23px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 9px auto 0;
}

.healthcare .tab-content .bmi-variation .data {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.healthcare .tab-content .bmi-variation .ic-variation {
  display: none;
  width: 9px;
  height: 9px;
  margin-left: 8px;
  margin-right: 4px;
}

.healthcare .tab-content .bmi-variation.up {
  background-color: #faeef0;
  color: #ff5151;
}

.healthcare .tab-content .bmi-variation.down {
  background-color: #eeeefa;
  color: #5653ff;
}

.healthcare .tab-content .bmi-variation.up .up {
  display: block;
}

.healthcare .tab-content .bmi-variation.down .down {
  display: block;
}

.healthcare .tab-content .body {
  width: 163px;
  margin: 46px auto 0;
  position: relative;
}

.healthcare .tab-content .body .body-img {
  width: 100%;
  display: none;
}

.healthcare .tab-content .body.female .female {
  display: block;
}

.healthcare .tab-content .body.male .male {
  display: block;
}

.healthcare .tab-content .body .box {
  border-radius: 10px;
  border: solid 1px #e6e8f2;
  background-color: #ffffff;
  width: 115px;
  height: 89px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
}

.healthcare .tab-content .body .box .title {
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
  margin-left: 10px;
  text-align: left;
}

.healthcare .tab-content .body .box .item-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 10px;
  margin-top: 5px;
}

.healthcare .tab-content .body .box .item-box .item-title {
  font-size: 11px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.58;
  letter-spacing: -0.37px;
  text-align: center;
  color: #686b73;
}

.healthcare .tab-content .body .box .item-box .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.healthcare .tab-content .body .box .item-box .item .spot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 3px;
}

.healthcare .tab-content .body .box .item-box .item .spot.yellow {
  background-color: #ffd93c;
}

.healthcare .tab-content .body .box .item-box .item .spot.red {
  background-color: #ff5151;
}

.healthcare .tab-content .body .box .item-box .item .spot.blue {
  background-color: #5653ff;
}

.healthcare .tab-content .body .box .item-box .item .data {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.35px;
  color: #363b41;
}

.healthcare .tab-content .body .box .box-divider {
  width: 106px;
  height: 1px;
  background-color: #e6e8f2;
  margin: 6px auto 0;
}

.healthcare .tab-content .body .left-top-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 78px;
  left: 48px;
}

.healthcare .tab-content .body .left-top-spot .left-top-line {
  width: 38px;
  height: 9px;
  border-left: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 3px;
  bottom: 2px;
}

.healthcare .tab-content .body .box.left-top {
  bottom: 8px;
  right: 17px;
}

.healthcare .tab-content .body .right-top-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 78px;
  right: 48px;
}

.healthcare .tab-content .body .right-top-spot .right-top-line {
  width: 38px;
  height: 9px;
  border-right: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  left: 3px;
  bottom: 2px;
}

.healthcare .tab-content .body .box.right-top {
  bottom: 8px;
  left: 17px;
}

.healthcare .tab-content .body .center-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 133px;
  left: 79px;
}

.healthcare .tab-content .body .center-spot .center-line {
  width: 90px;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 2px;
  top: 2px;
}

.healthcare .tab-content .body .box.center {
  top: -29px;
  right: 89px;
  width: 75px;
  height: 130px;
}

.healthcare .tab-content .body .box.center .item-box .item-title {
  text-align: left;
  margin-left: 10px;
}

.healthcare .tab-content .body .box.center .item-box {
  display: block;
  margin-left: 0px;
}

.healthcare .tab-content .body .box.center .item-box .item {
  margin-left: 10px;
}

.healthcare .tab-content .body .box.center .box-divider {
  width: 60px;
}

.healthcare .tab-content .body .left-bottom-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  bottom: 90px;
  left: 67px;
}

.healthcare .tab-content .body .left-bottom-spot .left-bottom-line {
  width: 38px;
  height: 18px;
  border-right: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 2px;
  top: 2px;
}

.healthcare .tab-content .body .box.left-bottom {
  top: 5px;
  right: 36px;
}

.healthcare .tab-content .body.male .left-bottom-spot {
  left: 58px;
}

.healthcare .tab-content .body.male .right-bottom-spot {
  right: 58px;
}

.healthcare .tab-content .body.male .box.left-bottom {
  right: 28px;
}

.healthcare .tab-content .body.male .box.right-bottom {
  left: 28px;
}

.healthcare .tab-content .body .right-bottom-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  bottom: 90px;
  right: 67px;
}

.healthcare .tab-content .body .right-bottom-spot .right-bottom-line {
  width: 38px;
  height: 18px;
  border-left: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  left: 2px;
  top: 2px;
}

.healthcare .tab-content .body .box.right-bottom {
  top: 5px;
  left: 36px;
}

.healthcare .tab-content .thick-divider {
  height: 2px;
  width: 100%;
  background-color: #e9edf0;
  margin-top: 50px;
}

.healthcare .tab-content .result-detail {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #363b41;
  margin-top: 28px;
  margin-left: 24px;
  text-align: left;
}

.healthcare .tab-content .result-date {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-top: 4px;
  margin-left: 24px;
  text-align: left;
}

.healthcare .tab-content .info-box {
  width: calc(100% - 48px);
  margin: 19px auto 0;
  border-radius: 7px;
  background-color: #f2f4fb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 15px 0px;
}

.healthcare .tab-content .info-box .info-item {
  width: calc((100% - 21px) / 3);
}

.healthcare .tab-content .info-box .info-item .title {
  font-family: SpoqaHanSans;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: #363b41;
}

.healthcare .tab-content .info-box .info-item .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.healthcare .tab-content .info-box .info-item .item .ic-info {
  display: none;
}

.healthcare .tab-content .info-box .info-item.down .item .ic-info.down {
  display: block;
}

.healthcare .tab-content .info-box .info-item.up .item .ic-info.up {
  display: block;
}

.healthcare .tab-content .info-box .info-item .item .data {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.44px;
  text-align: right;
  color: #363b41;
  margin-left: 4px;
}

.healthcare .tab-content .info-box .info-item .item .data .unit {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.13px;
  color: #363b41;
  margin-left: 3px;
}

.healthcare .tab-content .info-divider {
  width: 1px;
  height: 45px;
  background-color: #c9cdd1;
}

.healthcare .tab-content .graph-area {
  width: calc(100% - 48px);
  height: 70px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.healthcare .tab-content .graph-area.label {
  height: 55px;
}

.healthcare .tab-content .graph-area .graph-title {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.34px;
  color: #363b41;
  margin-left: 10px;
  width: 92px;
  text-align: left;
}

.healthcare .tab-content .graph-area .graph {
  width: calc(100% - 92px);
}

.healthcare .tab-content .graph-area .graph.label {
  position: absolute;
  bottom: 35px;
  left: 92px;
}

.healthcare .tab-content .graph-divider {
  width: calc(100% - 48px);
  margin: 0px auto 0;
  height: 1px;
  background-color: #e6e8f2;
}

.healthcare .tab-content .graph-divider.top {
  margin-top: 21px;
}

.healthcare .tab-content .more {
  width: calc(100% - 48px);
  margin: 0 auto;
  height: 46px;
  border-radius: 23px;
  border: solid 1.5px #5653ff;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.healthcare .tab-content .more div {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 46px;
  letter-spacing: -0.47px;
  color: #5653ff;
  margin-right: 2px;
}

@media (max-width: 350px) {
  .healthcare {
    /* 상체(우) */
    /* 상체(좌) */
    /* 복부 */
    /* 하체(우) 남 */
    /* 하체(좌) 남 */
    /* 하체(우) 여 */
    /* 하체(좌) 여 */
    /* 하체(좌) 여 */
    /* 하체(좌) 여 */
  }
  .healthcare .tab-content .body {
    width: 108px;
  }
  .healthcare .tab-content .body .left-top-spot {
    top: 50px;
    left: 30px;
  }
  .healthcare .tab-content .body .box.left-top {
    right: 4px;
  }
  .healthcare .tab-content .body .right-top-spot {
    top: 50px;
    right: 30px;
  }
  .healthcare .tab-content .body .box.right-top {
    left: 4px;
  }
  .healthcare .tab-content .body .center-spot {
    left: 52px;
    top: 88px;
  }
  .healthcare .tab-content .body .box.center {
    top: -41px;
    right: 66px;
  }
  .healthcare .tab-content .body.male .left-bottom-spot {
    left: 38px;
    bottom: 57px;
  }
  .healthcare .tab-content .body.male .box.left-bottom {
    right: 11px;
    top: 5px;
  }
  .healthcare .tab-content .body.male .right-bottom-spot {
    right: 38px;
    bottom: 57px;
  }
  .healthcare .tab-content .body.male .box.right-bottom {
    left: 11px;
    top: 5px;
  }
  .healthcare .tab-content .body.female .left-bottom-spot {
    left: 44px;
    bottom: 57px;
  }
  .healthcare .tab-content .body.female .right-bottom-spot {
    right: 44px;
    bottom: 57px;
  }
  .healthcare .tab-content .body.female .box.left-bottom {
    right: 16px;
    top: 5px;
  }
  .healthcare .tab-content .body.female .box.right-bottom {
    left: 16px;
    top: 5px;
  }
}

.healthcare .bmi-section {
  background-color: white;
  padding: 31px 18px 39px 18px;
  text-align: center;
}

.healthcare .bmi-section .bmi-label {
  margin-top: 29px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #25282b;
}

.healthcare .bmi-section .value-item {
  text-align: center;
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
}

.healthcare .bmi-section .status-item {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 10px auto 0px auto;
  padding: 5px 10px;
  border-radius: 5px;
  background-color: #eeeefa;
  color: #5653ff;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: center;
}

.healthcare .bmi-section .body-info-area {
  margin-top: 31px;
}

.healthcare .bmi-section .body-info-area .tab-list {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.healthcare .bmi-section .body-info-area .tab-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 62px;
  height: 26px;
  background-color: white;
  border-top: solid 1px #c7cad1;
  border-bottom: solid 1px #c7cad1;
  border-right: solid 1px #c7cad1;
  color: #363b41;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.4px;
  text-align: center;
}

.healthcare .bmi-section .body-info-area .tab-list li:first-child {
  border-left: solid 1px #c7cad1;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.healthcare .bmi-section .body-info-area .tab-list li:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.healthcare .bmi-section .body-info-area .tab-list li.selected {
  background-color: #5653ff;
  color: white;
  font-weight: bold;
  border-top: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  border-right: solid 1px #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content {
  position: relative;
  display: none;
  max-width: 375px;
  margin: 22px auto 0px auto;
}

.healthcare .bmi-section .body-info-area .active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area {
  width: 76px;
  height: 153px;
  border-radius: 10px;
  border: solid 1px #e6e8f2;
  text-align: center;
  background-color: white;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area-bottom {
  margin: auto 0px 20px auto;
}

.healthcare .bmi-section .body-info-area .tab-content .none-info-area {
  border: solid 1px transparent;
}

.healthcare .bmi-section .body-info-area .tab-content .info-wrapper {
  height: 76px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .label-item {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  text-align: center;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .value-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 5px;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .value-area .circle-item {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .value-area .purple {
  background-color: #9a81ff;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .value-area .yellow {
  background-color: #ffb858;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .value-area .value-item {
  margin-left: 4px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.healthcare .bmi-section .body-info-area .tab-content .info-area .divider {
  height: 1px;
  background-color: #e6e8f2;
  margin: 0px 8px;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area {
  position: relative;
  padding: 0px 16px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area img {
  width: 155px;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line1 {
  position: absolute;
  top: 77px;
  left: 0px;
  right: 0px;
  background-color: #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .guide-line1 .line1 {
  position: absolute;
  left: 0px;
  width: calc(50% - 46px);
  height: 1px;
  background-color: #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .guide-line1 .line2 {
  position: absolute;
  right: 0px;
  width: calc(50% - 46px);
  height: 1px;
  background-color: #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line2 {
  position: absolute;
  top: 77px;
  left: 0px;
  width: calc(50% - 24px);
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line2 .line1 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 100%;
  border-top: solid 1px #5653ff;
  border-right: solid 1px #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line2 .line2 {
  width: 40px;
  height: 100%;
  border-bottom: solid 1px #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line3 {
  position: absolute;
  bottom: 97px;
  left: 0px;
  right: 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line3 .line1 {
  position: absolute;
  left: 0px;
  width: calc(50% - 24px);
  height: 1px;
  background-color: #5653ff;
}

.healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line3 .line2 {
  position: absolute;
  right: 0px;
  width: calc(50% - 24px);
  height: 1px;
  background-color: #5653ff;
}

@media (max-width: 350px) {
  .healthcare .bmi-section .body-info-area .tab-content .img-area img {
    width: 115px;
  }
  .healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line1 {
    top: 55px;
  }
  .healthcare .bmi-section .body-info-area .tab-content .guide-line1 .line1 {
    width: calc(50% - 34px);
  }
  .healthcare .bmi-section .body-info-area .tab-content .guide-line1 .line2 {
    width: calc(50% - 34px);
  }
  .healthcare .bmi-section .body-info-area .tab-content .img-area .guide-line2 {
    width: calc(50% - 16px);
    height: 15px;
  }
  .healthcare .bmi-section .body-info-area .tab-content .guide-line2 .line1 {
    width: calc(50% - 34px);
  }
  .healthcare .bmi-section .body-info-area .tab-content .guide-line2 .line2 {
    width: 20px;
  }
}

.healthcare .section-divider {
  background-color: #e6e8f2;
  height: 6px;
}

.healthcare .card-section {
  padding: 5px 16px 12px 16px;
}

.healthcare .card-section .card-list {
  list-style: none;
}

.healthcare .card-section .card-list li {
  background-color: white;
  border-radius: 10px;
  -webkit-box-shadow: 0px 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 8px 20px 10px rgba(96, 110, 170, 0.06);
  margin-top: 20px;
  padding: 31px 0px 24px 0px;
}

.healthcare .card-section .card-list li .header-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0px 24px;
}

.healthcare .card-section .card-list li .header-area .title-label {
  font-weight: bold;
  font-size: 14px;
  letter-spacing: -0.47px;
  color: #686b73;
}

.healthcare .card-section .card-list li .header-area .detail-label {
  font-weight: bold;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #5653ff;
  margin-left: auto;
}

.healthcare .card-section .card-list li .header-area img {
  width: 5px;
  height: 8px;
  margin-left: 6px;
}

.healthcare .card-section .card-list li .value-item {
  margin-top: 1px;
  margin-left: 24px;
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
}

.healthcare .card-section .card-list li .value-item .unit-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  margin-left: 3px;
}

.healthcare .card-section .card-list li .value-item .total-value {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.2px;
  color: #686b73;
}

.healthcare .card-section .card-list li .status-item {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 8px 0px 0px 24px;
  padding: 1px 6px;
  border-radius: 5px;
  background-color: #eeeefa;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  color: #5653ff;
}

.healthcare .card-section .card-list li .date-item {
  margin-top: 5px;
  margin-left: 24px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
}

.healthcare .weight-wrapper .selector-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 34px 14px 0px 14px;
  border-radius: 7px;
  background-color: #f2f4fb;
  padding: 12px 0px;
}

.healthcare .weight-wrapper .selector-container .button-item {
  padding: 10px;
}

.healthcare .weight-wrapper .selector-container .button-item img {
  width: 8px;
}

.healthcare .weight-wrapper .selector-container .option-box {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 76px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 7px;
  margin: -1px;
}

.healthcare .weight-wrapper .selector-container .selected {
  background-color: white;
  -webkit-box-shadow: 0px 2px 5px 3px rgba(96, 110, 170, 0.1);
          box-shadow: 0px 2px 5px 3px rgba(96, 110, 170, 0.1);
  z-index: 1;
}

.healthcare .weight-wrapper .selector-container .option-box .box-label-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #363b41;
}

.healthcare .weight-wrapper .selector-container .selected .box-label-item {
  font-weight: bold;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 4px;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area .box-value-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: -0.44px;
  color: #363b41;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area .box-value-item::before {
  content: "";
  background: url("../images/icon_decrease_off.png") no-repeat;
  background-size: contain;
  width: 10px;
  height: 10px;
  display: block;
  margin-right: 3px;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area .box-value-item.increase::before {
  background: url("../images/icon_increase_off.png") no-repeat;
  background-size: contain;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area .box-value-item.decrease::before {
  background: url("../images/icon_decrease_off.png") no-repeat;
  background-size: contain;
}

.healthcare .weight-wrapper .selector-container .option-box.selected .box-value-area .box-value-item.increase::before {
  background: url("../images/icon_increase_on.png") no-repeat;
  background-size: contain;
}

.healthcare .weight-wrapper .selector-container .option-box.selected .box-value-area .box-value-item.decrease::before {
  background: url("../images/icon_decrease_on.png") no-repeat;
  background-size: contain;
}

.healthcare .weight-wrapper .selector-container .option-box .box-value-area .box-unit-item {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.13px;
  color: #363b41;
  margin-left: 2px;
  -ms-flex-item-align: end;
      align-self: flex-end;
}

.healthcare .weight-wrapper .selector-container .selected .box-value-area .box-value-item {
  color: #5653ff;
}

.healthcare .weight-wrapper .selector-container .selected .box-value-area .box-unit-item {
  color: #5653ff;
}

.healthcare .weight-wrapper .selector-container .divider {
  width: 1px;
  height: 45px;
  background-color: #c9cdd1;
}

.healthcare .weight-wrapper .graph-area {
  margin-top: 25px;
  padding: 0px 10px 0px 10px;
}

.healthcare .inbody-wrapper .dashboard-box {
  border-radius: 7px;
  background-color: #f2f4fb;
  margin: 24px 14px 0px 14px;
  padding: 20px 13px 20px 14px;
}

.healthcare .inbody-wrapper .dashboard-box .dashboard-label-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
  text-align: center;
}

.healthcare .inbody-wrapper .dashboard-box .dashboard-value-item {
  margin-top: 4px;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: -0.24px;
  color: #363b41;
  text-align: center;
}

.healthcare .inbody-wrapper .dashboard-box .dashboard-value-item span {
  margin-left: 2px;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.13px;
  color: #363b41;
}

.healthcare .inbody-wrapper .dashboard-box .bottom-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.healthcare .inbody-wrapper .dashboard-box .bottom-area .item-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.healthcare .inbody-wrapper .dashboard-box .divider {
  margin: 15px 0px;
  height: 1px;
  background: #c7cad1;
}

.healthcare .inbody-wrapper .dashboard-box .v-divider {
  width: 1px;
  height: 46px;
  background: #c7cad1;
}

.healthcare .inbody-wrapper .guide-item {
  margin-top: 17px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  text-align: center;
  color: #686b73;
}

.healthcare .position-result {
  padding: 31px 24px 0;
}

.healthcare .position-result .result-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
}

.healthcare .position-result .result-status {
  margin: 11px auto 0;
  height: 23px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: center;
  width: 49px;
  display: none;
}

.healthcare .position-result.good .result-status.good {
  display: block;
}

.healthcare .position-result.normal .result-status.normal {
  display: block;
}

.healthcare .position-result.bad .result-status.bad {
  display: block;
}

.healthcare .position-result .result-status.good {
  color: #5653ff;
  background-color: #eeeefa;
}

.healthcare .position-result .result-status.normal {
  color: #eebf00;
  background-color: #fafaee;
}

.healthcare .position-result .result-status.bad {
  color: #ff5151;
  background-color: #faeef0;
}

.healthcare .position-result .result-detail {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-top: 20px;
}

.healthcare .front-result {
  width: calc(100% - 48px);
  margin: 31px auto 0;
}

.healthcare .front-result + .thick-divider {
  margin-top: 31px;
}

.healthcare .front-result .result-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
}

.healthcare .front-result .divider {
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px 0 0 0;
}

.healthcare .front-result .items {
  width: calc(100% - 28px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 20px auto 0;
}

.healthcare .front-result .items.shoulder {
  margin-top: 31px;
}

.healthcare .front-result .items .title-item {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
}

.healthcare .front-result .items .title-item .desc {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  color: #686b73;
}

.healthcare .front-result .items .status-item {
  height: 23px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: center;
  padding: 0 6px;
}

.healthcare .front-result .items .status-item.normal {
  background-color: #eeeefa;
  color: #5653ff;
}

.healthcare .front-result .items .status-item.abnormal {
  background-color: #faeef0;
  color: #ff5151;
}

.healthcare .side-result {
  margin-top: 30px;
}

.healthcare .side-result .result-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
}

.healthcare .side-result .side-style {
  width: calc(100% - 60px);
  margin: 31px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.healthcare .side-result .side-style .status {
  width: 25%;
  text-align: center;
}

.healthcare .side-result .side-style .status .side-img {
  display: none;
  margin: 0 auto;
  height: 170px;
}

.healthcare .side-result .side-style .status.off .off {
  display: block;
}

.healthcare .side-result .side-style .status.on .on {
  display: block;
}

.healthcare .side-result .side-style .status .status-text {
  font-size: 13.3px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.38px;
  text-align: center;
  margin-top: 5px;
}

.healthcare .side-result .side-style .status.off .status-text {
  color: #686b73;
}

.healthcare .side-result .side-style .status.on .status-text {
  color: #5653ff;
  font-weight: bold;
}

.healthcare .neck-result {
  margin-top: 30px;
}

.healthcare .neck-result .status-angle {
  margin-top: 10px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.healthcare .neck-result .status-angle .status {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.23px;
  text-align: center;
  color: #5653ff;
  border-radius: 5px;
  background-color: #eeeefa;
  width: 36px;
  height: 23px;
  margin-right: 7px;
  display: none;
}

.healthcare .neck-result .status-angle .angle {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.25px;
  text-align: center;
  color: #363b41;
}

.healthcare .neck-result .status-angle.normal .status {
  display: block;
}

.healthcare .neck-result .result-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
}

.healthcare .neck-result .neck-style {
  width: calc(100% - 60px);
  margin: 31px auto 0;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.healthcare .neck-result .neck-style .neck-img {
  height: 48px;
}

.healthcare .neck-result .neck-style .weight {
  font-size: 11.2px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.32px;
  text-align: center;
  color: #a4a9b3;
}

.healthcare .neck-result .neck-style .neck {
  margin-top: 3px;
}

.healthcare .neck-result .neck-style .angle {
  font-size: 13.4px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.38px;
  text-align: center;
  color: #686b73;
  margin-top: 6px;
}

.healthcare .neck-result .neck-info-text {
  text-align: center;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  text-align: center;
  color: #686b73;
  margin-top: 24px;
  margin-bottom: 54px;
}

.healthcare .grade-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: calc(100% - 32px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 32px auto 0;
}

.healthcare .grade-area .general-grade {
  width: calc((100% - 1px) / 2);
}

.healthcare .grade-area .general-grade .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  margin-right: 54px;
  text-align: right;
  color: #36434c;
}

.healthcare .grade-area .general-grade .number-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.24px;
  text-align: right;
  margin-right: 80px;
  color: #363b41;
  margin-top: 3px;
}

.healthcare .grade-area .general-divider {
  width: 1px;
  height: 55px;
  background-color: #e6e8f2;
}

.healthcare .grade-area .score {
  width: calc((100% - 1px) / 2);
}

.healthcare .grade-area .score .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: left;
  margin-left: 62px;
  color: #36434c;
}

.healthcare .grade-area .score .number-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.24px;
  text-align: left;
  color: #363b41;
  margin-left: 69px;
  margin-top: 3px;
}

.healthcare .grade-area .score .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.13px;
  color: #363b41;
  margin-left: 3px;
}

.healthcare .grade-area + .divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 30px auto 0;
}

.healthcare .grade-detail {
  width: calc(100% - 34px);
  margin: 56px auto 44px;
  border-radius: 10px;
  background-color: #f2f4fb;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
}

.healthcare .grade-detail .content {
  padding: 14px 16px 15px 15px;
}

.healthcare .join-divider {
  width: calc(100% - 32px);
  margin: 31px auto 0;
  height: 1px;
  background-color: #e6e8f2;
}

.healthcare .angle-result {
  margin: 31px auto 0;
  width: calc(100% - 32px);
}

.healthcare .angle-result .result-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
}

.healthcare .angle-result .angle-estimate {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 16px;
}

.healthcare .angle-result .angle-estimate .estimate-item {
  width: calc((100% - 25px) / 3);
}

.healthcare .angle-result .angle-estimate .box-item {
  border-radius: 7px;
  border: solid 1px #e6e8f2;
}

.healthcare .angle-result .angle-estimate .box-item .img-area {
  height: 111px;
  position: relative;
}

.healthcare .angle-result .angle-estimate .box-item .img-area img {
  height: 96px;
  position: absolute;
  bottom: 0px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.healthcare .angle-result .angle-estimate .box-item .text-area {
  border-top: solid 1px #e6e8f2;
  background-color: #f2f4fb;
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.37px;
  text-align: center;
  color: #686b73;
  padding: 5px 0 8px;
}

.healthcare .angle-result .angle-estimate .estimate-item .angle-detail {
  text-align: center;
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.healthcare .angle-result .angle-estimate .estimate-item .angle-detail:nth-child(3) {
  margin-top: 6px;
}

.healthcare .angle-result .angle-estimate .estimate-item .angle-detail .left-unit {
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: normal;
  color: #25282b;
}

.healthcare .angle-result .angle-estimate .estimate-item .angle-detail .right-unit {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.17px;
  color: #73787e;
}

.healthcare .angle-result.shoulder .angle-estimate .box-item .img-area img {
  height: 111px;
}

.healthcare .angle-result.shoulder .angle-estimate .estimate-item:nth-child(2) .box-item .img-area img {
  height: 105px;
}

.healthcare .angle-result.shoulder .angle-estimate .estimate-item .angle-detail {
  margin-top: 9.8px;
}

.healthcare .angle-result.shoulder .angle-estimate .estimate-item .angle-detail:last-child {
  margin-top: 6px;
}

.healthcare .angle-result .angle-estimate .estimate-item .angle-detail .left-unit.red {
  color: #ff5151;
}

.healthcare .angle-result.waist .angle-estimate {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.healthcare .angle-result.waist .angle-estimate .estimate-item {
  width: calc((100% - 13px) / 2);
}

.healthcare .angle-result.waist .angle-estimate .estimate-item:last-child {
  width: 100%;
  margin-top: 15px;
}

.healthcare .angle-result.waist .angle-estimate .box-item .img-area {
  height: 165px;
}

.healthcare .angle-result.waist .angle-estimate .box-item .img-area:last-child {
  height: 154px;
}

.healthcare .angle-result.waist .angle-estimate .box-item .img-area img {
  height: 140px;
}

.healthcare .angle-result.pelvis .angle-estimate .box-item .img-area {
  height: 190px;
}

.healthcare .angle-result.pelvis .angle-estimate .box-item .img-area img {
  height: 177px;
  top: 0px;
  bottom: unset;
}

.healthcare .angle-desc {
  width: 100%;
  margin: 23px auto 0px;
  border-radius: 10px;
  background-color: #f2f4fb;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.1px;
  color: #363b41;
}

.healthcare .angle-desc .content {
  padding: 14px 16px 15px 15px;
}

.healthcare .shoulder .angle-desc {
  margin-top: 15px;
}

.healthcare .angle-result.waist .angle-estimate .estimate-item .angle-detail .left-unit.special {
  margin-left: 15px;
}

.healthcare .waist .angle-desc {
  margin-top: 15px;
}

.healthcare .pelvis .angle-desc {
  margin-top: 15px;
  margin-bottom: 64.6px;
}

.healthcare .general .graph-section .graph-area {
  height: 225px;
}

/* home */
body.home {
  background-color: #f5f8fd;
}

.home {
  /* interlock-area */
  /* mission-area */
  /* slide-box */
  /* media-query */
}

.home .header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  padding: 15px 24px 0;
}

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

.home .header__util-item {
  position: relative;
  margin-left: 18px;
}

.home .header__util-item .new {
  position: absolute;
  top: 5px;
  left: 50%;
  margin-left: -12px;
}

.home .header .text-img {
  position: absolute;
  width: 145px;
  left: 33px;
  top: 20px;
  z-index: 2;
}

.home .header .bg-img {
  position: absolute;
  width: 201px;
  right: 16px;
  z-index: 1;
}

.home .point-box {
  width: calc(100% - 32px);
  margin: 24px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
}

.home .point-box .box-wrapper {
  padding: 15px 24px 16px 23px;
}

.home .point-box .top-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* padding-top:16px;
      padding-left:24px; */
}

.home .point-box .top-box .profile {
  width: 59px;
  height: 59px;
  border-radius: 100%;
}

.home .point-box .top-box .info-wrapper {
  margin-left: 9px;
}

.home .point-box .top-box .info-wrapper .id-wrapper .nick {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
  color: #080808;
}

.home .point-box .top-box .info-wrapper .id-wrapper .ic-edit {
  width: 16px;
  height: 15px;
}

.home .point-box .top-box .info-wrapper .info-desc {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-top: 2px;
}

.home .point-box .bottom-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 14px;
}

.home .point-box .bottom-box .point-wrapper {
  border-radius: 8px;
  border: solid 1px #f2f4fb;
  background-color: #f2f4fb;
  position: relative;
  height: 27px;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin-left: 14.5px;
}

.home .point-box .bottom-box .point-wrapper .point-img {
  width: 29px;
  height: 29px;
  position: absolute;
  top: -2px;
  left: -14.5px;
}

.home .point-box .bottom-box .point-wrapper .point {
  margin-left: 26px;
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 26px;
  letter-spacing: -0.2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #363b41;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.home .point-box .bottom-box .point-wrapper .point .unit {
  margin-left: 5px;
  margin-right: 13px;
}

.home .point-box .bottom-box .grade-box {
  border-radius: 8px;
  border: solid 1px #f2f4fb;
  background-color: #f2f4fb;
  position: relative;
  margin-left: 17px;
  height: 27px;
  width: 115px;
}

.home .point-box .bottom-box .grade-box .grade-img {
  width: 26px;
  height: 29px;
  position: absolute;
  top: -2px;
  left: 0px;
}

.home .point-box .bottom-box .grade-box .grader {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 26px;
  letter-spacing: -0.2px;
  color: #363b41;
  margin-left: 32px;
}

.home .interlock-area {
  width: calc(100% - 32px);
  margin: 20px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #5653ff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: none;
  height: 40px;
}

.home .interlock-area.false {
  width: calc(100% - 32px);
  margin: 20px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #5653ff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.home .interlock-area .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 40px;
  letter-spacing: -0.2px;
  color: #ffffff;
  margin-left: 24px;
}

.home .interlock-area .text-item .unit {
  font-weight: bold;
}

.home .interlock-area .link-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 16px;
}

.home .mission-area {
  width: calc(100% - 32px);
  margin: 20px auto 0;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
}

.home .mission-area .title-wrapper {
  padding-top: 35px;
  padding-right: 24px;
  padding-left: 23px;
}

.home .mission-area .title-wrapper .mission-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.home .mission-area .title-wrapper .mission-title .title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #21211d;
}

.home .mission-area .title-wrapper .mission-title .calender {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  text-align: right;
  color: #686b73;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.home .mission-area .title-wrapper .mission-title .calender .ic-cal {
  width: 18px;
  height: 18px;
  margin-left: 4px;
}

.home .mission-area .title-wrapper .mission-title .graph {
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  text-align: right;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.home .mission-area .title-wrapper .mission-title .graph p {
  font-size: 13px;
  color: #686b70;
  font-weight: 500;
}

.home .mission-area .title-wrapper .mission-title .graph .ic-graph {
  width: 23px;
  height: 19px;
  margin-left: 3px;
}

.home .mission-area .title-wrapper .mission-desc {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-top: 3px;
}

.home .mission-area .mission-list {
  width: calc(100% - 47px);
  margin: 28px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.home .mission-area .mission-list .mission {
  width: calc((100% - 68px) / 3);
}

.home .mission-area .mission-list .mission:nth-child(3n-1) {
  margin-right: 32px;
  margin-left: 36px;
}

.home .mission-area .mission-list .mission:nth-child(n + 4) {
  margin-top: 24px;
  margin-bottom: 30px;
}

.home .mission-area .mission-list .mission .mission-kind {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  width: 68px;
  height: 68px;
  position: relative;
  margin: 0 auto;
}

.home .mission-area .mission-list .mission .mission-kind svg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.home .mission-area .mission-list .mission .mission-kind:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  margin-left: -4.5px;
  border-radius: 100%;
  background: #f60;
  background: #ffe370;
  -webkit-transition: 0.6s ease all;
  transition: 0.6s ease all;
  -webkit-transform: translate(21px, -25px);
          transform: translate(21px, -25px);
  opacity: 0;
}

.home .mission-area .mission-list .mission .mission-kind.active:after {
  opacity: 1;
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="1"]:after {
  -webkit-transform: translate(6px, -31px);
          transform: translate(6px, -31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="2"]:after {
  -webkit-transform: translate(7px, -31px);
          transform: translate(7px, -31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="3"]:after {
  -webkit-transform: translate(9px, -30px);
          transform: translate(9px, -30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="4"]:after {
  -webkit-transform: translate(11px, -30px);
          transform: translate(11px, -30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="5"]:after {
  -webkit-transform: translate(13px, -29px);
          transform: translate(13px, -29px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="6"]:after {
  -webkit-transform: translate(15px, -28px);
          transform: translate(15px, -28px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="7"]:after {
  -webkit-transform: translate(15px, -27px);
          transform: translate(15px, -27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="8"]:after {
  -webkit-transform: translate(17px, -27px);
          transform: translate(17px, -27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="9"]:after {
  -webkit-transform: translate(19px, -26px);
          transform: translate(19px, -26px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="10"]:after {
  -webkit-transform: translate(21px, -25px);
          transform: translate(21px, -25px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="11"]:after {
  -webkit-transform: translate(22px, -23px);
          transform: translate(22px, -23px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="12"]:after {
  -webkit-transform: translate(23px, -21px);
          transform: translate(23px, -21px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="13"]:after {
  -webkit-transform: translate(24px, -19px);
          transform: translate(24px, -19px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="14"]:after {
  -webkit-transform: translate(25px, -18px);
          transform: translate(25px, -18px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="15"]:after {
  -webkit-transform: translate(26px, -17px);
          transform: translate(26px, -17px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="16"]:after {
  -webkit-transform: translate(27px, -15px);
          transform: translate(27px, -15px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="17"]:after {
  -webkit-transform: translate(28px, -14px);
          transform: translate(28px, -14px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="18"]:after {
  -webkit-transform: translate(29px, -12px);
          transform: translate(29px, -12px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="19"]:after {
  -webkit-transform: translate(30px, -11px);
          transform: translate(30px, -11px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="20"]:after {
  -webkit-transform: translate(31px, -10px);
          transform: translate(31px, -10px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="21"]:after {
  -webkit-transform: translate(31px, -8px);
          transform: translate(31px, -8px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="22"]:after {
  -webkit-transform: translate(31px, -6px);
          transform: translate(31px, -6px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="23"]:after {
  -webkit-transform: translate(31px, -4px);
          transform: translate(31px, -4px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="24"]:after {
  -webkit-transform: translate(31px, -2px);
          transform: translate(31px, -2px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="25"]:after {
  -webkit-transform: translate(32px, 0px);
          transform: translate(32px, 0px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="26"]:after {
  -webkit-transform: translate(32px, 2px);
          transform: translate(32px, 2px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="27"]:after {
  -webkit-transform: translate(31px, 4px);
          transform: translate(31px, 4px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="28"]:after {
  -webkit-transform: translate(31px, 6px);
          transform: translate(31px, 6px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="29"]:after {
  -webkit-transform: translate(31px, 8px);
          transform: translate(31px, 8px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="30"]:after {
  -webkit-transform: translate(30px, 10px);
          transform: translate(30px, 10px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="31"]:after {
  -webkit-transform: translate(29px, 12px);
          transform: translate(29px, 12px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="32"]:after {
  -webkit-transform: translate(28px, 14px);
          transform: translate(28px, 14px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="33"]:after {
  -webkit-transform: translate(27px, 16px);
          transform: translate(27px, 16px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="34"]:after {
  -webkit-transform: translate(26px, 18px);
          transform: translate(26px, 18px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="35"]:after {
  -webkit-transform: translate(25px, 20px);
          transform: translate(25px, 20px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="36"]:after {
  -webkit-transform: translate(24px, 21px);
          transform: translate(24px, 21px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="37"]:after {
  -webkit-transform: translate(23px, 22px);
          transform: translate(23px, 22px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="38"]:after {
  -webkit-transform: translate(22px, 23px);
          transform: translate(22px, 23px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="39"]:after {
  -webkit-transform: translate(21px, 24px);
          transform: translate(21px, 24px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="40"]:after {
  -webkit-transform: translate(20px, 25px);
          transform: translate(20px, 25px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="41"]:after {
  -webkit-transform: translate(18px, 26px);
          transform: translate(18px, 26px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="42"]:after {
  -webkit-transform: translate(18px, 26px);
          transform: translate(18px, 26px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="43"]:after {
  -webkit-transform: translate(17px, 27px);
          transform: translate(17px, 27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="44"]:after {
  -webkit-transform: translate(16px, 28px);
          transform: translate(16px, 28px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="45"]:after {
  -webkit-transform: translate(10px, 30px);
          transform: translate(10px, 30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="46"]:after {
  -webkit-transform: translate(8px, 30px);
          transform: translate(8px, 30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="47"]:after {
  -webkit-transform: translate(6px, 31px);
          transform: translate(6px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="48"]:after {
  -webkit-transform: translate(4px, 31px);
          transform: translate(4px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="49"]:after {
  -webkit-transform: translate(2px, 31px);
          transform: translate(2px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="50"]:after {
  -webkit-transform: translate(1px, 32px);
          transform: translate(1px, 32px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="51"]:after {
  -webkit-transform: translate(-1px, 31px);
          transform: translate(-1px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="52"]:after {
  -webkit-transform: translate(-3px, 31px);
          transform: translate(-3px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="53"]:after {
  -webkit-transform: translate(-6px, 31px);
          transform: translate(-6px, 31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="54"]:after {
  -webkit-transform: translate(-7px, 30px);
          transform: translate(-7px, 30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="55"]:after {
  -webkit-transform: translate(-10px, 30px);
          transform: translate(-10px, 30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="56"]:after {
  -webkit-transform: translate(-12px, 29px);
          transform: translate(-12px, 29px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="57"]:after {
  -webkit-transform: translate(-14px, 29px);
          transform: translate(-14px, 29px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="58"]:after {
  -webkit-transform: translate(-16px, 27px);
          transform: translate(-16px, 27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="59"]:after {
  -webkit-transform: translate(-18px, 27px);
          transform: translate(-18px, 27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="60"]:after {
  -webkit-transform: translate(-19px, 26px);
          transform: translate(-19px, 26px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="61"]:after {
  -webkit-transform: translate(-21px, 24px);
          transform: translate(-21px, 24px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="62"]:after {
  -webkit-transform: translate(-22px, 22px);
          transform: translate(-22px, 22px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="63"]:after {
  -webkit-transform: translate(-24px, 20px);
          transform: translate(-24px, 20px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="64"]:after {
  -webkit-transform: translate(-26px, 18px);
          transform: translate(-26px, 18px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="65"]:after {
  -webkit-transform: translate(-27px, 16px);
          transform: translate(-27px, 16px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="66"]:after {
  -webkit-transform: translate(-28px, 14px);
          transform: translate(-28px, 14px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="67"]:after {
  -webkit-transform: translate(-29px, 12px);
          transform: translate(-29px, 12px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="68"]:after {
  -webkit-transform: translate(-30px, 11px);
          transform: translate(-30px, 11px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="69"]:after {
  -webkit-transform: translate(-30px, 10px);
          transform: translate(-30px, 10px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="70"]:after {
  -webkit-transform: translate(-31px, 9px);
          transform: translate(-31px, 9px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="71"]:after {
  -webkit-transform: translate(-31px, 7px);
          transform: translate(-31px, 7px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="72"]:after {
  -webkit-transform: translate(-31px, 5px);
          transform: translate(-31px, 5px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="73"]:after {
  -webkit-transform: translate(-31px, 3px);
          transform: translate(-31px, 3px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="74"]:after {
  -webkit-transform: translate(-31px, 1px);
          transform: translate(-31px, 1px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="75"]:after {
  -webkit-transform: translate(-32px, -1px);
          transform: translate(-32px, -1px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="76"]:after {
  -webkit-transform: translate(-31px, -3px);
          transform: translate(-31px, -3px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="77"]:after {
  -webkit-transform: translate(-31px, -5px);
          transform: translate(-31px, -5px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="78"]:after {
  -webkit-transform: translate(-31px, -7px);
          transform: translate(-31px, -7px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="79"]:after {
  -webkit-transform: translate(-31px, -9px);
          transform: translate(-31px, -9px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="80"]:after {
  -webkit-transform: translate(-30px, -10px);
          transform: translate(-30px, -10px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="81"]:after {
  -webkit-transform: translate(-29px, -12px);
          transform: translate(-29px, -12px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="82"]:after {
  -webkit-transform: translate(-28px, -14px);
          transform: translate(-28px, -14px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="83"]:after {
  -webkit-transform: translate(-27px, -16px);
          transform: translate(-27px, -16px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="84"]:after {
  -webkit-transform: translate(-26px, -18px);
          transform: translate(-26px, -18px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="85"]:after {
  -webkit-transform: translate(-25px, -20px);
          transform: translate(-25px, -20px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="86"]:after {
  -webkit-transform: translate(-24px, -21px);
          transform: translate(-24px, -21px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="87"]:after {
  -webkit-transform: translate(-23px, -22px);
          transform: translate(-23px, -22px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="88"]:after {
  -webkit-transform: translate(-22px, -23px);
          transform: translate(-22px, -23px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="89"]:after {
  -webkit-transform: translate(-20px, -24px);
          transform: translate(-20px, -24px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="90"]:after {
  -webkit-transform: translate(-19px, -25px);
          transform: translate(-19px, -25px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="91"]:after {
  -webkit-transform: translate(-18px, -26px);
          transform: translate(-18px, -26px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="92"]:after {
  -webkit-transform: translate(-17px, -27px);
          transform: translate(-17px, -27px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="93"]:after {
  -webkit-transform: translate(-16px, -28px);
          transform: translate(-16px, -28px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="94"]:after {
  -webkit-transform: translate(-13px, -29px);
          transform: translate(-13px, -29px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="95"]:after {
  -webkit-transform: translate(-12px, -30px);
          transform: translate(-12px, -30px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="96"]:after {
  -webkit-transform: translate(-10px, -31px);
          transform: translate(-10px, -31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="97"]:after {
  -webkit-transform: translate(-9px, -31px);
          transform: translate(-9px, -31px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="98"]:after {
  -webkit-transform: translate(-7px, -32px);
          transform: translate(-7px, -32px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="99"]:after {
  -webkit-transform: translate(-5px, -33px);
          transform: translate(-5px, -33px);
}

.home .mission-area .mission-list .mission .mission-kind[data-percent="100"]:after {
  display: none;
}

.home .mission-area .mission-list .mission .mission-kind .outer {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  width: 62px;
  height: 62px;
  margin: auto;
  text-align: center;
  z-index: 20;
}

.home .mission-area .mission-list .mission .mission-kind .complete {
  width: 68px;
  height: 68px;
  top: 0px;
  position: absolute;
  background: #5653ff;
  opacity: 0.5;
  border-radius: 50%;
  z-index: 5;
  display: none;
}

.home .mission-area .mission-list .mission.complete .mission-kind .complete {
  display: block;
}

.home .mission-area .mission-list .mission.insert .mission-kind {
  background-color: #dfdefb;
}

.home .mission-area .mission-list .mission.insert .mission-kind .outer .inner-mask {
  background-color: #dfdefb;
}

.home .mission-area .mission-list .mission.insert .mission-kind .outer .inner {
  background: #5653ff;
}

.home .mission-area .mission-list .mission .mission-kind .complete-mask {
  /*position:absolute;
      left:50%;
      top:50%;
      transform: translate(-50%, -50%);
      z-index: 100;
      width:43.42%;
      display:none;*/
}

.home .mission-area .mission-list .mission.complete .mission-kind .complete-mask {
  display: block;
}

.home .mission-area .mission-list .mission .mission-kind .outer .inner {
  /*width: 100%;
      height: 100%;
      border: solid 2px #c9cdd1;
      background: #f2f4fb;
      border-radius: 50%;
      position:absolute;
      left:50%;
      top:50%;
      transform: translate(-50%, -50%);
      z-index:1;*/
}

.home .mission-area .mission-list .mission .mission-kind .outer .inner-mask {
  /*width: 56px;
      height: 56px;
      border-radius: 50%;
      position:absolute;
      left:50%;
      top:50%;
      transform: translate(-50%, -50%);
      background-color: #f2f4fb;
      z-index:2;*/
  /* border: solid 2px #5653ff; */
}

.home .mission-area .mission-list .mission .mission-kind .outer .progress {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #5653ff;
  z-index: 2;
  /* border: solid 2px #5653ff; */
}

.home .mission-area .mission-list .mission.complete .mission-kind .outer .progress {
  background: unset !important;
}

.home .mission-area .mission-list .mission .mission-kind .outer .progress-bar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #f2f4fb;
  z-index: 2;
  /* border: solid 2px #5653ff; */
}

.home .mission-area .mission-list .mission .mission-kind .outer .mission-icon {
  /*position:absolute;
      left:50%;
      top:50%;
      width:43.42%;
      transform: translate(-50%, -50%);
      z-index:3;*/
}

.home .mission-area .mission-list .mission .point {
  border-radius: 15px;
  background: rgba(219, 224, 228, 0.73);
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 24px;
  letter-spacing: -0.35px;
  text-align: center;
  color: #686b73;
  width: 68px;
  margin: 6px auto 0;
  height: 24px;
}

.home .mission-area .mission-list .mission.complete .point {
  background-color: #ffe370;
  color: #323539;
}

.home .mission-area .mission-list .mission .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.65px;
  text-align: center;
  color: #25282b;
  margin-top: 3px;
}

.home .mission-area .mission-list .mission .status {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.36px;
  text-align: center;
  color: #5653ff;
  /* margin-top:3px; */
}

.home .slide-box .swiper-slide img {
  width: 100%;
  border-radius: 10px;
}

.home .slide-box .swiper-slide {
  padding: 20px 16px;
  border-radius: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.home .swiper-pagination {
  position: relative;
  bottom: auto;
  margin: -20px 0 20px 0;
}

.home .swiper-pagination .swiper-pagination-bullet-active {
  background: #000;
}

@media screen and (max-width: 374px) {
  .home .mission-area .mission-list .mission {
    width: calc((100% - 12px) / 3);
  }
  .home .mission-area .mission-list .mission:nth-child(3n-1) {
    margin-right: 6px;
    margin-left: 6px;
  }
  .home .point-box .bottom-box .point-wrapper .point {
    /* margin-left: 31px; */
    /* width:100px;
          overflow:hidden; 
          text-overflow:ellipsis; 
          white-space:nowrap; */
  }
  .home .point-box .bottom-box .point-wrapper .point .number {
    /* width:56%; */
    /* overflow:hidden; 
          text-overflow:ellipsis; 
          white-space:nowrap; */
  }
  .home .point-box .bottom-box .grade-box {
    /* width:auto; */
    /* margin-left: 10px; */
  }
  .home .point-box .bottom-box .grade-box .grader {
    /* margin-left: 31px; */
    /* width:40%;
          overflow:hidden; 
          text-overflow:ellipsis; 
          white-space:nowrap; */
  }
}

/* igrip_popup */
body.igrip_popup {
  background-color: #fff;
  padding-bottom: 34px;
}

.igrip_popup .alert-wrapper .alert-text {
  padding: 20px 0 20px;
  border-bottom: 1px solid #e6e8f2;
}

.igrip_popup .text-area {
  overflow-y: scroll;
  height: 70vh;
  padding-bottom: 35px;
}

.igrip_popup .text-wrapper .note {
  width: calc(100% - 44px);
  margin: 17px auto 0;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #5653ff;
}

.igrip_popup .alert-wrapper .alert-area {
  height: 56px;
  line-height: 56px;
  border-top: 1px solid #e6e8f2;
}

.igrip_popup .alert-wrapper .alert-area .confirm {
  width: 100%;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: center;
  color: #5653ff;
}

.igrip_popup .info-title {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-left: 22px;
  margin-top: 24px;
}

.igrip_popup .info-title:first-child {
  margin-top: 15px;
}

.igrip_popup .info-desc {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.2px;
  color: #686b73;
  width: calc(100% - 76px);
  margin: 2px auto 0px;
}

.igrip_popup .img-box {
  width: calc(100% - 76px);
  margin: 15px auto;
  text-align: center;
}

/* igrip */
body.igrip {
  background-color: #fff;
  padding-bottom: 34px;
}

.igrip .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.igrip .thick-divider {
  width: 100%;
  height: 2px;
  background-color: #e9edf0;
}

.igrip .title {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #686b73;
  margin: 20px 0 0 24px;
}

.igrip .score {
  margin: 1px 0 0 24px;
}

.igrip .score .own {
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
  color: #080808;
}

.igrip .score .standard {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: -0.2px;
  color: #686b73;
  margin-left: 3px;
}

.igrip .desc {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-left: 24px;
  margin-top: 10px;
  margin-bottom: 22px;
}

.igrip .detail {
  width: calc(100% - 48px);
  margin: 20px auto 18px;
}

.igrip .detail .detail-title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #21211d;
  margin-bottom: 19px;
}

.igrip .detail .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 14px;
  margin-top: 14px;
}

.igrip .detail .item:first-child {
  margin-top: 0px;
}

.igrip .detail .item .item-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.igrip .detail .item .item-title .tooltip {
  position: absolute;
  left: 100%;
  top: 0px;
  width: 215px;
  border-radius: 5px;
  border: solid 1px #c7cad1;
  background-color: #fcfcfe;
  display: none;
  z-index: 1;
}

.igrip .detail .item .item-title .tooltip .ic-tooltip-x {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 9px;
  right: 9px;
}

.igrip .detail .item .item-title .tooltip .tooltip-text {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #363b41;
  padding: 40px 15px 22px 16px;
  white-space: pre-wrap;
}

.igrip .detail .item .item-title .text {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.41px;
  color: #363b41;
}

.igrip .detail .item .item-title .ic_info {
  width: 15px;
  height: 15px;
  -o-object-fit: contain;
     object-fit: contain;
  margin-left: 3px;
}

.igrip .detail .item .item-detail .data {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  text-align: right;
  color: #080808;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  width: 100%;
}

.igrip .detail .item .item-detail .data .mark {
  height: 20px;
  padding: 2px 5px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: -0.22px;
  text-align: center;
  margin-right: 7px;
}

.igrip .detail .item .item-detail .data .mark.green {
  background-color: #e8fcf8;
  color: #00c69c;
}

.igrip .detail .item .item-detail .data .mark.blue {
  background-color: #eeeefa;
  color: #5653ff;
}

.igrip .detail .item .item-detail .data .mark.purple {
  background-color: #f6eaff;
  color: #a359e4;
}

.igrip .detail .item .item-detail .data .mark.yellow {
  background-color: #fafaee;
  color: #eebf00;
}

.igrip .detail .item .item-detail .data .mark.orange {
  background-color: #ffeedd;
  color: #ff8a14;
}

.igrip .detail .item .item-detail .data .mark.red {
  background-color: #faeef0;
  color: #ff5151;
}

.igrip .detail .item .item-detail .data .bottom {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #697279;
  width: 100%;
}

/* inbody */
body.inbody {
  background-color: #fff;
  padding-bottom: 34px;
}

.inbody .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.inbody .more {
  width: calc(100% - 48px);
  margin: 25px auto;
  height: 46px;
  border-radius: 23px;
  border: solid 1.5px #5653ff;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.inbody .more div {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 46px;
  letter-spacing: -0.47px;
  color: #5653ff;
  margin-right: 2px;
}

.inbody .thick-divider {
  width: 100%;
  height: 2px;
  background-color: #e9edf0;
}

.inbody .title {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #686b73;
  margin: 20px 0 0 24px;
}

.inbody .score {
  margin: 1px 0 0 24px;
}

.inbody .score .own {
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
  color: #080808;
}

.inbody .score .standard {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: -0.2px;
  color: #686b73;
  margin-left: 3px;
}

.inbody .desc {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-left: 24px;
  margin-top: 10px;
  margin-bottom: 22px;
}

.inbody .detail {
  width: calc(100% - 48px);
  margin: 20px auto 18px;
}

.inbody .detail .detail-title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #21211d;
  margin-bottom: 17px;
}

.inbody .detail .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 14px;
  margin-top: 14px;
}

.inbody .detail .item:first-child {
  margin-top: 0px;
}

.inbody .detail .item .item-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.inbody .detail .item .item-title .tooltip {
  position: absolute;
  left: 100%;
  top: 0px;
  width: 215px;
  border-radius: 5px;
  border: solid 1px #c7cad1;
  background-color: #fcfcfe;
  display: none;
  z-index: 1;
}

.inbody .detail .item .item-title .tooltip .ic-tooltip-x {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 9px;
  right: 9px;
}

.inbody .detail .item .item-title .tooltip .tooltip-text {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #363b41;
  padding: 40px 15px 22px 16px;
  white-space: pre-wrap;
}

.inbody .detail .item .item-title .text {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.41px;
  color: #363b41;
}

.inbody .detail .item .item-title .ic_info {
  width: 15px;
  height: 15px;
  -o-object-fit: contain;
     object-fit: contain;
  margin-left: 3px;
}

.inbody .detail .item .item-detail .data {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  text-align: right;
  color: #080808;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  width: 100%;
}

.inbody .detail .item .item-detail .data .mark {
  height: 20px;
  padding: 2px 5px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: -0.22px;
  text-align: center;
  margin-right: 7px;
}

.inbody .detail .item .item-detail .data .mark.green {
  background-color: #e8fcf8;
  color: #00c69c;
}

.inbody .detail .item .item-detail .data .mark.blue {
  background-color: #eeeefa;
  color: #5653ff;
}

.inbody .detail .item .item-detail .data .mark.purple {
  background-color: #f6eaff;
  color: #a359e4;
}

.inbody .detail .item .item-detail .data .mark.yellow {
  background-color: #fafaee;
  color: #eebf00;
}

.inbody .detail .item .item-detail .data .mark.orange {
  background-color: #ffeedd;
  color: #ff8a14;
}

.inbody .detail .item .item-detail .data .mark.red {
  background-color: #faeef0;
  color: #ff5151;
}

.inbody .detail .item .item-detail .data .bottom {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #697279;
  width: 100%;
}

/* index */
body.index {
  background-color: #f5f8fd;
}

.index {
  /* 건강 리포트 - 빈화면 */
  /* 건강 리포트 - 데이터 있을 시 */
  /* report-hidden mask, marker */
  /* danger */
  /* improve */
  /* keep */
  /* walking */
  /* 그래프 */
  /* graph-section */
  /* report-result */
  /* report ingredient */
  /* table-area */
  /* report general */
  /* food */
  /* sugar */
  /* blood */
}

.index .title-area {
  margin-top: 13px;
  padding: 0px 24px;
}

.index .title-area .name-item {
  font-size: 23px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.48;
  letter-spacing: -0.7px;
}

.index .title-area .comment-item {
  color: #363b41;
  font-size: 20px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.35;
  letter-spacing: -0.61px;
}

.index .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.index .tab-area .tab-content {
  display: none;
  padding: 22px 10px 43px 10px;
}

.index .tab-area .tab-content-active {
  display: block;
}

.index .tab-area .tab-content .card-list {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

.index .tab-area .tab-content .card-list li {
  width: 33.33333333%;
}

.index .tab-area .tab-content .card-list li .item-wrapper {
  margin: 6px;
  background-color: white;
  border-radius: 8px;
  -webkit-box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0px 1px 4px 2px rgba(96, 110, 170, 0.06);
  padding: 43px 15px 16px 12px;
  position: relative;
}

.index .tab-area .tab-content .card-list li .item-wrapper img {
  position: absolute;
  top: 13px;
  left: 14px;
}

.index .tab-area .tab-content .card-list li .item-wrapper .title-item {
  /* margin: 19px 0px 0px 5px; */
  color: #686b73;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: right;
}

.index .tab-area .tab-content .card-list li .item-wrapper .value-item {
  margin-top: 1px;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #080808;
  text-align: right;
}

.index .tab-area .tab-content .card-list li .item-wrapper .unit-item {
  margin-top: 1px;
  font-size: 10px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: right;
}

.index .tab-area .tab-content .guide-item {
  margin-top: 14px;
  color: #686b73;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.47px;
  text-align: center;
}

.index .tab-area .tab-content .edit-btn {
  padding: 2px 18px 2px 16px;
  border-radius: 15px;
  border: solid 1px #686b73;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 45px;
  min-width: 45px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 19px auto 0px;
  cursor: pointer;
}

.index .tab-area .tab-content .edit-btn .ic-img {
  width: 15px;
  height: 15px;
  margin-right: 5px;
}

.index .tab-area .tab-content .edit-btn .btn-item {
  font-family: "Spoqa Han Sans", "sans-serif";
  font-size: 12px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #686b73;
}

.index .pop-layer {
  display: none;
  position: absolute;
  bottom: 0px;
  height: auto;
  background-color: #fff;
  z-index: 10;
  border-top-right-radius: 16px;
  border-top-left-radius: 16px;
  width: 100%;
}

.index .dim-layer {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.index .dim-layer .dimBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.index .dim-layer .pop-layer {
  display: block;
}

.index .pop-container .check-content {
  border-radius: 16px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
}

.index .pop-container .check-content .scroll {
  max-height: 70vh;
  overflow: auto;
}

.index .check-content .static-list {
  margin: 0px 47px 0 47px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 41px;
}

.index .static-list .element {
  width: 33.333%;
}

.index .static-list .element .img-item {
  position: relative;
  width: 64px;
  height: 64px;
  margin: 0 auto;
  background-image: url("../images/bg/icon_bg.png");
  background-size: 100% 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 17px;
  text-align: center;
}

.index .static-list .element .img-item .icon {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.index .static-list .element .title-item {
  letter-spacing: -0.5px;
  text-align: center;
  color: #363b41;
  font-size: 15px;
  font-weight: bold;
  margin-top: 8px;
}

.index .pop-container .check-content .divider {
  height: 1px;
  margin: 22px 32px 0;
  background-color: #e6e8f2;
}

.index .check-content .dynamic-list {
  margin: 0px 47px 0 47px;
  margin-top: 29px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.index .dynamic-list .element {
  width: 33.333%;
}

.index .dynamic-list .element .img-item {
  width: 64px;
  height: 64px;
  margin: 0 auto;
  background-image: url("../images/bg/icon_bg.png");
  background-size: 100% 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 17px;
  text-align: center;
  position: relative;
}

.index .dynamic-list .element .img-item.off {
  background-image: url("../images/bg/icon_bg_off.png");
}

.index .dynamic-list .element .img-item .icon {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.index .dynamic-list .element .title-item {
  letter-spacing: -0.5px;
  text-align: center;
  color: #363b41;
  font-size: 15px;
  font-weight: bold;
  margin-top: 8px;
}

.index .dynamic-list .element:nth-child(n + 4) {
  margin-top: 36px;
}

.index .check-content .description {
  width: 296px;
  margin: 32px auto 0;
}

.index .check-content .description .desc-item {
  font-size: 14px;
  line-height: 1.43;
  letter-spacing: -0.47px;
  text-align: center;
  color: #697279;
}

.index .check-content .btn-area {
  margin: 25px auto 0;
  padding-bottom: 34px;
  text-align: center;
}

.index .check-content .btn-area button {
  padding: 17px 66px 19px 67px;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.18;
  letter-spacing: normal;
}

.index .check-content .btn-area .cancle {
  border-radius: 10px;
  background-color: #e6e8f2;
  color: #363b41;
}

.index .check-content .btn-area .confirm {
  margin-left: 13px;
  border-radius: 10px;
  background-color: #5653ff;
  color: #fff;
}

.index .dynamic-list .element .img-item .check-btn {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 22px;
  height: 22px;
  background-color: #5653ff;
  border-radius: 50%;
  border: 1px solid #5653ff;
}

.index .dynamic-list .element .img-item .check-btn.off {
  border: solid 1px #03070b;
  background-color: #ffffff;
}

.index .dynamic-list .element .img-item .check-btn .check-true {
  margin-bottom: 3px;
}

.index .nodata .empty-report {
  display: none;
}

.index .empty-report {
  width: 196px;
  margin: 113px auto 136px;
}

.index .empty-report .empty-btn-area {
  text-align: center;
}

.index .empty-report .empty-btn-area .interlock {
  width: 84px;
  height: 24px;
  padding: 3px 10px;
  border-radius: 15px;
  border: 1px solid #686b73;
  background-color: transparent;
  font-size: 12px;
  margin: 0 auto;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .empty-report .empty-text {
  width: 174px;
  margin: 12px auto 0px;
  letter-spacing: -0.4px;
  line-height: 20px;
  font-size: 14px;
  color: #363b41;
  text-align: center;
}

.index .empty-report .empty-img {
  margin-top: 35px;
  width: 100%;
}

.index .tab-area .tab-content.tab-content-active {
  padding: 12px 16px 43px 16px;
}

.index .data-report {
  margin: 0px auto;
}

.index .data-report .header-text {
  text-align: center;
  font-size: 12px;
  letter-spacing: -0.32px;
  color: #686b73;
}

.index .data-report .report-list {
  margin-top: 19px;
}

.index .data-report .report-list .report {
  background-color: #fff;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  margin-top: 20px;
}

.index .data-report .report-list .report:nth-child(1) {
  margin-top: 0px;
}

.index .data-report .report-list .report .report-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 21px 22px 0px 22px;
}

.index .data-report .report-list .report .report-top .top-left {
  color: #686b73;
  font-size: 14px;
  letter-spacing: -0.47px;
  font-weight: bold;
}

.index .data-report .report-list .report .report-top .top-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 15px;
  border: solid 1px #a4a9b3;
  letter-spacing: -0.4px;
  font-size: 12px;
  padding: 3px 6px 3px 9px;
}

.index .data-report .report-list .report .report-top .top-right .text-item {
  color: #a4a9b3;
  font-weight: bold;
}

.index .data-report .report-list .report .report-top .top-right .img-item {
  width: 14px;
  height: 14px;
  margin-left: 1px;
}

.index .data-report .report-list .report .report-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* margin-top:1px; */
  padding-left: 22px;
  padding-right: 22px;
}

.index .data-report .report-list .report .report-section .title {
  color: #080808;
  font-size: 20px;
  letter-spacing: -0.53px;
  font-weight: bold;
  line-height: 29px;
}

.index .data-report .report-list .report .report-section .img-imo {
  width: 28px;
  height: 28px;
  margin-left: 1px;
}

.index .report .report-hidden .grade-area .mask,
.index .report .report-hidden .grade-area .marker {
  display: none;
}

.index .report .report-hidden.danger .grade.danger .mask,
.index .report .report-hidden.danger .grade.danger .marker {
  display: block;
}

.index .report .report-hidden.improve .grade.improve .mask,
.index .report .report-hidden.improve .grade.improve .marker {
  display: block;
}

.index .report .report-hidden.keep .grade.keep .mask,
.index .report .report-hidden.keep .grade.keep .marker {
  display: block;
}

.index .report .report-hidden {
  display: none;
}

.index .report .report-hidden.active {
  display: block;
}

.index .report .report-hidden .grade-area {
  display: table;
  border-collapse: collapse;
  width: calc(100% - 44px);
  margin: 14px auto 0;
}

.index .report .report-hidden .grade-area .grade {
  width: calc(100% / 3);
  border: 2px solid #c7cad1;
  border-top: 0px;
  height: 24px;
  display: table-cell;
  position: relative;
}

.index .report .report-hidden .grade-area .grade .divider {
  width: 1px;
  height: 15px;
  background-color: #c7cad1;
  position: absolute;
  left: 50%;
  bottom: 0px;
  z-index: 2;
}

.index .report .report-hidden .grade-area .grade .mask {
  width: 100%;
  height: 15px;
  position: absolute;
  bottom: 0px;
  z-index: 1;
  left: 0px;
}

.index .report .report-hidden .grade-area .grade.danger .mask {
  background-color: #ffe2e2;
}

.index .report .report-hidden .grade-area .grade.improve .mask {
  background-color: #fff4c6;
}

.index .report .report-hidden .grade-area .grade.keep .mask {
  background-color: #eeeefa;
}

.index .report .report-hidden .grade-area .grade .marker {
  position: absolute;
  bottom: 15px;
  z-index: 1;
  left: 75%;
  -webkit-transform: translateX(-5px);
          transform: translateX(-5px);
}

.index .report .report-hidden .grade-text {
  width: calc(100% - 44px);
  margin: 5px auto 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 24px;
}

.index .report .report-hidden .grade-text .health-text {
  font-weight: bold;
  color: #363b41;
  letter-spacing: -0.37px;
  line-height: 16px;
  font-size: 14px;
}

.index .report .report-hidden .grade-text .weight-text {
  color: #686b73;
  letter-spacing: -0.32px;
  line-height: 16px;
  font-size: 12px;
  margin-top: 1px;
}

.index .report .report-hidden .grade-text .grade {
  width: calc(100% / 3);
  text-align: center;
}

.index .data-report .report-list .report.walking .report-section {
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.index .data-report .report-list .report.walking .report-section .title {
  font-size: 35px;
  line-height: 40px;
  letter-spacing: -0.24px;
  color: #080808;
  font-weight: bold;
}

.index .data-report .report-list .report.walking .report-section .unit {
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0px;
  color: #080808;
  font-weight: bold;
  margin-left: 3px;
}

.index .data-report .report-list .report.walking .report-section .compare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

.index .data-report .report-list .report.walking .report-section .compare .text-item {
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
}

.index .data-report .report-list .report.walking .report-section .compare .text-item.up {
  color: #5653ff;
}

.index .data-report .report-list .report.walking .report-section .compare .text-item.down {
  color: #ff5151;
}

.index .data-report .report-list .report.walking .report-section .compare .img-item {
  width: 10px;
  height: 10px;
  margin-left: 5px;
}

.index .data-report .report-list .report.walking .report-sub {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.walking .report-sub .status {
  font-size: 12px;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.19px;
  color: #5653ff;
  font-weight: bold;
  border-radius: 4px;
  background-color: #eeeefa;
  color: #5653ff;
  width: 34px;
  height: 17px;
}

.index .data-report .report-list .report.walking .report-sub .date {
  margin-left: 6px;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .graph-section {
  background-color: #fff;
  border-radius: 10px;
}

.index .graph-section .updated-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 31px 11px 0px 22px;
}

.index .graph-section .updated-area .date-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .graph-section .updated-area .date-item .goal-point {
  width: 6px;
  height: 6px;
  margin: 6px 4px 6px 0;
  border-radius: 5.5px;
  background-color: #5bcd8f;
}

.index .graph-section .updated-area .date-item .goal-text {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.14px;
  color: #73787e;
}

.index .graph-section .updated-area .unit-item {
  margin-left: auto;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #c7cad1;
}

.index .graph-section .graph-area {
  position: relative;
  pointer-events: none;
  height: 200px;
}

.index .graph-section .graph-area #chart {
  height: 200px !important;
}

.index .graph-section .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px 5px 15px 5px;
}

.index .graph-section .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.index .graph-section .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.index .report-hidden .report-result {
  margin-top: 24px;
  padding: 0px 22px 24px;
}

.index .report-hidden .report-result .result-title {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.11px;
  color: #080808;
}

.index .report-hidden .report-result .result-detail {
  margin-top: 4px;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: -0.3px;
  color: #080808;
}

.index .report.ingredient .report-top .top-left {
  font-size: 14px;
  letter-spacing: -0.47px;
  font-weight: bold;
  color: #686b73;
}

.index .data-report .report-list .report.ingredient .report-section {
  display: block;
  padding-left: 22px;
  padding-right: 22px;
  margin-top: 7px;
}

.index .data-report .report-list .report.ingredient .report-section .title {
  font-size: 14px;
  letter-spacing: -0.47px;
  line-height: 16px;
  color: #686b73;
  font-weight: normal;
}

.index .data-report .report-list .report.ingredient .report-section .recently {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 10px;
}

.index .general .report-section .recently .spot {
  background-color: #5653ff;
}

.index .data-report .report-list .report.ingredient .report-section .before {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 3px;
}

.index .report-section .before .spot {
  background-color: #c7cad1;
}

.index .data-report .report-list .report.ingredient .report-section .spot {
  width: 6px;
  height: 6px;
  border-radius: 5.5px;
}

.index .data-report .report-list .report.ingredient .report-section .text-item {
  font-size: 14px;
  letter-spacing: -0.09px;
  color: #686b73;
  margin-left: 6px;
}

.index .data-report .report-list .report.ingredient .report-section .text-item .status {
  font-size: 14px;
  color: #080808;
  font-weight: bold;
  margin-right: 5px;
}

.index .table-area {
  border: 1px solid #c7cad1;
  width: calc(100% - 40px);
  margin: 24px auto 0;
  border-collapse: collapse;
}

.index .table-area .header {
  text-align: center;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.34px;
  color: #686b73;
}

.index .table-area .td .col {
  border: 1px solid #c7cad1;
}

.index .table-area .td .colum-1 {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.34px;
  color: #363b41;
}

.index .table-area .td .colum-1 .sort {
  height: 31px;
  margin-top: 14px;
  margin-left: 14px;
}

.index .table-area .td .colum-2 {
  border-right: 1px dotted #c7cad1;
}

.index .table-area .td .colum-3 {
  border-left: 1px dotted #c7cad1;
  border-right: 1px dotted #c7cad1;
}

.index .table-area .td .colum-4 {
  border-left: 1px dotted #c7cad1;
}

.index .table-area .col {
  position: relative;
}

.index .table-area .colum-1 {
  width: 27.5%;
}

.index .table-area .colum-2,
.index .table-area .colum-4 {
  width: 22.5%;
}

.index .table-area .colum-3 {
  width: 17.5%;
}

.index .table-area .header .col {
  height: 28px;
}

.index .table-area .td .colum-2 .recently {
  position: absolute;
  /* width:100%; */
  height: 7px;
  left: 0px;
  bottom: 27px;
  background-color: #00c69c;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.index .table-area .td .colum-2 .before {
  position: absolute;
  height: 7px;
  left: 0px;
  bottom: 10px;
  background-color: #c7cad1;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.index .table-area .td .colum-2 .recently + .data-box {
  position: absolute;
  left: 0px;
  bottom: 30.5px;
  text-align: right;
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.34px;
  color: #363b41;
  height: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.index .table-area .td .colum-2 .before + .data-box {
  position: absolute;
  left: 0px;
  bottom: 14.5px;
  text-align: right;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.34px;
  color: #686b73;
  height: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.index .report.report.general .graph-area {
  margin-top: 24px;
  width: 100%;
  height: 220px !important;
}

.index .report.general .report-top .top-left {
  font-size: 14px;
  letter-spacing: -0.47px;
  font-weight: bold;
  color: #686b73;
}

.index .data-report .report-list .report.general .report-section {
  display: block;
  padding-left: 22px;
  padding-right: 22px;
  margin-top: 7px;
}

.index .data-report .report-list .report.general .report-section .title {
  font-size: 14px;
  letter-spacing: -0.4px;
  line-height: 1.14;
  color: #686b73;
  font-weight: normal;
}

.index .data-report .report-list .report.general .report-section .recently {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 10px;
}

.index .report-section .recently .spot {
  background-color: #00c69c;
}

.index .data-report .report-list .report.general .report-section .before {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 3px;
}

.index .report-section .before .spot {
  background-color: #c7cad1;
}

.index .data-report .report-list .report.general .report-section .spot {
  width: 6px;
  height: 6px;
  border-radius: 5.5px;
}

.index .data-report .report-list .report.general .report-section .text-item {
  font-size: 14px;
  letter-spacing: -0.09px;
  color: #686b73;
  margin-left: 6px;
}

.index .data-report .report-list .report.general .report-section .text-item .status {
  font-size: 14px;
  color: #080808;
  font-weight: bold;
  margin-right: 5px;
}

.index .data-report .report-list .report.food .report-section {
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.index .data-report .report-list .report.food .report-section .compare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

.index .data-report .report-list .report.food .report-section .compare .text-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #363b41;
}

.index .data-report .report-list .report.food .report-sub .status {
  font-size: 12px;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.19px;
  color: #5653ff;
  font-weight: bold;
  border-radius: 4px;
  background-color: #eeeefa;
  color: #5653ff;
  width: 34px;
  height: 17px;
}

.index .data-report .report-list .report.food .report-sub .date {
  margin-left: 6px;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .data-report .report-list .report.food .report-section .title {
  font-size: 35px;
  line-height: 40px;
  letter-spacing: -0.24px;
  color: #080808;
  font-weight: bold;
}

.index .data-report .report-list .report.food .report-section .unit {
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0px;
  color: #080808;
  font-weight: bold;
  margin-left: 3px;
}

.index .data-report .report-list .report.food .report-sub {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.food .report-section .compare .img-item {
  width: 10px;
  height: 10px;
  margin-left: 5px;
}

.index .report.food .report-hidden.active {
  padding-bottom: 24px;
}

.index .data-report .report-list .report.sugar .report-section {
  display: block;
}

.index .data-report .report-list .report.sugar .report-section .compare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.sugar .report-sub .status {
  font-size: 12px;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.19px;
  color: #5653ff;
  font-weight: bold;
  border-radius: 4px;
  background-color: #eeeefa;
  color: #5653ff;
  width: 34px;
  height: 17px;
}

.index .data-report .report-list .report.sugar .report-sub .date {
  margin-left: 6px;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .data-report .report-list .report.sugar .report-section .title {
  font-size: 35px;
  line-height: 40px;
  letter-spacing: -0.24px;
  color: #080808;
  font-weight: bold;
}

.index .data-report .report-list .report.sugar .report-section .unit {
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0px;
  color: #080808;
  font-weight: bold;
  margin-left: 3px;
}

.index .data-report .report-list .report.sugar .report-sub {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.sugar .report-section .compare .img-item {
  width: 10px;
  height: 10px;
  margin-left: 5px;
}

.index .report.sugar .report-hidden.active {
  padding-bottom: 24px;
}

.index .report.sugar .graph-section .updated-area .date-item .goal-point.empty {
  background-color: #6d53ff;
}

.index .report.sugar .graph-section .updated-area .date-item .goal-point.after {
  background-color: #00c69c;
  margin-left: 8px;
}

.index .report.sugar .graph-section .updated-area .date-item .goal-point.etc {
  background-color: #ff639d;
  margin-left: 8px;
}

.index .data-report .report-list .report.blood .report-section {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.index .data-report .report-list .report.blood .report-section .compare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.blood .report-sub .status {
  font-size: 12px;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.19px;
  color: #5653ff;
  font-weight: bold;
  border-radius: 4px;
  background-color: #eeeefa;
  color: #5653ff;
  width: 34px;
  height: 17px;
}

.index .data-report .report-list .report.blood .report-sub .date {
  margin-left: 6px;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.index .data-report .report-list .report.blood .report-section .title {
  font-size: 35px;
  line-height: 40px;
  letter-spacing: -0.24px;
  color: #080808;
  font-weight: bold;
}

.index .data-report .report-list .report.blood .report-section .unit {
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0px;
  color: #080808;
  font-weight: bold;
  margin-left: 3px;
}

.index .data-report .report-list .report.blood .report-sub {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.index .data-report .report-list .report.blood .report-section .compare .img-item {
  width: 10px;
  height: 10px;
  margin-left: 5px;
}

.index .report.blood .report-hidden.active {
  padding-bottom: 24px;
  margin-top: 52px;
}

/* ingredient_empty_igrip */
body.ingredient_empty_igrip {
  background-color: #fff;
}

.ingredient_empty_igrip .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.ingredient_empty_igrip .interlock-area {
  position: absolute;
  top: 0px;
  right: 8px;
  width: 170px;
  height: 47px;
  z-index: 1;
}

.ingredient_empty_igrip .interlock-area.blood-check {
  width: 196px;
}

.ingredient_empty_igrip .interlock-area .balloon {
  width: 100%;
}

.ingredient_empty_igrip .interlock-area.healthcare::after {
  position: absolute;
  content: "헬스케어존을 찾아주세요!";
  display: block;
  height: 13px;
  bottom: 16px;
  left: 13px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.ingredient_empty_igrip .interlock-area .text-item {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.ingredient_empty_igrip .tab-area .tab-content {
  display: none;
}

.ingredient_empty_igrip .tab-area .tab-content-active {
  display: block;
}

.ingredient_empty_igrip .empty-section {
  position: relative;
}

.ingredient_empty_igrip .empty-section .text-area {
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: -0.43px;
  text-align: center;
  color: #363b41;
  padding-top: 148px;
}

.ingredient_empty_igrip .empty-section .text-area .text-item {
  color: #363b41;
}

.ingredient_empty_igrip .empty-section .text-area .font-item {
  font-weight: bold;
}

.ingredient_empty_igrip .empty-section .img-area {
  width: 245px;
  margin: 36px auto 220px;
}

.ingredient_empty_igrip .empty-section .img-area .bg-img {
  width: 100%;
}

.ingredient_empty_igrip .empty-section .igrip-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 110px;
  height: 24px;
  border-radius: 15px;
  border: solid 1px #686b73;
  height: 24px;
  margin: 12px auto 0;
}

.ingredient_empty_igrip .empty-section .igrip-box .ic-question {
  width: 13px;
  height: 13px;
  -o-object-fit: contain;
     object-fit: contain;
  margin: 0 5px 0 9px;
}

.ingredient_empty_igrip .empty-section .igrip-box .igrip-info {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #686b73;
}

.ingredient_empty_igrip .empty-section .img-area.igrip {
  margin-top: 45px;
}

/* ingredient_empty_inbody */
body.ingredient_empty_inbody {
  background-color: #fff;
}

.ingredient_empty_inbody .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.ingredient_empty_inbody .interlock-area {
  position: absolute;
  top: 0px;
  right: 8px;
  width: 170px;
  height: 47px;
  z-index: 1;
}

.ingredient_empty_inbody .interlock-area.blood-check {
  width: 196px;
}

.ingredient_empty_inbody .interlock-area .balloon {
  width: 100%;
}

.ingredient_empty_inbody .interlock-area.healthcare::after {
  position: absolute;
  content: "헬스케어존을 찾아주세요!";
  display: block;
  height: 13px;
  bottom: 16px;
  left: 13px;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.ingredient_empty_inbody .interlock-area .text-item {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.47px;
  color: #5653ff;
}

.ingredient_empty_inbody .tab-area .tab-content {
  display: none;
}

.ingredient_empty_inbody .tab-area .tab-content-active {
  display: block;
}

.ingredient_empty_inbody .empty-section {
  position: relative;
}

.ingredient_empty_inbody .empty-section .text-area {
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: -0.43px;
  text-align: center;
  color: #363b41;
  padding-top: 148px;
}

.ingredient_empty_inbody .empty-section .text-area .text-item {
  color: #363b41;
}

.ingredient_empty_inbody .empty-section .text-area .font-item {
  font-weight: bold;
}

.ingredient_empty_inbody .empty-section .img-area {
  width: 245px;
  margin: 36px auto 220px;
}

.ingredient_empty_inbody .empty-section .img-area .bg-img {
  width: 100%;
}

.ingredient_empty_inbody .empty-section .igrip-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 110px;
  height: 24px;
  border-radius: 15px;
  border: solid 1px #686b73;
  height: 24px;
  margin: 12px auto 0;
}

.ingredient_empty_inbody .empty-section .igrip-box .ic-question {
  width: 13px;
  height: 13px;
  -o-object-fit: contain;
     object-fit: contain;
  margin: 0 5px 0 9px;
}

.ingredient_empty_inbody .empty-section .igrip-box .igrip-info {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #686b73;
}

.ingredient_empty_inbody .empty-section .img-area.igrip {
  margin-top: 45px;
}

/* ingredient */
body.ingredient {
  background-color: #fff;
  text-align: center;
}

.ingredient {
  /* bmi */
  /* 상체(우) */
  /* 상체(좌) */
  /* 복부 */
  /* 하체(우) */
  /* 남자 */
  /* 하체(좌) */
  /* responsive */
}

.ingredient canvas {
  height: 70px !important;
}

.ingredient .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.ingredient .tab-area .tab-content {
  display: none;
}

.ingredient .tab-area .tab-content-active {
  display: block;
}

.ingredient .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  margin: 20px auto 0;
  width: calc(100% - 32px);
}

.ingredient .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.ingredient .date-selector-container .prev-item {
  left: 0px;
}

.ingredient .date-selector-container .next-item {
  right: 0px;
}

.ingredient .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.ingredient .tab-content {
  padding-bottom: 34px;
}

.ingredient .tab-content .bmi-title {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
  margin-top: 31px;
}

.ingredient .tab-content .bmi {
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.ingredient .tab-content .bmi-variation {
  border-radius: 5px;
  width: 52px;
  height: 23px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 9px auto 0;
}

.ingredient .tab-content .bmi-variation .data {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}

.ingredient .tab-content .bmi-variation .ic-variation {
  display: none;
  width: 9px;
  height: 9px;
  margin-left: 8px;
  margin-right: 4px;
}

.ingredient .tab-content .bmi-variation.up {
  background-color: #faeef0;
  color: #ff5151;
}

.ingredient .tab-content .bmi-variation.down {
  background-color: #eeeefa;
  color: #5653ff;
}

.ingredient .tab-content .bmi-variation.up .up {
  display: block;
}

.ingredient .tab-content .bmi-variation.down .down {
  display: block;
}

.ingredient .tab-content .body {
  width: 163px;
  margin: 46px auto 0;
  position: relative;
}

.ingredient .tab-content .body .body-img {
  width: 100%;
  display: none;
}

.ingredient .tab-content .body.female .female {
  display: block;
}

.ingredient .tab-content .body.male .male {
  display: block;
}

.ingredient .tab-content .body .box {
  border-radius: 10px;
  border: solid 1px #e6e8f2;
  background-color: #ffffff;
  width: 115px;
  height: 89px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
}

.ingredient .tab-content .body .box .title {
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
  margin-left: 10px;
  text-align: left;
}

.ingredient .tab-content .body .box .item-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 10px;
  margin-top: 5px;
}

.ingredient .tab-content .body .box .item-box .item-title {
  font-size: 11px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.58;
  letter-spacing: -0.37px;
  text-align: center;
  color: #686b73;
}

.ingredient .tab-content .body .box .item-box .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 6px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.ingredient .tab-content .body .box .item-box .item .spot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 3px;
}

.ingredient .tab-content .body .box .item-box .item .spot.yellow {
  background-color: #ffd93c;
}

.ingredient .tab-content .body .box .item-box .item .spot.red {
  background-color: #ff5151;
}

.ingredient .tab-content .body .box .item-box .item .spot.blue {
  background-color: #5653ff;
}

.ingredient .tab-content .body .box .item-box .item .data {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.35px;
  color: #363b41;
}

.ingredient .tab-content .body .box .box-divider {
  width: 106px;
  height: 1px;
  background-color: #e6e8f2;
  margin: 6px auto 0;
}

.ingredient .tab-content .body .left-top-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 78px;
  left: 48px;
}

.ingredient .tab-content .body .left-top-spot .left-top-line {
  width: 38px;
  height: 9px;
  border-left: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 3px;
  bottom: 2px;
}

.ingredient .tab-content .body .box.left-top {
  bottom: 8px;
  right: 17px;
}

.ingredient .tab-content .body .right-top-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 78px;
  right: 48px;
}

.ingredient .tab-content .body .right-top-spot .right-top-line {
  width: 38px;
  height: 9px;
  border-right: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  left: 3px;
  bottom: 2px;
}

.ingredient .tab-content .body .box.right-top {
  bottom: 8px;
  left: 17px;
}

.ingredient .tab-content .body .center-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  top: 133px;
  left: 79px;
}

.ingredient .tab-content .body .center-spot .center-line {
  width: 90px;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 2px;
  top: 2px;
}

.ingredient .tab-content .body .box.center {
  top: -29px;
  right: 89px;
  width: 75px;
  height: 130px;
}

.ingredient .tab-content .body .box.center .item-box .item-title {
  text-align: left;
  margin-left: 10px;
}

.ingredient .tab-content .body .box.center .item-box {
  display: block;
  margin-left: 0px;
}

.ingredient .tab-content .body .box.center .item-box .item {
  margin-left: 10px;
}

.ingredient .tab-content .body .box.center .box-divider {
  width: 60px;
}

.ingredient .tab-content .body .left-bottom-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  bottom: 90px;
  left: 67px;
}

.ingredient .tab-content .body .left-bottom-spot .left-bottom-line {
  width: 38px;
  height: 18px;
  border-right: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  right: 2px;
  top: 2px;
}

.ingredient .tab-content .body .box.left-bottom {
  top: 5px;
  right: 36px;
}

.ingredient .tab-content .body.male .left-bottom-spot {
  left: 58px;
}

.ingredient .tab-content .body.male .right-bottom-spot {
  right: 58px;
}

.ingredient .tab-content .body.male .box.left-bottom {
  right: 28px;
}

.ingredient .tab-content .body.male .box.right-bottom {
  left: 28px;
}

.ingredient .tab-content .body .right-bottom-spot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5653ff;
  position: absolute;
  bottom: 90px;
  right: 67px;
}

.ingredient .tab-content .body .right-bottom-spot .right-bottom-line {
  width: 38px;
  height: 18px;
  border-left: solid 1px #5653ff;
  border-bottom: solid 1px #5653ff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  left: 2px;
  top: 2px;
}

.ingredient .tab-content .body .box.right-bottom {
  top: 5px;
  left: 36px;
}

.ingredient .tab-content .thick-divider {
  height: 2px;
  width: 100%;
  background-color: #e9edf0;
  margin-top: 50px;
}

.ingredient .tab-content .result-detail {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  color: #363b41;
  margin-top: 28px;
  margin-left: 24px;
  text-align: left;
}

.ingredient .tab-content .result-date {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.4px;
  color: #686b73;
  margin-top: 4px;
  margin-left: 24px;
  text-align: left;
}

.ingredient .tab-content .info-box {
  width: calc(100% - 48px);
  margin: 19px auto 0;
  border-radius: 7px;
  background-color: #f2f4fb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 15px 0px;
}

.ingredient .tab-content .info-box .info-item {
  width: calc((100% - 21px) / 3);
}

.ingredient .tab-content .info-box .info-item .title {
  font-family: SpoqaHanSans;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: #363b41;
}

.ingredient .tab-content .info-box .info-item .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.ingredient .tab-content .info-box .info-item .item .ic-info {
  display: none;
}

.ingredient .tab-content .info-box .info-item.down .item .ic-info.down {
  display: block;
}

.ingredient .tab-content .info-box .info-item.up .item .ic-info.up {
  display: block;
}

.ingredient .tab-content .info-box .info-item .item .data {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.44px;
  text-align: right;
  color: #363b41;
  margin-left: 4px;
}

.ingredient .tab-content .info-box .info-item .item .data .unit {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.13px;
  color: #363b41;
  margin-left: 3px;
}

.ingredient .tab-content .info-divider {
  width: 1px;
  height: 45px;
  background-color: #c9cdd1;
}

.ingredient .tab-content .graph-area {
  width: calc(100% - 48px);
  height: 70px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.ingredient .tab-content .graph-area.label {
  height: 55px;
}

.ingredient .tab-content .graph-area .graph-title {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.34px;
  color: #363b41;
  margin-left: 10px;
  width: 92px;
  text-align: left;
}

.ingredient .tab-content .graph-area .graph {
  width: calc(100% - 92px);
}

.ingredient .tab-content .graph-area .graph.label {
  position: absolute;
  bottom: 35px;
  left: 92px;
}

.ingredient .tab-content .graph-divider {
  width: calc(100% - 48px);
  margin: 0px auto 0;
  height: 1px;
  background-color: #e6e8f2;
}

.ingredient .tab-content .graph-divider.top {
  margin-top: 21px;
}

.ingredient .tab-content .more {
  width: calc(100% - 48px);
  margin: 0 auto;
  height: 46px;
  border-radius: 23px;
  border: solid 1.5px #5653ff;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.ingredient .tab-content .more div {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 46px;
  letter-spacing: -0.47px;
  color: #5653ff;
  margin-right: 2px;
}

@media (max-width: 350px) {
  .ingredient {
    /* 상체(우) */
    /* 상체(좌) */
    /* 복부 */
    /* 하체(우) 남 */
    /* 하체(좌) 남 */
    /* 하체(우) 여 */
    /* 하체(좌) 여 */
    /* 하체(좌) 여 */
    /* 하체(좌) 여 */
  }
  .ingredient .tab-content .body {
    width: 108px;
  }
  .ingredient .tab-content .body .left-top-spot {
    top: 50px;
    left: 30px;
  }
  .ingredient .tab-content .body .box.left-top {
    right: 4px;
  }
  .ingredient .tab-content .body .right-top-spot {
    top: 50px;
    right: 30px;
  }
  .ingredient .tab-content .body .box.right-top {
    left: 4px;
  }
  .ingredient .tab-content .body .center-spot {
    left: 52px;
    top: 88px;
  }
  .ingredient .tab-content .body .box.center {
    top: -41px;
    right: 66px;
  }
  .ingredient .tab-content .body.male .left-bottom-spot {
    left: 38px;
    bottom: 57px;
  }
  .ingredient .tab-content .body.male .box.left-bottom {
    right: 11px;
    top: 5px;
  }
  .ingredient .tab-content .body.male .right-bottom-spot {
    right: 38px;
    bottom: 57px;
  }
  .ingredient .tab-content .body.male .box.right-bottom {
    left: 11px;
    top: 5px;
  }
  .ingredient .tab-content .body.female .left-bottom-spot {
    left: 44px;
    bottom: 57px;
  }
  .ingredient .tab-content .body.female .right-bottom-spot {
    right: 44px;
    bottom: 57px;
  }
  .ingredient .tab-content .body.female .box.left-bottom {
    right: 16px;
    top: 5px;
  }
  .ingredient .tab-content .body.female .box.right-bottom {
    left: 16px;
    top: 5px;
  }
}

/* period_condition_complete */
body.period_condition_complete {
  background-color: #fff;
}

.period_condition_complete {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* radio button custom 2 */
  /* divider */
  /* sub-divider */
  /* condition-date */
  /* .condition-step-1 */
  /* .condition-step-2 */
  /* .condition-step-3 */
  /* footer-area */
  /* custom popup */
}

.period_condition_complete ul {
  list-style: none;
}

.period_condition_complete input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.period_condition_complete input:-ms-input-placeholder {
  color: #a4a9b3;
}

.period_condition_complete input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.period_condition_complete textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.period_condition_complete textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.period_condition_complete textarea::-moz-placeholder {
  color: #a4a9b3;
}

.period_condition_complete .box-radio-input-2 input[type="radio"] {
  display: none;
}

.period_condition_complete .box-radio-input-2 input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.period_condition_complete .box-radio-input-2 input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background-color: #dfdefb;
  color: #5653ff;
  font-weight: bold;
}

.period_condition_complete .divider {
  width: 100%;
  height: 1px;
  background-color: #c7cad1;
}

.period_condition_complete .sub-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 14px;
}

.period_condition_complete .condition-date {
  width: calc(100% - 32px);
  margin: 20px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.period_condition_complete .condition-date .text-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin: 0 0 0 24px;
}

.period_condition_complete .condition-date .date-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 0 25px;
}

.period_condition_complete .condition-date .date-item .date {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  color: #363b41;
}

.period_condition_complete .condition-date .date-item .icon-img {
  margin: 0 0 0 3px;
  -o-object-fit: contain;
     object-fit: contain;
}

.period_condition_complete .condition-step-1 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
}

.period_condition_complete .condition-step-1 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_complete .condition-step-1 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_complete .condition-step-1 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_complete .condition-step-1 .exam .question-number {
  width: 26px;
}

.period_condition_complete .condition-step-1 .exam .question {
  margin-left: 8px;
  width: calc(100% - 34px);
}

.period_condition_complete .condition-step-1 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.period_condition_complete .condition-step-1 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_complete .condition-step-1 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_complete .condition-step-1 .button-area .exception {
  width: 100%;
}

.period_condition_complete .condition-step-1 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_complete .condition-step-2 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.period_condition_complete .condition-step-2 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_complete .condition-step-2 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_complete .condition-step-2 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_complete .condition-step-2 .exam .question-number {
  width: 26px;
}

.period_condition_complete .condition-step-2 .exam .question {
  margin-left: 8px;
  width: calc(100% - 34px);
}

.period_condition_complete .condition-step-2 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.period_condition_complete .condition-step-2 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_complete .condition-step-2 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_complete .condition-step-2 .button-area .exception {
  width: 100%;
}

.period_condition_complete .condition-step-2 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_complete .condition-step-3 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.period_condition_complete .condition-step-3 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 0px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_complete .condition-step-3 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_complete .condition-step-3 .exam .detail {
  font-size: 13px;
  line-height: 18px;
  color: #363b41;
  margin-left: 20px;
  margin-top: 4px;
  padding: 0px 12px 9px 13px;
  width: 100%;
}

.period_condition_complete .condition-step-3 .exam .detail .title-item {
  font-weight: normal;
  letter-spacing: -0.14px;
  line-height: 16px;
}

.period_condition_complete .condition-step-3 .exam .detail .content {
  font-weight: normal;
  letter-spacing: -0.14px;
  line-height: 16px;
}

.period_condition_complete .condition-step-3 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_complete .condition-step-3 .exam .question-number {
  width: 26px;
}

.period_condition_complete .condition-step-3 .exam .question {
  margin-left: 8px;
  width: calc(100% - 53px);
}

.period_condition_complete .condition-step-3 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.period_condition_complete .condition-step-3 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_complete .condition-step-3 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_complete .condition-step-3 .button-area .exception {
  width: 100%;
}

.period_condition_complete .condition-step-3 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_complete .condition-step-3 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_complete .condition-step-3 .input-item {
  text-align: right;
  font-size: 15px;
}

.period_condition_complete .condition-step-3 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.period_condition_complete .condition-step-3 .subject-item {
  margin-left: 8px;
}

.period_condition_complete .condition-step-3 .exercise-day {
  margin-top: 14px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  margin-right: 8px;
}

.period_condition_complete .condition-step-3 .exercise-hour {
  margin-top: 14px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  margin-right: 8px;
}

.period_condition_complete .condition-step-3 .exercise-minute {
  margin-top: 14px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  margin-right: 8px;
}

.period_condition_complete .condition-step-3 .exercise-middle {
  margin-top: 14px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  margin-right: 8px;
}

.period_condition_complete .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_complete .footer-area .not-input {
  display: none;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  color: #fff;
  background-color: #363b41;
  padding: 8px 0;
  width: calc(100% - 56px);
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 14px;
  line-height: 23px;
  text-align: center;
}

.period_condition_complete .footer-area .footer-navi {
  width: 100%;
  text-align: center;
  margin-bottom: 19px;
  margin-top: 11px;
  font-size: 15px;
  letter-spacing: -0.4px;
  font-weight: bold;
  color: #363b41;
}

.period_condition_complete .btn-submit {
  width: calc((100% - 13px) / 2);
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-bottom: 34px;
}

.period_condition_complete .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.period_condition_complete .middle-layer .confirm-wrapper .confirm-text {
  padding: 33px 0 27px 0;
}

/* period_condition_doing */
body.period_condition_doing {
  background-color: #fff;
}

.period_condition_doing {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* radio button custom 1 */
  /* radio button custom 2 */
  /* divider */
  /* sub-divider */
  /* .condition-step-1 */
  /* .condition-step-2 */
  /* .condition-step-3 */
  /* footer-area */
  /* custom popup */
}

.period_condition_doing .condition-request {
  padding: 30px 16px 0;
  text-align: right;
  font-size: 12px;
}

.period_condition_doing .condition-request strong {
  color: #5653ff;
}

.period_condition_doing .request {
  color: #5653ff;
}

.period_condition_doing ul {
  list-style: none;
}

.period_condition_doing input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.period_condition_doing input:-ms-input-placeholder {
  color: #a4a9b3;
}

.period_condition_doing input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.period_condition_doing textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.period_condition_doing textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.period_condition_doing textarea::-moz-placeholder {
  color: #a4a9b3;
}

.period_condition_doing .box-radio-input input[type="radio"] {
  display: none;
}

.period_condition_doing .box-radio-input input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.period_condition_doing .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.period_condition_doing .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.period_condition_doing .box-radio-input input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.period_condition_doing .box-radio-input-2 input[type="radio"] {
  display: none;
}

.period_condition_doing .box-radio-input-2 input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.period_condition_doing .box-radio-input-2 input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.period_condition_doing .box-radio-input-2 input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
}

.period_condition_doing .box-radio-input-2 input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.period_condition_doing .divider {
  width: 100%;
  height: 1px;
  background-color: #c7cad1;
}

.period_condition_doing .sub-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 14px;
}

.period_condition_doing .exercise {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-1 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
}

.period_condition_doing .condition-step-1 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_doing .condition-step-1 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_doing .condition-step-1 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_doing .condition-step-1 .exam .question-number {
  margin-right: 8px;
}

.period_condition_doing .condition-step-1 .exam .question {
  width: calc(100% - 34px);
}

.period_condition_doing .condition-step-1 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.period_condition_doing .condition-step-1 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_doing .condition-step-1 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_doing .condition-step-1 .button-area .exception {
  width: 100%;
}

.period_condition_doing .condition-step-1 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_doing .condition-step-2 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.period_condition_doing .condition-step-2 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_doing .condition-step-2 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_doing .condition-step-2 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_doing .condition-step-2 .exam .question-number {
  margin-right: 8px;
}

.period_condition_doing .condition-step-2 .exam .question {
  width: calc(100% - 34px);
}

.period_condition_doing .condition-step-2 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.period_condition_doing .condition-step-2 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_doing .condition-step-2 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_doing .condition-step-2 .button-area .exception {
  width: 100%;
}

.period_condition_doing .condition-step-2 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_doing .condition-step-3 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.period_condition_doing .condition-step-3 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 0px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_doing .condition-step-3 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.period_condition_doing .condition-step-3 .exam .detail {
  font-size: 13px;
  line-height: 18px;
  color: #363b41;
  margin-left: 20px;
  margin-top: 4px;
  padding: 0px 12px 9px 13px;
  width: 100%;
}

.period_condition_doing .condition-step-3 .exam .detail .title-item {
  font-weight: normal;
  letter-spacing: -0.14px;
  line-height: 16px;
}

.period_condition_doing .condition-step-3 .exam .detail .content {
  font-weight: normal;
  letter-spacing: -0.14px;
  line-height: 16px;
}

.period_condition_doing .condition-step-3 .exam:nth-child(1) {
  margin-top: 0px;
}

.period_condition_doing .condition-step-3 .exam .question-number {
  margin-right: 8px;
}

.period_condition_doing .condition-step-3 .exam .question {
  width: calc(100% - 53px);
}

.period_condition_doing .condition-step-3 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.period_condition_doing .condition-step-3 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.period_condition_doing .condition-step-3 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.period_condition_doing .condition-step-3 .button-area .exception {
  width: 100%;
}

.period_condition_doing .condition-step-3 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.period_condition_doing .condition-step-3 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-3 .input-item {
  text-align: right;
  font-size: 15px;
}

.period_condition_doing .condition-step-3 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.period_condition_doing .condition-step-3 .subject-item {
  margin-left: 8px;
}

.period_condition_doing .condition-step-3 .exercise-day {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-3 .exercise-day .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.period_condition_doing .condition-step-3 .exercise-hour {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-3 .exercise-hour .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.period_condition_doing .condition-step-3 .exercise-minute {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-3 .exercise-minute .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.period_condition_doing .condition-step-3 .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.period_condition_doing .condition-step-3 .exercise-middle .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.period_condition_doing .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.period_condition_doing .footer-area .not-input {
  display: none;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  color: #fff;
  background-color: #363b41;
  padding: 8px 0;
  width: calc(100% - 56px);
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 14px;
  line-height: 23px;
  text-align: center;
}

.period_condition_doing .footer-area .footer-navi {
  width: 100%;
  text-align: center;
  margin-bottom: 19px;
  font-size: 15px;
  margin-top: 11px;
  letter-spacing: -0.4px;
  font-weight: bold;
  color: #363b41;
}

.period_condition_doing .btn-submit {
  width: calc((100% - 13px) / 2);
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-bottom: 34px;
}

.period_condition_doing .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.period_condition_doing .middle-layer .confirm-wrapper .confirm-text {
  padding: 33px 0 27px 0;
}

.period_condition_doing #prev_popup .text-item {
  margin-top: 5px;
}

/* coaching_condition_doing */
body.coaching_condition_doing {
  background-color: #fff;
}

.coaching_condition_doing {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* radio button custom 1 */
  /* radio button custom 2 */
  /* checkbox button custom 1 */
  /* checkbox button custom 2 */
  /* divider */
  /* sub-divider */
  /* .condition-step-1 */
  /* .condition-step-2 */
  /* .condition-step-3 */
  /* footer-area */
  /* custom popup */
}

.coaching_condition_doing .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.coaching_condition_doing .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 83.46%;
}

.coaching_condition_doing .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.coaching_condition_doing .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.coaching_condition_doing .header-area .title-item .bar {
  margin-left: 11px;
}

.coaching_condition_doing .header-area .title-item .text {
  margin-left: 8px;
}

.coaching_condition_doing .header-area .desc-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
}

.coaching_condition_doing .header-area .circle-graph .pie-chart {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  background: conic-gradient(#dfdefb 0% 100%);
  /* background: conic-gradient(#8b22ff 0% 56%, #DFDEFB 0% 100%); */
  border-radius: 50%;
}

.coaching_condition_doing .header-area .circle-graph .pie-chart .center {
  position: absolute;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
  top: 5px;
  left: 5px;
  line-height: 37px;
  font-size: 13px;
  color: #5653ff;
  font-weight: bold;
  letter-spacing: 0px;
  text-align: center;
}

.coaching_condition_doing .condition-request {
  padding: 30px 16px 0;
  text-align: right;
  font-size: 12px;
}

.coaching_condition_doing .condition-request strong {
  color: #5653ff;
}

.coaching_condition_doing .request {
  color: #5653ff;
}

.coaching_condition_doing ul {
  list-style: none;
}

.coaching_condition_doing input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.coaching_condition_doing input:-ms-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_doing input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.coaching_condition_doing textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_doing textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_doing textarea::-moz-placeholder {
  color: #a4a9b3;
}

.coaching_condition_doing .box-radio-input input[type="radio"] {
  display: none;
}

.coaching_condition_doing .box-radio-input input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.coaching_condition_doing .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.coaching_condition_doing .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.coaching_condition_doing .box-radio-input input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.coaching_condition_doing .box-radio-input-2 input[type="radio"] {
  display: none;
}

.coaching_condition_doing .box-radio-input-2 input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.coaching_condition_doing .box-radio-input-2 input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.coaching_condition_doing .box-radio-input-2 input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_doing .box-radio-input-2 input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.coaching_condition_doing .box-radio-input input[type="checkbox"] {
  display: none;
}

.coaching_condition_doing .box-radio-input input[type="checkbox"]:disabled {
  background-color: #e6e8f2;
}

.coaching_condition_doing .box-radio-input input[type="checkbox"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.coaching_condition_doing .box-radio-input input[type="checkbox"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.coaching_condition_doing .box-radio-input input[type="checkbox"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.coaching_condition_doing .box-radio-input-2 input[type="checkbox"] {
  display: none;
}

.coaching_condition_doing .box-radio-input-2 input[type="checkbox"]:disabled {
  background-color: #e6e8f2;
}

.coaching_condition_doing .box-radio-input-2 input[type="checkbox"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.coaching_condition_doing .box-radio-input-2 input[type="checkbox"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_doing .box-radio-input-2 input[type="checkbox"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.coaching_condition_doing .divider {
  width: 100%;
  height: 1px;
  background-color: #c7cad1;
}

.coaching_condition_doing .sub-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 14px;
}

.coaching_condition_doing .exercise {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-1 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
}

.coaching_condition_doing .exam .question-number {
  margin-right: 8px;
}

.coaching_condition_doing .exam .question {
  width: calc(100% - 34px);
}

.coaching_condition_doing .condition-step-2 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_doing .condition-step-3 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_doing .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.coaching_condition_doing .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.coaching_condition_doing .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.coaching_condition_doing .button-area .exception {
  width: 100%;
}

.coaching_condition_doing .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.coaching_condition_doing .condition-step-3 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-3 .input-item {
  text-align: right;
  font-size: 15px;
}

.coaching_condition_doing .condition-step-3 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.coaching_condition_doing .condition-step-3 .subject-item {
  margin-left: 8px;
}

.coaching_condition_doing .condition-step-3 .exercise-day {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-3 .exercise-day .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.coaching_condition_doing .condition-step-3 .exercise-hour {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-3 .exercise-hour .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.coaching_condition_doing .condition-step-3 .exercise-minute {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-3 .exercise-minute .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.coaching_condition_doing .condition-step-3 .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .condition-step-3 .exercise-middle .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.coaching_condition_doing .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.coaching_condition_doing .footer-area .not-input {
  display: none;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  color: #fff;
  background-color: #363b41;
  padding: 8px 0;
  width: calc(100% - 56px);
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 14px;
  line-height: 23px;
  text-align: center;
}

.coaching_condition_doing .footer-area .footer-navi {
  width: 100%;
  text-align: center;
  margin-bottom: 19px;
  font-size: 15px;
  margin-top: 11px;
  letter-spacing: -0.4px;
  font-weight: bold;
  color: #363b41;
}

.coaching_condition_doing .btn-submit {
  width: calc((100% - 13px) / 2);
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-bottom: 34px;
}

.coaching_condition_doing .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.coaching_condition_doing .middle-layer .confirm-wrapper .confirm-text {
  padding: 33px 0 27px 0;
}

.coaching_condition_doing #prev_popup .text-item {
  margin-top: 5px;
}

.coaching_condition_doing .condition-step-4,
.coaching_condition_doing .condition-step-5,
.coaching_condition_doing .condition-step-6 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_doing .exam {
  font-weight: bold;
  font-size: 16px;
  letter-spacing: -0.4px;
  color: #080808;
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_condition_doing .exam:nth-child(1) {
  margin-top: 0px;
}

.coaching_condition_doing .label {
  font-size: 15px;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_doing .height {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .weight {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .input-item {
  text-align: right;
  font-size: 15px;
}

.coaching_condition_doing .input-item::-webkit-input-placeholder {
  font-size: 15px;
}

.coaching_condition_doing .input-item::-moz-placeholder {
  font-size: 15px;
}

.coaching_condition_doing .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.coaching_condition_doing .height .unit-item {
  margin-right: 10px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_doing .weight .unit-item {
  margin-right: 14px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_doing .subject-item {
  min-width: 110px;
  margin-left: 8px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_doing .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .exercise-middle .unit-item {
  margin-right: 10px;
}

.coaching_condition_doing .count {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 15px 8px 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_doing .input-item {
  max-width: 100px;
  text-align: right;
  font-size: 15px;
}

.coaching_condition_doing .unit-item {
  margin-left: 6px;
}

.coaching_condition_doing .count .unit-item {
  margin-right: 10px;
}

.coaching_condition_doing .condition-step-4 .button-area li.exception {
  margin: 15px 0px 0;
}

/* coaching_condition_complete */
body.coaching_condition_complete {
  background-color: #fff;
}

.coaching_condition_complete {
  /* condition-date */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* radio button custom 1 */
  /* radio button custom 2 */
  /* radio button custom 1 */
  /* radio button custom 2 */
  /* divider */
  /* sub-divider */
  /* .condition-step-1 */
  /* .condition-step-2 */
  /* .condition-step-3 */
  /* footer-area */
  /* custom popup */
}

.coaching_condition_complete .condition-date {
  position: relative;
  top: 10px;
  width: calc(100% - 32px);
  margin: 0 auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.coaching_condition_complete .condition-date .text-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin: 0 0 0 24px;
}

.coaching_condition_complete .condition-date .date-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 0 25px;
}

.coaching_condition_complete .condition-date .date-item .date {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  color: #363b41;
}

.coaching_condition_complete .condition-date .date-item .icon-img {
  margin: 0 0 0 3px;
  -o-object-fit: contain;
     object-fit: contain;
}

.coaching_condition_complete .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.coaching_condition_complete .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 83.46%;
}

.coaching_condition_complete .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.coaching_condition_complete .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.coaching_condition_complete .header-area .title-item .bar {
  margin-left: 11px;
}

.coaching_condition_complete .header-area .title-item .text {
  margin-left: 8px;
}

.coaching_condition_complete .header-area .desc-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
}

.coaching_condition_complete .header-area .circle-graph .pie-chart {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  background: conic-gradient(#dfdefb 0% 100%);
  /* background: conic-gradient(#8b22ff 0% 56%, #DFDEFB 0% 100%); */
  border-radius: 50%;
}

.coaching_condition_complete .header-area .circle-graph .pie-chart .center {
  position: absolute;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
  top: 5px;
  left: 5px;
  line-height: 37px;
  font-size: 13px;
  color: #5653ff;
  font-weight: bold;
  letter-spacing: 0px;
  text-align: center;
}

.coaching_condition_complete .condition-request {
  padding: 30px 16px 0;
  text-align: right;
  font-size: 12px;
}

.coaching_condition_complete .condition-request strong {
  color: #5653ff;
}

.coaching_condition_complete .request {
  color: #5653ff;
}

.coaching_condition_complete ul {
  list-style: none;
}

.coaching_condition_complete input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.coaching_condition_complete input:-ms-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_complete input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.coaching_condition_complete textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_complete textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.coaching_condition_complete textarea::-moz-placeholder {
  color: #a4a9b3;
}

.coaching_condition_complete .box-radio-input input[type="radio"] {
  display: none;
}

.coaching_condition_complete .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.coaching_condition_complete .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background-color: #dfdefb;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_complete .box-radio-input-2 input[type="radio"] {
  display: none;
}

.coaching_condition_complete .box-radio-input-2 input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.coaching_condition_complete .box-radio-input-2 input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background-color: #dfdefb;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_complete .box-radio-input input[type="checkbox"] {
  display: none;
}

.coaching_condition_complete .box-radio-input input[type="checkbox"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.coaching_condition_complete .box-radio-input input[type="checkbox"]:checked + span {
  border: 1.5px solid #5653ff;
  background-color: #dfdefb;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_complete .box-radio-input-2 input[type="checkbox"] {
  display: none;
}

.coaching_condition_complete .box-radio-input-2 input[type="checkbox"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 43px;
  line-height: 43px;
  font-size: 15px;
}

.coaching_condition_complete .box-radio-input-2 input[type="checkbox"]:checked + span {
  border: 1.5px solid #5653ff;
  background-color: #dfdefb;
  color: #5653ff;
  font-weight: bold;
}

.coaching_condition_complete .divider {
  width: 100%;
  height: 1px;
  background-color: #c7cad1;
}

.coaching_condition_complete .sub-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 14px;
}

.coaching_condition_complete .exercise {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 14px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  text-align: right;
  color: #5653ff;
  margin-right: 8px;
}

.coaching_condition_complete .condition-step-1 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
}

.coaching_condition_complete .exam .question-number {
  margin-right: 8px;
}

.coaching_condition_complete .exam .question {
  width: calc(100% - 34px);
}

.coaching_condition_complete .condition-step-2 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_complete .condition-step-3 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_complete .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.coaching_condition_complete .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.coaching_condition_complete .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.coaching_condition_complete .button-area .exception {
  width: 100%;
}

.coaching_condition_complete .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.coaching_condition_complete .condition-step-3 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .condition-step-3 .input-item {
  text-align: right;
  font-size: 15px;
}

.coaching_condition_complete .condition-step-3 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.coaching_condition_complete .condition-step-3 .subject-item {
  margin-left: 8px;
}

.coaching_condition_complete .condition-step-3 .exercise-day {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .condition-step-3 .exercise-day .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.coaching_condition_complete .condition-step-3 .exercise-hour {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .condition-step-3 .exercise-hour .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.coaching_condition_complete .condition-step-3 .exercise-minute {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .condition-step-3 .exercise-minute .unit-item {
  margin-right: 18px;
  margin-top: 1px;
}

.coaching_condition_complete .condition-step-3 .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 14px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .condition-step-3 .exercise-middle .unit-item {
  margin-right: 4px;
  margin-top: 1px;
}

.coaching_condition_complete .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.coaching_condition_complete .footer-area .not-input {
  display: none;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  color: #fff;
  background-color: #363b41;
  padding: 8px 0;
  width: calc(100% - 56px);
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 14px;
  line-height: 23px;
  text-align: center;
}

.coaching_condition_complete .footer-area .footer-navi {
  width: 100%;
  text-align: center;
  margin-bottom: 19px;
  font-size: 15px;
  margin-top: 11px;
  letter-spacing: -0.4px;
  font-weight: bold;
  color: #363b41;
}

.coaching_condition_complete .btn-submit {
  width: calc((100% - 13px) / 2);
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-bottom: 34px;
}

.coaching_condition_complete .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.coaching_condition_complete .middle-layer .confirm-wrapper .confirm-text {
  padding: 33px 0 27px 0;
}

.coaching_condition_complete #prev_popup .text-item {
  margin-top: 5px;
}

.coaching_condition_complete .condition-step-4,
.coaching_condition_complete .condition-step-5,
.coaching_condition_complete .condition-step-6 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.coaching_condition_complete .exam {
  font-weight: bold;
  font-size: 16px;
  letter-spacing: -0.4px;
  color: #080808;
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.coaching_condition_complete .exam:nth-child(1) {
  margin-top: 0px;
}

.coaching_condition_complete .label {
  font-size: 15px;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_complete .height {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .weight {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .data-area .exercise {
  margin-top: 0;
}

.coaching_condition_complete .input-item {
  text-align: right;
  font-size: 15px;
}

.coaching_condition_complete .input-item::-webkit-input-placeholder {
  font-size: 15px;
}

.coaching_condition_complete .input-item::-moz-placeholder {
  font-size: 15px;
}

.coaching_condition_complete .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.coaching_condition_complete .height .unit-item {
  margin-right: 10px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_complete .weight .unit-item {
  margin-right: 14px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_complete .subject-item {
  min-width: 110px;
  margin-left: 8px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.coaching_condition_complete .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .exercise-middle .unit-item {
  margin-right: 10px;
}

.coaching_condition_complete .count {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 15px 8px 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.coaching_condition_complete .input-item {
  max-width: 100px;
  text-align: right;
  font-size: 15px;
}

.coaching_condition_complete .unit-item {
  margin-left: 6px;
}

.coaching_condition_complete .count .unit-item {
  margin-right: 10px;
}

.coaching_condition_complete .condition-step-4 .button-area li.exception {
  margin: 15px 0px 0;
}

/* popup_permit */
.popup_permit {
  /* 팝업 커스텀 */
  /* 권한 허용 안내 */
}

.popup_permit .middle-layer .alert-wrapper .alert-text {
  padding: 21px 0 19px;
}

.popup_permit .permit-content {
  border-top: 1px solid #e6e8f2;
  padding-top: 30px;
  padding-left: 22px;
  padding-right: 22px;
  padding-bottom: 23px;
}

.popup_permit .permit-content .title {
  font-weight: bold;
  font-size: 14px;
  letter-spacing: -0.2px;
}

.popup_permit .permit-content .title .essential {
  color: #5653ff;
}

.popup_permit .permit-content .text-item {
  margin-left: 13px;
}

.popup_permit .permit-content .desc {
  font-size: 14px;
  line-height: 18px;
  color: #686b73;
  letter-spacing: -0.65px;
  margin-top: 3px;
}

.popup_permit .permit-content .save {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.popup_permit .permit-content .location {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 22px;
}

.popup_permit .permit-content .camera {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 22px;
}

.popup_permit .permit-content .picture {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 22px;
}

.popup_permit .permit-content .quide {
  color: #a4a9b3;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: -0.25px;
  margin-top: 23px;
  margin-left: 3px;
  margin-right: 3px;
}

/* service_apply_agree */
body.service_apply_agree {
  background-color: #fff;
}

.service_apply_agree {
  /* agree-divider */
  /* contents-area */
  /* footer-area */
  /* popup custom */
}

.service_apply_agree li {
  list-style: none;
}

.service_apply_agree .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_apply_agree .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 32.5%;
}

.service_apply_agree .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  /* border-bottom: solid 1px rgb(233, 237, 240); */
  background-color: #ffffff;
}

.service_apply_agree .header-area .title-item {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #5653ff;
}

.service_apply_agree .header-area .all-agree-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 20px;
  margin-bottom: 26px;
}

.service_apply_agree .header-area .all-agree-area .ic-circle-check {
  width: 26px;
  height: 26px;
}

.service_apply_agree .header-area .all-agree-area .all-check {
  margin-left: 6.5px;
  height: 24px;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.24px;
  color: #363b41;
}

.service_apply_agree .header-list ul {
  padding: 10px 0 0 0;
}

.service_apply_agree .header-list ul li {
  position: relative;
  padding-left: 6px;
  font-size: 12px;
}

.service_apply_agree .header-list ul li:after {
  content: "";
  display: block;
  position: absolute;
  top: 8px;
  left: 0;
  width: 2px;
  height: 2px;
  background-color: #666;
  border-radius: 2px;
}

.service_apply_agree .header-list ul li strong {
  color: #5653ff;
}

.service_apply_agree .agree-divider {
  width: calc(100% - 32px);
  margin: 0 auto;
  height: 1px;
  background-color: #e6e8f2;
}

.service_apply_agree .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_apply_agree .contents-wrapper .agree-list {
  margin-left: 2px;
}

.service_apply_agree .contents-wrapper .agree-list .list-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 25px;
}

.service_apply_agree .contents-wrapper .agree-list .list-item .item-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_apply_agree .contents-wrapper .agree-list .list-item .item-left .check-item {
  width: 17px;
  height: 12px;
}

.service_apply_agree .contents-wrapper .agree-list .list-item .item-left .text-item {
  margin-left: 7px;
}

.service_apply_agree .contents-wrapper .agree-list .list-item .item-left.false .text-item {
  color: #c7cad1;
}

.service_apply_agree .contents-wrapper .agree-list .list-item .item-icon {
  cursor: pointer;
}

.service_apply_agree .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 34px;
}

.service_apply_agree .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
}

.service_apply_agree .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.service_apply_agree .middle-layer .alert-wrapper .alert-text {
  padding: 21px 0 19px;
}

.service_apply_agree .text-area {
  border-top: 1px solid #e6e8f2;
}

.service_apply_agree .text-area .text-wrapper {
  padding: 20px 24px 0px 22px;
  max-height: 316px;
  overflow-y: scroll;
}

.service_apply_agree .alert-area {
  margin-top: 22px;
  cursor: pointer;
}

.service_apply_agree .text-area .text-wrapper p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.2px;
  color: #080808;
}

/* service_join_condition_adult */
body.service_join_condition_adult {
  background-color: #fff;
}

body.service_join_condition_adult.complete {
  background: #f5f8fd;
}

.service_join_condition_adult {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* radio button custom 1 */
  /* radio button custom 2 */
  /* 안드로이드 백버튼을 구현할수 없어 테스트 예시용으로 백버튼 추가 [개발시 삭제 요망] */
  /* sub-divider */
  /* condition-step-1 */
  /* .condition-step-2 */
  /* .condition-step-3 */
  /* .condition-step-4 */
  /* .condition-step-5 */
  /* .condition-step-6 */
  /* .condition-step-7 */
  /* .condition-step-8 */
  /* report-hidden mask, marker */
  /* danger */
  /* improve */
  /* keep */
  /* footer-area */
  /* custom popup */
  /* radio-button */
  /* mobileSelect custom */
}

.service_join_condition_adult .condition-request {
  padding: 30px 16px 0;
  text-align: right;
  font-size: 12px;
}

.service_join_condition_adult .condition-request strong {
  color: #5653ff;
}

.service_join_condition_adult .request {
  color: #5653ff;
}

.service_join_condition_adult ul {
  list-style: none;
}

.service_join_condition_adult input::-webkit-input-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.service_join_condition_adult input:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_condition_adult input::-moz-placeholder {
  color: #a4a9b3;
  font-size: 15px;
}

.service_join_condition_adult textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join_condition_adult textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_condition_adult textarea::-moz-placeholder {
  color: #a4a9b3;
}

.service_join_condition_adult .box-radio-input input[type="radio"] {
  display: none;
}

.service_join_condition_adult .box-radio-input input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.service_join_condition_adult .box-radio-input input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 64px;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  font-size: 14px;
}

.service_join_condition_adult .box-radio-input input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
  font-size: 14px;
}

.service_join_condition_adult .box-radio-input input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.service_join_condition_adult .box-radio-input-2 input[type="radio"] {
  display: none;
}

.service_join_condition_adult .box-radio-input-2 input[type="radio"]:disabled {
  background-color: #e6e8f2;
}

.service_join_condition_adult .box-radio-input-2 input[type="radio"] + span {
  display: inline-block;
  background: none;
  border: 1.5px solid #c7cad1;
  text-align: center;
  width: 100%;
  height: 33px;
  line-height: 33px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  color: #363b41;
  height: 46px;
  line-height: 46px;
  font-size: 15px;
}

.service_join_condition_adult .box-radio-input-2 input[type="radio"]:checked + span {
  border: 1.5px solid #5653ff;
  background: #fff;
  color: #5653ff;
  font-weight: bold;
}

.service_join_condition_adult .box-radio-input-2 input[type="radio"]:disabled + span {
  background-color: #e6e8f2;
  border: 1.5px solid #e6e8f2;
  color: #a4a9b3;
}

.service_join_condition_adult .condition-step-3 .box-radio-input-2 input[type="radio"]:disabled + span {
  background-color: #fff;
  border: 1.5px solid #c7cad1;
  color: #c7cad1;
}

.service_join_condition_adult .android-back-btn {
  position: absolute;
  font-size: 9px;
  right: 10px;
  top: 10px;
}

.service_join_condition_adult .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join_condition_adult .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 83.46%;
}

.service_join_condition_adult .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  background-color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join_condition_adult .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.service_join_condition_adult .header-area .title-item .bar {
  margin-left: 11px;
}

.service_join_condition_adult .header-area .title-item .text {
  margin-left: 8px;
}

.service_join_condition_adult .header-area .desc-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
}

.service_join_condition_adult .header-area .circle-graph .pie-chart {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  background: conic-gradient(#dfdefb 0% 100%);
  /* background: conic-gradient(#8b22ff 0% 56%, #DFDEFB 0% 100%); */
  border-radius: 50%;
}

.service_join_condition_adult .header-area .circle-graph .pie-chart .center {
  position: absolute;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
  top: 5px;
  left: 5px;
  line-height: 37px;
  font-size: 13px;
  color: #5653ff;
  font-weight: bold;
  letter-spacing: 0px;
  text-align: center;
}

.service_join_condition_adult .condition-adult {
  /* margin-bottom:200px; */
}

.service_join_condition_adult .sub-divider {
  width: 100%;
  height: 1px;
  background-color: #e6e8f2;
  margin-top: 15px;
}

.service_join_condition_adult .condition-step-1 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
}

.service_join_condition_adult .condition-step-1 .exam {
  font-weight: bold;
  font-size: 16px;
  letter-spacing: -0.4px;
  color: #080808;
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-1 .exam .question {
  margin-left: 8px;
}

.service_join_condition_adult .condition-step-1 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-1 .label {
  font-size: 15px;
  letter-spacing: -0.8px;
  color: #363b41;
}

.service_join_condition_adult .condition-step-1 .height {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-1 .weight {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-1 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-1 .input-item {
  text-align: right;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-1 .input-item::-webkit-input-placeholder {
  font-size: 15px;
}

.service_join_condition_adult .condition-step-1 .input-item::-moz-placeholder {
  font-size: 15px;
}

.service_join_condition_adult .condition-step-1 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-1 .height .unit-item {
  margin-right: 10px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.service_join_condition_adult .condition-step-1 .weight .unit-item {
  margin-right: 14px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.service_join_condition_adult .condition-step-1 .subject-item {
  margin-left: 8px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.8px;
  color: #363b41;
}

.service_join_condition_adult .condition-step-1 .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-1 .exercise-middle .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .exam-2 {
  width: 100%;
  margin: 15px auto 0;
}

.service_join_condition_adult .exam-2.male {
  display: none;
}

.service_join_condition_adult .exam-2.female {
  display: none;
}

.service_join_condition_adult .exam-2 td {
  width: 20%;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: -0.4px;
  text-align: center;
  color: #686b73;
}

.service_join_condition_adult .exam-2 td.active {
  color: #5653ff;
}

.service_join_condition_adult .condition-step-2 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-2 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin-top: 40px;
}

.service_join_condition_adult .condition-step-2 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-2 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-2 .exam .question {
  width: calc(100% - 34px);
}

.service_join_condition_adult .condition-step-2 .condition {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 8px;
}

.service_join_condition_adult .condition .title-item {
  margin-top: 10px;
  font-size: 15px;
  letter-spacing: -0.8px;
  color: #363b41;
}

.service_join_condition_adult .condition .button-area {
  margin-top: 15px;
}

.service_join_condition_adult .condition-step-3 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-3 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-3 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.service_join_condition_adult .condition-step-3 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-3 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-3 .exam .question {
  width: calc(100% - 34px);
}

.service_join_condition_adult .condition-step-3 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.service_join_condition_adult .condition-step-3 .button-area li {
  width: calc((100% - 17px) / 2);
  margin-left: 17px;
  margin-top: 15px;
}

.service_join_condition_adult .condition-step-3 .button-area li:nth-child(2n-1) {
  margin-left: 0px;
}

.service_join_condition_adult .condition-step-3 .button-area .exception {
  width: 100%;
}

.service_join_condition_adult .condition-step-3 .exam .alert {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  margin-top: 4px;
  color: #ff5151;
  font-weight: normal;
}

.service_join_condition_adult .condition-step-3 .count {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 15px 8px 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-3 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-3 .input-item {
  text-align: right;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-3 .unit-item {
  margin-left: 6px;
}

.service_join_condition_adult .condition-step-3 .count .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .condition-step-4 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-4 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-4 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.service_join_condition_adult .condition-step-4 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-4 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-4 .exam .question {
  width: calc(100% - 34px);
}

.service_join_condition_adult .condition-step-4 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.service_join_condition_adult .condition-step-4 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.service_join_condition_adult .condition-step-4 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.service_join_condition_adult .condition-step-4 .button-area .exception {
  width: 100%;
}

.service_join_condition_adult .condition-step-4 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.service_join_condition_adult .condition-step-5 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-5 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 8px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-5 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.service_join_condition_adult .condition-step-5 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-5 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-5 .exam .question {
  width: calc(100% - 34px);
}

.service_join_condition_adult .condition-step-5 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: calc(100% - 16px);
  margin: 0 auto;
}

.service_join_condition_adult .condition-step-5 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.service_join_condition_adult .condition-step-5 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.service_join_condition_adult .condition-step-5 .button-area .exception {
  width: 100%;
}

.service_join_condition_adult .condition-step-5 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.service_join_condition_adult .condition-step-6 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-6 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 0px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-6 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.service_join_condition_adult .condition-step-6 .exam .detail {
  background-color: #f5f8fd;
  font-size: 13px;
  line-height: 18px;
  color: #363b41;
  margin-left: 34px;
  margin-top: 4px;
  padding: 10px 12px 9px 13px;
  margin-top: 9px;
  width: 100%;
}

.service_join_condition_adult .condition-step-6 .exam .detail .title-item {
  font-weight: bold;
  letter-spacing: -0.14px;
}

.service_join_condition_adult .condition-step-6 .exam .detail .content {
  font-weight: normal;
  letter-spacing: -0.14px;
}

.service_join_condition_adult .condition-step-6 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-6 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-6 .exam .question {
  width: calc(100% - 53px);
}

.service_join_condition_adult .condition-step-6 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.service_join_condition_adult .condition-step-6 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.service_join_condition_adult .condition-step-6 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.service_join_condition_adult .condition-step-6 .button-area .exception {
  width: 100%;
}

.service_join_condition_adult .condition-step-6 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.service_join_condition_adult .condition-step-6 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-6 .input-item {
  text-align: right;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-6 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-6 .subject-item {
  margin-left: 8px;
}

.service_join_condition_adult .condition-step-6 .exercise-day {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-6 .exercise-day .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .condition-step-6 .exercise-hour {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-6 .exercise-hour .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .condition-step-6 .exercise-minute {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-6 .exercise-minute .unit-item {
  margin-right: 10px;
  margin-top: 1px;
}

.service_join_condition_adult .condition-step-6 .exercise-middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-6 .exercise-middle .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .condition-step-7 {
  width: calc(100% - 32px);
  margin: 30px auto 200px;
  display: none;
}

.service_join_condition_adult .condition-step-7 .exam {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  letter-spacing: -0.4px;
  font-weight: bold;
  margin: 40px 0px 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .condition-step-7 .exam .desc {
  font-size: 13px;
  line-height: 16px;
  letter-spacing: -0.14px;
  color: #686b73;
  margin-left: 34px;
  font-weight: normal;
  margin-top: 4px;
}

.service_join_condition_adult .condition-step-7 .exam .detail {
  background-color: #f5f8fd;
  font-size: 13px;
  line-height: 18px;
  color: #363b41;
  margin-left: 34px;
  margin-top: 4px;
  padding: 10px 12px 9px 13px;
  margin-top: 9px;
  width: 100%;
}

.service_join_condition_adult .condition-step-7 .exam .detail .title-item {
  font-weight: bold;
  letter-spacing: -0.14px;
}

.service_join_condition_adult .condition-step-7 .exam .detail .content {
  font-weight: normal;
  letter-spacing: -0.14px;
}

.service_join_condition_adult .condition-step-7 .exam:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .condition-step-7 .exam .question-number {
  margin-right: 8px;
}

.service_join_condition_adult .condition-step-7 .exam .question {
  width: calc(100% - 53px);
}

.service_join_condition_adult .condition-step-7 .button-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.service_join_condition_adult .condition-step-7 .button-area li {
  margin: 15px 0px 0;
  width: calc((100% - 17px) / 2);
}

.service_join_condition_adult .condition-step-7 .button-area li:nth-child(2n) {
  margin-left: 17px;
}

.service_join_condition_adult .condition-step-7 .button-area .exception {
  width: 100%;
}

.service_join_condition_adult .condition-step-7 .button-area .exception:nth-child(2n) {
  width: 100%;
  margin-left: 0px;
}

.service_join_condition_adult .condition-step-7 .data-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-7 .input-item {
  text-align: right;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-7 .unit-item {
  margin-left: 6px;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-7 .subject-item {
  margin-left: 8px;
}

.service_join_condition_adult .condition-step-7 .walking-day {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-7 .walking-day .unit-item {
  margin-right: 10px;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-7 .walking-hour {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-7 .walking-hour .unit-item {
  margin-right: 10px;
  font-size: 15px;
}

.service_join_condition_adult .condition-step-7 .weight-training {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-7 .weight-training .unit-item {
  margin-right: 10px;
  margin-top: 1px;
}

.service_join_condition_adult .condition-step-7 .walking-count {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.service_join_condition_adult .condition-step-7 .walking-count .unit-item {
  margin-right: 10px;
}

.service_join_condition_adult .condition-step-8 {
  display: none;
  background-color: #f5f8fd;
  padding-top: 16px;
  padding-bottom: 16px;
  margin-top: 16px;
  height: 100%;
}

.service_join_condition_adult .condition-step-8 .confirm-area {
  width: calc(100% - 32px);
  background-color: #fff;
  border-radius: 10px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  margin: 0 auto;
  padding-bottom: 24px;
}

.service_join_condition_adult .header-text {
  text-align: center;
  font-size: 12px;
  letter-spacing: -0.32px;
  color: #686b73;
}

.service_join_condition_adult .report {
  background-color: #fff;
  border-radius: 10px;
  margin-top: 20px;
}

.service_join_condition_adult .report:nth-child(1) {
  margin-top: 0px;
}

.service_join_condition_adult .report .report-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 21px 22px 0px 22px;
}

.service_join_condition_adult .report .report-top .top-left {
  color: #a4a9b3;
  font-size: 14px;
  letter-spacing: -0.47px;
  font-weight: bold;
}

.service_join_condition_adult .report .report-top .top-right .text-item {
  color: #a4a9b3;
  font-weight: bold;
}

.service_join_condition_adult .report .report-top .top-right .img-item {
  width: 14px;
  height: 14px;
  margin-left: 1px;
}

.service_join_condition_adult .report .report-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 1px;
  padding-left: 22px;
  padding-right: 22px;
}

.service_join_condition_adult .report .report-section .title {
  color: #080808;
  font-size: 20px;
  letter-spacing: -0.53px;
  font-weight: bold;
}

.service_join_condition_adult .report .report-section .img-imo {
  width: 28px;
  height: 28px;
  margin-left: 1px;
}

.service_join_condition_adult .report .report-hidden .grade-area .mask,
.service_join_condition_adult .report .report-hidden .grade-area .marker {
  display: none;
}

.service_join_condition_adult .report .report-hidden.danger .grade.danger .mask,
.service_join_condition_adult .report .report-hidden.danger .grade.danger .marker {
  display: block;
}

.service_join_condition_adult .report .report-hidden.improve .grade.improve .mask,
.service_join_condition_adult .report .report-hidden.improve .grade.improve .marker {
  display: block;
}

.service_join_condition_adult .report .report-hidden.keep .grade.keep .mask,
.service_join_condition_adult .report .report-hidden.keep .grade.keep .marker {
  display: block;
}

.service_join_condition_adult .report .report-hidden {
  display: none;
}

.service_join_condition_adult .report .report-hidden.active {
  display: block;
}

.service_join_condition_adult .report .report-hidden .grade-area {
  display: table;
  border-collapse: collapse;
  width: calc(100% - 44px);
  margin: 14px auto;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade {
  width: calc(100% / 3);
  border: 2px solid #c7cad1;
  border-top: 0px;
  height: 24px;
  display: table-cell;
  position: relative;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade .divider {
  width: 1px;
  height: 15px;
  background-color: #c7cad1;
  position: absolute;
  left: 50%;
  bottom: 0px;
  z-index: 2;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade .mask {
  width: 100%;
  height: 15px;
  position: absolute;
  bottom: 0px;
  z-index: 1;
  left: 0px;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade.danger .mask {
  background-color: #ffe2e2;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade.improve .mask {
  background-color: #fff4c6;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade.keep .mask {
  background-color: #eeeefa;
}

.service_join_condition_adult .report .report-hidden .grade-area .grade .marker {
  position: absolute;
  bottom: 15px;
  z-index: 1;
  left: 75%;
  -webkit-transform: translateX(-5px);
          transform: translateX(-5px);
}

.service_join_condition_adult .report .report-hidden .grade-text {
  width: calc(100% - 44px);
  margin: 14px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 9px;
}

.service_join_condition_adult .report .report-hidden .grade-text .health-text {
  font-weight: bold;
  color: #363b41;
  letter-spacing: -0.37px;
  line-height: 16px;
  font-size: 14px;
}

.service_join_condition_adult .report .report-hidden .grade-text .weight-text {
  color: #686b73;
  letter-spacing: -0.32px;
  line-height: 16px;
  font-size: 12px;
  margin-top: 1px;
}

.service_join_condition_adult .report .report-hidden .grade-text .grade {
  width: calc(100% / 3);
  text-align: center;
}

.service_join_condition_adult .condition-step-8 .confirm-area .health-desc-area {
  margin-top: 19px;
  margin-left: 19px;
}

.service_join_condition_adult .condition-step-8 .confirm-area .health-desc-area .title-item {
  font-weight: bold;
  color: #080808;
  letter-spacing: -0.09px;
  font-size: 14px;
}

.service_join_condition_adult .condition-step-8 .confirm-area .health-desc-area .desc-item {
  margin-top: 2px;
  font-size: 13px;
  font-weight: normal;
}

.service_join_condition_adult .condition-step-8 .confirm-area .goal-walking {
  margin-top: 19px;
  margin-left: 19px;
}

.service_join_condition_adult .condition-step-8 .confirm-area .goal-walking .title-item {
  font-weight: bold;
  color: #080808;
  letter-spacing: -0.09px;
  font-size: 14px;
}

.service_join_condition_adult .condition-step-8 .confirm-area .goal-walking .desc-item {
  margin-top: 2px;
  font-size: 13px;
  font-weight: normal;
}

.service_join_condition_adult .condition-step-8 .estimate {
  margin: 28px auto;
  width: 172px;
  text-align: center;
  color: #686b73;
  font-size: 12px;
  letter-spacing: -0.4px;
  line-height: 18px;
}

.service_join_condition_adult .condition-step-8 .btn-area {
  background-color: #f2f4fb;
  position: fixed;
  bottom: 0px;
  width: 100%;
  text-align: center;
}

.service_join_condition_adult .condition-step-8 .service-join {
  width: calc(100% - 32px);
  text-align: center;
  border-radius: 10px;
  background-color: #5653ff;
  height: 56px;
  color: #fff;
  font-size: 17px;
  letter-spacing: 0px;
  margin-bottom: 34px;
}

.service_join_condition_adult .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.service_join_condition_adult .footer-area .not-input {
  display: none;
  opacity: 0.9;
  border-radius: 28px;
  -webkit-box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
          box-shadow: 0 8px 20px 10px rgba(96, 110, 170, 0.06);
  color: #fff;
  background-color: #363b41;
  padding: 8px 0;
  width: calc(100% - 56px);
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 14px;
  line-height: 23px;
  text-align: center;
}

.service_join_condition_adult .footer-area .footer-navi {
  width: 100%;
  text-align: center;
  margin-bottom: 19px;
  font-size: 15px;
  letter-spacing: -0.4px;
  font-weight: bold;
  color: #363b41;
}

.service_join_condition_adult .btn-submit {
  width: calc((100% - 13px) / 2);
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-bottom: 34px;
}

.service_join_condition_adult .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.service_join_condition_adult .middle-layer .confirm-wrapper .confirm-text {
  padding: 33px 0 27px 0;
}

.service_join_condition_adult .alchol_cup.off {
  color: #686b73 !important;
}

.service_join_condition_adult .alchol_cup.off span {
  color: #686b73 !important;
}

.service_join_condition_adult .alchol_cut.off {
  color: #686b73 !important;
}

.service_join_condition_adult .alchol_cut.off span {
  color: #686b73 !important;
}

.service_join_condition_adult .cigarette_count.off {
  color: #686b73 !important;
}

.service_join_condition_adult .cigarette_count.off span {
  color: #686b73 !important;
}

.service_join_condition_adult .cigarette_plan.off {
  color: #686b73 !important;
}

.service_join_condition_adult .cigarette_plan.off span {
  color: #686b73 !important;
}

/* service_join_info_digital */
body.service_join_info_digital {
  background-color: #fff;
}

.service_join_info_digital {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* contents-area */
  /* footer-area */
}

.service_join_info_digital input::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital input:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital input::-moz-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital textarea::-moz-placeholder {
  color: #a4a9b3;
}

.service_join_info_digital .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join_info_digital .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 44.8%;
}

.service_join_info_digital .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  /* border-bottom: solid 1px rgb(233, 237, 240); */
  background-color: #ffffff;
}

.service_join_info_digital .header-area .title-item {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #5653ff;
}

.service_join_info_digital .header-area .text-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
  margin-top: 2px;
}

.service_join_info_digital .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_join_info_digital .contents-wrapper label {
  font-weight: bold;
  font-size: 13px;
  letter-spacing: -0.47px;
  color: #363b41;
  display: block;
}

.service_join_info_digital .contents-wrapper .input-text {
  width: 100%;
  height: 22px;
  font-size: 14px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
}

.service_join_info_digital .contents-wrapper .area {
  border-bottom: 1px solid #e6e8f2;
  padding-bottom: 4px;
  margin-top: 17px;
}

.service_join_info_digital .contents-wrapper .area:nth-child(1) {
  margin-top: 0px;
}

.service_join_info_digital .contents-wrapper .email .email-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join_info_digital .contents-wrapper .email .email-wrapper .at {
  font-size: 15px;
  color: #a4a9b3;
  margin-right: 4px;
  margin-top: 6px;
}

.service_join_info_digital .contents-wrapper .nickname .nickname-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join_info_digital .contents-wrapper .nickname .nickname-wrapper .input-text {
  width: calc(100% - 44px);
}

.service_join_info_digital .contents-wrapper .nickname .nickname-wrapper .duple {
  font-weight: bold;
  font-size: 12px;
  width: 44px;
  letter-spacing: -0.2px;
  color: #a4a9b3;
  margin-top: 4px;
}

.service_join_info_digital .contents-wrapper .nickname .nickname-wrapper .duple.active {
  color: #5653ff;
}

.service_join_info_digital .contents-wrapper .nickname .nickname-wrapper .duple.true {
  text-align: right;
}

.service_join_info_digital .contents-wrapper .warning {
  font-size: 12px;
  letter-spacing: -0.2px;
  margin-top: 2px;
  display: none;
}

.service_join_info_digital .contents-wrapper .warning.active {
  display: block;
}

.service_join_info_digital .contents-wrapper .warning.blue {
  color: #5653ff;
}

.service_join_info_digital .contents-wrapper .warning.red {
  color: #ff5151;
}

.service_join_info_digital .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
}

.service_join_info_digital .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
  margin-bottom: 34px;
}

.service_join_info_digital .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

/* service_join_info_pass */
body.service_join_info_pass {
  background-color: #fff;
}

.service_join_info_pass {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* contents-area */
  /* footer-area */
}

.service_join_info_pass input::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass input:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass input::-moz-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass textarea::-moz-placeholder {
  color: #a4a9b3;
}

.service_join_info_pass .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join_info_pass .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 44.8%;
}

.service_join_info_pass .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  /* border-bottom: solid 1px rgb(233, 237, 240); */
  background-color: #ffffff;
}

.service_join_info_pass .header-area .title-item {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.53px;
  color: #5653ff;
}

.service_join_info_pass .header-area .text-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
  margin-top: 2px;
}

.service_join_info_pass .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_join_info_pass .contents-wrapper label {
  font-weight: bold;
  font-size: 13px;
  letter-spacing: -0.47px;
  color: #363b41;
  display: block;
}

.service_join_info_pass .contents-wrapper .input-text {
  width: 100%;
  height: 22px;
  font-size: 14px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
}

.service_join_info_pass .contents-wrapper .area {
  border-bottom: 1px solid #e6e8f2;
  padding-bottom: 4px;
  margin-top: 17px;
}

.service_join_info_pass .contents-wrapper .area:nth-child(1) {
  margin-top: 0px;
}

.service_join_info_pass .contents-wrapper .email .email-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join_info_pass .contents-wrapper .email .email-wrapper .at {
  font-size: 15px;
  color: #a4a9b3;
  margin-right: 4px;
  margin-top: 6px;
}

.service_join_info_pass .contents-wrapper .nickname .nickname-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join_info_pass .contents-wrapper .nickname .nickname-wrapper .input-text {
  width: calc(100% - 44px);
}

.service_join_info_pass .contents-wrapper .nickname .nickname-wrapper .duple {
  font-weight: bold;
  font-size: 12px;
  width: 44px;
  letter-spacing: -0.2px;
  color: #a4a9b3;
  margin-top: 4px;
}

.service_join_info_pass .contents-wrapper .nickname .nickname-wrapper .duple.active {
  color: #5653ff;
}

.service_join_info_pass .contents-wrapper .nickname .nickname-wrapper .duple.true {
  text-align: right;
}

.service_join_info_pass .contents-wrapper .warning {
  font-size: 12px;
  letter-spacing: -0.2px;
  margin-top: 2px;
  display: none;
}

.service_join_info_pass .contents-wrapper .warning.active {
  display: block;
}

.service_join_info_pass .contents-wrapper .warning.blue {
  color: #5653ff;
}

.service_join_info_pass .contents-wrapper .warning.red {
  color: #ff5151;
}

.service_join_info_pass .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
}

.service_join_info_pass .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
  margin-bottom: 34px;
}

.service_join_info_pass .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

/* service_join */
body.service_join {
  background-color: #fff;
}

.service_join {
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* chrome, opera, safari */
  /* IE 10 ~ */
  /* Firefox */
  /* join-step-2 */
  /* join-step-3 */
  /* join-step-4 */
  /* popup custom */
}

.service_join li {
  list-style: none;
}

.service_join .certificationbox {
  position: relative;
}

.service_join .certificationbox strong {
  position: absolute;
  top: 10px;
  right: 0;
  font-size: 12px;
  color: #ff5151;
}

.service_join input::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join input:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join input::-moz-placeholder {
  color: #a4a9b3;
}

.service_join textarea::-webkit-input-placeholder {
  color: #a4a9b3;
}

.service_join textarea:-ms-input-placeholder {
  color: #a4a9b3;
}

.service_join textarea::-moz-placeholder {
  color: #a4a9b3;
}

.service_join .header-area .title-item .bar {
  margin-left: 11px;
}

.service_join .header-area .title-item .text {
  margin-left: 8px;
}

.service_join .join-step-2 {
  display: block;
  position: relative;
}

.service_join .join-step-2 .android-back-btn {
  position: absolute;
  font-size: 9px;
  right: 10px;
  top: 10px;
}

.service_join .join-step-2 .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join .join-step-2 .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 32.5%;
}

.service_join .join-step-2 .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  /* border-bottom: solid 1px rgb(233, 237, 240); */
  background-color: #ffffff;
}

.service_join .join-step-2 .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.service_join .join-step-2 .header-area .all-agree-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 64px;
  margin-bottom: 26px;
}

.service_join .join-step-2 .header-area .all-agree-area .ic-circle-check {
  width: 26px;
  height: 26px;
}

.service_join .join-step-2 .header-area .all-agree-area .all-check {
  margin-left: 6.5px;
  height: 24px;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.24px;
  color: #363b41;
}

.service_join .join-step-2 .agree-divider {
  width: calc(100% - 32px);
  margin: 0 auto;
  height: 1px;
  background-color: #e6e8f2;
}

.service_join .join-step-2 .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_join .join-step-2 .contents-wrapper .agree-list {
  margin-left: 2px;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 25px;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item .item-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item .item-left .check-item {
  width: 17px;
  height: 12px;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item .item-left .text-item {
  margin-left: 7px;
  color: #363b41;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item .item-left.false .text-item {
  color: #c7cad1;
}

.service_join .join-step-2 .contents-wrapper .agree-list .list-item .item-icon {
  cursor: pointer;
}

.service_join .join-step-2 .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 34px;
}

.service_join .join-step-2 .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
}

.service_join .join-step-2 .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.service_join .join-step-3 {
  display: none;
  position: relative;
}

.service_join .join-step-3 .android-back-btn {
  position: absolute;
  font-size: 9px;
  right: 10px;
  top: 10px;
}

.service_join .join-step-3 .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join .join-step-3 .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 44.8%;
}

.service_join .join-step-3 .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  background-color: #ffffff;
}

.service_join .join-step-3 .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.service_join .join-step-3 .header-area .text-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
  margin-top: 2px;
}

.service_join .join-step-3 .header-area .text-item .digital {
  display: none;
}

.service_join .join-step-3 .header-area .text-item .pass {
  display: none;
}

.service_join .join-step-3 .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_join .join-step-3 .contents-wrapper label {
  font-weight: bold;
  font-size: 13px;
  letter-spacing: -0.47px;
  color: #363b41;
  display: block;
}

.service_join .join-step-3 .contents-wrapper .input-text {
  width: 100%;
  height: 22px;
  font-size: 15px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
}

.service_join .join-step-3 .contents-wrapper .input-text:disabled {
  color: #c7cad1;
}

.service_join .join-step-3 .contents-wrapper .area {
  border-bottom: 1px solid #e6e8f2;
  padding-bottom: 4px;
  margin-top: 17px;
}

.service_join .join-step-3 .contents-wrapper .area.focus {
  border-bottom: 1px solid #5653ff;
}

.service_join .join-step-3 .contents-wrapper .area:nth-child(1) {
  margin-top: 0px;
}

.service_join .join-step-3 .contents-wrapper .email .email-wrapper {
  display: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join .join-step-3.pass .email-wrapper.pass {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service_join .join-step-3.digital .email-wrapper.digital {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service_join .join-step-3 .contents-wrapper .email .email-wrapper .at {
  font-size: 15px;
  color: #a4a9b3;
  margin-right: 4px;
  margin-top: 6px;
}

.service_join .join-step-3 .contents-wrapper .nickname .nickname-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join .join-step-3 .contents-wrapper .nickname .nickname-wrapper .input-text {
  width: calc(100% - 44px);
}

.service_join .join-step-3 .contents-wrapper .nickname .nickname-wrapper .duple {
  font-weight: bold;
  font-size: 12px;
  width: 44px;
  letter-spacing: -0.2px;
  color: #c7cad1;
  margin-top: 4px;
}

.service_join .join-step-3 .contents-wrapper .nickname .nickname-wrapper .duple.active {
  color: #5653ff;
}

.service_join .join-step-3 .contents-wrapper .nickname .nickname-wrapper .duple.true {
  text-align: right;
}

.service_join .join-step-3 .contents-wrapper .warning {
  font-size: 12px;
  letter-spacing: -0.2px;
  margin-top: 2px;
  display: none;
}

.service_join .join-step-3 .contents-wrapper .warning.active {
  display: block;
}

.service_join .join-step-3 .contents-wrapper .warning.gray {
  color: #686b73;
}

.service_join .join-step-3 .contents-wrapper .warning.blue {
  color: #5653ff;
}

.service_join .join-step-3 .contents-wrapper .warning.red {
  color: #ff5151;
}

.service_join .join-step-3 .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
}

.service_join .join-step-3 .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
  margin-bottom: 34px;
}

.service_join .join-step-3 .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.service_join .join-step-4 {
  display: none;
}

.service_join .join-step-4 .header-divider {
  height: 6px;
  background-color: #f2f4fb;
}

.service_join .join-step-4 .header-progress {
  height: 4px;
  background-color: #5653ff;
  width: 66.6%;
}

.service_join .join-step-4 .header-area {
  width: calc(100% - 48px);
  margin: 32px auto 0;
  background-color: #ffffff;
}

.service_join .join-step-4 .header-area .title-item {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.8px;
  color: #5653ff;
}

.service_join .join-step-4 .header-area .text-item {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.6px;
  color: #686b73;
  margin-top: 2px;
}

.service_join .join-step-4 .contents-wrapper {
  width: calc(100% - 48px);
  margin: 32px auto 134px;
}

.service_join .join-step-4 .contents-wrapper label {
  font-weight: bold;
  font-size: 13px;
  letter-spacing: -0.47px;
  color: #363b41;
  display: block;
}

.service_join .join-step-4 .contents-wrapper .input-text {
  height: 22px;
  font-size: 14px;
  letter-spacing: -0.4px;
  color: #363b41;
  margin-top: 8px;
}

.service_join .join-step-4 .contents-wrapper .input-text:disabled {
  color: #c7cad1;
}

.service_join .join-step-4 .contents-wrapper .input-text.foward {
  width: 50px;
}

.service_join .join-step-4 .contents-wrapper .input-text.behind {
  width: 150px;
  -webkit-text-security: disc;
}

.service_join .join-step-4 .contents-wrapper .area {
  border-bottom: 1px solid #e6e8f2;
  padding-bottom: 4px;
  margin-top: 17px;
}

.service_join .join-step-4 .contents-wrapper .area.focus {
  border-bottom: 1px solid #5653ff;
}

.service_join .join-step-4 .contents-wrapper .resident.area {
  border-bottom: 1px solid #5653ff;
}

.service_join .join-step-4 .contents-wrapper .area:nth-child(1) {
  margin-top: 0px;
}

.service_join .join-step-4 .contents-wrapper .resident .resident-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service_join .join-step-4 .contents-wrapper .resident .resident-wrapper .dash {
  font-size: 15px;
  color: #a4a9b3;
  margin-right: 4px;
  margin-top: 6px;
}

.service_join .join-step-4 .contents-wrapper .warning {
  font-size: 12px;
  letter-spacing: -0.2px;
  margin-top: 2px;
  display: none;
}

.service_join .join-step-4 .contents-wrapper .warning.active {
  display: block;
}

.service_join .join-step-4 .contents-wrapper .warning.blue {
  color: #5653ff;
}

.service_join .join-step-4 .contents-wrapper .warning.red {
  color: #ff5151;
}

.service_join .join-step-4 .footer-area {
  width: 100%;
  padding: 0 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  background-color: #fff;
}

.service_join .join-step-4 .btn-submit {
  width: 100%;
  height: 56px;
  background-color: #dbe0e4;
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
  margin-bottom: 34px;
}

.service_join .join-step-4 .btn-submit.active {
  background-color: #5653ff;
  color: #fff;
}

.service_join .middle-layer .alert-wrapper .alert-text {
  padding: 21px 0 19px;
}

.service_join .middle-layer .alert-wrapper .text-area {
  border-top: 1px solid #e6e8f2;
}

.service_join .middle-layer .alert-wrapper .text-area .text-wrapper {
  padding: 20px 24px 0px 22px;
  max-height: 316px;
  overflow-y: scroll;
}

.service_join .middle-layer .alert-wrapper .alert-area {
  margin-top: 22px;
  cursor: pointer;
}

.service_join #sejong_popup.middle-layer .alert-wrapper .alert-area {
  margin-top: 0px;
}

.service_join #sejong_popup.middle-layer .alert-wrapper .alert-text .active {
  margin-bottom: 5px;
}

.service_join #not_sejong_popup.middle-layer .alert-wrapper .alert-area {
  margin-top: 0px;
}

.service_join #not_sejong_popup.middle-layer .alert-wrapper .alert-text .active {
  margin-bottom: 5px;
}

.service_join .middle-layer .alert-wrapper .text-area .text-wrapper p {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: -0.2px;
  color: #080808;
}

.service_join .footer-area.length02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service_join .footer-area.length02 button:first-child {
  margin-right: 6px;
}

.service_join .footer-area.length02 button:last-child {
  margin-left: 6px;
}

.service_join .btn-gray01 {
  background-color: #e6e8f2 !important;
  color: #686b73 !important;
}

.service_join .btn-gray02 {
  background-color: #dbe0e4 !important;
  color: #686b73 !important;
}

/* sleeping */
body.sleeping {
  background-color: white;
}

.sleeping {
  /* sleeping-section */
  /* average-section */
  /* list-section */
}

.sleeping .sleeping-section {
  background-color: white;
  padding: 31px 18px 0px 18px;
  text-align: center;
}

.sleeping .sleeping-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.sleeping .sleeping-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.sleeping .sleeping-section .date-selector-container .prev-item {
  left: 0px;
}

.sleeping .sleeping-section .date-selector-container .next-item {
  right: 0px;
}

.sleeping .sleeping-section .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.sleeping .average-section {
  text-align: center;
}

.sleeping .average-section .title-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 26px;
}

.sleeping .average-section .time {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.sleeping .average-section .time .unit {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
}

.sleeping .average-section .sleep-divider {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
  height: 6px;
  background-color: #e9edf0;
  margin-top: 36px;
}

.sleeping .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.sleeping .list-section .sleeping-list .list-item {
  padding: 15px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

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

.sleeping .sleeping-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.sleeping .sleeping-list .list-item .date .achieve {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.23px;
  color: #5653ff;
  padding: 1px 7px 2px;
  border-radius: 5px;
  background-color: #eeeefa;
  margin-left: 7px;
  display: none;
}

.sleeping .sleeping-list .list-item .record .count {
  font-size: 14px;
  color: #697279;
}

.sleeping .sleeping-list .list-item .record .while {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  text-align: right;
  letter-spacing: -0.45px;
}

/* sugar_direct */
body.sugar_direct {
  background-color: #f5f8fd;
}

.sugar_direct {
  /* blood-section */
  /* divider */
  /* select-section */
  /* .select-section .integer-blood .select-wrap:before {
    content: "/";
    top: 134px;
    color:#5653ff;
    font-size: 22px;
    font-weight: bold;
    letter-spacing: -0.24px;
} */
  /* btn-section */
  /* popup-selection */
  /* 년도 */
  /* .mobileSelect .content .panel .wheel:nth-child(1) .selectContainer li {
    text-align: right;
}
.mobileSelect .content .panel .wheel:nth-child(3) .selectContainer li {
    text-align: center;
}
.mobileSelect .content .panel .wheel:nth-child(5) .selectContainer li {
    text-align: right;
}  */
  /* .mobileSelect .content .panel .wheel:nth-child(3) .selectContainer li {
    text-align: right;
}
.mobileSelect .content .panel .wheel:nth-child(4) .selectContainer li {
    text-align: left;
}

.mobileSelect .content .panel .wheel:nth-child(5) .selectContainer li {
    text-align: right;
}
.mobileSelect .content .panel .wheel:nth-child(7) .selectContainer li {
    text-align: left;
} */
}

.sugar_direct .blood-direct-section {
  background-color: white;
  padding: 20px 16px;
  text-align: center;
}

.sugar_direct .blood-direct-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.sugar_direct .blood-direct-section .date-selector-container .date {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #363b41;
  margin-left: 24px;
}

.sugar_direct .blood-direct-section .date-selector-container .date-time {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  color: #363b41;
  margin-left: 25px;
}

.sugar_direct .divider {
  height: 11px;
  width: 100%;
  background-color: #f5f8fd;
}

.sugar_direct .select-section {
  background-color: white;
  position: relative;
}

.sugar_direct .select-section .select-wrap .select-options .select-option {
  color: #a4a9b3;
}

.sugar_direct .select-section .integer-blood .select-wrap {
  text-align: right;
}

.sugar_direct .select-section .integer-blood .select-wrap .select-options .select-option {
  left: -20px;
}

.sugar_direct .select-section .integer-blood .highlight .highlight-item {
  margin-right: 20px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.sugar_direct .select-section .float-blood .select-wrap {
  text-align: left;
}

.sugar_direct .select-section .float-blood .select-wrap .select-options .select-option {
  margin-left: 10px;
}

.sugar_direct .select-section .float-blood .highlight .highlight-item {
  margin-left: 10px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.sugar_direct .select-section .float-blood .select-wrap:after {
  content: "mg/dL";
  right: -60px;
  top: 132px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
}

.sugar_direct .btn-section {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #f5f8fd;
  margin-top: 20px;
}

.sugar_direct .btn-section .btn-area {
  width: calc(100% - 32px);
  margin: 20px auto 34px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.sugar_direct .btn-section .desc {
  width: calc(100% - 32px);
  margin: 0 auto;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.2px;
  color: #686b73;
}

.sugar_direct .btn-section .btn-area button {
  border-radius: 10px;
  height: 56px;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: normal;
  text-align: center;
  color: #363b41;
  width: calc((100% - 13px) / 2);
}

.sugar_direct .btn-section .btn-area .cancel {
  background-color: #e6e8f2;
  color: #363b41;
}

.sugar_direct .btn-section .btn-area .confirm {
  background-color: #5653ff;
  color: #ffffff;
  margin-left: 13px;
}

.sugar_direct .mobileSelect .content .fixWidth {
  width: calc(100% - 32px);
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(1) {
  width: 21.5% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(2) {
  width: 5% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(3) {
  width: 13.1% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(4) {
  width: 5% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(5) {
  width: 10.2% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(6) {
  width: 5% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(7) {
  width: 17.2% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(8) {
  width: 1.5% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(9) {
  width: 18.6% !important;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(1) .selectContainer li {
  text-align: right;
  margin-right: 5px;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(3) .selectContainer li {
  text-align: right;
  margin-right: 5px;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(5) .selectContainer li {
  text-align: right;
  margin-right: 5px;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(7) .selectContainer li {
  text-align: right;
  margin-right: 12px;
}

.sugar_direct .mobileSelect .content .panel .wheel:nth-child(9) .selectContainer li {
  text-align: left;
  margin-left: 9px;
}

/* sugar */
body.sugar {
  background-color: white;
}

.sugar {
  /* btn-move */
  /* sugar-section */
  /* graph-section */
  /* thick-divider */
  /* average-section */
  /* list-section */
  /* custom-poopup */
}

.sugar .btn-move {
  width: 25px;
  height: 25px;
}

.sugar .sugar-section {
  background-color: white;
  padding: 20px 16px 25px;
  text-align: center;
}

.sugar .sugar-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.sugar .sugar-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.sugar .sugar-section .date-selector-container .prev-item {
  left: 0px;
}

.sugar .sugar-section .date-selector-container .next-item {
  right: 0px;
}

.sugar .sugar-section .date-selector-container .date-item {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.sugar .graph-section {
  background-color: #fff;
}

.sugar .graph-section .spot-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 18px;
}

.sugar .graph-section .spot-area .spot {
  width: 6px;
  height: 6px;
  border-radius: 5.5px;
}

.sugar .graph-section .spot-area .spot-text {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.14px;
  color: #73787e;
}

.sugar .graph-section .spot-area .empty {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.sugar .graph-section .spot-area .empty .spot {
  background-color: #6d53ff;
}

.sugar .graph-section .spot-area .empty .spot-text {
  margin-left: 4px;
}

.sugar .graph-section .spot-area .after {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.sugar .graph-section .spot-area .after .spot {
  background-color: #00c69c;
  margin-left: 8px;
}

.sugar .graph-section .spot-area .after .spot-text {
  margin-left: 4px;
}

.sugar .graph-section .spot-area .etc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.sugar .graph-section .spot-area .etc .spot {
  background-color: #ff639d;
  margin-left: 7px;
}

.sugar .graph-section .spot-area .etc .spot-text {
  margin-left: 4px;
}

.sugar .graph-section .spot-area .info-icon {
  margin-left: 8px;
  position: relative;
}

.sugar .graph-section .spot-area .info-icon .info-popup {
  position: absolute;
  width: 215px;
  border-radius: 5px;
  border: solid 1px #c7cad1;
  background-color: #fcfcfe;
  display: none;
  left: -30px;
  top: 0px;
  z-index: 2;
}

.sugar .graph-section .spot-area .info-icon .info-popup .close-popup {
  margin-top: 10px;
  text-align: right;
  margin-right: 9px;
}

.sugar .graph-section .spot-area .info-icon .info-popup .popup-text {
  padding: 6px 15px 19px 16px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: -0.4px;
  color: #363b41;
}

.sugar .graph-section .graph-area {
  position: relative;
  pointer-events: none;
  margin-top: 5px;
}

.sugar .graph-section .graph-area #chart {
  height: 210px !important;
}

.sugar .graph-section .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px 5px 15px 5px;
}

.sugar .graph-section .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.sugar .graph-section .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.sugar .graph-section .graph-area .bubble-area {
  display: none;
  position: absolute;
}

.sugar .graph-section .graph-area .bubble {
  padding: 7px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: white;
}

.sugar .graph-section .graph-area .bubble::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 10%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #5653ff;
}

.sugar .graph-section .graph-area .bubble span {
  font-weight: bold;
}

.sugar .graph-section .graph-area .bubble-area.grey .bubble {
  background-color: #dbe0e4;
  color: #363b41;
  /* border: solid 1px rgb(156 161 165); */
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
}

.sugar .graph-section .graph-area .bubble-area.grey .bubble::after {
  left: 11%;
  bottom: 0px;
  background-color: #dbe0e4;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
}

.sugar .graph-section .graph-area .bubble-area.right .bubble::after {
  left: auto;
  right: 5%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
}

.sugar .graph-section .section-divider {
  height: 1px;
  background-color: #e6e8f2;
}

.sugar .graph-section .average-area .day-item {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.47;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 15px;
}

.sugar .graph-section .average-area .count-item {
  font-size: 36px;
  font-weight: bold;
  color: #080808;
  text-align: center;
}

.sugar .graph-section .average-area .count-item > span {
  font-size: 14px;
}

.sugar .graph-section .average-area .section-divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px auto 0;
}

.sugar .graph-section .average-area .info-wrapper {
  width: calc(100% - 32px);
  margin: 22px auto 0px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.sugar .graph-section .average-area .info-wrapper .high {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.sugar .graph-section .average-area .info-wrapper .low {
  width: 50%;
}

.sugar .info-wrapper .text-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: #36434c;
}

.sugar .info-wrapper .number-item {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: -0.24px;
  color: #363b41;
}

.sugar .info-wrapper .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.13px;
  color: #363b41;
}

.sugar .thick-divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 23px;
}

.sugar .average-section {
  text-align: center;
}

.sugar .average-section .title-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 26px;
}

.sugar .average-section .time {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.sugar .average-section .time .unit {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
}

.sugar .average-section .sleep-divider {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
  height: 6px;
  background-color: #e9edf0;
  margin-top: 36px;
}

.sugar .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.sugar .list-section .list-header {
  background-color: #f5f8fd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px 0;
}

.sugar .list-section .list-header .ic-img {
  width: 15px;
  height: 15px;
}

.sugar .list-section .list-header .text-item {
  margin-left: 3px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #686b73;
}

.sugar .list-section .list-header .direct {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 15px;
}

.sugar .list-section .sugar-list .list-item {
  padding: 16px 24px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

.sugar .sugar-list .list-item .date .days {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.sugar .sugar-list .list-item .date .days .day-item {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.4px;
  color: #363b41;
}

.sugar .sugar-list .list-item .date .days .ic-img {
  width: 19px;
  height: 19px;
  margin-left: 7px;
  display: none;
}

.sugar .sugar-list .list-item.direct .date .days .ic-img {
  display: block;
}

.sugar .list-section .sugar-list .list-item .time .time-item {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #697279;
  margin-top: 1px;
}

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

.sugar .sugar-list .list-item .record .status {
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: -0.23px;
  text-align: center;
  border-radius: 5px;
  padding: 1px 5px 2px;
}

.sugar .sugar-list .list-item .record .status.after {
  color: #00c69c;
  background-color: #e8fcf8;
}

.sugar .sugar-list .list-item .record .status.empty {
  color: #5653ff;
  background-color: #eeeefa;
}

.sugar .sugar-list .list-item .record .status.etc {
  color: #ff639d;
  background-color: #fbebf1;
}

.sugar .sugar-list .list-item .record .data {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  color: #080808;
  margin-left: 7px;
}

.sugar .sugar-list .list-item .record .ic-more {
  margin-right: -8px;
}

.sugar #more_popup.bottom-layer .list-wrapper #direct_insert.list-item {
  border-top: 1px solid #e6e8f2;
}

/* walking */
.walking {
  /* walking-section */
  /* graph-section */
  /* .graph-section .graph-area .bubble{
  padding: 7px; 
  background-color: rgb(86, 83, 255);
  border-radius: 10px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: white;
} */
  /* list-section */
  /* 목표 걸음수 팝업 설정 */
  /* mobileSelect custom */
}

.walking .walking-section {
  background-color: white;
  padding: 31px 18px 0px 18px;
  text-align: center;
}

.walking .walking-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.walking .walking-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.walking .walking-section .date-selector-container .prev-item {
  left: 0px;
}

.walking .walking-section .date-selector-container .next-item {
  right: 0px;
}

.walking .walking-section .date-selector-container .date-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.walking .graph-section {
  background-color: #fff;
}

.walking .graph-section .updated-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 22px 10px 5px 11px;
}

.walking .graph-section .updated-area .date-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.walking .graph-section .updated-area .date-item .goal-point {
  width: 6px;
  height: 6px;
  margin: 6px 4px 6px 0;
  border-radius: 5.5px;
  background-color: #5bcd8f;
}

.walking .graph-section .updated-area .date-item .goal-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 10px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.14px;
  color: #73787e;
}

.walking .graph-section .updated-area .date-item .goal-text02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 10px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.14px;
  color: #73787e;
  border: 1px solid #5653ff;
  border-radius: 3px;
}

.walking .graph-section .updated-area .date-item .goal-text02::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  margin-right: 4px;
  border-radius: 5.5px;
  background-color: #5653ff;
}

.walking .graph-section .updated-area .unit-item {
  margin-left: auto;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #c7cad1;
}

.walking .graph-section .graph-area {
  position: relative;
  pointer-events: none;
}

.walking .graph-section .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px 5px 15px 5px;
}

.walking .graph-section .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.walking .graph-section .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.walking .graph-section .graph-area .bubble-area {
  display: none;
  position: absolute;
  background-color: #f2f4fb;
  border-radius: 5px;
  text-align: center;
  color: #686b73;
  width: 84px;
  padding: 6px 7px;
}

.walking .graph-section .graph-area .bubble-area #walkCount {
  font-size: 15px;
  font-weight: bold;
}

.walking .graph-section .graph-area .bubble-area #clickedDate {
  font-size: 12px;
  letter-spacing: -0.2px;
}

.walking .graph-section .graph-area .bubble::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 50%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #f2f4fb;
}

.walking .graph-section .graph-area .bubble span {
  font-weight: bold;
}

.walking .graph-section .graph-area .bubble-area.grey .bubble {
  background-color: #dbe0e4;
  color: #363b41;
  /* border: solid 1px rgb(156 161 165); */
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
}

.walking .graph-section .graph-area .bubble-area.grey .bubble::after {
  left: 11%;
  bottom: 0px;
  background-color: #dbe0e4;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
}

.walking .graph-section .graph-area .bubble-area.right .bubble::after {
  left: auto;
  right: 5%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
}

.walking .graph-section .section-divider {
  height: 1px;
  background-color: #e6e8f2;
}

.walking .graph-section .average-area .day-item {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.47;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 15px;
}

.walking .graph-section .average-area .count-item {
  font-size: 36px;
  font-weight: bold;
  color: #080808;
  text-align: center;
  line-height: 1.11;
}

.walking .graph-section .average-area .count-item > span {
  font-size: 14px;
}

.walking .graph-section .average-area .section-divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px auto 0;
}

.walking .graph-section .average-area .info-wrapper {
  width: calc(100% - 32px);
  margin: 20px auto 0px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.walking .graph-section .average-area .info-wrapper .calory {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.walking .graph-section .average-area .info-wrapper .distance {
  width: 50%;
}

.walking .info-wrapper .text-item {
  font-size: 14px;
  color: #36434c;
  letter-spacing: -0.47px;
}

.walking .info-wrapper .number-item {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
  color: #363b41;
}

.walking .info-wrapper .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  letter-spacing: -0.13px;
  color: #363b41;
}

.walking .graph-section .average-area .thick-divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 18px;
}

.walking .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.walking .list-section .walk-list .list-item {
  padding: 27px 24px 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
}

.walking .walk-list .list-item .date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.walking .walk-list .list-item .date .days {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #363b41;
}

.walking .walk-list .list-item .date .achieve {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.23px;
  color: #5653ff;
  padding: 1px 7px 2px;
  border-radius: 5px;
  background-color: #eeeefa;
  margin-left: 7px;
  display: none;
}

.walking .walk-list .list-item.success .date .achieve {
  display: block;
}

.walking .walk-list .list-item .record {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.walking .walk-list .list-item .record .distance {
  font-size: 14px;
  color: #697279;
}

.walking .walk-list .list-item .record .count {
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  letter-spacing: -0.45px;
  margin-left: 5px;
}

.walking .walk-list .list-item.success .record .count {
  color: #080808;
}

.walking .pop-layer {
  display: none;
  position: absolute;
  bottom: 0px;
  height: auto;
  background-color: #fff;
  z-index: 10;
  border-top-right-radius: 16px;
  border-top-left-radius: 16px;
  width: 100%;
}

.walking .dim-layer {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.walking .dim-layer .dimBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.walking .dim-layer .pop-layer {
  display: block;
}

.walking .dim-layer .pop-conts .title-area {
  font-size: 17px;
  font-weight: bold;
  padding: 21px 16px 18px;
  border-radius: 16px;
  background-color: #f2f4fb;
  text-align: center;
  position: relative;
}

.walking .dim-layer .pop-conts .title-area .confirm {
  position: absolute;
  right: 24px;
  top: 24px;
  font-size: 14px;
  letter-spacing: -0.37px;
  font-weight: bold;
  color: #5653ff;
}

.walking .dim-layer .pop-conts .sticky-divider {
  height: 1px;
  background-color: #e6e8f2;
}

.walking .mobileSelect .custom-text.now {
  color: #5653ff;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.14px;
}

.walking .mobileSelect .custom-text.past {
  color: #a4a9b3;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: -0.14px;
}

.walking .custom-text img {
  width: 10px;
  height: 10px;
  margin-left: 3px;
}

.walking .mobileSelect .content .btnBar .cancel {
  display: none;
}

.walking .mobileSelect:nth-child(1) .content .panel .wheel:nth-child(2) .selectContainer li {
  text-align: left;
}

.walking .mobileSelect .content .panel .wheel .selectContainer {
  margin-left: 10px;
  text-align: left;
}

.walking .selectContainer.lock {
  -webkit-transform: translate3d(0px, 40px, 0px) !important;
          transform: translate3d(0px, 40px, 0px) !important;
  text-align: right !important;
}

.walking .selectContainer.hold {
  -webkit-transform: translate3d(0px, 80px, 0px) !important;
          transform: translate3d(0px, 80px, 0px) !important;
  text-align: right !important;
}

.walking .selectContainer .selected {
  font-size: 18px !important;
}

/* weight_direct */
body.weight_direct {
  background-color: #f5f8fd;
}

.weight_direct {
  /* weight-section */
  /* divider */
  /* select-section */
  /* btn-section */
  /* popup-selection */
}

.weight_direct .weight-direct-section {
  background-color: white;
  padding: 31px 18px 20px 18px;
  text-align: center;
}

.weight_direct .weight-direct-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.weight_direct .weight-direct-section .date-selector-container .date {
  font-size: 14px;
  font-weight: bold;
  color: #363b41;
  margin-left: 24px;
}

.weight_direct .weight-direct-section .date-selector-container .date-time {
  letter-spacing: -0.2px;
  color: #363b41;
  font-size: 14px;
  margin-left: 25px;
}

.weight_direct .divider {
  height: 11px;
  width: 100%;
  background-color: #f5f8fd;
}

.weight_direct .select-section {
  background-color: white;
  position: relative;
}

.weight_direct .select-section .select-wrap .select-options .select-option {
  color: #a4a9b3;
}

.weight_direct .select-section .integer-weight .select-wrap {
  text-align: right;
}

.weight_direct .select-section .integer-weight .select-wrap .select-options .select-option {
  left: -20px;
}

.weight_direct .select-section .integer-weight .highlight .highlight-item {
  margin-right: 20px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.weight_direct .select-section .integer-weight .select-wrap:before {
  content: ".";
  top: 134px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
}

.weight_direct .select-section .float-weight .select-wrap {
  text-align: left;
}

.weight_direct .select-section .float-weight .select-wrap .select-options .select-option {
  margin-left: 10px;
}

.weight_direct .select-section .float-weight .highlight .highlight-item {
  margin-left: 10px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
}

.weight_direct .select-section .float-weight .select-wrap:after {
  content: "kg";
  right: -30px;
  top: 134px;
  color: #5653ff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
}

.weight_direct .btn-section {
  margin-top: 20px;
}

.weight_direct .btn-section .btn-area {
  text-align: center;
}

.weight_direct .btn-section .btn-area button {
  border-radius: 10px;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.18;
  letter-spacing: normal;
  text-align: center;
  padding: 17px 0 19px 0;
  width: 165px;
}

.weight_direct .btn-section .btn-area .cancel {
  background-color: #e6e8f2;
  color: #363b41;
}

.weight_direct .btn-section .btn-area .confirm {
  background-color: #5653ff;
  color: #ffffff;
  margin-left: 13px;
}

.weight_direct .mobileSelect .content .fixWidth {
  width: calc(100% - 32px);
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(1) {
  width: 25% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(2) {
  width: 15% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(4) {
  width: 20% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(5) {
  width: 10% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(6) {
  width: 10% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(7) {
  width: 10% !important;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(1) .selectContainer li {
  text-align: right;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(2) .selectContainer li {
  text-align: center;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(4) .selectContainer li {
  text-align: right;
}

.weight_direct .mobileSelect .content .panel .wheel:nth-child(6) .selectContainer li {
  text-align: left;
}

/* weight */
body.weight {
  background-color: white;
}

.weight {
  /* weight-section */
  /* graph-section */
  /* average-section */
  /* divider */
  /* list-section */
}

.weight .weight-section {
  background-color: white;
  padding: 31px 18px 16px 18px;
  text-align: center;
}

.weight .weight-section .date-selector-container {
  position: relative;
  height: 48px;
  border-radius: 10px;
  background-color: #f2f4fb;
}

.weight .weight-section .date-selector-container .button-item {
  position: absolute;
  padding: 7px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

.weight .weight-section .date-selector-container .prev-item {
  left: 0px;
}

.weight .weight-section .date-selector-container .next-item {
  right: 0px;
}

.weight .weight-section .date-selector-container .date-item {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.4px;
}

.weight .graph-section {
  background-color: #fff;
  margin-top: 22px;
}

.weight .graph-section .updated-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 22px 16px 5px 11px;
  border-bottom: solid 1px #e9edf0;
}

.weight .graph-section .updated-area .date-item {
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #686b73;
}

.weight .graph-section .updated-area .unit-item {
  margin-left: auto;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.4px;
  color: #c7cad1;
}

.weight .graph-section .graph-area {
  position: relative;
  pointer-events: none;
}

.weight .graph-section .graph-area .balloon {
  position: absolute;
  width: 74px;
  padding: 2px;
  border-radius: 5px;
  background-color: #f2f4fb;
  z-index: 1;
}

.weight .graph-section .graph-area .balloon::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 50%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #f2f4fb;
}

.weight .graph-section .graph-area .balloon .kg-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.25px;
  text-align: center;
  color: #686b73;
}

.weight .graph-section .graph-area .balloon .date-item {
  font-size: 12px;
  letter-spacing: -0.2px;
  text-align: center;
  color: #686b73;
}

.weight .graph-section .graph-area #chart {
  height: 255px !important;
}

.weight .graph-section .graph-area #chart2 {
  height: 287px !important;
}

.weight .graph-section .graph-area .x-label-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px 5px 15px 5px;
}

.weight .graph-section .graph-area .x-label-area .label-item {
  font-weight: 400;
  font-size: 12px;
  color: #686b73;
}

.weight .graph-section .graph-area .x-label-area .end-item {
  margin-left: auto;
}

.weight .graph-section .graph-area .bubble-area {
  display: none;
  position: absolute;
}

.weight .graph-section .graph-area .bubble {
  padding: 7px;
  background-color: #5653ff;
  border-radius: 10px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.47px;
  text-align: center;
  color: white;
}

.weight .graph-section .graph-area .bubble::after {
  position: absolute;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  bottom: 0px;
  left: 10%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
  background-color: #5653ff;
}

.weight .graph-section .graph-area .bubble span {
  font-weight: bold;
}

.weight .graph-section .graph-area .bubble-area.grey .bubble {
  background-color: #dbe0e4;
  color: #363b41;
  /* border: solid 1px rgb(156 161 165); */
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.5);
}

.weight .graph-section .graph-area .bubble-area.grey .bubble::after {
  left: 11%;
  bottom: 0px;
  background-color: #dbe0e4;
  -webkit-box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
          box-shadow: 0 2px 5px 0 rgba(156, 161, 165, 0.1);
}

.weight .graph-section .graph-area .bubble-area.right .bubble::after {
  left: auto;
  right: 5%;
  transform: translate(-50%, 50%) rotate(-45deg);
  -ms-transform: translate(-50%, 50%) rotate(-45deg);
  -webkit-transform: translate(-50%, 50%) rotate(-45deg);
  -moz-transform: translate(-50%, 50%) rotate(-45deg);
}

.weight .graph-section .section-divider {
  height: 1px;
  background-color: #e6e8f2;
}

.weight .graph-section .average-area .day-item {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.47;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 15px;
}

.weight .graph-section .average-area .count-item {
  font-size: 36px;
  font-weight: bold;
  color: #080808;
  text-align: center;
}

.weight .graph-section .average-area .count-item > span {
  font-size: 14px;
}

.weight .graph-section .average-area .section-divider {
  width: calc(100% - 32px);
  height: 1px;
  background-color: #e6e8f2;
  margin: 20px auto 0;
}

.weight .graph-section .average-area .info-wrapper {
  width: calc(100% - 32px);
  margin: 20px auto 0px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.weight .graph-section .average-area .info-wrapper .calory {
  width: 50%;
  border-right: 1px solid #e6e8f2;
}

.weight .graph-section .average-area .info-wrapper .distance {
  width: 50%;
}

.weight .info-wrapper .text-item {
  font-size: 14px;
  color: #36434c;
  letter-spacing: -0.47px;
}

.weight .info-wrapper .number-item {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: -0.24px;
  color: #363b41;
}

.weight .info-wrapper .number-item .ic-img {
  width: 10px;
  height: 10px;
  margin-bottom: 2px;
}

.weight .info-wrapper .number-item .unit {
  font-size: 12px;
  font-weight: bold;
  letter-spacing: -0.13px;
  color: #363b41;
}

.weight .graph-section .average-area .thick-divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 18px;
}

.weight .average-section {
  text-align: center;
}

.weight .average-section .title-item {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
  text-align: center;
  color: #363b41;
  margin-top: 26px;
}

.weight .average-section .time {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: -0.24px;
  text-align: center;
  color: #080808;
}

.weight .average-section .time .unit {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
}

.weight .average-section .sleep-divider {
  font-size: 14px;
  line-height: 1.57;
  letter-spacing: normal;
  height: 6px;
  background-color: #e9edf0;
  margin-top: 36px;
}

.weight .divider {
  height: 6px;
  background-color: #e9edf0;
  margin-top: 23px;
}

.weight .list-section {
  background-color: #fff;
  padding-bottom: 34px;
}

.weight .list-section .list-header {
  background-color: #f5f8fd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 14px 0;
}

.weight .list-section .list-header .ic-img {
  width: 15px;
  height: 15px;
}

.weight .list-section .list-header .text-item {
  margin-left: 3px;
  font-size: 12px;
  color: #686b73;
}

.weight .list-section .list-header .igrip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 6px;
}

.weight .list-section .list-header .direct {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 6px;
}

.weight .list-section .list-header .healthcare {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 6px;
}

.weight .list-section .list-header .external {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 15px;
}

.weight .list-section .weight-list .list-item {
  height: 75px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 10px 0 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #e9edf0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.weight .weight-list .list-item .date {
  margin-left: 24px;
}

.weight .weight-list .list-item .date .days {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: -0.4px;
}

.weight .weight-list .list-item .date .days p {
  color: #363b41;
}

.weight .weight-list .list-item .date .days .ic-img {
  width: 19px;
  height: 19px;
  margin-left: 7px;
}

.weight .weight-list .list-item .date .time p {
  font-size: 14px;
  color: #697279;
}

.weight .weight-list .list-item .date .achieve {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.23px;
  color: #5653ff;
  padding: 1px 7px 2px;
  border-radius: 5px;
  background-color: #eeeefa;
  margin-left: 7px;
  display: none;
}

.weight .weight-list .list-item .record {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 14px;
  margin-right: 24px;
}

.weight .weight-list .list-item .record.up .diff {
  color: #ff5151;
}

.weight .weight-list .list-item .record.down .diff {
  color: #5653ff;
}

.weight .weight-list .list-item .record.same .diff {
  color: #686b73;
}

.weight .weight-list .list-item .record .count {
  font-size: 14px;
  text-align: right;
  color: #697279;
}

.weight .weight-list .list-item .record .count .ic-img {
  width: 8px;
  height: 8px;
}

.weight .weight-list .list-item .record .count .diff {
  margin-left: 4px;
}

.weight .weight-list .list-item .record .while {
  position: relative;
  font-size: 17px;
  font-weight: bold;
  color: #080808;
  text-align: right;
  letter-spacing: -0.45px;
  margin-left: 11px;
  width: 70px;
}

.weight .weight-list .list-item .record .ic-more {
  position: absolute;
  top: 0;
  right: -29px;
}

/* writing */
.writing .contents-wrapper {
  position: relative;
  padding-top: 17px;
}

.writing .contents-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  height: 48px;
}

.writing .contents-header::before {
  content: "";
  background: url("../images/icon_close.svg") no-repeat;
  background-size: contain;
  width: 30px;
  height: 30px;
  position: absolute;
  display: block;
  right: 16px;
}

.writing .contents-header p {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.45px;
  text-align: center;
}

.writing .contents-body {
  margin: 14px 16px 12px;
}

.writing .item-wrapper {
  padding: 23px 0 24px;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
          box-shadow: 0 1px 4px 2px rgba(96, 110, 170, 0.06);
  background-color: #ffffff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}

.writing .writing-area {
  padding: 0 20px;
  width: calc(100% - 40px);
  min-height: 350px;
  resize: none;
  font-size: 14px;
  line-height: 1.64;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.writing .writing-area::-webkit-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.writing .writing-area:-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.writing .writing-area::-ms-input-placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.writing .writing-area::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  letter-spacing: normal;
  color: #c7cad1;
  font-family: "Spoqa Han Sans", "sans-serif";
}

.writing .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.writing .upload-container {
  margin: 22px 19px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.writing .upload-container input[type="file"] {
  display: none;
}

.writing .upload-button-box {
  border-radius: 8px;
  border: solid 1px #e6e8f2;
  width: 80px;
  height: 80px;
  min-width: 80px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.writing .upload-box + .thumbnail {
  display: none;
}

.writing .upload-box.active {
  display: none;
}

.writing .upload-box.active + .thumbnail {
  display: block;
}

.writing .upload-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  white-space: nowrap;
  cursor: pointer;
  padding: 22px 18px 20px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.2px;
  text-align: center;
  color: #4b5158;
}

.writing .upload-button::before {
  content: "";
  background: url("../images/icon_camera.svg") no-repeat;
  background-size: contain;
  display: block;
  width: 30px;
  height: 20px;
}

.writing .thumbnail {
  position: relative;
}

.writing .thumbnail .close {
  position: absolute;
  right: -5px;
  top: -5px;
  width: 20px;
  height: 20px;
}

.writing .thumbnail-img {
  width: 100%;
  height: 100%;
  border-radius: 8px;
}

.writing .file-desc {
  margin-left: 18px;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #c7cad1;
  word-break: break-all;
}

.writing .file-desc > p {
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #686b73;
}

.writing .button-area {
  margin-top: 32px;
}

.writing .button-area button {
  padding: 16px 0 16px;
  width: 100%;
  border-radius: 10px;
  background-color: #dbe0e4;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #686b73;
}

.writing .button-area button.active {
  background-color: #5653ff;
  color: #ffffff;
}

.agree-contents {
  font-size: 12px;
}

.agree-contents * {
  margin: 0;
  padding: 0;
  font-size: 12px !important;
}

.agree-contents dl {
  margin: 0;
  padding: 0;
  margin-bottom: 20px;
}

.agree-contents dl dt {
  margin: 0 0 10px 0;
  padding: 0 0 10px 0;
  font-size: 16px !important;
  line-height: 18px;
  border-bottom: 1px solid #eee;
}

.agree-contents dl dd > ul > li {
  padding: 10px 0 10px 0;
}

.agree-contents__title {
  padding: 5px 0;
  font-size: 14px !important;
}

.agree-contents dl dd > ul > li > ol > li {
  padding: 3px 0;
}

.agree-contents dl dd > ul > li > ol > li > ol {
  padding: 0 0 0 10px;
}

.agree-contents dl dd > ul > li > ol > li > ol > li {
  padding: 3px 0;
}

@-webkit-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadein {
  -webkit-animation: fadein 1s;
          animation: fadein 1s;
}

body.information {
  background: #fff;
}

.information {
  background: #fff;
}

.information__accordion {
  margin: -20px -10px 0 -10px;
}

.information__accordion-title {
  position: relative;
  min-height: 42px;
  padding: 14px 24px 12px 24px;
  border-bottom: 1px solid #e6e8f2;
}

.information__accordion-title p {
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: -0.4px;
  color: #080808;
  font-weight: bold;
}

.information__accordion-title p strong {
  color: #5653ff;
}

.information__accordion-title span {
  font-size: 12px;
  color: #a4a9b3;
}

.information__accordion-title::after {
  content: "";
  display: block;
  position: absolute;
  top: 24px;
  right: 24px;
  width: 18px;
  height: 18px;
  background: url(../images/arrow.png) no-repeat 50% 50%;
  background-size: 18px 18px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.information__accordion-title.ui-accordion-header-active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.information__accordion-contents {
  padding: 14px 24px;
  border-bottom: 1px solid #e6e8f2;
}

.information__accordion-contents ol,
.information__accordion-contents ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.information__accordion-contents img {
  width: 100%;
  margin: 10px 0;
}

.information__accordion-contents p {
  margin: 10px 0;
}

.information__accordion-contents table {
  width: 100%;
  border: 1px solid #a4a9b3;
  border-collapse: collapse;
}

.information__accordion-contents table th,
.information__accordion-contents table td {
  padding: 5px;
  font-size: 12px;
  text-align: center;
  border: 1px solid #a4a9b3;
}

.information__accordion-contents table th {
  background: #eee;
}

.information .tab-area .divider {
  margin-top: -1px;
  height: 1px;
  background-color: #e6e8f2;
  z-index: -1;
}

.information .tab-area .tab-content {
  display: none;
  padding: 20px 10px 0 10px;
}

.information .tab-area .tab-content-active {
  display: block;
}

.information__inner {
  padding: 0 15px;
  background: #fff;
}

.information hr {
  height: 1px;
  margin: 20px 0;
  border: 0;
  border-top: 1px solid #e6e8f2;
}

.information__title {
  padding-bottom: 5px;
  font-size: 17px;
  color: #080808;
  letter-spacing: -0.45px;
  font-weight: bold;
}

.information__text {
  font-size: 14px;
  line-height: 21px;
  color: #686b73;
  letter-spacing: -0.4px;
}

.information__list ul li {
  list-style: none;
  margin-bottom: 10px;
}

.information__list ul li strong {
  font-size: 14px;
  color: #5653ff;
  letter-spacing: -0.4px;
}

.information__list ul li p {
  padding-top: 3px;
  font-size: 14px;
  line-height: 21px;
  color: #686b73;
  letter-spacing: -0.4px;
}

.information__map {
  position: relative;
  margin: 20px -25px 0;
}

.information__map > img {
  width: 100%;
}

.information__map-item {
  position: absolute;
}

.information__map-item p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 28px;
  font-size: 13px;
  letter-spacing: -0.16px;
  color: #fff;
  font-weight: bold;
}

.information__map-item p strong {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  background: #fff;
  border-radius: 100%;
  font-size: 14px;
  color: #5653ff;
}

.information__map-item--a {
  left: 53%;
  top: 16%;
  width: 214px;
  height: 36px;
  background: url(../images/contents_bubble_long.svg) no-repeat 50% 50%;
}

.information__map-item--b {
  left: 21%;
  top: 61%;
  width: 169px;
  height: 36px;
  background: url(../images/contents_bubble_shout.svg) no-repeat 50% 50%;
}

.help {
  background-color: #f5f8fd;
}

.help .title {
  font-size: 22px;
  text-align: center;
  line-height: 32px;
  letter-spacing: -0.67px;
  padding-top: 52px;
  color: #363b41;
  font-weight: 400;
  padding-bottom: 20px;
}

.help .title strong {
  color: #080808;
}

.help-slide .swiper-container {
  width: 100%;
  height: 100%;
}

.help-slide .swiper-slide {
  text-align: center;
  font-size: 18px;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.help-slide .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* swiper 수정 start*/
.help-slide {
  position: relative;
}

.help-slide .swiper-container {
  padding-bottom: 2vh;
}

.help-slide .swiper-slide img {
  width: auto;
  height: calc(100vh - 100px);
}

.help-slide .swiper-button-next.swiper-button-disabled,
.help-slide .swiper-button-prev.swiper-button-disabled {
  opacity: 1;
}

.help-slide .swiper-slide {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.help-slide .swiper-slide img {
  margin-top: -5vh;
}

.help-slide .swiper-button-next,
.help-slide .swiper-button-prev {
  top: auto;
  bottom: 0;
  z-index: 20;
}

.help-slide .swiper-button-next,
.help-slide .swiper-button-prev {
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}

.help-slide .swiper-button-next {
  background-image: url("../images/help/icon2Right.png");
}

.help-slide .swiper-button-prev {
  background-image: url("../images/help/icon2Left.png");
}

.help-slide .swiper-button-next::after,
.help-slide .swiper-button-prev::after {
  display: none;
}

.help-slide .swiper-pagination {
  text-align: left;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.4px;
  top: 20px;
  left: 20px;
}

/* swiper 수정 end*/
.homeindicator {
  width: 134px;
  margin: 44px auto 8px auto;
  height: 5px;
  background-color: #000;
  border-radius: 100px;
}