@import url(reset.css);
/****************************************/
/*Name: 핏고잉
/*Version: 1.0
/*Author: 
/****************************************/

/***************************
        input reset
***************************/
/* IE */
select::-ms-expand { 
	display: none;
}
select {
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
}
input{padding:0;border: none;border-radius: 0;-webkit-appearance: none;-moz-appearance: none;appearance: none;background: transparent;font-family: 'Pretendard', 'Poppins', 'dotum', '돋움';}
input:focus {outline: none;-webkit-box-shadow: none;box-shadow: none;}
textarea,
input[type='text'],
input[type='email'],
input[type='number'],
input[type='password']{font-size:4.1vw;line-height:7.69vw;color:#222;font-weight: 400;box-sizing: border-box;}
/* input[type='text']:invalid,
input[type='number']:invalid,
input[type='email']:invalid,
input[type='password']:invalid{outline:1px solid #ED5959;}
input[type='text'].error,
input[type='number'].error,
input[type='email'].error,
input[type='password'].error{outline:1px solid #ED5959;}
*/
input[type='text'][disabled],
input[type='email'][disabled],
input[type='number'][disabled],
input[type='password'][disabled]{color:#A7ADBB;}
input:focus,
textarea:focus{}
textarea::placeholder,
input::placeholder,
textarea::placeholder {color:#A7ADBB;}
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color:#A7ADBB;}
textarea::-ms-input-placeholder,
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {color:#A7ADBB;}
/* .iptCon .iptBox{position: relative;}
.iptCon .iptBox input {padding-bottom:2.05vw;padding-right: 8.2vw;width:100%;}
.iptCon .iptBox .btnDel{position: absolute;top: 1.28vw;right: 0;width: 5.128vw;height:5.128vw;background: url(../img/ico_btn_del.png)no-repeat 0 0;background-size:100%;border: none;outline: none;cursor: pointer;display: none;}
.iptCon label{margin-bottom: 1vw;display: block;}
.iptCon label span{font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;}
.iptCon.star label span::after{content: '*';color: #50CD98;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;margin-left: 0.5vw;}
.iptCon .iptBox + .subTxt{margin-top:2.05vw;} */
.h1 + .iptCon{margin-top:8.2vw;}
.iptCon + .iptCon{margin-top:8.2vw;}
.stepH + .iptCon{margin-top:8.2vw;}
.stepH + .stepH{margin-top:8.2vw;}
.iptCon .iptBox{position: relative;display: flex;border-bottom:1px solid #DEE4EE;justify-content: space-between;align-items: flex-start;}
.iptCon .iptBox.on{border-bottom:1px solid #50CD98;}
.iptCon .iptBox.error{border-bottom:1px solid #F27C63;}
.iptCon .iptBox.txtArea{border:none;}
.iptCon .iptBox .flexBox{position: relative;}
.iptCon .iptBox .flexBox:first-child{flex-grow: 1;min-width: 0;}
.iptCon .iptBox input {padding-bottom:2.05vw;padding-right: 6.15vw;width:100%;}
.iptCon .iptBox input::before{content:'';position: absolute;bottom:0;left:0;width: 100%;}
.iptCon .iptBox .btnDel{position: absolute;top: 1.28vw;right: 0;width: 5.128vw;height:5.128vw;background: url(../img/ico_btn_del.png)no-repeat 0 0;background-size:100%;border: none;outline: none;cursor: pointer;display: none;}
input[type='text'][disabled] + .btnDel,
input[type='email'][disabled] + .btnDel,
input[type='number'][disabled] + .btnDel,
input[type='password'][disabled] + .btnDel{display: none !important;}
.iptCon .iptBox .btnIpt{padding:1vw 3.1vw;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;border-radius: 2vw;background: #E4E8F1;color:#A7ADBB;margin-left: 2vw;}
.iptCon .iptBox .btnIpt{background:#E3F6F3;color: #50CD98;}
.iptCon .iptBox .unit{font-size: 4vw;line-height: 7.69vw;margin-left: 2vw;color:#6D7B85;white-space: nowrap;word-break: keep-all;flex-shrink: 0;}
.iptCon .iptBox .unit.gM{font-size: 3.589vw;}
.iptCon label{margin-bottom: 1vw;display: block;}
.iptCon label span{font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;}
.iptCon.star label span::after{content: '*';color: #50CD98;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;margin-left: 0.5vw;}
.iptCon label.flexBox{display: flex;}
.iptCon label.flexBox .txtCntBox{display: flex;}
.iptCon label.flexBox .txtCntBox span:first-child{font-size: 3vw;line-height: 5.128vw;font-family: 'gSans';font-weight: 400;}
.iptCon label.flexBox .txtCntBox span:last-child{font-size: 3vw;color:#A7ADBB;line-height: 5.128vw;font-family: 'gSans';font-weight: 400;}
.iptCon .iptBox + .subTxt{margin-top:2.05vw;}
.iptCon .iptBox.password{overflow: hidden;}
.iptCon .iptBox.password input{color: transparent;}
.iptCon .iptBox.password .dotPassBox{display: flex;gap: 1.28vw;position: absolute;top: 3vw;left: 0;pointer-events: none;}
.iptCon .iptBox.password .dotPassBox .dotPass {width: 2.56vw;height: 2.56vw;background-color:#222;border-radius: 50%;}

.iptCon.time{display: flex;align-items: center;}
.iptCon.time .colon{width: 15.89vw;height: 6.15vw;background:url(../img/ico_colon.png)no-repeat center;background-size: 6.15vw;margin:0 4.87vw;}

.iptCon select{border:none;width: 100%;color:#6D7B85;font-family:'Pretendard','Poppins','dotum','돋움';font-size: 4.1vw;line-height: 7.69vw;}
.iptCon select.on{color:#222;}

.iptCon textarea{border:1px solid #DEE4EE;border-radius: 4vw;width: 100%;text-align: left;padding:4vw 5.128vw;font-family:'Pretendard','Poppins','dotum','돋움';font-size: 4.1vw;line-height: 7.69vw;color:#6D7B85;outline: none;}


.searchBox .iptCon .iptBox{border-bottom: 0;border:2px solid #000;border-radius: 15.38vw;padding-left: 11.28vw;background:#fff url(../img/ico_search.png)no-repeat left 4vw center;background-size: 6.15vw;}
.searchBox .iptCon .iptBox input{padding:3vw 0;line-height: 6.15vw;padding-right: 10.25vw;}
.searchBox .iptCon .iptBox .btnDel{right: 4vw;top:50%;margin-top:-2.564vw;}

/***************************
    체크박스 & 라디오박스
***************************/
.checkBox{position: relative;}
.checkBox input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.checkBox input[type="checkbox"] + label {display: inline-block;position: relative;padding-left: 9.23vw;cursor: pointer;outline:none !important;width: 100%;}
.checkBox input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;background:url(../../static/img/ico_check_g.png)no-repeat center center;background-size:3.84vw 2.9vw;}
.checkBox input[type="checkbox"]:checked + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;background:url(../../static/img/ico_check_on.png)no-repeat center center;background-size:3.84vw 2.9vw;}
.checkBox input[type="checkbox"] + label span {font-weight: 500;font-size: 4.1vw;line-height: 6.15vw;color:#6D7B85;}
.checkBox .checkAll{padding:5.128vw;border:1px solid #DEE4EE;border-radius: 4.1vw;}
.checkBox .checkAll input[type="checkbox"] + label span{color:#222;font-weight: 700;line-height: 6.15vw;}
.checkBox .checkAll input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;border-radius: 2vw;background:#D4D8E1 url(../../static/img/ico_check_w.png)no-repeat center center;background-size:3.33vw 2.39vw;}
.checkBox .checkAll.checked{border:1px solid #3DD18A;box-shadow: 0px 2.56vw 5.128vw 0px rgba(42, 89, 117, 0.18);}
.checkBox .checkAll input[type="checkbox"]:checked + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;border-radius: 2vw;background:#3DD18A url(../../static/img/ico_check_w.png)no-repeat center center;background-size:3.33vw 2.39vw;}
.checkBox.square input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;border-radius: 2vw;background:#D4D8E1 url(../../static/img/ico_check_w.png)no-repeat center center;background-size:3.33vw 2.39vw;}
.checkBox.square input[type="checkbox"]:checked + label:before {content: "";position: absolute;left: 0;top: 0;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;border-radius: 2vw;background:#3DD18A url(../../static/img/ico_check_w.png)no-repeat center center;background-size:3.33vw 2.39vw;}
.iptCon + .checkBox.square{margin-top:6.15vw;}

.checkBox.toggle input[type="checkbox"]{position: relative;display: block;width: 12.3vw;height: 7.179vw;background-color: #DCE3F2;border-radius: 46.15vw;cursor: pointer;transition: background-color 0.3s ease;}
.checkBox.toggle input[type="checkbox"] + label{position: absolute;top:0;left: 0;height: 100%;padding-left:0;}
.checkBox.toggle input[type="checkbox"] + label::before {content: "";position: absolute;top: 50%;left: 0.5vw;width: 6.15vw;height: 6.15vw;border-radius: 50%;transition: transform 0.3s ease;background:none;background-color: #fff;margin-top: -3.075vw;}
.checkBox.toggle input[type="checkbox"]:checked{background-color:#3DD18A;}
/* .checkBox.toggle input[type="checkbox"]:checked + label {background-color: #3DD18A;} */
.checkBox.toggle input[type="checkbox"]:checked + label::before {transform: translateX(4.6vw);}

.checkBox.toggle .checkAll{padding:0;border:none;border-radius: none;}
.checkBox.toggle .checkAll input[type="checkbox"] + label span{color:#222;font-weight: 700;line-height: 6.15vw;}
.checkBox.toggle .checkAll input[type="checkbox"] + label:before {content: "";position: absolute;top: 50%;left: 0.5vw;width: 6.15vw;height: 6.15vw;border-radius: 50%;transition: transform 0.3s ease;background:none;background-color: #fff;margin-top: -3.075vw;}
.checkBox.toggle .checkAll.checked{border:none;box-shadow:none;background-color:#3DD18A;}
.checkBox.toggle .checkAll input[type="checkbox"]:checked + label:before {content: "";position: absolute;top: 50%;left: 0.5vw;width: 6.15vw;height: 6.15vw;text-align: center;box-sizing: border-box;border-radius:50%;background: none;transform: translateX(4.6vw);background-color: #fff;}

.checkBox.only input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.checkBox.only input[type="checkbox"] + label {display: inline-block;position: relative;cursor: pointer;outline:none !important;width: 9.23vw;height:9.23vw;}
.checkBox.only input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 9.23vw;height: 9.23vw;text-align: center;box-sizing: border-box;background:url(../../static/img/ico_check_g02.png)no-repeat center center;background-size:3.84vw 2.9vw;border:1px solid #DEE4EE;border-radius: 3vw;}
.checkBox.only input[type="checkbox"]:checked + label:before {content: "";position: absolute;left: 0;top: 0;width: 9.23vw;height: 9.23vw;text-align: center;box-sizing: border-box;background:rgba(80, 205, 152, 0.15) url(../../static/img/ico_check_on02.png)no-repeat center center;background-size:3.84vw 2.9vw;border:none;}
.checkBox.only input[type="checkbox"] + label span {display: inline-block;text-indent: -99999px;}

.checkBox.bookmark input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.checkBox.bookmark input[type="checkbox"] + label {display: inline-block;position: relative;cursor: pointer;outline:none !important;width: 5.128vw;height:5.128vw;padding-left: 0;}
.checkBox.bookmark input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 1vw;width: 5.128vw;height: 5.128vw;text-align: center;box-sizing: border-box;background:url(../../static/img/ico_bookmark.png)no-repeat center top;background-size:3.589vw 4vw;}
.checkBox.bookmark input[type="checkbox"]:checked + label:before {content: "";position: absolute;left: 0;top: 0;width: 5.128vw;height: 5.128vw;text-align: center;box-sizing: border-box;background:url(../../static/img/ico_bookmark_on.png)no-repeat center center;background-size:3.589vw 4vw;}
.checkBox.bookmark input[type="checkbox"] + label span {display: inline-block;text-indent: -99999px;}

.radioTxtBox{display: flex;}
.radioTxtBox > div{width: 100%;}
.radioTxtBox > div + div{margin-left: 2.56vw;}
.radioTxtBox input[type="radio"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.radioTxtBox input[type="radio"] + label {display: inline-block;position: relative;cursor: pointer;width:100%;height:12.8vw;line-height: 12.8vw;background:#fff;border-radius: 3vw;text-align: center;color:#A7ADBB;box-sizing: border-box;margin-bottom: 0;border:1px solid #DEE4EE;}
.radioTxtBox input[type="radio"] + label span{font-weight: 500;}
.radioTxtBox input[type="radio"]:checked + label{border:1px solid #3DD18A;background:rgba(80, 205, 152, 0.1);}
.radioTxtBox input[type="radio"]:checked + label span {color:#3DD18A;}

.certiList .radioLineBox{display: flex;flex-wrap: wrap;width:calc(100% + 3.076vw);margin-left: -1.538vw;}
.certiList .radioLineBox > div{width: calc((100%/3) - 3.076vw);margin:1.538vw;}
.certiList .radioLineBox input[type="radio"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
.certiList .radioLineBox input[type="radio"] + label {position: relative;cursor: pointer;width:100%;min-height:27.179vw;line-height: 12.8vw;background:#fff;border-radius: 4vw;text-align: center;color:#A7ADBB;box-sizing: border-box;margin-bottom: 0;border:1px solid #DEE4EE;display: flex;align-items: center;justify-content: center;}
.certiList .radioLineBox input[type="radio"] + label span{font-weight: 500;font-size: 3.589vw;line-height: 5.64vw;padding-top:11.28vw;display: block;min-width: 10.256vw;}
.certiList .radioLineBox input[type="radio"]:checked + label{border:1px solid #3DD18A;box-shadow: 0px 2.56vw 5.12vw 0px rgba(42, 89, 117, 0.18);}
.certiList .radioLineBox input[type="radio"]:checked + label span {}

.certiList .radioLineBox .kakao label span{background:url(../img/bodyAge/ico_kakao.png)no-repeat center top;background-size: 10.256vw;}
.certiList .radioLineBox .naver label span{background:url(../img/bodyAge/ico_naver.png)no-repeat center top;background-size: 10.256vw;}
.certiList .radioLineBox .kb label span{background:url(../img/bodyAge/ico_kb.png)no-repeat center top;background-size: 10.256vw;}
.certiList .radioLineBox .pass label span{background:url(../img/bodyAge/ico_pass.png)no-repeat center top;background-size: 10.256vw;}
.certiList .radioLineBox .payco label span{background:url(../img/bodyAge/ico_payco.png)no-repeat center top;background-size: 10.256vw;}
.certiList .radioLineBox .samsung label span{background:url(../img/bodyAge/ico_samsung.png)no-repeat center top;background-size: 10.256vw;}




/***************************
    selectBox Custom
***************************/
.selBox * { box-sizing: border-box; }
.selBox {position: relative;z-index: 1;height: 9.74vw;border-bottom: 1px solid #DEE4EE;cursor: pointer;box-sizing: border-box;}
.selBox:before {content: '';position: absolute;right:0;top: 3.07vw;width:2.05vw;height:1.538vw;background: url(../img/ico_select.svg) 0 0 no-repeat;background-size: 100% auto;transition: all 0.4s;}
.selBox .label {display: flex;width:100%;font-size:4.1vw;height: 7.69vw;line-height:7.69vw;padding:0;border: 0 none;outline: 0 none;background: transparent;cursor: pointer;color:#222;}
.selBox .label.first{color:#6D7B85;}
.selBox .selOptBox{position: absolute;background:#fff;box-shadow: 3.58vw 4.35vw 15.38vw 0px rgba(34, 79, 106, 0.24);border-radius: 4.1vw;z-index: 10;padding:3.07vw;top: 13.33vw;display: none;right:0;}
.selBox .selOptBox.up{position: absolute;background:#fff;box-shadow: 3.58vw 4.35vw 15.38vw 0px rgba(34, 79, 106, 0.24);border-radius: 4.1vw;z-index: 10;padding:3.07vw;top:auto;bottom:60vw;display: none;right:0;}
.selBox .selOpt .selItem{font-size: 4.1vw;line-height: 6.15vw;padding:3.07vw 3.07vw;border-radius: 3.07vw;color:#6D7B85;}
.selBox .selOpt .selItem.active{background:#F3F4F6;}
.selBox.active:before{transform: rotate(-180deg);}
.selBox .selOpt .selItem + .selItem {margin-top:1vw;}
.iptBox .selBox{width: 100%;border-bottom: none;}
.iptBox .selBox .selOptBox{width: 100%;}
.selBox.sm{min-width:26.66vw;width:auto;}
.selBox.sm .label{padding-right: 9.23vw;}
.selBox.sm .selOptBox{min-width: 33.84vw;}


/***************************
        테이블 커스텀
***************************/
.tableBox{position: relative;padding-top:1px;}
.tableBox::before{content: '';position: absolute;height:100%;left:0;width:100%;top:0;border-top:1px solid #D9D9D9;border-bottom: 1px solid #D9D9D9;z-index: 1;}
.tableBox table {position: relative;z-index: 2;}
.tableBox table thead tr th{padding:3vw 5.128vw;font-weight: 700;border-left:1px solid #D9D9D9;background: #F6F8F9;}
.tableBox table thead tr th:first-child{border-left: 0;}
.tableBox table tbody tr td{border-top:1px solid #D9D9D9;border-left:1px solid #D9D9D9;padding:4.1vw;vertical-align: middle;}
.tableBox table tbody tr td:first-child{border-left: 0;}
.tableBox table tbody tr td.th{text-align: center;font-weight: 700;padding:4.1vw;}

/***************************
    font size
***************************/
body{min-height: 100vh;}
.h1{font-size: 7.179vw;line-height: 10.7vw;font-weight: 700;}
.h2{font-size:6.15vw;line-height: 8.7vw;font-weight: 700;}
.h3{font-size:5.64vw;line-height: 8.2vw;font-weight: 700;}
.fs1{font-size: 4.1vw;line-height: 6.15vw;}
.fs2{font-size: 5.1vw;line-height: 7.69vw;}
.fs3{font-size: 4.6vw;line-height: 7.179vw;}
.fs4{font-size: 3.589vw;line-height: 5.64vw;}
.fs5{font-size: 3vw;line-height: 5.128vw;}
.fs6{font-size: 2.8vw;line-height: 2;}
.fs7{font-size: 3.84vw;line-height: 6.15vw;}
.fwR{font-weight: 400 !important;}
.fwM{font-weight: 500 !important;}
.fwB{font-weight: 700 !important;}

/********** 공통 ***********/
.container{}
.container.noH .wrap{padding-top:16.4vw;}
.container.tabP .wrap{padding-top:21.5vw;}
.container.calP .wrap{padding-top:15.38vw;}
.container .wrap{padding:0 6.15vw;padding-bottom:16.4vw;min-height:100vh;overflow: hidden;}
.gL{font-family: 'gSans';font-weight: 300;}
.gM{font-family: 'gSans';font-weight: 500;}
.gB{font-family: 'gSans';font-weight: 700;}
section{width:100%;position:relative;}
.flexBox{display: flex;}
.flexGrow{flex-grow: 1;}
.spBt{justify-content: space-between;}
.jsC{justify-content: center;}
.agC{align-items: center;}
.jsE{justify-content: flex-end;}
.stickyCon{position: sticky;top:0;}
.conC{display: flex;flex-direction: column;justify-content: center;}
.txtC{text-align: center;}
.disN{display: none !important;}
.pR{position: relative !important;}
.fullW{width: calc(100% + 12.3vw);margin-left: -6.15vw;}
.bgTxt{width:100%;padding:4vw 5.12vw;background: #F3F4F6;border-radius: 4vw;text-align: center;}
.bgTxt p{color:#6D7B85;}

/***************************
            간격
***************************/
.mb4{margin-bottom: 1vw !important;}
.mb8{margin-bottom: 2vw !important;}
.mb12{margin-bottom: 3vw !important;}
.mb16{margin-bottom: 4.1vw !important;}
.mb20{margin-bottom: 5.1vw !important;}
.mb24{margin-bottom: 6.15vw !important;}
.mb28{margin-bottom: 7.179vw !important;}
.mb32{margin-bottom: 8.2vw !important;}
.mb36{margin-bottom: 9.2vw !important;}
.mb40{margin-bottom: 10.25vw !important;}

.mt2{margin-top: 0.5vw !important;}
.mt4{margin-top: 1vw !important;}
.mt8{margin-top: 2vw !important;}
.mt12{margin-top: 3vw !important;}
.mt16{margin-top: 4.1vw !important;}
.mt20{margin-top: 5.1vw !important;}
.mt24{margin-top: 6.15vw !important;}
.mt28{margin-top: 7.179vw !important;}
.mt32{margin-top: 8.2vw !important;}
.mt36{margin-top: 9.2vw !important;}
.mt40{margin-top: 10.25vw !important;}

.mr4{margin-right: 1vw !important;}

.ml12{margin-left: 3vw !important;}

.pt0{padding-top: 0 !important;}
.pt16{padding-top: 4vw !important;}



.pb0{padding-bottom: 0 !important;}

/***************************
            색상
***************************/
.cGreen{color:#3DD18A !important;}
.cGray{color:#6D7B85 !important;}
.cGray02{color:#A7ADBB !important;}
.cOrange{color:#F27C63 !important;}
.cBlue{color:#4CA8F9 !important;}
.cBk{color:#222 !important;}
.bgGray{background:#F3F4F6;}
.bgGray02{background:#F8FAFF;}
.bgGreen{background:#F0FFF2;}



/***************************
            header
***************************/
header{position:fixed;width:100%;top:0;left:0;min-height: 15.38vw;background:#fff;z-index: 101;box-shadow: 0px 1vw 2vw 0px rgba(0, 0, 0, 0.05);}
header .headerWrap{display: flex;position: relative;justify-content: space-between;padding:5.12vw 6.15vw;}
header .headerWrap .btn.back{width:5.12vw;height: 5.12vw;position: relative;z-index: 2;}
header .headerWrap .btn.back a{display: block;background: url(../img/ico_header_back.png)no-repeat 0 0;width:100%;height: 100%;background-size: 100% auto;}
header .headerWrap .btn.back a span{display: inline-block;text-indent: -99999px;}
header .headerWrap .rBox{display: flex;position: relative;z-index: 2;}
header .headerWrap .rBox .alrm{width:5.128vw;height: 5.128vw;}
header .headerWrap .rBox .alrm a{display: block;width: 100%;height: 100%;background:url(../img/ico_alrm.png)no-repeat 0 0;background-size: 100% auto;}
header .headerWrap .rBox .alrm a span{display: inline-block;text-indent: -99999px;}
header .headerWrap .rBox .menu{width:5.128vw;height: 5.128vw;margin-left:5.128vw;}
header .headerWrap .rBox .menu a{display: block;width: 100%;height: 100%;background:url(../img/ico_menu.png)no-repeat 0 0;background-size: 100% auto;}
header .headerWrap .rBox .menu a span{display: inline-block;text-indent: -99999px;}
header .headerWrap .pageTit{position: absolute;width:100%;text-align: center;left: 0;font-size: 4.1vw;line-height: 6.15vw;font-weight: 700;top: 50%;margin-top: -3.075vw;z-index: 1;}
header .headerWrap .menuCon{position: fixed;right:-100%;width:calc(100% - 12.3vw);background:#fff;box-sizing: border-box;height: 100%;top:0;transition: all 0.6s;z-index: 101;overflow-y: scroll;}
header .headerWrap .menuCon.on{right:0;}
header .headerWrap .menuCon .topMenu{height:27.179vw;background: linear-gradient(93.52deg, #6ABCD6 3.65%, #8AE7D6 85.3%);position: relative;padding:0 8.2vw}
header .headerWrap .menuCon .topMenu a{position:absolute;top:13.846vw;left:8.2vw;padding-left: 10.25vw;background:url(../img/ico_menu_home.png)no-repeat left center;background-size: 7.179vw;}
header .headerWrap .menuCon .topMenu a span{line-height: 7.179vw;font-weight: 700;color:#fff;padding-right: 5.128vw;background:url(../img/ico_arrow_r_w.png)no-repeat right center;background-size:4.1vw;}
header .headerWrap .menuClose{position: absolute;top:8.2vw;right:8.2vw;width: auto;}
header .headerWrap .menuClose a{display: block;width:4.6vw;height: 4.6vw;background: url(../img/ico_menu_close.png)no-repeat 0 0;background-size: 100%;}
header .headerWrap .menuClose span{display: inline-block;text-indent: -99999px;}
header .headerWrap .menuCon > ul > li{padding:5.128vw 8.2vw;}
header .headerWrap .menuCon > ul > li + li{border-top:1px solid #EBF0FA;}
header .headerWrap .menuCon > ul > li:nth-child(1) {padding-top:6.15vw;}
header .headerWrap .menuCon > ul > li:last-child {padding-bottom:6.15vw;}
header .headerWrap .menuCon > ul > li > a{display:block;font-weight: 700;padding-left: 9.23vw;width:100%;position: relative;}
header .headerWrap .menuCon > ul > li > a::before{content:'';position: absolute;right:0;top:1vw;background: url(../img/ico_arrow_r_bk.png)no-repeat 0 0;background-size:4.1vw;width:4.1vw;height:4.1vw;}
header .headerWrap .menuCon > ul > li:nth-child(1) > a{background:url(../img/ico_menu_write.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(2) > a{background:url(../img/ico_menu_analysis.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(3) > a{background:url(../img/ico_menu_helper.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(4) > a{background:url(../img/ico_menu_info.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(5) > a{background:url(../img/ico_menu_event.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(6) > a{background:url(../img/ico_menu_mypage.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li:nth-child(7) > a{background:url(../img/ico_menu_center.png)no-repeat left center;background-size: 6.15vw;}
header .headerWrap .menuCon > ul > li > ul{margin-top:4.1vw;display: flex;flex-wrap: wrap;}
header .headerWrap .menuCon > ul > li > ul > li{width:50%;margin-top:2vw;}
header .headerWrap .menuCon > ul > li > ul > li:nth-child(1),
header .headerWrap .menuCon > ul > li > ul > li:nth-child(2){margin-top:0;}
header .headerWrap .menuCon > ul > li > ul > li > a{display: block;color: #6D7B85;font-weight: 500;}

header .headerCal{display:flex;justify-content: center;font-family:'gSans';font-weight: 700;padding-bottom: 2vw;}
header .headerCal p{padding-left:7.179vw;background: url(../img/ico_header_cal.png)no-repeat left center;background-size:6.15vw 6.15vw;font-size: 3.8vw;line-height: 6.66vw;}
header .headerWrap .menuDimmed{display:none;position: fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index: 100;}

header .headerWrap .logo{display: none;}
header .headerWrap.main{align-items: center;padding:4.35vw 6.15vw;}
header .headerWrap.main .logo{display: block;padding-left: 11.79vw;width: 30.769vw;height: 9.74vw;position: relative;}
header .headerWrap.main .logo::before{content:'';position: absolute;left: 0;top:0;width: 9.74vw;height: 9.74vw;background:url(../img/ico_logo_before01.png)no-repeat left 0;background-size: 100% auto;transform: scaleX(-1);transition: all 0.8s;}
header .headerWrap.main .logo.ty01::before{background:url(../img/ico_logo_before01.png)no-repeat left 0;background-size: 100% auto;transform: scaleX(1);}
header .headerWrap.main .logo.ty02::before{background:url(../img/ico_logo_before02.png)no-repeat left 0;background-size: 100% auto;transform: scaleX(-1);}
header .headerWrap.main .logo.ty03::before{background:url(../img/ico_logo_before03.png)no-repeat left 0;background-size: 100% auto;transform: scaleX(1);}
header .headerWrap.main .logo.ty04::before{background:url(../img/ico_logo_before04.png)no-repeat left 0;background-size: 100% auto;transform: scaleX(-1);}
header .headerWrap.main .logo span{display: block;background: url(../img/ico_logo.png)no-repeat 0 center;background-size: 18.97vw 6.239vw;text-indent: -99999px;height:9.74vw;}
header .headerWrap.main .btn.back{display: none;}
header .headerWrap.main .pageTit{display: none;}


/***************************
            footer
***************************/
footer{background:rgba(211, 217, 227, 0.2);padding:9.23vw 4vw;text-align: left;}
footer .company{display: flex;margin-bottom: 1vw;}
footer .company p{font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;position: relative;color:#6D7B85;}
footer .company p + p{margin-left: 2vw;padding-left: 2vw;}
footer .company p + p:before{content:'';position: absolute;left: 0;width: 1px;height: 3vw;top:50%;margin-top:-1.5vw;background:#ccc;}
footer .address{font-size: 3vw;line-height: 5.128vw;color:#6D7B85;}
footer .btn.txt{margin-bottom: 1vw;width: auto;text-align: left;}
footer .btn.txt a {display: block;}
footer .btn.txt a span{font-size: 3vw;line-height: 5.128vw;color:#6D7B85;}
footer .copy{font-size: 2.8vw;line-height: 5.128vw;color:#6D7B85;font-family: 'gSans';font-weight: 400;margin-top:1vw;}

/***************************
            버튼
***************************/
button{background: inherit ; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; cursor:pointer;font-family: 'Pretendard', 'Poppins', 'dotum', '돋움';}

.btnBottom{position: fixed;bottom:0;width:100%;left:0;padding:6.15vw;background: linear-gradient(360deg, #FFFFFF 86.57%, rgba(255, 255, 255, 0) 100%);z-index: 100;}
.btnBottom.flex{display: flex;}
.wrap.bgGreen .btnBottom{background: linear-gradient(360deg, #F0FFF2 86.57%, rgba(240, 255, 242, 0) 100%);}

.btn{width: 100%;text-align: center;}
.btn a{display: block;}
.btn.sm{height:12.3vw;border-radius: 15.38vw;width: 30.769vw;}
.btn.sm a{height: 100%;}
.btn.sm span{line-height: 12.3vw;font-weight: 700;font-size:4.1vw;display: inline-block;}
.btn.md{height:15.38vw;border-radius: 4.1vw;}
.btn.md a{height: 100%;}
.btn.md span{line-height: 15.38vw;font-weight: 700;font-size:4.1vw;display: inline-block;}
.btn.green{background-color: #3DD18A;color:#fff;}
.btn.gray{background-color: #DAE8EF;color:#6D7B85;}
.btn.gray02{background-color: #94A9B2;color:#fff;}
.btn.white{background-color: #FFFFFF;color:#222;}
.btn.black{background-color: #111111;color:#fff;}

.btn.bgSm{display: flex;justify-content: center;align-items: center;width: auto;min-width: 5.64vw;padding:1vw 2vw;border-radius: 2vw;font-size: 3.589vw;line-height: 5.64vw;}
.btn.bgSm.bgGreen{background:#E3F6F3;color:#3DD18A;}


.btn.txtLink{display: flex;}
.btn.txtLink a{position: relative;font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;}
.btn.txtLink a::before{content: '';position: absolute;width:100%;height:1px;bottom:0;left:0;border-bottom:1px solid #6D7B85;}
.btn.popHelp{text-align: left;}
.btn.popHelp a{}
.btn.popHelp a span{font-size:4.6vw;line-height: 7.179vw;color:#6D7B85;font-weight: 500;padding-right:  7.179vw;background:url(../img/ico_help.png)no-repeat right center;background-size: 5.128vw;}
.btn span.hidTxt{display: inline-block;}

.btn.alrmSet {width: auto;}
.btn.alrmSet a{padding-left: 5.64vw;background:url(../img/ico_alrm_set.png)no-repeat left top 0.2vw;background-size: 4.6vw;}
.btn.alrmSet a span{color:#6D7B85;font-weight: 500;}
.flexBox .btn.alrmSet {margin-left: auto;}


.btn.disabled{opacity: 0.4;pointer-events: none;}
.btnBottom.flex .btn + .btn{margin-left: 2vw;}
.btn.disabled span.hidTxt{display: none;}

.fixWrite{position: fixed;bottom:24.6vw;right:6.15vw;z-index: 101;}
.fixWrite a{width:14.35vw;height:14.35vw;border-radius: 50%;background:#0262F3 url(../img/ico_plus_w.png)no-repeat center;background-size: 6.15vw;box-shadow: 0px 1vw 2.7vw 0px rgba(53, 141, 244, 0.4);}
.fixWrite a span{display: inline-block;text-indent: -99999px;}


/* 
.btnBox{display: flex;}
.btn .sm{border-radius: 3.125vw;min-width: 3.33vw;text-align: center;}
.btn button span,
.btn a span{display:inline-block;vertical-align:top;}
.btn button.sm span,
.btn a.sm span{font-size:0.83vw;font-weight: 500;line-height: 2.08vw;}
.btn button.md span,
.btn a.md span{font-size:0.83vw;font-weight: 500;line-height: 1.458vw;}
.btn .btnBc{background:#222;color:#fff;}
.btn .btnGr{background:#E4E4E4;color:#000;}
.btn + .btn{margin-left:0.416vw;}
.btn .btnSend{border:1px solid #000;border-radius: 3.125vw;padding:0.83vw;}
.btn .btnSend span{padding-left: 1.66vw;background:url(../img/ico_btn_del.png)no-repeat 0 0;background-size:1.458vw 1.458vw;}
.btn .btnSend:hover span{animation: moveSend 0.6s 0.2s linear forwards;}
@keyframes moveSend {
    0% {background-position: left -1vw center;}
    100% {background-position: left 0 center;}
}   */





/***************************
            팝업
***************************/
/* popup dimmed */
.dimmed{position: fixed;top:0;left:0;width: 100%;height: 100%;background:rgba(0,0,0,0.6);z-index: 999;display: none;}
.dimmed02{position: fixed;top:0;left:0;width: 100%;height: 100%;background:rgba(0,0,0,0.6);z-index: 1001;display: none;}

/* popup */
.popup{position: fixed;top:50%;left:50%;transform: translate(-50%, -50%);display: none;z-index: 1000;background: #fff;border-radius: 8.2vw;padding:10.25vw 10.25vw 8.2vw;}
.popup .popCon .bgGray{width: calc(100% + 12.3vw);margin-left: -6.15vw;padding:6.15vw 6.15vw 10.25vw 6.15vw;margin-bottom:-10.25vw;}
.popup.double{z-index: 1002;}
.popup.alert{text-align: center;width: 83vw;}
.popup.alert .popCon p.txt{color:#6D7B85;font-size:4.1vw;line-height: 6.15vw;}
.popup.bgPop01{background: linear-gradient(180deg, #D7EFD2 7.43%, #FFFFFF 47.07%);}


.popup.bottom{display:flex;width:100%;top:auto;bottom:-150dvh;left:0;transform: translate(0,0);max-height:calc(100dvh - 10.25vw);transition: bottom 0.6s ease;border-radius: 8.2vw 8.2vw 0 0;padding:0;flex-direction: column;min-height: 61.5vw;}
.popup.bottom.on{bottom:0;}
.popup.bottom .popTitBox{display: flex;justify-content: space-between;align-items: center;padding:4.1vw 6.15vw;}
.popup.bottom .popTitBox .popTit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;}
.popup.bottom .popTitBox .popTit.ai{background:linear-gradient(90deg, #3DBDC6 10%, #3B77E5 90%);text-align: center;color: transparent;background-clip: text;-webkit-background-clip: text;padding-left:9.23vw;position: relative;}
.popup.bottom .popTitBox .popTit.ai::before{content:'';position: absolute;left:0;top:0;width: 7.179vw;height: 7.179vw;background: url(../img/ico_ai.png)no-repeat 0 0;background-size:100%;}
.popup.bottom .popTitBox .btn.popClose{width:4.6vw;height: 4.6vw;background:url(../img/ico_close_pop.svg)no-repeat 0 0;background-size: 100%;}
.popup.bottom .popTitBox .btn.popClose a{display: block;}
.popup.bottom .popTitBox .btn.popClose span{display: inline-block;text-indent: -99999px;}
.popup.bottom .popCon{
    /* padding:3vw 6.15vw 10.25vw 6.15vw;overflow-y: scroll;height:100%;overflow-x: hidden; */
  padding:3vw 6.15vw 10.25vw 6.15vw;
  overflow-y:auto;
  overflow-x:hidden;
  flex:1 1 auto;
  min-height:0;
  -webkit-overflow-scrolling: touch;
}

.popup .btnBox{display: flex;justify-content: center;margin-top:6.15vw;}
.popup .btnBox .btn + .btn{margin-left: 1vw;}

.toastPop{position: fixed;bottom:6.15vw;left:0;width:calc(100% - 12.3vw);margin-left:6.15vw;visibility: hidden;opacity: 0;transition: all 0.8s;background:rgba(0, 0, 0, 0.65);border-radius: 3.07vw;z-index: 1001;}
.toastPop.bt{bottom:24.6vw;}
.toastPop p{font-size: 3.589vw;line-height: 5.64vw;color:#fff;padding:2.56vw;text-align: center;}
.toastPop.show{visibility:visible;opacity: 1;}

/* 달력팝업 버튼 */
.btnDatePicker{padding-bottom: 2.05vw;padding-right: 6.15vw;width: 100%;background:url(../img/ico_calendar.png)no-repeat right 1.28vw;background-size: 5.128vw;min-height: 9.74vw;font-size:4.1vw;line-height: 7.69vw;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{display: none;}
/* 달력팝업 커스텀 */
.calModal .popCon {position: relative;}
.calModal .popCon .iptCal{visibility: hidden;position: absolute;left: 0;top: 0;}
.calModal .popCon .ui-datepicker{position: relative !important;left: 0 !important;top:0 !important;width: 100%;border:none;padding:0;display: block !important;opacity: 1 !important;}
.calModal .popCon .ui-datepicker .ui-datepicker-header{background:#fff;border:none;padding:0;}
.calModal .popCon .ui-datepicker .ui-datepicker-title{margin:0;line-height: 7.69vw;text-align: left;}
.calModal .popCon .ui-datepicker .ui-datepicker-title select{margin:0;border:none;background:url(../img/ico_arrow_select.png)no-repeat right 2.4vw;background-size: 2.56vw auto;color:#222;font-family: 'gSans';font-weight: 700;line-height: 7.69vw;}
.calModal .popCon .ui-datepicker .ui-datepicker-prev,
.calModal .popCon .ui-datepicker .ui-datepicker-next{display: none;}
.calModal .popCon .ui-datepicker-year{min-width: 19.23vw;width:auto;margin-right: 6.15vw !important;}
.calModal .popCon .ui-datepicker-month{min-width: 13.33vw;width:auto;}
.calModal .popCon .ui-datepicker table{margin-top:3.33vw;margin-bottom:0;}
.calModal .popCon .ui-datepicker th{padding:0;background: none;line-height: 9.23vw;font-size: 3.84vw;font-weight: 500;color:#222;}
.calModal .popCon .ui-datepicker td{padding:0;margin:1vw 0;}
.calModal .popCon .ui-datepicker td span,
.calModal .popCon .ui-datepicker td a{padding:0;border:none;color:#6D7B85;font-weight: 700;font-family: 'gSans';line-height: 11.28vw;font-size: 3.589vw;background:none;text-align: center;letter-spacing: 0;}
.calModal .calClose{margin:0 6.15vw 10.25vw;width:calc(100% - 12.3vw);}
.calModal .popCon .ui-state-highlight{color:#6D7B85 !important;}
.calModal .popCon .ui-state-active{color:#3DD18A !important;background: none;border:none;}
.calModal .popCon .ui-datepicker td span.ui-state-hover, 
.calModal .popCon .ui-datepicker td a.ui-state-hover{color:#3DD18A;}
.calModal .popCon .ui-datepicker td.selected-date a{color:#3DD18A;}

/* 달력 - 건강기록 */
.calModal.record .popCon{display: flex;flex-direction: column;}
.calModal.record .popCon .ui-datepicker .ui-datepicker-header{display: flex;}
.calModal.record .popCon .ui-datepicker .ui-datepicker-prev,
.calModal.record .popCon .ui-datepicker .ui-datepicker-next{display: block;}
.calModal .ui-datepicker .ui-datepicker-prev{background: url(../img/ico_cal_arrow_l.png)no-repeat 0 0;width:4vw;height: 4vw;background-size:100% auto;left: 0;top:50%;margin-top:-2vw;}
.calModal .ui-datepicker .ui-datepicker-next{background: url(../img/ico_cal_arrow_r.png)no-repeat 0 0;width:4vw;height: 4vw;background-size:100% auto;right: 0;top:50%;margin-top:-2vw;left:27.66vw;}
.calModal.record .ui-datepicker-title{min-width: 20.51vw;padding-left: 6.15vw;padding-right: 6.15vw;}
.calModal.record .popCon .ui-datepicker-year{margin-right: 0 !important;position: relative;}
.calModal.record .popCon .ui-datepicker-year::after{content:'.';}
.calModal.record .popCon .ui-datepicker-year,
.calModal.record .popCon .ui-datepicker-month{font-size:4.6vw;line-height: 7.69vw;font-weight: 700;font-family: 'gSans';letter-spacing: 0;}
.calModal.record .popCon .ui-datepicker-month{position: relative;left: -0.8vw;}
.calModal.record .popCon .ui-datepicker tr td{padding-top:2vw;}
.calModal.record .popCon .ui-datepicker tr:first-child td{padding-top:0;}
.calModal.record .popCon .ui-datepicker td span,
.calModal.record .popCon .ui-datepicker td a{line-height: 4.6vw;padding-bottom: 6.66vw;margin:1.538vw 0;background: url(../img/ico_cal_rock.png)no-repeat bottom center;background-size:6.15vw auto;}

.calModal.slide .popCon .ui-datepicker .ui-datepicker-header{display: flex;}
.calModal.slide .popCon .ui-datepicker .ui-datepicker-prev,
.calModal.slide .popCon .ui-datepicker .ui-datepicker-next{display: block;}
.calModal.slide .ui-datepicker-title{min-width: 20.51vw;padding-left: 6.15vw;padding-right: 6.15vw;}
.calModal.slide .popCon .ui-datepicker-year{margin-right: 0 !important;position: relative;}
.calModal.slide .popCon .ui-datepicker-year::after{content:'.';}
.calModal.slide .popCon .ui-datepicker-year,
.calModal.slide .popCon .ui-datepicker-month{font-size:4.6vw;line-height: 7.69vw;font-weight: 700;font-family: 'gSans';letter-spacing: 0;}
.calModal.slide .popCon .ui-datepicker-month{position: relative;left: -0.8vw;}

/* 달력 - 건강기록 - 걸음 */
.calModal.walk .popCon .ui-datepicker td.on span,
.calModal.walk .popCon .ui-datepicker td.on a{background: url(../img/ico_cal_walk.png)no-repeat bottom center;background-size:6.15vw auto;}
.calModal.walk .ui-datepicker-header .icoTxt{margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 7.179vw;background: url(../img/ico_cal_walk.png)no-repeat left center;background-size:6.15vw auto;}
.calModal.walk .popCon .detailBox{order: 2;background: #F5F9FF;border-radius: 5.128vw;padding:3.589vw 0;margin-top:4vw;text-align: center;}
.calModal.walk .popCon .detailBox > p{display: inline-block;padding-left: 6.66vw;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;}
.calModal.walk .popCon .detailBox > p + p{margin-top:2vw;}
.calModal.walk .popCon .detailBox > p:first-child{background: url(../img/ico_cal_detail_walk.png)no-repeat left center;background-size: 4.6vw;}
.calModal.walk .popCon .detailBox > p:last-child{background: url(../img/ico_cal_detail_goal.png)no-repeat left center;background-size: 4.6vw;}

/* 달력 - 건강기록 - 음식 */
.calModal.food .popCon .ui-datepicker td.on span,
.calModal.food .popCon .ui-datepicker td.on a{background: url(../img/ico_cal_food.png)no-repeat bottom center;background-size:6.15vw auto;}
.calModal.food .ui-datepicker-header .icoTxt{margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 7.179vw;background: url(../img/ico_cal_food.png)no-repeat left center;background-size:6.15vw auto;}

/* 달력 - 건강기록 - 혈당 */
.calModal.sugar .popCon .ui-datepicker td.on span,
.calModal.sugar .popCon .ui-datepicker td.on a{background: url(../img/ico_cal_sugar.png)no-repeat bottom center;background-size:6.15vw auto;}
.calModal.sugar .ui-datepicker-header .icoTxt{margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 7.179vw;background: url(../img/ico_cal_sugar.png)no-repeat left center;background-size:6.15vw auto;}

/* 달력 - 건강기록 - 혈압 */
.calModal.pressure .popCon .ui-datepicker td.on span,
.calModal.pressure .popCon .ui-datepicker td.on a{background: url(../img/ico_cal_pressure.png)no-repeat bottom center;background-size:6.15vw auto;}
.calModal.pressure .ui-datepicker-header .icoTxt{margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 7.179vw;background: url(../img/ico_cal_pressure.png)no-repeat left center;background-size:6.15vw auto;}

/* 달력 - 건강기록 - 몸무게 */
.calModal.weight .popCon .ui-datepicker td.on span,
.calModal.weight .popCon .ui-datepicker td.on a{background: url(../img/ico_cal_weight.png)no-repeat bottom center;background-size:6.15vw auto;}
.calModal.weight .ui-datepicker-header .icoTxt{margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 7.179vw;background: url(../img/ico_cal_weight.png)no-repeat left center;background-size:6.15vw auto;}

/* 달력 - 기본 도트 */
.calModal.default .popCon .ui-datepicker td span,
.calModal.default .popCon .ui-datepicker td a{background: none;margin:0;}
.calModal.default .popCon .ui-datepicker td.on span,
.calModal.default .popCon .ui-datepicker td.on a{position: relative;}
.calModal.default .popCon .ui-datepicker td.on a::before{content:'';position: absolute;left:50%;bottom:4.6vw;width:1.538vw;height: 1.538vw;margin-left:-0.769vw;background:#3DD18A;border-radius: 50%;}
.calModal.default .ui-datepicker-header .icoTxt{position: relative;margin-left:auto;font-size: 3.589vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;padding-left: 4.1vw;}
.calModal.default .ui-datepicker-header .icoTxt::before{content:'';position: absolute;left:1vw;top:50%;width:1.538vw;height: 1.538vw;margin-top:-0.769vw;background:#3DD18A;border-radius: 50%;}


/* 시간팝업업 버튼 */
.btnTimePicker{padding-bottom: 2.05vw;padding-right: 6.15vw;width: 100%;background:url(../img/ico_timepicker.png)no-repeat right 1.28vw;background-size: 5.128vw;min-height: 9.74vw;font-size:4.1vw;line-height: 7.69vw;}

/* 텍스트 */
.subTxt{position:relative;padding-left:2.56vw;font-size: 3.07vw;line-height: 5.128vw;color: #A7ADBB;font-weight: 500;}
.subTxt::before{content:'*';position:absolute;left:0;top:0;}

.errorTxt{position:relative;padding-left:2.56vw;font-size: 3.07vw;line-height: 5.128vw;color: #F27C63;font-weight: 500;}
.errorTxt::before{content:'';position:absolute;left:0;top:0;width:1.53vw;height: 5.12vw;background: url(../img/ico_error_txt.png)no-repeat 0 0;background-size: 1.53vw 5.12vw;}
.subTxt + .errorTxt{margin-top:1vw;}
.iptBox + .errorTxt{margin-top:2.05vw;}
.radioTxtBox + .errorTxt{margin-top:2.05vw;}


/***************************
        텍스트 리스트
***************************/
.txtList{}
.txtList li{border-bottom: 1px solid #DEE4EE;}
.txtList li a{display:block;background:url(../img/ico_arrow_r_bk.png)no-repeat right center;background-size:3vw;padding:5.12vw 0;}
.txtList li a span{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;display: inline-block;position: relative;}
.txtList li.new a span::before{content: '';position: absolute;width: 1.28vw;height: 1.28vw;border-radius: 50%;background:#F26C63;top:1vw;right:-2vw;}

.dotList li{position: relative;padding-left: 2.05vw;}
.dotList li + li{margin-top:1vw;}
.dotList li::before{content:'';position: absolute;left:0;top:2vw;width:1vw;height:1vw;border-radius: 50%;}

.guideBox{padding:4.1vw 5.128vw;border-radius: 6.15vw;background: #F3F4F6;}
.guideBox.noBg{padding:0;border-radius: 6.15vw;background: none;}
.guideBox .tit{padding-left: 5.6vw;background:url(../img/ico_guide.png)no-repeat left 0.5vw;background-size: 4.6vw;font-size: 3.58vw;line-height: 5.6vw;font-weight: 500;margin-bottom: 2.05vw;}
.guideBox .dotList li{color:#6D7B85;font-size: 3.589vw;line-height: 5.6vw;}
.guideBox .dotList li::before{background:#A7ADBB;}





.grayBox{padding:5.128vw;border-radius: 5.128vw;background: #F3F4F6;}
.grayBox p + p{margin-top:0.5vw;}

.dashList > div,
.dashList > li{position:relative;padding-left:0.52vw;color:#666;font-size: 0.833vw;line-height: 1.458vw;}
.dashList > div::before,
.dashList > li::before{content:'';position: absolute;left:0;top:0.677vw;width: 0.3125vw;height: 2px;background:rgba(102, 102, 102, 0.4);}
.dashList > div + div,
.dashList > li + li{margin-top:0.208vw;}

.barList li{border-radius: 5.128vw;padding:5.128vw 6.15vw;}
.barList.link li{padding:0;}
.barList.link li > a{padding:5.128vw 6.15vw;display: block;background:url(../img/ico_arrow_r_bk.png)no-repeat right 6.15vw center;background-size:3vw;}
.barList li + li{margin-top:3vw;}
.barList li .btn{text-align: left;}
.barList li .btn a{display:block;background: url(../img/ico_arrow_r_bk.png)no-repeat right center;background-size:3vw;}
.barList li .btn a span{display:inline-block;font-size:3.84vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;}
.barList li .tit{font-size:3.84vw;line-height: 7.69vw;color:#6D7B85;font-weight: 500;}

.barList.bgW li{background:#fff;}

/***************************
        아코디언 리스트
***************************/
.acdList > ul > li{}
.acdList > ul > li{padding: 5.128vw 0;border-bottom:1px solid #DEE4EE;}
.acdList > ul > li:first-child{padding-top:0;}
.acdList > ul > li .titBox{position:relative;padding-left: 9.23vw;padding-right: 9.23vw;}
.acdList > ul > li .titBox::before{content:'';position: absolute;width:4vw;height: 4vw;right:0;top: 50%;margin-top:-2vw;background:url(../img/ico_accrodion.png)no-repeat 0 0;background-size: 4vw;transition: all 0.6s;}
.acdList > ul > li.on .titBox::before{transform: rotate(180deg);}
.acdList > ul > li .titBox .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;}
.acdList > ul > li .titBox .date{margin-top:0.5vw;font-size: 2.8vw;line-height: 2;font-family: 'gSans';color: #A7ADBB;}
.acdList > ul > li .titBox .date span{display: inline-block;position: relative;}
.acdList > ul > li .titBox .date.new span::before{content: '';position: absolute;width: 1.28vw;height: 1.28vw;border-radius: 50%;background:#F26C63;top:1vw;right:-1.79vw;}
.acdList > ul > li .titBox .btnDel{display: none;}
.acdList > ul > li .txtBox{display: none;margin-top:3vw;}
.acdList > ul > li .txtBox > div{background: #F3F4F6;border-radius: 4vw;padding:4vw 5vw;color:#6D7B85;}

.acdList .btn.delList{display: flex;justify-content: flex-end;}
.acdList .btn.delList .btnDel{background:url(../img/ico_delList.png)no-repeat 0 0;background-size: 4.6vw;width:4.6vw;height: 4.6vw;margin-bottom:5.128vw;}
.acdList .btn.delList .btnDel span{display: inline-block;text-indent: -99999px;}
.acdList .btn.delList .btnAllDel{margin-bottom: 3.6vw;display: none;}
.acdList .btn.delList .btnAllDel span{color:#6D7B85;font-size: 3.589vw;line-height:5.64vw;font-weight: 500;position: relative;display: inline-block;}
.acdList .btn.delList .btnAllDel span::before{content: '';position: absolute;left:0;bottom: 0;border-bottom: 1px solid #6D7B85;width:100%;height: 1px;}

.acdList.delMode > ul > li .titBox::before{content:none;}
.acdList.delMode > ul > li .titBox .btnDel{position: absolute;right:0;top:50%;margin-top:-2.56vw;background:url(../img/ico_del.png)no-repeat 0 0;width:5.12vw;height:5.12vw;background-size: 100%;;}
.acdList.delMode > ul > li .titBox .btnDel span{display: inline-block;text-indent: -99999px;}
.acdList > ul > li.event .titBox{background:url(../img/mypage/ico_alrm_event.png)no-repeat left top;background-size: 6.15vw;}
.acdList > ul > li.health .titBox{background:url(../img/mypage/ico_alrm_health.png)no-repeat left top;background-size: 6.15vw;}
.acdList > ul > li.inquiry .titBox{background:url(../img/mypage/ico_alrm_inquiry.png)no-repeat left top;background-size: 6.15vw;}
.acdList > ul > li.stretch .titBox{background:url(../img/mypage/ico_alrm_stretch.png)no-repeat left top;background-size: 6.15vw;}

.acdList.qnaList> ul > li .titBox{background:url(../img/ico_qna.png)no-repeat left 3vw;background-size: 6.15vw;}
.acdList.qnaList> ul > li .titBox .label{color:#A7ADBB;font-size: 3.589vw;line-height: 5.64vw;margin-bottom: 0.5vw;}

/***************************
        탭 리스트
***************************/
.tabList{width:calc(100% + 12.3vw);padding:6.15vw 0 5.128vw;margin-left: -6.15vw;background:#fff;}
.tabList.txt{width:100%;margin-left: 0;padding-bottom: 0;}
.tabList ul{display:flex;flex-wrap: nowrap;overflow-x: auto;}
.tabList.sm ul li{flex:0 0 auto;margin:0 1vw;}
.tabList.sm ul li:first-child{margin-left: 6.15vw;}
.tabList.sm ul li:last-child{margin-right: 6.15vw;}
.tabList.sm ul li a{display:block;padding:1.538vw 4.1vw;border-radius: 17.9vw;background:rgba(111, 130, 168, 0.1);}
.tabList.sm ul li.on a{background:rgba(57, 60, 69, 1);}
.tabList.sm ul li a span{display: inline-block;font-size:3.84vw;line-height: 6.15vw;color:#6D7B85;font-weight: 500;}
.tabList.sm ul li.on a span{color:#fff;}
.tabList.txt ul{padding:1vw;background:#EFF3F5;border-radius: 15.38vw;}
.tabList.txt ul li{flex:1;}
.tabList.txt ul li a{display:block;padding:2vw 3vw;border-radius: 17.9vw;font-weight: 500;text-align: center;color:rgba(41, 48, 62, 0.4);}
.tabList.txt ul li.on a{background:#fff;color:#222;font-weight: 700;}

/***************************
        카드 형태 리스트
***************************/

/* 타이틀 1줄, 내용 2줄 말줄임 */
.cardList li + li{margin-top:3.07vw;}
.cardList li a{padding:5vw;border-radius: 6.15vw;background: #fff;display: block;}
.cardList li a .tit{font-size:4vw;line-height:6.15vw;font-weight:700;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin-bottom:1vw;}
.cardList li a .txt{color: #6D7B85;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

/***************************
        숫자 리스트
***************************/

.numList{}
.numList li{position: relative;padding-left: 8.2vw;color: #6D7B85;}
.numList li + li{margin-top:4vw;}
.numList li:before{text-align: center;position: absolute;left: 0.5vw;top:0;width:5.64vw;height: 5.64vw;border-radius: 50%;background:#222;color:#fff;font-family: 'gSans';font-size: 3vw;line-height: 5.64vw;}
.numList li:nth-child(1):before{content: '1';}
.numList li:nth-child(2):before{content: '2';}
.numList li:nth-child(3):before{content: '3';}
.numList li:nth-child(4):before{content: '4';}
.numList li:nth-child(5):before{content: '5';}
.numList li:nth-child(6):before{content: '6';}
.numList li:nth-child(7):before{content: '7';}
.numList li:nth-child(8):before{content: '8';}
.numList li:nth-child(9):before{content: '9';}
.numList li:nth-child(10):before{content: '10';}
.numList li:nth-child(11):before{content: '11';}



/***************************
        No Data
***************************/
.noData{padding-top:20.5vw;}
.noData p{padding-top:18.46vw;background: url(../img/ico_nodata.png)no-repeat top center;background-size: 16.4vw;text-align: center;font-weight: 500;color:#A7ADBB;}
.popup .noData{padding-bottom:10.25vw;padding-top:10.25vw;}

/***************************
    비디오 - 썸네일 링크
***************************/
/* .videoCon{height: 49.74vw;overflow: hidden;width: 100%;border-radius: 6.15vw;}
.videoCon a{overflow: hidden;position: relative;display: block;width:100%;height:100%;}
.videoCon a > button{position: absolute;left: 0;top:0;width:100%;height:100%;background-color: rgba(0,0,0,0.6);background-image: url(../img/ico_video_play.png);background-repeat: no-repeat;background-size:13.33vw auto;background-position: center center;}
.videoCon a > button.play{background-color: transparent;background-image: none;}
.videoCon a > .imgBox{margin-top:0 !important;height: 100%;}
.videoCon a > .imgBox img{object-fit: cover;width: 100%;height: 100%;} */

/***************************
            라인
***************************/
.lineBar{margin-top:8vw;padding-top:8vw;border-top:3vw solid #F0F2F5;}


/***************************
            로딩
***************************/
.loadingPop {position: fixed;inset: 0;z-index: 9999;background: rgba(0, 0, 0, 0.6);display: flex;align-items: center;justify-content: center;}
.loadingPop .loadingBox {width: 100%;text-align: center;}
.loadingPop .foodScanArea {position: relative;width: 35.9vw;margin: 0 auto;}
.loadingPop .foodCard {position: relative;width: 100%;transform-style: preserve-3d;perspective: 1000px;}
.loadingPop .foodCard img {display: block;width: 100%;height: auto;backface-visibility: hidden;transform-origin: center center;will-change: transform, opacity;}
.loadingPop .foodCard.flipOut img {animation: foodFlipOut .5s ease-in forwards;}
.loadingPop .foodCard.flipIn img {animation: foodFlipIn .5s ease-out forwards;}
@keyframes foodFlipOut {
    0% {transform: rotateY(0deg) scale(1);opacity: 1;}
    100% {transform: rotateY(90deg) scale(.94);opacity: 0;}
}

@keyframes foodFlipIn {
    0% {transform: rotateY(-90deg) scale(.94);opacity: 0;}
    100% {transform: rotateY(0deg) scale(1);opacity: 1;}
}

/* 돋보기 */
.magnifier {position: absolute;left: 50%;top: 52%;width: 28.7vw;transform: translate(-20%, -40%);pointer-events: none;z-index: 3;opacity: 1;}
.magnifier img {display: block;width: 100%;height: auto;}
/* 훑는 모션 시작 상태 */
.magnifier.scanning {animation: magnifierScanFloat 1.5s ease-in-out forwards;}
/* 멈춤 */
.magnifier.paused {animation-play-state: paused;}

@keyframes magnifierScanFloat {
    0% {transform: translate(-20%, -40%) rotate(0deg);}  
    25% {transform: translate(-50%, -50%) rotate(12deg);}    
    50% {transform: translate(-60%, -40%) rotate(-6deg);}    
    75% {transform: translate(-40%, -30%) rotate(12deg);}    
    100% {transform: translate(-20%, -40%) rotate(0deg);}
}

/* 텍스트 */
.loadingTxtBox {position: relative;height: 4.36vw;margin-top: 1vw;overflow: hidden;}
.loadingTxt {margin: 0;font-size: 3.58vw;line-height: 4.36vw;font-weight: 500;color: #fff;white-space: nowrap;will-change: transform, opacity;}
/* 텍스트 등장/퇴장 */
.loadingTxt.txtIn {animation: textInUp .45s ease-out forwards;}
.loadingTxt.txtOut {animation: textOutUp .45s ease-in forwards;}

@keyframes textInUp {
    0% {opacity: 0;transform: translateY(120%);}
    100% {opacity: 1;transform: translateY(0%);}
}

@keyframes textOutUp {
    0% {opacity: 1;transform: translateY(0%);}
    100% {opacity: 0;transform: translateY(-120%);}
}

/***************************
    0. 스플래시 화면
***************************/
/* .wrap.splash {background: url(../img/splash/bg_splash.png)no-repeat center center;background-size: cover;padding: 0 !important;}
.wrap.splash .txtBox{text-align: center;position: absolute;top:30.7vw;width: 100%;}
.wrap.splash .txtBox .imgBox{width: 42vw;margin:0 auto;margin-bottom: 4vw;}
.wrap.splash .txtBox > p{font-size: 6.15vw;line-height: 8.7179vw;font-weight: 700;color: #fff;}
.wrap.splash .imgList{height: 100vh;position: absolute;width: 100%;}
.wrap.splash .imgList > div{position: absolute;}
.wrap.splash .img01{z-index: 2;width:100%;height:91.79vw; background: url(../img/splash/img_splash01.png)no-repeat 0 0;background-size: 100%;top:67.69vw;right:0;
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    animation: reveal 0.6s 2s ease-in-out forwards;}
@keyframes reveal {
    from {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}
.wrap.splash .img02{z-index: 1;width:68.7179vw;height:93.8vw; background: url(../img/splash/img_splash02.png)no-repeat 0 0;background-size: 100%;top:69.487vw;left:15.64vw;
    animation: float 2s forwards linear;
}
@keyframes float {
    0% {
        transform: translateX(-10vw) translateY(0);
    }
    33% {
        transform: translateX(-6vw) translateY(2vw);
    }
    66% {
        transform: translateX(-3vw) translateY(-2vw);
    }

    100% {
        transform: translateX(0) translateY(0);
    }
}

.wrap.splash .img03{z-index: 1;width:59.48vw;height:45.128vw; background: url(../img/splash/img_splash04.png)no-repeat 0 0;background-size: 100%;bottom:0;left:-100%;
    animation: cloud01 1s 0.5s forwards linear;
}
@keyframes cloud01 {
    from {left:-100%;}
    to {left:0;}
}

.wrap.splash .img04{z-index: 2;width:59.48vw;height:45.128vw; background: url(../img/splash/img_splash03.png)no-repeat 0 0;background-size: 100%;bottom:0;right:-100%;
    animation: cloud02 1s forwards linear;
}
@keyframes cloud02 {
    from {right:-100%;}
    to {right:0;}
} */
.wrap.splash {background: url(../img/splash/bg_splash.png)no-repeat center center;background-size: cover;padding: 0 !important;}
.wrap.splash .txtBox{text-align: center;position: absolute;top:14.2vh;width: 100%;}
.wrap.splash .txtBox .imgBox{width: 19.4vh;margin:0 auto;margin-bottom: 1.89vh;}
.wrap.splash .txtBox > p{font-size: 2.84vh;line-height: 4vh;font-weight: 700;color: #fff;}
.wrap.splash .imgList{height: 100vh;position: absolute;width: 100%;}
.wrap.splash .imgList > div{position: absolute;}
.wrap.splash .img01{z-index: 2;width:100%;height:42.4vh; background: url(../img/splash/img_splash01.png)no-repeat 0 0;background-size: 100%;top:31.279vh;right:0;
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    animation: reveal 0.6s 2s ease-in-out forwards;}
@keyframes reveal {
    from {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}
.wrap.splash .img02{z-index: 1;width:31.75vh;height:43.36vh; background: url(../img/splash/img_splash02.png)no-repeat 0 0;background-size: 100%;top:32vh;
    left:50%;
    margin-left: -15.875vh;
    animation: float 2s forwards linear;
}
@keyframes float {
    0% {
        transform: translateX(-10vh) translateY(0);
    }
    33% {
        transform: translateX(-6vh) translateY(2vh);
    }
    66% {
        transform: translateX(-3vh) translateY(-2vh);
    }

    100% {
        transform: translateX(0) translateY(0);
    }
}

.wrap.splash .img03{z-index: 1;width:27.48vh;height:20.8vh; background: url(../img/splash/img_splash04.png)no-repeat 0 0;background-size: 100%;bottom:0;left:-100%;
    animation: cloud01 1s 0.5s forwards linear;
}
@keyframes cloud01 {
    from {left:-100%;}
    to {left:0;}
}

.wrap.splash .img04{z-index: 2;width:27.48vh;height:20.8vh; background: url(../img/splash/img_splash03.png)no-repeat 0 0;background-size: 100%;bottom:0;right:-100%;
    animation: cloud02 1s forwards linear;
}
@keyframes cloud02 {
    from {right:-100%;}
    to {right:0;}
}






@media screen and (min-width:659px) {
    .wrap.splash {background: url(../img/splash/bg_splash_tb.png)no-repeat center center;background-size: cover;padding: 0 !important;}
    /* .wrap.splash .txtBox{top:15.2vw;}
    .wrap.splash .txtBox .imgBox{width: 30vw;margin:0 auto;margin-bottom: 2.3vw;}
    .wrap.splash .txtBox > p{font-size: 4vw;line-height: 6vw;}

    .wrap.splash .img01{height:66vw; background: url(../img/splash/img_splash01_tb.png)no-repeat 0 0;background-size: 100%;top:31.7vw;right:0;}
    .wrap.splash .img02{width:48vw;height:63vw;background: url(../img/splash/img_splash02_tb.png)no-repeat 0 0;background-size: 100%;top:36.9vw;left:26.8vw;}

    .wrap.splash .img03{width:63.7vw;height:42.46vw; background: url(../img/splash/img_splash04_tb.png)no-repeat 0 0;background-size: 100%;bottom:-3vw;left:-100%;}
    .wrap.splash .img04{width:44.49vw;height:33.768vw; background: url(../img/splash/img_splash03_tb.png)no-repeat 0 0;background-size: 100%;bottom:0;right:-100%;}
         */


    .wrap.splash .txtBox{top:12.3vh;}
    .wrap.splash .txtBox .imgBox{width: 25vh;margin:0 auto;margin-bottom: 1.9vh;}
    .wrap.splash .txtBox > p{font-size: 3.37vh;line-height: 5vh;}
    .wrap.splash .img01{height:55vh; background: url(../img/splash/img_splash01_tb.png)no-repeat 0 0;background-size: 100%;top:26.4vh;right:0;}
    .wrap.splash .img02{width:40vh;height:52.59vh;background: url(../img/splash/img_splash02_tb.png)no-repeat 0 0;background-size: 100%;top:30.7vh;left:22.3vh;
        left: 50%;
        margin-left: -20vh;
    animation: float 2s forwards linear;
    }
    @keyframes float {
        0% {
            transform: translateX(-10vh) translateY(0);
        }
        33% {
            transform: translateX(-6vh) translateY(2vh);
        }
        66% {
            transform: translateX(-3vh) translateY(-2vh);
        }
    
        100% {
            transform: translateX(0) translateY(0);
        }
    }
    
    .wrap.splash .img03{width:53vh;height:35.34vh; background: url(../img/splash/img_splash04_tb.png)no-repeat 0 0;background-size: 100%;bottom:-3vh;left:-100%;}
    .wrap.splash .img04{width:37.4vh;height:28vh; background: url(../img/splash/img_splash03_tb.png)no-repeat 0 0;background-size: 100%;bottom:0;right:-100%;}




}




/* .wrap.splash{background: url(../img/splash/bg_splash.png)no-repeat 0 0;background-size: cover;padding:0 !important;}
.wrap.splash .txtBox{padding-top:120px;text-align: center;}
.wrap.splash .txtBox .imgBox{width: 164px;margin:0 auto;margin-bottom: 16px;}
.wrap.splash .txtBox > p{font-size: 24px;line-height: 34px;font-weight: 700;color: #fff;}
.wrap.splash .imgList > div{position: absolute;}
.wrap.splash .img01{z-index: 2;width:100%;height:358px; background: url(../img/splash/img_splash01.png)no-repeat 0 0;background-size: 100%;top:264px;right:0;
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    animation: reveal 1s 2s ease-in-out forwards;}
@keyframes reveal {
    from {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}
.wrap.splash .img02{z-index: 1;width:268px;height:366px; background: url(../img/splash/img_splash02.png)no-repeat 0 0;background-size: 100%;top:271px;
    left:50%;
    margin-left: -134px;
    animation: float 2s forwards ease-in-out;
}
@keyframes float {
    0% {
        transform: translateX(-48px) translateY(0);
    }
    33% {
        transform: translateX(-36px) translateY(8px);
    }
    66% {
        transform: translateX(-24px) translateY(-8px);
    }

    100% {
        transform: translateX(0) translateY(0);
    }
} */















.wrap.splash .img03{}
.wrap.splash .img04{}

/***************************
    1. 로그인 & 회원가입
***************************/

/* 앱접근 권한 */
/* .accAuth{padding-top:16.4vw;} */
.accAuth .h1{margin-bottom: 3.07vw;}
.accAuth .h1 + .tit{color: #6D7B85;margin-bottom: 6.15vw;font-weight: 500;}
.accAuth .acclist{margin-bottom:8.2vw;}
.accAuth .acclist li{padding-left: 19.487vw;position: relative;}
.accAuth .acclist li::before{content:'';position: absolute;left:0;top:0;border-radius: 50%;width:15.38vw;height:15.38vw;}
.accAuth .acclist li:nth-child(1)::before{background:#F3F4F6 url(../img/login/ico_alrm.png)no-repeat center center;background-size: 10.256vw;}
.accAuth .acclist li:nth-child(2)::before{background:#F3F4F6 url(../img/login/ico_health_aos.png)no-repeat center center;background-size: 10.256vw;}
body.ios .accAuth .acclist li:nth-child(2)::before{background:#F3F4F6 url(../img/login/ico_health_ios.png)no-repeat center center;background-size: 10.256vw;}
.accAuth .acclist li:nth-child(3)::before{background:#F3F4F6 url(../img/login/ico_camera.png)no-repeat center center;background-size: 10.256vw;}
.accAuth .acclist li + li{margin-top:8.2vw;}
.accAuth .acclist li .tit{font-size: 4.6vw;line-height: 7.179vw;margin-bottom: 0.5vw;}
.accAuth .acclist li .txt{color:#A7ADBB;}

/* 이메일 인증 */
.timeBox{padding:4.6vw 5.128vw;background: #F6F8F9;border-radius: 3vw;display: flex;justify-content: space-between;align-items: center;margin-top:4vw;}
.timeBox .time{padding-left: 5.128vw;color:#3DD18A;font-weight: 700;font-family: 'gSans';font-size:3vw;line-height: 5.128vw;background: url(../img/ico_time.png)no-repeat left 1vw;background-size: 4.1vw;letter-spacing: 0;padding-top:1vw;}
.timeBox .btn{width: auto;}
.timeBox .btn.txt span{position: relative;font-size: 3.589vw;line-height: 5.64vw;color:#6D7B85;font-weight: 500;display: inline-block;}
.timeBox .btn.txt span::before{content:'';position:absolute;width: 100%;height:1px;background: #6D7B85;left:0;bottom:0;}

/* 회원가입 */
.phoneAuth{text-align: center;padding-top:16.93vw;}
.phoneAuth .imgBox{margin:0 6.66vw 3.07vw 6.66vw}
.phoneAuth .h1{margin-bottom: 3.07vw;}

/* 서비스 소개 */
.introService{background:url(../img/login/bg_introServic.png)no-repeat 0 0;background-size:cover;min-height: 100vh;padding-top:23vw !important;}
.introService .slideBox{text-align: center;width:calc(100% + 12.3vw);margin-left:-6.15vw;}
.introService .slideBox .swiper-slide .imgBox{position: relative;opacity: 0;top:8vw;transition: all 0.8s 0.4s;}
.introService .slideBox .swiper-slide.swiper-slide-active .imgBox{opacity: 1;top:0;}
.introService .slideBox .swiper-pagination{position: relative;top:0;bottom:0;font-size: 0;line-height: 0;margin-bottom:5.64vw;}
.introService .slideBox .swiper-pagination .swiper-pagination-bullet{background:#fff;opacity: 0.3;margin:0 0.769vw;width:1.538vw;height:1.538vw;}
.introService .slideBox .swiper-pagination .swiper-pagination-bullet-active{opacity: 1;width:4.1vw;border-radius: 12.8vw;}
.introService .h1{color:#fff;margin-bottom:3.07vw;}
.introService .fs1{color: #fff;margin-bottom:4.1vw;min-height: 12.3vw;}
.introService .btnBottom{background: transparent !important;}

/* 이용약관 */
.agreeCon{margin-top:10.256vw;}
.agreeCon.checkBox .checkAll{margin-bottom:6.15vw;}
.agreeCon.checkBox ul{margin:0 5.12vw;}
.agreeCon.checkBox ul li{width:100%;position: relative;padding:0.5vw 0;padding-right: 9.23vw;}
.agreeCon.checkBox ul li + li{margin-top:5.128vw;}
.agreeCon.checkBox ul li a.link{position:absolute;right:0;top:0.5vw;width:6.15vw;height: 6.15vw;background:#E9EEF3 url(../img/ico_arrow_r_g.svg)no-repeat center center;background-size: 2vw 2vw;border-radius: 50%;}
.agreeCon.checkBox ul li a.link span{display: inline-block;text-indent: -99999px;}
.agreePop p,
.agreePop dl dd,
.agreePop dl dd li{color:#6D7B85;}
.agreePop p,
.agreePop dd{margin-top:2vw;}
.agreePop .tit{font-size: 4.1vw;line-height: 6.15vw;font-weight: 700;color:#222;margin-top:0;}
.agreePop .tit + .tit{margin-top:4.1vw;}
.agreePop .tit + dl{margin-top:8.2vw;}
.agreePop dl + dl{margin-top:8.2vw;}
.agreePop p + dl{margin-top:8.2vw;}
.agreePop dl dt{font-size: 4.1vw;line-height: 6.15vw;font-weight: 700;}
.agreePop dl dd li{padding-left: 2.3vw;position: relative;}
.agreePop dl dd li::before{content: '-';position: absolute;left:0;top:0;}
.agreePop dl dd li p.star{position: relative;margin-top:1vw;font-size:3.589vw;line-height:5.64vw;color:#A7ADBB;}
.agreePop dl dd li p.star::before{content:'*';position:absolute;left:-2.3vw;}

/* 계정설정 */
.h1 + .stepFlowBox{margin-top:10.256vw;}
.stepFlowBox .stepH{position: relative;top:-1vw;display: none;opacity: 0;}
.stepFlowBox .stepH.on{animation: stepS 0.2s 0.2s linear forwards;}
@keyframes stepS {
    0% {top:-1vw;opacity: 0;}
    100% {top:0;opacity: 1;}
}

/* 회원가입 완료 */
.joinFinish{min-height: calc(100vh - 27.69vw);position: relative;margin-top:-16.4vw;}
.joinFinish .imgBox{position: relative;width:66.66vw;margin:0 auto;margin-bottom:2vw;}
.joinFinish .imgBox::before{content:'';position: absolute;left:24.33vw;top:30.87vw;width:45.726vw;height:23.16vw;background:url(../img/login/img_join_finishi02.png)no-repeat 0 0;background-size: 100%;transform: scale(0);}
.joinFinish .imgBox::before{animation: flowerfly 0.6s 0.4s ease-in forwards;}
@keyframes flowerfly {
    0% {transform: scale(0);top:30.87vw;left:24.33vw;}
    100% {transform: scale(1);top:4.87vw;left:13.33vw;}
}
.joinFinish .h2{text-align: center;}


/* 로그인 */
.loginCon{padding-top:2vw;}
.loginCon .titBox{text-align: center;margin-bottom: 10.25vw;}
.loginCon .titBox .imgBox:nth-child(1){width:17.4vw;margin: 0 auto;margin-bottom: 2vw;}
.loginCon .titBox .imgBox:nth-child(2){width:28.97vw;margin:0 auto;margin-bottom: 3.589vw;}
.loginCon .checkBox.square + .btn{margin-top:6.15vw;}
.loginCon .linkList{display: flex;justify-content: center;align-items: center;margin-top:5.64vw;}
.loginCon .linkList li{position: relative;}
.loginCon .linkList li + li{padding-left:3vw;margin-left: 3vw;}
.loginCon .linkList li + li::before{content: '';position: absolute;left: 0;top:1vw;background: #DEE4EE;width:1px;height:4.1vw;}
.loginCon .linkList li a{color:#6D7B85;}
.loginCon .linkList li a span{display: inline-block;line-height: 6.15vw;}
.loginCon .easyLoingBox{margin-top:10.256vw;}
.loginCon .easyLoingBox .fs1{text-align: center;}
.loginCon .easyLoingBox ul{display: flex;justify-content: center;align-items: center;margin-top:7.179vw;}
.loginCon .easyLoingBox ul li{width:14.35vw;height:14.35vw;position: relative;}
.loginCon .easyLoingBox ul li + li{margin-left:9.23vw}
.loginCon .easyLoingBox ul li.naver{background: url(../img/login/ico_naver.png)no-repeat 0 0;background-size:100%;}
.loginCon .easyLoingBox ul li.google{background: url(../img/login/ico_google.png)no-repeat 0 0;background-size:100%;}
.loginCon .easyLoingBox ul li.kakao{background: url(../img/login/ico_kakao.png)no-repeat 0 0;background-size:100%;}
.loginCon .easyLoingBox ul li a{display: block;width: 100%;height: 100%;}
.loginCon .easyLoingBox ul li a span{display: inline-block;text-indent: -99999px;}
.loginCon .easyLoingBox ul li.recent::before{content:'최근 로그인';position: absolute;width:100%;height:6.15vw;left:-2.56vw;top:-4.1vw;padding:0 3.07vw;font-size: 3vw;line-height: 6.15vw;font-weight: 500;border-radius: 10.25vw;background:#fff;box-shadow: 0px 1vw 5.589vw 0px rgba(75, 99, 145, 0.25);text-align: center;}
.loginCon .easyLoingBox ul li.recent::after{content:'';position: absolute;width: 3.76vw;left:6.14vw;top: 1.54vw;background: url(../img/login/ico_bubble_tail.png)no-repeat 0 0;background-size: 100%;z-index: 2;height: 2.56vw;}

/* 아이디/비밀번호 재설정 */
.confirmTxt{padding-top:10.25vw;background: url(../img/ico_check_result.png)no-repeat center top;background-size: 8.2vw;text-align: center;}

/***************************
    2. 메인
***************************/
.wrap.main{background:#F3F4F6 url(../img/main/bg_main.png)repeat-y 0 0;background-size: 100% auto;}
/* 스켈레톤 박스 */
:root {
    /* --bg-color: rgba(130, 159, 185, 1); */
    --bg-color: #DCE3EA;
}
.relCon{position: relative;}
.skelBox {position: absolute;width: 100%;height: 100%;background: var(--bg-color);z-index: 100;left:0;top:0;}
/* 스켈레톤 이미지 */
.skelImg {width: 100%;height: 100%;}

/* 스켈레톤 텍스트 */
.skelTxt {width:auto;height:auto;}
.skelBox * {
    background: linear-gradient(120deg, #CCD6E0 30%, #f0f0f0 38%, #f0f0f0 40%, #CCD6E0 48%);
    border-radius: 2vw;
    background-size: 200% 100%;
    background-position: 100% 0;
    animation: skelLoad 1s infinite;
}

@keyframes skelLoad {
    100% {background-position: -100% 0;}
}


/* 스켈레톤 영역 */
.contents.main .slideTop .skelBox{border-radius: 0;}
.contents.main .slideTop .skelBox .skelImg:nth-child(1){width:100%;height:100%;border-radius: 0;}
.contents.main .slideTop .skelBox .skelTxt{position: absolute;bottom: -3.538vw;width: 25%;height: 2vw;left: 50%;margin-left: -12.5%;}

.contents.main .slideTop{position: relative;width:calc(100% + 12.3vw);margin-left: -6.15vw;}
.contents.main .slideTop .slideCon{position: relative;}
.contents.main .slideTop .slideCon .pagination_container{position: absolute;width: 100%;bottom: 0;left: 0;}
.contents.main .slideTop .slideCon .swiper-pagination{position: relative;z-index: 1;}
.contents.main .slideTop .slideCon .swiper-pagination2{position: absolute;right: 6.15vw;bottom: 3.589vw;z-index: 1;width: auto;top: auto;left: auto;background:rgba(0,0,0,0.6);height: 5.128vw;padding:0 2vw;border-radius: 17.948vw;color: #fff;line-height: 5.128vw;font-size: 3vw;}
.contents.main .slideTop .slideCon .swiper-pagination {position: relative;top: auto;bottom: -3.538vw;font-size: 0;line-height: 0;}
.contents.main .slideTop .slideCon .swiper-pagination .swiper-pagination-bullet {background: rgba(0,0,0,0.4);opacity: 0.3;margin: 0 0.769vw;width: 1.538vw;height: 1.538vw;}
.contents.main .slideTop .slideCon .swiper-pagination .swiper-pagination-bullet-active {background: #444;opacity: 1;width: 4.1vw;border-radius: 12.8vw;}

.contents.main .bodyAgeCon .titBox .skelBox,
.contents.main .myStateCon .titBox .skelBox{background: #fff;}
.contents.main .bodyAgeCon .titBox .skelTxt,
.contents.main .myStateCon .titBox .skelTxt{width: 100%;height: 100%;}
.contents.main .bodyAgeCon .cardList > div .skelBox{border-radius: 8vw;padding:4vw 3vw 2.8vw;}
.contents.main .bodyAgeCon .cardList > div .skelBox .skelTxt:nth-child(1){width:40%;height:5.128vw;margin-bottom: 1vw;}
.contents.main .bodyAgeCon .cardList > div .skelBox .skelTxt:nth-child(2){width:100%;height:5.128vw;}
.contents.main .bodyAgeCon .cardList > div .skelBox .skelTxt:nth-child(3){width:50%;height:5.128vw;margin-top:1vw;}
.contents.main .bodyAgeCon .cardList > div .skelBox .skelTxt:nth-child(4){position: absolute;width: calc(100% - 6vw);height:11.28vw;left:3vw;bottom:10.256vw;border-radius: 15.38vw;}

.contents.main .bodyAgeCon{margin-top:13.84vw}
.contents.main .bodyAgeCon .titBox{position: relative;}
.contents.main .bodyAgeCon .titBox .skelBox .skelTxt{border-radius: 1vw;}
.contents.main .bodyAgeCon .cardList{display: flex;margin-top:4vw;}
.contents.main .bodyAgeCon .cardList > div{width: 100%;border-radius: 8.2vw;padding:4vw 3vw 2.8vw;position: relative;min-height: 53.84vw;}
.contents.main .bodyAgeCon .cardList > div + div{margin-left: 2vw;}
.contents.main .bodyAgeCon .cardList .walk{background:#3CD187;}
.contents.main .bodyAgeCon .cardList .walk .imgBox > div,
.contents.main .bodyAgeCon .cardList .age .imgBox > div{position: absolute;}
.contents.main .bodyAgeCon .cardList .walk .imgBox > div:nth-child(1){right: 4.6vw;top:17.9vw;width: 7.4vw;height:9.658vw;background: url(../img/main/img_main_walk01.png)no-repeat 0 0;background-size: 100% 100%;z-index: 1;}
.contents.main .bodyAgeCon .cardList .walk .imgBox > div:nth-child(2){right: 10.5vw;top:22.8vw;width: 11.28vw;height:9.23vw;background: url(../img/main/img_main_walk02.png)no-repeat 0 0;background-size: 100% 100%;z-index: 2;
    animation: mainWalk 2s 6 linear;
}
.contents.main .bodyAgeCon .cardList .walk .imgBox > div:nth-child(3){right: 6.9vw;top:25vw;width: 11.28vw;height:9.23vw;background: url(../img/main/img_main_walk02.png)no-repeat 0 0;background-size: 100% 100%;z-index: 3;
    animation: mainWalk 2s 1s 6 linear;
}
@keyframes mainWalk {
    0% {
        transform: translateY(0) translateX(0) rotate(0);
    }
    50% {
        transform: translateY(-1vw) translateX(0.5vw) rotate(30deg);
    }
    100% {
        transform: translateY(0) translateX(0) rotate(0);
    }
}

.contents.main .bodyAgeCon .cardList .age .imgBox > div:nth-child(1){right: 6.66vw;top:24vw;width:11.79vw;height:10.769vw;background: url(../img/main/img_main_age01.png)no-repeat 0 0;background-size: 100% 100%;z-index: 1;}
.contents.main .bodyAgeCon .cardList .age .imgBox > div:nth-child(2){right: 8.2vw;top:20.256vw;width: 10.769vw;height:9.7vw;background: url(../img/main/img_main_age02.png)no-repeat 0 0;background-size: 100% 100%;z-index: 2;
    clip-path: inset(0 100% 0 0);
    animation: mainAge 1.6s 6 linear;
}
@keyframes mainAge {
    0% {clip-path: inset(0 100% 0 0);}
    60% {clip-path: inset(0 0 0 0);}
    100% {clip-path: inset(0 0 0 0);}
}

.contents.main .bodyAgeCon .cardList .age{background:#58AEFF;}
.contents.main .bodyAgeCon .cardList > div .btn.label{text-align: left;margin-bottom:0.5vw;padding-left: 1vw;}
.contents.main .bodyAgeCon .cardList > div .btn.label a span{display: inline-block;color:#fff;font-weight: 500;padding-right: 3.589vw;background:url(../img/ico_arrow_r_w.png)no-repeat right center;background-size: 3vw;}
.contents.main .bodyAgeCon .cardList > div .txt{font-weight: 700;color:#fff;padding-left: 1vw;}
.contents.main .bodyAgeCon .cardList > div .txt .btn.set{width: 16.9vw;border-radius: 15.38vw;background: rgba(34, 34, 34, 0.3);margin-top:0.769vw;margin-left: -1vw;}
.contents.main .bodyAgeCon .cardList > div .txt .btn.set span{display: block;font-size: 3vw;line-height: 5.128vw;color:#fff;padding-right: 3.589vw;background:url(../img/ico_arrow_r_w.png)no-repeat right 0.5vw center;background-size: 3vw;padding-left: 1.53vw;}
.contents.main .bodyAgeCon .cardList > div .txt .btn.reGoal{margin-left: -1vw;display: flex;align-items: center;}
.contents.main .bodyAgeCon .cardList > div .txt .btn.reGoal > p{border-radius: 15.38vw;background: rgba(34, 34, 34, 0.3);font-size:3vw;line-height: 5.128vw;color:#fff;padding:0 1.53vw;height: 5.128vw;}
.contents.main .bodyAgeCon .cardList > div .txt .btn.reGoal span{display: inline-block;font-size: 3.589vw;line-height: 5.128vw;color:#fff;padding-right: 3.589vw;background:url(../img/ico_arrow_r_w.png)no-repeat right center;background-size: 3vw;padding-left: 1.53vw;}
.contents.main .bodyAgeCon .cardList > div .nowAge{display: flex;align-items: center;margin-left: -1vw;}
.contents.main .bodyAgeCon .cardList > div .nowAge > p.tit{border-radius: 15.38vw;background: rgba(34, 34, 34, 0.3);font-size:3vw;line-height: 5.128vw;color:#fff;padding:0 1.53vw;height: 5.128vw;}
.contents.main .bodyAgeCon .cardList > div .nowAge > p.txt{font-size: 3.589vw;line-height: 5.128vw;color:#fff;}
.contents.main .bodyAgeCon .cardList > div .bgBox{position: absolute;width: calc(100% - 6vw);height:11.28vw;left:3vw;bottom:10.256vw;background:rgba(0,0,0,0.2);border-radius: 15.38vw;text-align: center;font-weight: 700;color:#fff;line-height: 10.28vw;display: flex;align-items: center;justify-content: center;}
.contents.main .bodyAgeCon .cardList > div .bgBox span{font-size: 4.6vw;margin-right: 0.5vw;}
.contents.main .bodyAgeCon .cardList > div .bgBox .gap{display: inline-block;vertical-align: top;height: 5.128vw;padding:0 1.538vw;border-radius: 1.538vw;background: #E0F4E5;color:#32B06D;font-size: 3vw;line-height: 5.128vw;margin-right: 1vw;}
.contents.main .bodyAgeCon .cardList > div .bgBox .gap.up,
.contents.main .bodyAgeCon .cardList > div .bgBox .gap.down{padding:0 1.538vw 0 4vw;}
.contents.main .bodyAgeCon .cardList > div .bgBox .gap.up{background: rgba(242, 124, 99, 0.15) url(../img/bodyAge/ico_age_up.png)no-repeat left 1.538vw center;color:#4299FF;background-size:2.56vw;}
.contents.main .bodyAgeCon .cardList > div .bgBox .gap.down{background: #D6E9FF url(../img/bodyAge/ico_age_down.png)no-repeat left 1.538vw center;color:#4299FF;background-size:2.56vw;}
.contents.main .bodyAgeCon .cardList > div .btn.connect,
.contents.main .bodyAgeCon .cardList > div .date{height: 5.64vw;bottom:2.56vw;width:100%;text-align: center;position: absolute;left:0;}
.contents.main .bodyAgeCon .cardList > div .date span{font-size: 2.8vw;line-height: 2;font-family: 'gSans';color:#fff;vertical-align: top;}
.contents.main .bodyAgeCon .cardList > div .btn.connect a span{padding-left: 6.15vw;padding-right:4vw;font-weight: 500;font-size:3.589vw;line-height: 5.128vw;display: inline-block;color:#fff;}
.contents.main .bodyAgeCon .cardList > div .btn.connect a span{background:url(../img/healthRecord/ico_health_aos.png)no-repeat left center, url(../img/ico_arrow_r_w.png)no-repeat right center;background-size: 5.128vw, 3vw;}
body.ios .contents.main .bodyAgeCon .cardList > div .btn.connect a span{background:url(../img/healthRecord/ico_health_ios.png)no-repeat left center, url(../img/ico_arrow_r_w.png)no-repeat right center;background-size: 5.128vw, 3vw;}
.contents.main .bodyAgeCon .cardList > div.walk.before .bgBox,
.contents.main .bodyAgeCon .cardList > div.walk.after .bgBox,
.contents.main .bodyAgeCon .cardList > div.age.after .bgBox{background:#fff;color:#222;}
.contents.main .bodyAgeCon .cardList > div.walk.before .bgBox .date,
.contents.main .bodyAgeCon .cardList > div.walk.after .bgBox .date,
.contents.main .bodyAgeCon .cardList > div.age.after .bgBox .date{}
.contents.main .bodyAgeCon .cardList > div.walk.before .btn.reset{display: none;}
.contents.main .bodyAgeCon .cardList > div.walk.after .btn.reset{display: flex;height: 5.64vw;bottom: 2.56vw;width: 100%;text-align: center;position: absolute;left: 0;justify-content: center;}
.contents.main .bodyAgeCon .cardList > div.walk.after .btn.reset > a{display: block;background: url(../img/ico_reset_w.png)no-repeat left center;background-size: 5.128vw;padding-left:5.128vw;}
.contents.main .bodyAgeCon .cardList > div.walk.after .btn.reset a span{font-size: 2.8vw;line-height: 2;font-family: 'gSans';color:#fff;display: inline-block;vertical-align: top;}

.contents.main .myStateCon{margin-top:10.25vw;}
.contents.main .myStateCon .titBox{position: relative;}
.contents.main .myStateCon .healthCardList li{position: relative;}
.contents.main .myStateCon .healthCardList li + li{margin-top:4vw;}


.contents.main .healthCardList li.meal > .before .imgBox > div:nth-child(1),
.contents.main .healthCardList li.meal .bottom .imgBox > div:nth-child(1),
.contents.main .healthCardList li.bSugar > .before .imgBox > div:nth-child(1),
.contents.main .healthCardList li.bSugar .bottom .imgBox > div:nth-child(1),
.contents.main .healthCardList li.bPressure > .before .imgBox > div:nth-child(1),
.contents.main .healthCardList li.bPressure > .before .imgBox > div:nth-child(2),
.contents.main .healthCardList li.bPressure > .before .imgBox > div:nth-child(3),
.contents.main .healthCardList li.bPressure .bottom .imgBox > div:nth-child(1),
.contents.main .healthCardList li.bPressure .bottom .imgBox > div:nth-child(2),
.contents.main .healthCardList li.bPressure .bottom .imgBox > div:nth-child(3),
.contents.main .healthCardList li.weight > .before .imgBox > div:nth-child(1),
.contents.main .healthCardList li.weight > .before .imgBox > div:nth-child(2),
.contents.main .healthCardList li.weight > .before .imgBox > div:nth-child(3),
.contents.main .healthCardList li.weight > .before .imgBox > div:nth-child(4),
.contents.main .healthCardList li.weight > .before .imgBox > div:nth-child(5),
.contents.main .healthCardList li.weight .bottom .imgBox > div:nth-child(1){animation:none;}

.contents.main .healthCardList li.meal.is-active > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_meal_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:16.9vw;height:16.9vw;left:11.53vw;top:2vw;animation: popRoundM 2s linear forwards;transform:scale(0) rotate(0);opacity: 0;transform-origin: bottom center;}
.contents.main .healthCardList li.meal.is-active .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_meal02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:10.769vw;height: 10.769vw;left:10vw;top:0;animation: spinM 1s linear forwards;transform:translateY(0) rotate(0);}
.contents.main .healthCardList li.bSugar.is-active > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bSugar_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:15.89vw;height:15.89vw;left:4vw;bottom:6.4vw;animation: whriteM 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(0);}
.contents.main .healthCardList li.bSugar.is-active .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bSugar02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:12.3vw;height: 12.3vw;left:1.79vw;top:2.82vw;animation: whriteM 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(0);}
.contents.main .healthCardList li.bPressure.is-active > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bPressure_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:6.15vw;height:6.15vw;right:8.46vw;top:6.15vw;animation: bounce 1.2s linear 2 forwards;transform:scale(0.3);}
.contents.main .healthCardList li.bPressure.is-active > .before .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_bPressure_before03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:6.66vw;height:6.66vw;left:6.66vw;top:10.769vw;animation: bounce 1s linear 2 forwards;transform:scale(0.6);}
.contents.main .healthCardList li.bPressure.is-active > .before .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_bPressure_before04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:8.2vw;height:8.2vw;right:7.179vw;bottom:3vw;animation: bounce 1.4s linear 2 forwards;transform:scale(1);}
.contents.main .healthCardList li.bPressure.is-active .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bPressure02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4.6vw;height: 4.6vw;right:4.87vw;top:0.25vw;animation: bounce 1.2s linear 2 forwards;transform:scale(0.3);}
.contents.main .healthCardList li.bPressure.is-active .bottom .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_bPressure03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4.6vw;height: 4.6vw;left:2.56vw;top:4vw;animation: bounce 1s linear 2 forwards;transform:scale(0.6);}
.contents.main .healthCardList li.bPressure.is-active .bottom .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_bPressure04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:5.128vw;height: 5.128vw;right:4.6vw;bottom:0.5vw;animation: bounce 1.4s linear 2 forwards;transform:scale(1);}
.contents.main .healthCardList li.weight.is-active > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_weight_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3vw;height:3vw;right:19.48vw;top:3.58vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.contents.main .healthCardList li.weight.is-active > .before .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_weight_before03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4vw;height:4vw;left:8.97vw;top:5vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.contents.main .healthCardList li.weight.is-active > .before .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_weight_before04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3.58vw;height:3.58vw;left:33.33vw;bottom:12.3vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.contents.main .healthCardList li.weight.is-active > .before .imgBox > div:nth-child(4){background: url(../img/healthRecord/img_sub_weight_before05.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3.58vw;height:3.58vw;left:8.46vw;bottom:3.58vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.contents.main .healthCardList li.weight.is-active > .before .imgBox > div:nth-child(5){background: url(../img/healthRecord/img_sub_weight_before06.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3vw;height:3vw;left:18.97vw;top:12vw;animation: roundM 2s linear 2 forwards;transform:rotate(0);transform-origin: bottom center;}
.contents.main .healthCardList li.weight.is-active .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_weight02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:2.56vw;height: 2.56vw;left:11.79vw;top:5.128vw;animation: roundM 2s linear 2 forwards;transform:rotate(0);transform-origin: bottom center;}

/* 스켈레톤 영역 */
.contents.main .myStateCon .healthCardList li.meal .skelBox{border-radius: 6.15vw;padding:4vw 6.15vw;}
.contents.main .myStateCon .healthCardList li.meal.prev .skelBox .skelTxt:nth-child(1){width:20%;height:5.64vw;margin-top: 1vw;}
.contents.main .myStateCon .healthCardList li.meal.prev .skelBox .skelTxt:nth-child(2){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.meal.prev .skelBox .skelTxt:nth-child(3){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(1){width: 20%;height: 5.64vw;position: absolute;left: 3vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(2){width: 32%;height: 5.128vw;margin-top: 2vw;position: absolute;right: 2vw;top: 2vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(3){width: 50%;height: 6.128vw;position: absolute;top: 30vw;left: 21vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(4){width: 43%;height: 5.6vw;position: absolute;bottom: 16vw;left: 5vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(5){width: 43%;height: 5.6vw;position: absolute;bottom: 16vw;right: 4vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(6){width: 43%;height: 5.6vw;position: absolute;bottom: 7vw;left: 5vw;}
.contents.main .myStateCon .healthCardList li.meal.next .skelBox .skelTxt:nth-child(7){width: 43%;height: 5.6vw;position: absolute;bottom: 7vw;right: 4vw;}
.contents.main .myStateCon .healthCardList li.weight .skelBox{border-radius: 6.15vw;padding:4vw 6.15vw;}
.contents.main .myStateCon .healthCardList li.weight.prev .skelBox .skelTxt:nth-child(1){width:20%;height:5.64vw;margin-top: 1vw;}
.contents.main .myStateCon .healthCardList li.weight.prev .skelBox .skelTxt:nth-child(2){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.weight.prev .skelBox .skelTxt:nth-child(3){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.weight.noBgTxt .skelBox .skelTxt:nth-child(1){width: 20%;height: 5.64vw;position: absolute;left: 3vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.weight.noBgTxt .skelBox .skelTxt:nth-child(2){width: 32%;height: 5.128vw;position: absolute;right: 2vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.weight.noBgTxt .skelBox .skelTxt:nth-child(3){width: 50%;height: 6.128vw;position: absolute;top: 30vw;left: 21vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .top{padding:0 1vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt{padding:3vw;}
.contents.main .myStateCon .healthCardList li.weight.noBgTxt .bottom{padding-bottom: 5.128vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .bottom{padding:0;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt{padding:3vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .skelBox .skelTxt:nth-child(1){width: 20%;height: 5.64vw;position: absolute;left: 3vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .skelBox .skelTxt:nth-child(2){width: 32%;height: 5.128vw;position: absolute;right: 2vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .skelBox .skelTxt:nth-child(3){width: 50%;height: 6.128vw;position: absolute;top: 30vw;left: 21vw;}
.contents.main .myStateCon .healthCardList li.weight.bgTxt .skelBox .skelTxt:nth-child(4){width: 78%;height: 13.128vw;position: absolute;bottom: 3vw;left: 9.6vw;}
.contents.main .myStateCon .healthCardList li.pose .skelBox{border-radius: 6.15vw;padding:4vw 6.15vw;}
.contents.main .myStateCon .healthCardList li.pose.prev .skelBox .skelTxt:nth-child(1){width:20%;height:5.64vw;margin-top: 1vw;}
.contents.main .myStateCon .healthCardList li.pose.prev .skelBox .skelTxt:nth-child(2){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.pose.prev .skelBox .skelTxt:nth-child(3){width:50%;height:5.128vw;margin-top:2vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(1){width: 35%;height: 5.64vw;position: absolute;left: 3.5vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(2) {width: 24%;height: 5.128vw;top: 15.5vw;position: absolute;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(3) {width: 70%;height: 5.128vw;position: absolute;left: 23vw;top: 21.5vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(4) {width: 70%;height: 5.128vw;position: absolute;left: 23vw;top: 27vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(5) {width: 17.4vw;height: 17.4vw;position: absolute;top: 16vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(6) {width: 31%;height: 5.128vw;position: absolute;bottom: 14vw;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(7) {width: 31%;height: 5.128vw;position: absolute;bottom: 14vw;right: 2vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(8) {width: 31%;height: 6.128vw;position: absolute;bottom: 6.5vw;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.strech .skelBox .skelTxt:nth-child(9) {width: 17.4vw;height: 17.4vw;position: absolute;bottom: 3vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(1) {width: 35%;height: 5.64vw;position: absolute;left: 3.5vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(2) {width: 24%;height: 5.128vw;top: 16.5vw;position: absolute;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(3) {width: 32%;height: 5.128vw;position: absolute;right: 5px;top: 16.5vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(4) {top: 23vw;width: 31%;height: 6.128vw;position: absolute;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(5) {width: 17.4vw;height: 17.4vw;position: absolute;top: 15vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(6) {width: 44%;height: 13.128vw;position: absolute;top: 34vw;left: 4vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(7) {right: 5vw;width: 44%;height: 13.128vw;position: absolute;top: 34vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(8) {width: 33%;height: 6.128vw;position: absolute;bottom: 15.5vw;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(9) {width: 17.4vw;height: 17.4vw;position: absolute;bottom: 4.5vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(10) {width: 70%;height: 5.128vw;position: absolute;left: 23vw;bottom: 10vw;}
.contents.main .myStateCon .healthCardList li.pose.correction .skelBox .skelTxt:nth-child(11) {width: 70%;height: 5.128vw;position: absolute;left: 23vw;bottom: 4.5vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(1) {width: 35%;height: 5.64vw;position: absolute;left: 3.5vw;top: 4vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(2) {width: 24%;height: 5.128vw;top: 16.5vw;position: absolute;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(3) {width: 32%;height: 5.128vw;position: absolute;right: 5px;top: 16.5vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(4) {top: 23vw;width: 31%;height: 6.128vw;position: absolute;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(5) {width: 17.4vw;height: 17.4vw;position: absolute;top: 15vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(6) {width: 44%;height: 13.128vw;position: absolute;top: 34vw;left: 4vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(7) {right: 5vw;width: 44%;height: 13.128vw;position: absolute;top: 34vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(8) {width: 33%;height: 6.128vw;position: absolute;bottom: 13.5vw;left: 23vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(9) {width: 17.4vw;height: 17.4vw;position: absolute;bottom: 3.5vw;left: 3.5vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(10) {width: 31%;height: 5.128vw;position: absolute;bottom: 14vw;right: 2vw;}
.contents.main .myStateCon .healthCardList li.pose.both .skelBox .skelTxt:nth-child(11) {width: 31%;height: 6.128vw;position: absolute;bottom: 6.5vw;left: 23vw;}

.contents.main .healthCardList li > .before .txtBox .tit{margin-bottom: 0;}



/* 공지사항  */
.contents.main .noticeCon{margin-top:6.15vw;position: relative;}
.contents.main .noticeCon .btn.notice{border-radius: 4.1vw;background: #fff;box-shadow: 2px 4px 12px 0px rgba(24, 33, 82, 0.05);}
.contents.main .noticeCon .btn.notice a{padding:4vw;background:url(../img/ico_notice.png)no-repeat left 4vw center, url(../img/ico_arrow_r_bk.png)no-repeat right 4vw center;background-size: 6.15vw, 3vw;}
.contents.main .noticeCon .btn.notice a p{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding:0 6.15vw 0 9.23vw;font-size: 3.589vw;line-height: 6.15vw;font-weight: 500;}

.contents.main .noticeCon .skelBox{border-radius: 4.1vw;padding:4vw 6.15vw;}
.contents.main .noticeCon .skelBox .skelTxt:nth-child(1){width:20%;height:5.64vw;margin-top: 1vw;}



/***************************
    3.건강 기록
***************************/
/* 건강 기록 */
.noData .btn.connect{margin-top:4vw;display: flex;justify-content: center;}
.noData .btn.connect a{box-shadow: 0px 1vw 3vw 0px rgba(101, 121, 163, 0.2);border-radius: 15.38vw;padding:2.8vw 4vw;}
.noData .btn.connect a span{padding-left: 7.179vw;font-weight: 500;line-height: 6.15vw;display: inline-block;}
.noData .btn.connect a span{background:url(../img/healthRecord/ico_health_aos.png)no-repeat left center;background-size: 5.128vw;}
body.ios .noData .btn.connect a span{background:url(../img/healthRecord/ico_health_ios.png)no-repeat left center;background-size: 5.128vw;}

.dateBox{display: flex;}
.dateBox > a{display: block;width:5.128vw;height:5.128vw;background: url(../img/ico_reset_time.png)no-repeat 0 0;background-size: 100%;}
.dateBox > a span{display: inline-block;text-indent: -99999px;}
.dateBox > .date{font-size: 2.8vw;line-height:1.8;color:#A7ADBB;font-family: 'gSans';}

.healthCardList{padding-top:6.15vw;}
.healthCardList li{border-radius:6.15vw;background:#fff;box-shadow: 2px 4px 12px 0px rgba(24, 33, 82, 0.05);}
.healthCardList li + li{margin-top:3vw;}
.healthCardList li > .before{padding-left: 6.15vw;display: flex;justify-content: space-between;align-items: center;}
.healthCardList li > .before .txtBox .label{font-size:3.589vw;line-height: 5.64vw;font-weight: 500;color:#A7ADBB;margin-bottom: 1vw;}
.healthCardList li > .before .txtBox .tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;}
.healthCardList li > .before a{display: block;}
.healthCardList li > .before .imgBox{position: relative;}
.healthCardList li .top{display: flex;justify-content: space-between;}
.healthCardList li .top .btn{width: auto;}
.healthCardList li .top .btn a{display: block;padding-right: 3.589vw;background: url(../img/ico_arrow_r_g_02.png)no-repeat right center;background-size: 3vw;}
.healthCardList li .top .btn a span{font-size: 4vw;line-height: 6.15vw;font-weight: 700;display: inline-block;vertical-align: middle;}
.healthCardList li > .before .imgBox{width:42vw;height: 31.28vw;}
.healthCardList li .bottom .imgBox{width:30.769vw;height:17.9vw;margin:0 auto;position: relative;}
.healthCardList li .bottom .goalBox{display: flex;justify-content: center;align-items: center;margin-top:1vw;}
.healthCardList li .bottom .goalBox p{color:#6D7B85;font-size: 3.58vw;line-height: 5.12vw;font-weight: 500;}
.healthCardList li .bottom .goalBox .label{font-size:3vw;line-height: 5.128vw;border-radius: 1.53vw;padding:0 1.53vw;font-weight: 700;margin-right: 1vw;margin-bottom:0.5vw;}
.healthCardList li .bottom .goalBox .label.gray{color:#A7ADBB;background:rgba(175, 173, 172, 0.15);}
.healthCardList li .bottom .goalBox .label.red{color:#F27C63;background:rgba(242, 124, 99, 0.15);}
.healthCardList li .bottom .goalBox .label.blue{color:#4299FF;background:rgba(66, 153, 255, 0.2)}
.healthCardList li .bottom .counterBox{font-size: 5.12vw;line-height: 1.6;font-weight: 700;font-family: 'gSans';margin-right: 1vw;}
.healthCardList li .bottom .counterBox .counter{font-size: 5.12vw;line-height: 1.6;font-weight: 700;font-family: 'gSans';display: inline-block;}
.healthCardList li .bottom .btn.setGoal{display: flex;justify-content: center;margin-top:2vw;}
.healthCardList li .bottom .btn.setGoal a{display: block;padding:1.53vw 4.358vw;border:1px solid #D7D8E2;border-radius: 23vw;}
.healthCardList li .bottom .btn.setGoal a span{display:inline-block;padding-left: 7.179vw;background:url(../img/healthRecord/ico_btn_goal.png)no-repeat left center;background-size:6.15vw;font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;}
/* 걸음 */
.healthCardList li.walk > .before .txtBox .btn.connect{text-align: left;padding-left: 6.15vw;margin-top:1vw;}
.healthCardList li.walk > .before .txtBox .btn.connect span{display: inline-block;position: relative;padding-right: 4.1vw;background:url(../img/healthRecord/ico_health_txt_link.png)no-repeat right center;background-size: 3vw;font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;}
.healthCardList li.walk > .before .txtBox .btn.connect{background:url(../img/healthRecord/ico_health_aos.png)no-repeat left center;background-size: 5.128vw;}
.ios .healthCardList li.walk > .before .txtBox .btn.connect{background:url(../img/healthRecord/ico_health_ios.png)no-repeat left center;background-size: 5.128vw;}
.healthCardList li.walk > .before > a{padding:3.33vw 0;padding-left: 6.15vw;}
.healthCardList li.walk > .before .imgBox{background:url(../img/healthRecord/img_sub_walk_before01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.walk > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_walk_before02.png)no-repeat 0 0;background-size:12.8vw;position: absolute;width:12.8vw;height: 12.8vw;left:14vw;bottom:5.38vw;animation: walking 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(36deg);}
.healthCardList li.walk .top{padding:4.1vw;padding-bottom:0;}
.healthCardList li.walk .bottom{padding:4.1vw;padding-top:0;}
.healthCardList li.walk .bottom .imgBox{background:url(../img/healthRecord/img_sub_walk01.png)no-repeat 0 0;background-size: 100% auto;}
.healthCardList li.walk .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_walk02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:10.769vw;height: 10.769vw;left:10vw;top:5.38vw;animation: walking 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(36deg);}
@keyframes walking {
    0% {
        transform: translateX(0) translateY(0) rotate(36deg);
    }
    33% {
        transform: translateX(-1.5vw) translateY(-1vw) rotate(36deg);
    }
    66% {
        transform: translateX(-1.5vw) translateY(0) rotate(0deg);
    }
    100% {
        transform: translateX(0) translateY(0) rotate(0deg);
    }
}

/* 식사 */
.healthCardList li.meal > .before .imgBox{background:url(../img/healthRecord/img_sub_meal_before01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.meal > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_meal_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:16.9vw;height:16.9vw;left:11.53vw;top:2vw;animation: popRoundM 2s linear forwards;transform:scale(0) rotate(0);opacity: 0;transform-origin: bottom center;}
.healthCardList li.meal .top{padding:4.1vw;padding-bottom:0;}
.healthCardList li.meal .bottom{padding:3vw;padding-top:0;}
.healthCardList li.meal .bottom .imgBox{background:url(../img/healthRecord/img_sub_meal01.png)no-repeat 0 0;background-size: 100% auto;}
.healthCardList li.meal .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_meal02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:10.769vw;height: 10.769vw;left:10vw;top:0;animation: spinM 1s linear forwards;transform:translateY(0) rotate(0);}
.healthCardList li.meal .bottom .mealDetail{background: #F6F8F9;padding:2.56vw 0;border-radius: 4vw;display: flex;flex-wrap: wrap;margin-top:2vw;}
.healthCardList li.meal .bottom .mealDetail dl{width:50%;display: flex;justify-content: space-between;padding:1.53vw 4vw;}
.healthCardList li.meal .bottom .mealDetail dl dt{padding-left: 4vw;font-size: 3.589vw;line-height: 5.64vw;color: #6D7B85;position: relative;}
.healthCardList li.meal .bottom .mealDetail dl dd{font-size: 3.589vw;line-height: 5.64vw;font-family: 'gSans';font-weight: 700;}
.healthCardList li.meal .bottom .mealDetail dl dt::before{content:'';position: absolute;left:0;top:50%;margin-top:-1.5vw;width:3vw;height: 3vw;border-radius: 1vw;}
.healthCardList li.meal .bottom .mealDetail dl:nth-child(1) dt::before{background:#DA8156;}
.healthCardList li.meal .bottom .mealDetail dl:nth-child(2) dt::before{background:#69AC6C;}
.healthCardList li.meal .bottom .mealDetail dl:nth-child(3) dt::before{background:#9076E3;}
.healthCardList li.meal .bottom .mealDetail dl:nth-child(4) dt::before{background:#8D9EAB;}
@keyframes popRoundM {
    0% {
        transform:scale(0) rotate(0);opacity: 0;
    }
    40% {
        transform:scale(1) rotate(0);opacity: 1;
    }
    50% {
        transform:scale(1) rotate(-10deg);opacity: 1;
    }
    75% {
        transform:scale(1) rotate(10deg);opacity: 1;
    }
    100% {
        transform:scale(1) rotate(0deg);opacity: 1;
    }
}
@keyframes spinM {
    0% {
        transform:translateY(0) rotate(0);
    }
    50% {
        transform:translateY(-5vw) rotate(320deg);
    }
    100% {
        transform:translateY(0) rotate(360deg);
    }
}



/* 혈당 */
.healthCardList li.bSugar > .before .imgBox{background:url(../img/healthRecord/img_sub_bSugar_before01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.bSugar > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bSugar_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:15.89vw;height:15.89vw;left:4vw;bottom:6.4vw;animation: whriteM 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(0);}
.healthCardList li.bSugar .top{padding:4.1vw;padding-bottom:0;}
.healthCardList li.bSugar .bottom{padding:4.1vw;padding-top:0;}
.healthCardList li.bSugar .bottom .imgBox{background:url(../img/healthRecord/img_sub_bSugar01.png)no-repeat 0 0;background-size: 100% auto;}
.healthCardList li.bSugar .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bSugar02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:12.3vw;height: 12.3vw;left:1.79vw;top:2.82vw;animation: whriteM 1s linear 2 forwards;transform: translateX(0) translateY(0) rotate(0);}
@keyframes whriteM {
    0% {
        transform: translateX(0) translateY(0) rotate(0);
    }
    25% {
        transform: translateX(0) translateY(-1vw) rotate(10deg);
    }
    50% {
        transform: translateX(1.5vw) translateY(0) rotate(-10deg);
    }
    75% {
        transform: translateX(1.5vw) translateY(-1vw) rotate(0);
    }
    100% {
        transform: translateX(0) translateY(0) rotate(0);
    }
}

/* 혈압 */
.healthCardList li.bPressure > .before .imgBox{background:url(../img/healthRecord/img_sub_bPressure_before01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.bPressure > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bPressure_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:6.15vw;height:6.15vw;right:8.46vw;top:6.15vw;animation: bounce 1.2s linear 2 forwards;transform:scale(0.3);}
.healthCardList li.bPressure > .before .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_bPressure_before03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:6.66vw;height:6.66vw;left:6.66vw;top:10.769vw;animation: bounce 1s linear 2 forwards;transform:scale(0.6);}
.healthCardList li.bPressure > .before .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_bPressure_before04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:8.2vw;height:8.2vw;right:7.179vw;bottom:3vw;animation: bounce 1.4s linear 2 forwards;transform:scale(1);}
.healthCardList li.bPressure .top{padding:4.1vw;padding-bottom:0;}
.healthCardList li.bPressure .bottom{padding:4.1vw;padding-top:0;}
.healthCardList li.bPressure .bottom .imgBox{background:url(../img/healthRecord/img_sub_bPressure01.png)no-repeat 0 0;background-size: 100% auto;}
.healthCardList li.bPressure .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_bPressure02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4.6vw;height: 4.6vw;right:4.87vw;top:0.25vw;animation: bounce 1.2s linear 2 forwards;transform:scale(0.3);}
.healthCardList li.bPressure .bottom .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_bPressure03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4.6vw;height: 4.6vw;left:2.56vw;top:4vw;animation: bounce 1s linear 2 forwards;transform:scale(0.6);}
.healthCardList li.bPressure .bottom .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_bPressure04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:5.128vw;height: 5.128vw;right:4.6vw;bottom:0.5vw;animation: bounce 1.4s linear 2 forwards;transform:scale(1);}
.healthCardList li.bPressure .bottom .counterBox{margin-right: 0;}
@keyframes bounce {
    0% {
        transform:scale(1);
    }
    50% {
        transform:scale(0.2);
    }
    100% {
        transform:scale(1);
    }
}


/* 몸무게 */
.healthCardList li.weight > .before .imgBox{background:url(../img/healthRecord/img_sub_weight_before01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.weight > .before .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_weight_before02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3vw;height:3vw;right:19.48vw;top:3.58vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.healthCardList li.weight > .before .imgBox > div:nth-child(2){background: url(../img/healthRecord/img_sub_weight_before03.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:4vw;height:4vw;left:8.97vw;top:5vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.healthCardList li.weight > .before .imgBox > div:nth-child(3){background: url(../img/healthRecord/img_sub_weight_before04.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3.58vw;height:3.58vw;left:33.33vw;bottom:12.3vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.healthCardList li.weight > .before .imgBox > div:nth-child(4){background: url(../img/healthRecord/img_sub_weight_before05.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3.58vw;height:3.58vw;left:8.46vw;bottom:3.58vw;animation: popM 0.3s linear forwards;transform:scale(0.1);opacity: 0;}
.healthCardList li.weight > .before .imgBox > div:nth-child(5){background: url(../img/healthRecord/img_sub_weight_before06.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:3vw;height:3vw;left:18.97vw;top:12vw;animation: roundM 2s linear 2 forwards;transform:rotate(0);transform-origin: bottom center;}
.healthCardList li.weight .top{padding:4.1vw;padding-bottom:0;}
.healthCardList li.weight .bottom{padding:4.1vw;padding-top:0;}
.healthCardList li.weight .bottom .imgBox{background:url(../img/healthRecord/img_sub_weight01.png)no-repeat 0 0;background-size: 100% auto;}
.healthCardList li.weight .bottom .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_sub_weight02.png)no-repeat 0 0;background-size:100% auto;position: absolute;width:2.56vw;height: 2.56vw;left:11.79vw;top:5.128vw;animation: roundM 2s linear 2 forwards;transform:rotate(0);transform-origin: bottom center;}
.healthCardList li.weight .bottom .weightDetail{background: #F6F8F9;padding:3.33vw 0;border-radius: 4vw;margin-top:2vw;text-align: center;color:#6D7B85;}
@keyframes popM {
    0% {
        left:50%;
        top:50%;
        transform:scale(0.1);
        opacity: 0;
    }
    100% {
        transform:scale(1);
        opacity: 1;
    }
}
@keyframes roundM {
    0% {
        transform:rotate(0);
    }
    33% {
        transform:rotate(-20deg);
    }
    66% {
        transform:rotate(10deg);
    }
    100% {
        transform:rotate(0deg);
    }
}

/* 바른자세 */
.healthCardList li.pose > .before .imgBox{background:url(../img/healthRecord/img_sub_pose01.png)no-repeat 0 0;background-size: 42vw auto;}
.healthCardList li.pose.strech,
.healthCardList li.pose.correction,
.healthCardList li.pose.both{padding:4vw;}
.healthCardList li.pose .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;margin-bottom: 5.128vw;}
.healthCardList li.pose .poseBox,
.healthCardList li.pose .strechBox{padding-left: 20.5vw;min-height: 16.4vw;display: flex;flex-direction: column;justify-content: center;}
.healthCardList li.pose .poseBox{background: url(../img/main/img_sub_pose_set.png)no-repeat left top;background-size: 16.4vw;}
.healthCardList li.pose .strechBox{background: url(../img/main/img_sub_pose_alrm.png)no-repeat left top 5.128vw;background-size: 16.4vw;margin-top:5.128vw;padding-top:5.128vw;border-top:1px solid #DEE4EE;min-height: calc(16.4vw + 5.128vw);}
.healthCardList li.pose .poseBox .txt,
.healthCardList li.pose .strechBox .txt{font-size: 3.589vw;line-height: 5.6vw;color:#6D7B85;}

.healthCardList li.pose .cntBox{display: flex;align-items: center;}
.healthCardList li.pose .cntBox *{display: inline-block;}
.healthCardList li.pose .cntBox .cnt{font-size: 4.6vw;line-height: 7.69vw;font-weight: 700;font-family: 'gSans';}
.healthCardList li.pose .cntBox .slash{color:rgba(0,0,0,0.3);margin:0 0.5vw;font-family: 'gSans';font-weight: 500;}
.healthCardList li.pose .cntBox .total{font-size: 4.6vw;line-height: 7.69vw;font-weight: 700;font-family: 'gSans';color:rgba(0,0,0,0.3);}
.healthCardList li.pose .cntBox .unit{color:rgba(0,0,0,0.3);font-weight: 700;margin-left: 0.5vw;}

.healthCardList li.pose .record{margin-top:3vw;display: flex;}
.healthCardList li.pose .record > div{width: 100%;border-radius: 3vw;padding:3vw 4vw;display: flex;justify-content: space-between;align-items: center;}
.healthCardList li.pose .record > div + div{margin-left: 2vw;}
.healthCardList li.pose .record > div:nth-child(1){background: #F1F8FE;}
.healthCardList li.pose .record > div:nth-child(2){background: #FAF2EF;}

.healthCardList li.pose .record > div:nth-child(1) p:nth-child(1){background: url(../img/main/ico_o.png)no-repeat left center;background-size: 4vw;}
.healthCardList li.pose .record > div:nth-child(2) p:nth-child(1){background: url(../img/main/ico_x.png)no-repeat left center;background-size: 4vw;}
.healthCardList li.pose .record > div p:nth-child(1){color: #6D7B85;padding-left: 5.128vw;line-height: 4vw;}
.healthCardList li.pose .record > div p:nth-child(2) span{font-size: 3.589vw;display: inline-block;line-height: 5.64vw;font-family: 'gSans';font-weight: 500;margin-right: 0.5vw;vertical-align: top;}




/* 걸음 상세 */
.recordWalk .topCon{min-height:99.48vw;background: linear-gradient(0deg, #C1EFFF 29.52%, #80D0EB 53.99%, #4384EB 101.37%);width:calc(100% + 12.3vw);margin-left:-6.15vw;position: relative;}
.recordWalk .topCon .txtBox{padding:9.23vw 0 0 6.15vw;}
.recordWalk .topCon .txtBox p{font-size: 5.64vw;line-height: 8.2vw;font-weight: 700;color: #fff;margin-bottom: 3vw;}
.recordWalk .topCon .txtBox .btn.goal{display: flex;justify-content: flex-start;}
.recordWalk .topCon .txtBox .btn.goal a{background:rgba(0,0,0,0.3);border-radius: 23vw;padding:1.5vw 3vw;display: block;}
.recordWalk .topCon .txtBox .btn.goal a span{display: inline-block;color:#fff;line-height: 5.64vw;font-size: 3.589vw;font-weight: 700;letter-spacing: 0;}
.recordWalk .topCon .txtBox .btn.goal a span.txt{padding-left: 7.179vw;padding-right: 4vw;position: relative;background:url(../img/ico_arrow_r_w.png)no-repeat right center;background-size: 3vw;}
.recordWalk .topCon .txtBox .btn.goal.disabled a span.txt{background:none;}
.recordWalk .topCon .txtBox .btn.goal a span.txt::before{content:'';position: absolute;left: 0;top:0;width: 6.15vw;height: 6.15vw;background: url(../img/healthRecord/ico_btn_goal.png)no-repeat 0 0;background-size:100%;}
.recordWalk .topCon .txtBox .btn.goal a span span{margin:0 1vw;}
.recordWalk .topCon .imgBox{position:absolute;bottom:17.4vw;left:0;width:100%;background:url(../img/healthRecord/img_record_walk_bg01.png)no-repeat 0 0;background-size: 100%;height:38.4vw;}
.recordWalk .topCon .imgBox > div:nth-child(1){height: 42.8vw;position: absolute;bottom:-0.44vw;left: 0;width: 100%;background: url(../img/healthRecord/img_record_walk01.png)no-repeat 0 0;background-size: 100% auto;opacity: 0;
    animation: recordCloud 2s ease-in forwards;}
.recordWalk .topCon .imgBox > div:nth-child(2){height: 28.46vw;width: 85.128vw;background: url(../img/healthRecord/img_record_walk02.png)no-repeat 0 0;background-size: 100%;left:7.179vw;bottom:12vw;position: absolute;
    animation: recordBlink 2s 4;
}
.recordWalk .topCon .imgBox > div:nth-child(3){width:20.5vw;height: 19.74vw;background: url(../img/healthRecord/img_record_walk03.png)no-repeat 0 0;background-size: 100%;right: 31.28vw;bottom:15.128vw;position: absolute;
    animation: walking 1.4s 3 ease-in-out;
}
@keyframes recordCloud {
    from {opacity: 0;}
    to {opacity: 1;}
}
@keyframes recordBlink {
0% { opacity: 1; }
50% { opacity: 0.5; }
100% { opacity: 1; }
}


.recordWalk .topCon.finish .imgBox{position:absolute;bottom:17.4vw;left:0;width:100%;background:url(../img/healthRecord/img_record_walk_bg01_finish.png)no-repeat 0 0;background-size: 100%;height:42.56vw;}
.recordWalk .topCon.finish .imgBox > div:nth-child(1){height: 26.66vw;position: absolute;bottom:0;left: 50%;margin-left:-28.2vw;width: 56.4vw;background: url(../img/healthRecord/img_record_walk01_finish.png)no-repeat 0 0;background-size: 100% auto;opacity: 0;
    animation: recordparty 0.4s 0.8s ease-in forwards;}
.recordWalk .topCon.finish .imgBox > div:nth-child(2){height: 30.769vw;width:28.46vw;background: url(../img/healthRecord/img_record_walk02_finish.png)no-repeat 0 0;background-size: 100%;right:32.56vw;bottom:5.128vw;position: absolute;left: auto;
    animation: recordbomb 0.5s 2 forwards ease-in-out;
    /* animation: stomp 0.5s ease-in-out; */
}
.recordWalk .topCon.finish .imgBox > div:nth-child(3){display: none;}
@keyframes recordparty {
    from {opacity: 0;transform: scale(0);}
    to {opacity: 1;transform: scale(1);}
}
@keyframes recordbomb {
    0% {transform: translateX(0) translateY(0);}
    50% {transform: translateX(0) translateY(-7vw);}
    60% {transform: translateX(0) translateY(-6.5vw);}
    100% {transform: translateX(0) translateY(0);}
}




.recordWalk .bottomCon{margin-top:-17.4vw;background: #fff;border-radius: 10.25vw 10.25vw 0 0;width:calc(100% + 12.3vw);margin-left:-6.15vw;padding:8.2vw 6.15vw 0 6.15vw;position: relative;}
.recordWalk .bottomCon .titBox{display: flex;justify-content: space-between;padding-bottom:5.128vw;}
.recordWalk .bottomCon .noData{padding-top:5.128vw;}
.recordWalk .bottomCon .dataBox .recordBox{display: flex;}
.recordWalk .bottomCon .dataBox .recordBox > div{width: 50%;text-align: center;}
.recordWalk .bottomCon .dataBox .recordBox > div:last-child{border-left: 1px solid #DEE4EE;}
.recordWalk .bottomCon .dataBox .recordBox > div > p{display: inline-block;padding-left: 5.64vw;font-size: 3.589vw;line-height: 5.64vw;color:#6D7B85;margin-bottom:1.28vw;}
.recordWalk .bottomCon .dataBox .recordBox > div:first-child > p{background:url(../img/healthRecord/ico_walk.png)no-repeat left center;background-size:4.6vw;}
.recordWalk .bottomCon .dataBox .recordBox > div:last-child > p{background:url(../img/healthRecord/ico_kal.png)no-repeat left center;background-size:4.6vw;}
.recordWalk .bottomCon .dataBox .recordBox .flexBox{justify-content: center;align-items: center;}
.recordWalk .bottomCon .dataBox .recordBox .flexBox .counterBox{font-size: 6.15vw;line-height: 8.2vw;font-weight: 700;font-family: 'gSans';}
.recordWalk .bottomCon .dataBox .recordBox .flexBox .counterBox .counter{font:inherit;}
.recordWalk .bottomCon .dataBox .recordBox .flexBox p{font-weight: 500;color:#6D7B85;margin-left: 0.5vw;}
.recordWalk .bottomCon .dataBox .detailBox{background: #F5F9FF;border-radius: 6.15vw;padding:6.15vw 0;margin-top:6.15vw;text-align: center;}
.recordWalk .bottomCon .dataBox .detailBox p{color:#6D7B85;font-weight: 500;}
.recordWalk .bottomCon .dataBox .detailBox p + p{margin-top:0.5vw;}
.recordWalk .bottomCon .dataBox .detailBox span{display: inline-block;letter-spacing: 0;}
.recordWalk .bottomCon .dataBox .detailBox p > span{padding:0 2vw;border-radius: 15.38vw;color:#fff;font-weight: 700;line-height: 6.66vw;}
.recordWalk .bottomCon .dataBox .detailBox span.walk{background:#7558E8;}
.recordWalk .bottomCon .dataBox .detailBox.fail span.goal{background:#4D6CE8;}
.recordWalk .bottomCon .dataBox .detailBox.over span.goal{background:#EA645D;margin-left:1vw;}
.recordWalk .bottomCon .dataBox .detailBox .point{font-size: 4vw;line-height: 6.15vw;margin-top:2vw;font-weight: 700;color:#222;display: inline-block;}
.recordWalk .bottomCon .dataBox .detailBox .point span{padding:0;}
/* .recordWalk .bottomCon .dataBox .detailBox.safe .point{padding-right: 7.179vw;background:url(../img/healthRecord/ico_walk_safe.png)no-repeat right center;background-size:6.15vw;} */
.recordWalk .bottomCon .dataBox .detailBox.noGoal .point.ico{padding-right: 7.179vw;background:url(../img/healthRecord/ico_walk_nodata.png)no-repeat right center;background-size:6.15vw;}


/* 식사 상세 */
.recordMeal .topCon{min-height:154.87vw;background: linear-gradient(180deg, #FFFEDB 31.7%, #B5EE8C 76.5%, #91D384 94.16%);width:calc(100% + 12.3vw);margin-left:-6.15vw;position: relative;}
.recordMeal .topCon .txtBox{padding:9.23vw 0 0 6.15vw;margin-bottom: 4vw;}
.recordMeal .topCon .txtBox p{font-size: 5.64vw;line-height: 8.2vw;font-weight: 700;margin-bottom: 3vw;}
.recordMeal .topCon .txtBox .btn.goal{display: flex;justify-content: flex-start;}
.recordMeal .topCon .txtBox .btn.goal a{background:rgba(0,0,0,0.3);border-radius: 23vw;padding:1.5vw 3vw;display: block;}
.recordMeal .topCon .txtBox .btn.goal a span{display: inline-block;color:#fff;line-height: 5.64vw;font-size: 3.589vw;font-weight: 700;letter-spacing: 0;}
.recordMeal .topCon .txtBox .btn.goal a span.txt{padding-left: 7.179vw;position: relative;}
.recordMeal .topCon .txtBox .btn.goal.disabled a span.txt{background:none;}
.recordMeal .topCon .txtBox .btn.goal a span.txt::before{content:'';position: absolute;left: 0;top:0;width: 6.15vw;height: 6.15vw;background: url(../img/healthRecord/ico_btn_goal.png)no-repeat 0 0;background-size:100%;}
.recordMeal .topCon .imgBox{background:url(../img/healthRecord/img_record_meal_bg01.png)no-repeat 0 0;background-size: 100%;height:33.589vw;width: 36.9vw;margin: 0 auto;position: relative;margin-bottom: 2.56vw;}
.recordMeal .topCon .imgBox > div{position: absolute;}
.recordMeal .topCon .imgBox > div:nth-child(1){width: 16.66vw;height: 27.35vw;top: 3.846vw;left: 0.98vw;background: url(../img/healthRecord/img_record_meal01.png)no-repeat 0 0;background-size: 100% 100%;
    animation: recordMeal01 0.8s 2 forwards ease-in-out;
}
.recordMeal .topCon .imgBox > div:nth-child(2){width: 19.658vw;height: 30.42vw;top: 2vw;right: 1.846vw;background: url(../img/healthRecord/img_record_meal02.png)no-repeat 0 0;background-size: 100% 100%;
    animation: recordMeal02 0.8s 2 forwards ease-in-out;
}
@keyframes recordMeal01 {
    0% {transform: rotate(0);}
    50%{transform: rotate(30deg);}
    100% {transform: rotate(0);}
}
@keyframes recordMeal02 {
    0% {transform: rotate(0);}
    50%{transform: rotate(-30deg);}
    100% {transform: rotate(0);}
}

/* .recordMeal.record .topCon .imgBox{width:100%;background:url(../img/healthRecord/img_record_meal_bg01_record.png)no-repeat 0 0;background-size: 100%;height:37.948vw;} */
.recordMeal.record .topCon .imgBox{background:url(../img/healthRecord/img_record_meal_bg01_record.png)no-repeat center top 2vw;background-size: 36.9vw 33.589vw;height:37.948vw;width:100%;margin: 0 auto;position: relative;margin-bottom: 2.56vw;}
.recordMeal.record .topCon .imgBox > div:nth-child(1){left: 21.02vw;top: 5vw;}
.recordMeal.record .topCon .imgBox > div:nth-child(2){right: 19.846vw;top: 3vw;}
.recordMeal.record .topCon .imgBox > div:nth-child(3){background:url(../img/healthRecord/img_record_meal_bg01_record02.png)no-repeat 0 0;background-size: 100% 100%;height:27.4vw;width: 65.64vw;position:absolute;left:18.2vw;top:4.87vw;}
.recordMeal .topCon .totalCal{padding-left: 6.15vw;font-family: 'gSans';color:#6D7B85;}
.recordMeal .topCon .totalCal span{color:#222;display: inline-block;font-family: 'gSans';}
.recordMeal .topCon .totalCal .goalCal{display: none;}
.recordMeal .topCon .mealDetail .reGoal{display: none;}
.recordMeal .topCon .mealDetail{padding:2vw 6.15vw;padding-bottom:25.38vw;}
.recordMeal .topCon .mealDetail > div{background: #fff;border-radius: 6.15vw;display: flex;flex-wrap: wrap;position: relative;padding:5.15vw 1vw;}
.recordMeal .topCon .mealDetail > div dl{width:50%;display: flex;justify-content: space-between;padding:2vw 5.128vw;}
.recordMeal .topCon .mealDetail > div dl dt{padding-left: 4vw;font-size: 3.589vw;line-height: 5.64vw;color: #6D7B85;position: relative;}
.recordMeal .topCon .mealDetail > div dl dd{font-size: 3.589vw;line-height: 5.64vw;font-family: 'gSans';font-weight: 700;}
.recordMeal .topCon .mealDetail > div dl dt::before{content:'';position: absolute;left:0;top:50%;margin-top:-1.5vw;width:3vw;height: 3vw;border-radius: 1vw;}
.recordMeal .topCon .mealDetail > div dl:nth-child(1) dt::before{background:#DA8156;}
.recordMeal .topCon .mealDetail > div dl:nth-child(2) dt::before{background:#69AC6C;}
.recordMeal .topCon .mealDetail > div dl:nth-child(3) dt::before{background:#9076E3;}
.recordMeal .topCon .mealDetail > div dl:nth-child(4) dt::before{background:#8D9EAB;}
.recordMeal .bottomCon{margin-top:-17.9vw;background: #fff;border-radius: 10.25vw 10.25vw 0 0;width:calc(100% + 12.3vw);margin-left:-6.15vw;padding:8.2vw 6.15vw 0 6.15vw;position: relative;}
.recordMeal .bottomCon .date{display: none;}
.recordMeal .bottomCon .acdList{display: none;}
.recordMeal .bottomCon .recordList{margin-top:5.12vw;}
.recordMeal .bottomCon .recordList > li{border-bottom:1px solid #DEE4EE;padding-bottom:6.15vw;}
.recordMeal .bottomCon .recordList > li + li{margin-top:6.15vw;}
.recordMeal .bottomCon .recordList > li a{padding-left: 17.4vw;display: flex;flex-direction:column;min-height:13.33vw;justify-content: center;position: relative;}
.recordMeal .bottomCon .recordList > li a::before{content:'';background:url(../img/healthRecord/ico_health_txt_link.png)no-repeat right center;background-size: 3vw;width:100%;height:100%;position: absolute;right: 0;top: 0;}
.recordMeal .bottomCon .recordList > li a p.tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;}
.recordMeal .bottomCon .recordList > li a p.txt{font-size: 3.589vw;line-height: 5.6vw;color:#A7ADBB;}
.recordMeal .bottomCon .recordList > li:nth-child(1) a{background:url(../img/healthRecord/img_meal_breakfast.png)no-repeat left center;background-size:13.33vw;}
.recordMeal .bottomCon .recordList > li:nth-child(2) a{background:url(../img/healthRecord/img_meal_lunch.png)no-repeat left center;background-size:13.33vw;}
.recordMeal .bottomCon .recordList > li:nth-child(3) a{background:url(../img/healthRecord/img_meal_dinner.png)no-repeat left center;background-size:13.33vw;}
.recordMeal .bottomCon .recordList > li:nth-child(4) a{background:url(../img/healthRecord/img_meal_sanck.png)no-repeat left center;background-size:13.33vw;}
.checkActive{display: flex;margin-top:4.6vw;justify-content: center;align-items: center;}
.checkActive li{position: relative;width: calc(100%/3);}
.checkActive li + li{margin-left: 1.5vw;}
.checkActive li span{display: inline-block;text-indent: -99999px;}
.checkActive input[type="radio"]{position: relative;display: block;height:28.2vw;width: 28.2vw;cursor: pointer;}
.checkActive input[type="radio"] + label{position: absolute;top:0;left: 0;height: 100%;padding-left:0;}
.checkActive li:nth-child(1) input[type="radio"] + label::before {content: "";position: absolute;width: 28.2vw;height: 28.2vw;background:url(../img/healthRecord/img_check_activity01.png)no-repeat 0 0;background-size: 100%;}
.checkActive li:nth-child(2) input[type="radio"] + label::before {content: "";position: absolute;width: 28.2vw;height: 28.2vw;background:url(../img/healthRecord/img_check_activity02.png)no-repeat 0 0;background-size: 100%;}
.checkActive li:nth-child(3) input[type="radio"] + label::before {content: "";position: absolute;width: 28.2vw;height: 28.2vw;background:url(../img/healthRecord/img_check_activity03.png)no-repeat 0 0;background-size: 100%;}
.checkActive li:nth-child(1) input[type="radio"]:checked + label::before {background:url(../img/healthRecord/img_check_activity01_on.png)no-repeat 0 0;background-size: 100%;}
.checkActive li:nth-child(2) input[type="radio"]:checked + label::before {background:url(../img/healthRecord/img_check_activity02_on.png)no-repeat 0 0;background-size: 100%;}
.checkActive li:nth-child(3) input[type="radio"]:checked + label::before {background:url(../img/healthRecord/img_check_activity03_on.png)no-repeat 0 0;background-size: 100%;}
.recordMeal.goal .topCon .totalCal .goalCal{display: inline-block;color:#6D7B85;}
.recordMeal.goal .topCon .mealDetail .reGoal{display: flex;background: #F3F7FD;border-radius: 6.15vw;padding:2.8vw 0;color: #6D7B85;line-height: 4vw;width: 100%;justify-content: center;align-items: center;margin:0 2vw;line-height: 6.15vw;margin-top:2vw;}
.recordMeal.goal .topCon .mealDetail .reGoal span{display: inline-block;padding-left: 5.128vw;background:url(../img/healthRecord/ico_kal.png)no-repeat left 0.8vw;background-size: 4vw;margin-right: 1vw;}
.recordMeal.goal .topCon .mealDetail .reGoal.more span{display: inline-block;padding-left: 5.128vw;background:url(../img/healthRecord/ico_caution.png)no-repeat left 1.1vw;background-size: 4vw;margin-right: 1vw;}
.recordMeal.goal .topCon .mealDetail .reGoal.txt span{background: none;padding-left: 0;}


.recordMeal.record .bottomCon .rec .date{display: block;padding-left: 5.128vw;background:url(../img/ico_time.png)no-repeat left center;background-size: 4vw;color:#6D7B85;font-size: 3.589vw;line-height: 5.64vw;}
.recordMeal.record .bottomCon .rec .txt{display: none;}
.recordMeal.record .bottomCon .rec .acdList{display: block;background: #F6F6F7;border-radius: 5.128vw;padding:4.6vw 5.128vw;margin-top:4vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li{padding-bottom: 0;border-bottom: none;}
.recordMeal.record .bottomCon .rec .acdList .titBox{padding:0;display: flex;justify-content: space-between;align-items: center;padding-right: 6.15vw;}
.recordMeal.record .bottomCon .rec .acdList .titBox .tit{max-width: 46.15vw;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp:1;display: block;}
.recordMeal.record .bottomCon .rec .acdList .titBox .cal{max-width:calc(100% - 46.15vw);font-family: 'gSans';font-weight: 700;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox{margin-top:3.84vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient{display: flex;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li{position: relative;padding-left: 5.64vw;font-family: 'gSans';min-width: 15.89vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li + li{margin-left: 1.5vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li:before{color:#fff;font-size: 3vw;line-height: 4.6vw;height: 4.6vw;width: 4.6vw;border-radius: 1.5vw;position: absolute;left:0;top:50%;margin-top:-2.3vw;text-align: center;font-weight: 500;font-family:'Pretendard','Poppins','dotum','돋움';}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li:nth-child(1):before{content:'탄';background: #DA8156;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li:nth-child(2):before{content:'단';background: #69AC6C;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li:nth-child(3):before{content:'지';background: #9076E3;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient li:nth-child(4):before{content:'당';background: #8D9EAB;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .ingredient + .food{margin-top:4vw;padding-top:4vw;border-top:1px dashed rgba(109, 123, 133, 0.4)}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .food li{display: flex;justify-content: space-between;align-items: center;color:#6D7B85;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .food li + li{margin-top:0.5vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .food li .name{font-size: 3.589vw;line-height:5.64vw;}
.recordMeal.record .bottomCon .rec .acdList > ul > li .txtBox .food li .cal{font-size: 3.589vw;line-height:5.64vw;font-family: 'gSans';}

.tabList ul li.food a span{padding-left: 5.128vw;background:url(../img/healthRecord/ico_food.png)no-repeat left center;background-size:4.1vw;}
.tabList ul li.bookmark a span{padding-left: 5.128vw;background:url(../img/healthRecord/ico_bookmark.png)no-repeat left center;background-size:4.1vw;}
.tabList ul li.write a span{padding-left: 5.128vw;background:url(../img/healthRecord/ico_write.png)no-repeat left center;background-size:4.1vw;}
.latelyBox {margin-top:6.15vw;display: none;}
.latelyBox .titBox{display: flex;justify-content: space-between;align-items: center;}
.latelyBox .titBox p{font-size: 4vw;line-height: 6.15vw;font-weight: 700;}
.latelyBox .btn.delList{width: auto;}
.latelyBox .btn.delList .btnAllDel span{color:#6D7B85;font-size: 3.589vw;line-height:5.64vw;font-weight: 500;position: relative;display: inline-block;}
.latelyBox .btn.delList .btnAllDel span::before{content: '';position: absolute;left:0;bottom: 0;border-bottom: 1px solid #6D7B85;width:100%;height: 1px;}
.latelyBox ul{margin-top:2vw;display: flex;flex-wrap: wrap;width: calc(100% + 2vw);margin-left: -1vw;}
.latelyBox ul li{display: none;background:#E7EAEE;border-radius: 2vw;padding:1vw 3vw;margin:3vw 1vw 0 1vw;align-items: center;}
.latelyBox ul li:nth-child(-n+10){display: flex;}
.latelyBox ul li p{font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;}
.latelyBox ul li .btn.del{width:4vw;height:4vw;margin-left: 1vw;}
.latelyBox ul li .btn.del a{width:4vw;height:4vw;background:url(../img/ico_del02.png)no-repeat 0 0;background-size: 100%;}
.latelyBox ul li .btn.del span{display: inline-block;text-indent: -99999px;}

.recordFoodList{margin-top:5.12vw;padding-bottom: 21.58vw;}
.recordFoodList li{display: flex;background:#fff;border-radius: 4vw;padding:5.128vw;align-items: center;justify-content: space-between;}
.recordFoodList li + li{margin-top:3vw;}
.recordFoodList li .foodBox{max-width:42.56vw;display: flex;align-items: center;}
.recordFoodList li .foodBox > div{}
.recordFoodList li .foodBox .bookmark{width:5.128vw;}
.recordFoodList li .foodBox .food{max-width:37.43vw;flex-direction: column;display: flex;margin-left: 2.56vw;}
.recordFoodList li .foodBox .name{position:relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight: 700;}
.recordFoodList li .foodBox > p{margin-left: 6.66vw;}
.recordFoodList li .calBox{display: flex;align-items: center;}
.recordFoodList li .cal span + span{margin-left: 0.5vw;}
.recordFoodList li .cal .gB{font-size: 4vw;line-height: 6.15vw;}
.recordFoodList li .cal .gM{color: #6D7B85;}
.recordFoodList li .calBox .btn.del{width: auto;margin-left: 1.5vw;}
.recordFoodList li .calBox .btn.del a{width:5.128vw;height:5.128vw;background: url(../img/ico_del.png)no-repeat center;background-size: 5.128vw;}
.recordFoodList li .calBox .btn.del a span{display: inline-block;text-indent: -99999px;}
.recordFoodList li.direct .name:before{content:'직접등록';display: block;font-size: 3vw;line-height: 5.128vw;width:10.769vw;color:#fff;background:#6D98F5;text-align: center;border-radius: 12.8vw;padding:0 1.538vw;margin-bottom: 0.5vw;}
.bgGray + .btnBottom{background: linear-gradient(360deg, #F3F4F6 86.57%, rgba(255, 255, 255, 0) 100%);}


.popCon .foodBox{display: flex;}
.popCon .foodBox .bookmark{width:6.15vw;}
.popCon .foodBox .food{max-width:calc(100% - 6.15vw);margin-left: 1vw;}
.popCon .foodBox .food .name{font-weight: 700;}
.popCon .foodBox .food .cal{font-weight: 700;font-family: 'gSans';font-size: 5.128vw;line-height: 1.6;margin-top:0.769vw;}
.popCon .foodBox .food .cal span{font-weight: 700;font-family: 'gSans';font-size: 5.128vw;line-height: 1.6;}
.popCon .detailCal{border-top:1px dashed rgba(0,0,0,0.4);margin-top:4vw;padding-top:6.15vw;}
.popCon .detailCal .radioTxtBox input[type="radio"] + label {width:100%;height:auto;line-height: 5.128vw;padding:3.846vw 0;}
.popCon .detailCal .mealDetail dl{display: flex;justify-content: space-between;}
.popCon .detailCal .mealDetail dl + dl{margin-top:2vw;}
.popCon .detailCal .mealDetail dl dt{padding-left: 4vw;color: #6D7B85;position: relative;}
.popCon .detailCal .mealDetail dl dd{font-size: 3.589vw;line-height: 5.64vw;font-family: 'gSans';font-weight: 700;}
.popCon .detailCal .mealDetail dl dt::before{content:'';position: absolute;left:0;top:50%;margin-top:-1.5vw;width:3vw;height: 3vw;border-radius: 1vw;}
.popCon .detailCal .mealDetail dl:nth-child(1) dt::before{background:#DA8156;}
.popCon .detailCal .mealDetail dl:nth-child(2) dt::before{background:#69AC6C;}
.popCon .detailCal .mealDetail dl:nth-child(3) dt::before{background:#9076E3;}
.popCon .detailCal .mealDetail dl:nth-child(4) dt::before{background:#8D9EAB;}

.mealTime .topCon{width: calc(100% + 12.3vw);margin-left: -6.15vw;padding:10.25vw 6.15vw;}
.mealTime .topCon .tiBox{display: flex;justify-content: space-between;align-items: flex-start;margin-bottom:5.12vw;}
.mealTime .topCon .tiBox .tit{font-size:6.15vw;line-height: 8.7179vw;font-weight: 700;}
.mealTime .topCon .tiBox .btn.time{width: auto;position: relative;text-align: right;}
.mealTime .topCon .tiBox .btn.time a{padding-left: 5.64vw;background:url(../img/ico_time.png)no-repeat left center;background-size: 4.6vw;display: inline-block;}
.mealTime .topCon .tiBox .btn.time a span{color:#6D7B85;font-weight: 500;padding:0.5vw 0;padding-right: 4.1vw;background:url(../img/ico_cal_arrow_r.png)no-repeat right center;background-size: 3vw;display: block;}
.mealTime .topCon .tiBox .btn.time .txt.bubble{background: #0262F3;position: relative;border-radius: 2.05vw;margin-top:1.5vw;padding:2.05vw 3vw;}
.mealTime .topCon .tiBox .btn.time .txt.bubble::before{content: "";position: absolute;top: -1.5vw;right: 15.2vw;transform: translateX(-50%);width: 0;height: 0;border-left: 2.56vw solid transparent;border-right: 2.56vw solid transparent;border-bottom: 2.56vw solid #0262F3;}
.mealTime .topCon .tiBox .btn.time .txt.bubble{font-size: 3vw;color:#fff;line-height: 4.6vw;font-weight: 500;}


.mealTime .topCon .imgBox{display: flex;align-items: center;justify-content: center;position: relative;margin-bottom:8.2vw;}
.mealTime .topCon .imgBox .roundBox{width: 35.897vw;height: 35.897vw;border-radius: 12.8vw;background:url(../img/mypage/bg_profile.png)no-repeat 0 0;background-size:100% auto;position: relative;overflow: hidden;}
.mealTime .topCon .imgBox .roundBox > div{width: 35.897vw;height: 35.897vw;position: absolute;}
/* .mealTime .topCon .imgBox .roundBox > div:nth-child(1){right:-28.2vw;top:0;animation: character01 0.6s 0.4s ease-in forwards;background:url(../img/mypage/img_profile_c01.png)no-repeat 0 0;background-size: cover;}
.mealTime .topCon .imgBox .roundBox > div:nth-child(2){left:-28.2vw;top:0;animation: character02 0.6s 0.8s ease-in forwards;background:url(../img/mypage/img_profile_c02.png)no-repeat 0 0;background-size: cover;}
.mealTime .topCon .imgBox .roundBox > div:nth-child(3){bottom:-28.2vw;left:0;animation: character03 0.8s 1.4s ease-in forwards;background:url(../img/mypage/img_profile_c03.png)no-repeat 0 0;background-size: cover;} */

.mealTime .topCon .imgBox .roundBox > div{position: absolute;}
.mealTime.time01 .topCon .imgBox .roundBox{background:url(../img/healthRecord/bg_mealTime01.png)no-repeat 0 0;background-size:100% auto;}
.mealTime.time01 .topCon .imgBox .roundBox > div:nth-child(1){width: 24.87vw;height: 14.35vw;background: url(../img/healthRecord/bg_mealTime01_2.png)no-repeat 0 0;background-size: 100% 100%;left: 2vw;bottom:7.435vw;z-index: 2;
    animation: recordMealTime01_1 1s forwards ease-in-out;
}
.mealTime.time01 .topCon .imgBox .roundBox > div:nth-child(2){width:12.56vw;height: 12.56vw;background: url(../img/healthRecord/bg_mealTime01_1.png)no-repeat 0 0;background-size: 100% 100%;right: 6.9vw;bottom:13.33vw;z-index: 1;opacity: 0;
    animation: recordMealTime01_2 0.8s 1.2s forwards ease-in-out;
}
@keyframes recordMealTime01_1 {
    0% {left: 0.5vw;}
    100% {left: 2vw;}
}
@keyframes recordMealTime01_2 {
    0% {opacity: 0;right: 15.9vw;bottom: 7.33vw;}
    100% {opacity: 1;right: 6.9vw;bottom:13.33vw;}
}
.mealTime.time02 .topCon .imgBox .roundBox{background:url(../img/healthRecord/bg_mealTime02.png)no-repeat 0 0;background-size:100% auto;}
.mealTime.time02 .topCon .imgBox .roundBox > div:nth-child(1){width:15.38vw;height: 15.38vw;background: url(../img/healthRecord/bg_mealTime02_1.png)no-repeat 0 0;background-size: 100% 100%;right: 5.128vw;top:4.87vw;
    animation: recordMealTime02_1 1.4s forwards ease;
}
@keyframes recordMealTime02_1 {
    0% {right:-16vw;transform: rotate(-120deg);top:14vw;}
    100% {right: 5.128vw;transform: rotate(0);top:4.87vw;}
}

.mealTime.time03 .topCon .imgBox .roundBox{background:url(../img/healthRecord/bg_mealTime03.png)no-repeat 0 0;background-size:100% auto;}
.mealTime.time03 .topCon .imgBox .roundBox > div:nth-child(1){width: 21.5vw;height: 11.79vw;background: url(../img/healthRecord/bg_mealTime03_2.png)no-repeat 0 0;background-size: 100% 100%;left: 1.5vw;bottom:7.69vw;z-index: 2;
    animation: recordMealTime03_1 3s forwards ease-in-out;
}
.mealTime.time03 .topCon .imgBox .roundBox > div:nth-child(2){width:17.4vw;height: 17.4vw;background: url(../img/healthRecord/bg_mealTime03_1.png)no-repeat 0 0;background-size: 100% 100%;right: 4.35vw;bottom:10.256vw;z-index: 1;
    animation: recordMealTime03_2 2s forwards ease-in-out;
}
@keyframes recordMealTime03_1 {
    0% {left: 6vw;}
    100% {left: 1.5vw;}
}
@keyframes recordMealTime03_2 {
    0% {right: 8.35vw;}
    100% {right:4.35vw;}
}
.mealTime.time04 .topCon .imgBox .roundBox{background:url(../img/healthRecord/bg_mealTime04.png)no-repeat 0 0;background-size:100% auto;}
.mealTime.time04 .topCon .imgBox .roundBox > div:nth-child(1){width: 16.9vw;height: 12.56vw;background: url(../img/healthRecord/bg_mealTime04_1.png)no-repeat 0 0;background-size: 100% 100%;left: 0;bottom:11.28vw;z-index: 2;
    animation: recordMealTime04_1 1s forwards ease-in-out;
}
.mealTime.time04 .topCon .imgBox .roundBox > div:nth-child(2){width:17.69vw;height: 14.358vw;background: url(../img/healthRecord/bg_mealTime04_2.png)no-repeat 0 0;background-size: 100% 100%;left: 6.4vw;bottom:0;z-index: 1;
    animation: recordMealTime04_2 1.5s forwards ease-in-out;
}
@keyframes recordMealTime04_1 {
    0% {bottom:0;transform: rotate(120deg);left:-15vw;}
    100% {bottom:11.28vw;transform: rotate(0);left:0;}
}
@keyframes recordMealTime04_2 {
    0% {transform: rotate(0);bottom:-15vw;}
    50% {transform: rotate(380deg);bottom:2vw;}
    100% {transform: rotate(360deg);bottom:0vw;}
}


.mealTime .topCon .allCal p{position: relative;font-size: 5.128vw;line-height: 1.6;font-weight: 700;font-family: 'gSans';text-align: center;}
.mealTime .topCon .allCal p span{font-size: 5.128vw;line-height: 1.6;font-weight: 700;font-family: 'gSans';}
/* .mealTime .topCon .allCal p::before{content:'총 칼로리';display:inline-block;vertical-align:middle;font-size: 3.589vw;background:#EBEDF1;line-height: 6.66vw;height:6.66vw;border-radius: 15.38vw;padding:0 2vw;font-weight: 500;font-family: 'Pretendard','Poppins','dotum','돋움';color:#6D7B85;margin-right: 1vw;} */
.mealTime .topCon .mealDetail{display: flex;align-items: center;justify-content: center;margin-top:5.128vw;}
.mealTime .topCon .mealDetail dl{text-align: center;min-width: 13.33vw;padding:0;width: calc(100%/4);}
.mealTime .topCon .mealDetail dl dt{color:#6D7B85;margin-bottom:0.5vw;}
.mealTime .topCon .mealDetail dl dd{font-size: 4vw;line-height: 6.15vw;font-weight: 700;font-family: 'gSans';word-break: break-all;}
.mealTime .topCon .mealDetail dl + dl{border-left:1px solid #DEE4EE;}
.mealTime .foodList{padding-top:6.15vw;}
.mealTime .foodList li{display: flex;justify-content: space-between;align-items: center;border-top:1px solid #DEE4EE;padding:6.15vw 0;}
.mealTime .foodList li:first-child{border-top:none;padding-top:0;}
.mealTime .foodList li:last-child{border-bottom:1px solid #DEE4EE;}
/* .mealTime .foodList li + li{border-top:1px solid #DEE4EE;padding:6.15vw 0;} */


.mealTime .foodListBox .titBox{display: flex;justify-content: space-between;align-items: center;margin-top:8.2vw;}
.mealTime .foodListBox .titBox .tit{font-size: 5.12vw;line-height: 1.5;font-weight: 700;}
.mealTime .foodListBox .titBox .bookmark {width: auto;}
.mealTime .foodListBox .titBox .bookmark a{display: inline-block;border:1px solid #DEE4EE;border-radius: 15.38vw;padding:2vw 3vw;vertical-align: center;line-height: 5.12vw;}
.mealTime .foodListBox .titBox .bookmark span{display: block;font-size: 3vw;line-height: 5.12vw;font-weight: 700;color:#6D7B85;padding-left: 6.15vw;background: url(../img/ico_bookmark_on.png)no-repeat left 1vw center;background-size: 3vw 3.58vw;vertical-align: center;}
.mealTime .foodListBox .noData{padding-top:10.25vw;}
.mealTime .foodList li .foodBox{max-width:52.8vw;display: flex;flex-shrink: 0;}
.mealTime .foodList li .foodBox .bookmark{width:5.128vw;}
.mealTime .foodList li .foodBox .food{max-width:47.68vw;margin-left: 1.53vw;}
.mealTime .foodList li .foodBox .food .foodNameBox{display: flex;}
.mealTime .foodList li .foodBox .food .foodNameBox .editFood{width: 4.6vw;height: 4.6vw;margin-top:0.5vw;margin-left: 1vw;}
.mealTime .foodList li .foodBox .food .foodNameBox .editFood a{width: 4.6vw;height: 4.6vw;display: block;background: url(../img/healthRecord/ico_edit.png)no-repeat 0 0;background-size: 100% auto;}
.mealTime .foodList li .foodBox .food .foodNameBox .editFood span{display: inline-block;text-indent: -99999px;}
.mealTime .foodList li .foodBox .name{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight: 700;}
.mealTime .foodList li .calBox{display: flex;align-items: center;flex-shrink: 0;width: calc(100% - 52.8vw);justify-content: flex-end;flex-wrap: wrap;}
.mealTime .foodList li .calBox .cal{color:#6D7B85;}
.mealTime .foodList li .calBox .cal .gB{color:#222;font-size: 4.6vw;}
.mealTime .foodList li .calBox .cal .gM{font-size: 3.5897vw;line-height: 5.64vw;margin-left: 0.5vw;}
.mealTime .foodList li .calBox .btn.del{width: auto;margin-left: 2.56vw;}
.mealTime .foodList li .calBox .btn.del a{width:5.128vw;height:5.128vw;background: url(../img/ico_del.png)no-repeat center;background-size: 5.128vw;}
.mealTime .foodList li .calBox .btn.del a span{display: inline-block;text-indent: -99999px;}

/* 식사등록팝업 */
.selctRecordList{margin-top:4.1vw;}
.selctRecordList ul li + li{margin-top:3vw;}
.selctRecordList ul li a{display: flex;padding:3.58vw 4.1vw;background: #F3F4F6;border-radius: 4.1vw;align-items: center;}
.selctRecordList ul li a .txtBox{padding-left: 5.12vw;position: relative;}
.selctRecordList ul li a::before{content:'';position: relative;width: 20.5vw;height: 16.9vw;display: block;}
.selctRecordList ul li:nth-child(1) a::before{background: url(../img/healthRecord/ico_record_food01.png)no-repeat 0 0;background-size: 100% auto;}
.selctRecordList ul li:nth-child(2) a::before{background: url(../img/healthRecord/ico_record_food02.png)no-repeat 0 0;background-size: 100% auto;}
.selctRecordList ul li:nth-child(3) a::before{background: url(../img/healthRecord/ico_record_food03.png)no-repeat 0 0;background-size: 100% auto;}



/* .recordFoodList li .food > div .btn.bookmark{width: 5.128vw;height:5.128vw;}
.recordFoodList li .food > div .btn.bookmark a{width: 100%;}
.recordFoodList li .food > div .btn.bookmark a span{display: inline-block;text-indent: -99999px;} */


.recordBlood .txtBox .btn.connect{margin-top:3vw;display: flex;justify-content: flex-start;}
.recordBlood .txtBox .btn.connect a{box-shadow: 0px 1vw 3vw 0px rgba(101, 121, 163, 0.2);border-radius: 15.38vw;padding:2vw 3vw;}
.recordBlood .txtBox .btn.connect a span{padding-left: 6.15vw;font-weight: 500;line-height:5.128vw;display:block;color: #6D7B85;}
.recordBlood .txtBox .btn.connect a span{background:url(../img/healthRecord/ico_health_aos.png)no-repeat left center;background-size: 5.128vw;}
body.ios .recordBlood .txtBox .btn.connect a span{background:url(../img/healthRecord/ico_health_ios.png)no-repeat left center;background-size: 5.128vw;}

/* 혈당 상세 */
.btn.writeSugar{position: fixed;right:6.15vw;bottom:10.25vw;width:14.3589vw;height:14.3589vw;background: #0262F3 url(../img/ico_plus_w.png)no-repeat center center;background-size:6.15vw;border-radius: 50%;box-shadow: 0px 1vw 3.2vw 0px rgba(53, 141, 244, 0.4);}
.btn.writeSugar a{display: block;width:100%;height: 100%;}
.btn.writeSugar a span{display: inline-block;text-indent: -99999px;}
.recordBlood .dataBox {margin-top:4vw;}
.recordBlood .dataBox.sugar .imgBox{height: 37.948vw;background: url(../img/healthRecord/img_d_sugar.png)no-repeat 0 0;background-size: auto 100%;width:calc(100% + 12.3vw);margin-left: -6.15vw;position: relative;}
.recordBlood .dataBox.sugar .imgBox > div{position: absolute;}
.recordBlood .dataBox.sugar .imgBox > div:nth-child(1){position: absolute;top:8.7179vw;left:30.769vw;width: 12.3vw;height: 18.46vw;background:url(../img/healthRecord/img_d_sugar01.png)no-repeat 0 0;background-size: 100% 100%;
    animation: moveWritet01 2s linear forwards;
}
.recordBlood .dataBox.sugar .imgBox > div:nth-child(2){
    bottom: 1vw;
    right: 31vw;
    width: 14.87vw;
    height: 18.46vw;
    background:url(../img/healthRecord/img_d_sugar02.png)no-repeat 0 0;background-size: 100% 100%;
    animation: moveWritet02 2.5s linear forwards;
}
@keyframes moveWritet01 {
    0% {transform: translate(0, 0) rotate(10deg);}
    20% {transform: translate(1vw, -1vw) rotate(0deg);}
    40% {transform: translate(2vw, -1vw) rotate(10deg);}
    60% {transform: translate(2vw, -1vw) rotate(0deg);}
    80% {transform: translate(1vw, -2vw) rotate(10deg);}
    100% {transform: translate(0, 0) rotate(0deg);}
}
@keyframes moveWritet02 {
    0% {transform: translate(0, 0) rotate(10deg);}
    20% {transform: translate(-2vw, -1vw) rotate(0deg);}
    40% {transform: translate(-4vw, -2vw) rotate(10deg);}
    60% {transform: translate(-4vw, -2vw) rotate(0deg);}
    80% {transform: translate(-2vw, -1vw) rotate(10deg);}
    100% {transform: translate(0, 0) rotate(0deg);}
}
.recordBlood .dataBox ul{margin-top:4vw;}
.recordBlood .dataBox ul li{display: flex;align-items: center;position: relative;}
.recordBlood .dataBox ul li + li{padding-top:3vw;}
.recordBlood .dataBox ul li + li::before{content:'';position: absolute;left:3.8vw;top: -50%;background:#DEE4EE;width:1px;height: 100%;z-index: 1;}
.recordBlood .dataBox ul li > .date{min-width:8.7179vw;font-size: 3vw;line-height: 5.128vw;color:#6D7B85;margin-right: 4vw;background: #fff;position: relative;padding:2vw 0;z-index: 2;font-family: 'gSans';}
.recordBlood .dataBox ul li > .box{background:#F2F5F7;border-radius: 4vw;padding:5.128vw;width: 100%;position: relative;}
.recordBlood .dataBox ul li > .box .meal{font-size:3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;margin-bottom: 0.5vw;}
.recordBlood .dataBox ul li > .box .flexBox{align-items: center;}
.recordBlood .dataBox ul li > .box .flexBox .label{font-size: 3vw;height:5.128vw;line-height: 5.128vw;padding:0 1.538vw;border-radius: 1.538vw;font-weight: 700;background:rgba(66, 153, 255, 0.2);color:#4299FF;margin-right: 2vw;}
.recordBlood .dataBox ul li > .box .flexBox .label.danger{background: rgba(242, 124, 99, 0.15);color:#F27C63;}
.recordBlood .dataBox ul li > .box .flexBox .val{font-size:3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;font-family: 'gSans';}
.recordBlood .dataBox ul li > .box .flexBox .val > span{font-size: 4vw;line-height: 6.15vw;font-weight: 700;color: #222;display: inline-block;margin-right: 0.5vw;font-family: 'gSans';letter-spacing: 0;}
.recordBlood .dataBox ul li > .box .flexBox .btn{width:4.6vw;height: 4.6vw;}
.recordBlood .dataBox ul li > .box .flexBox .btn a{display: block;background:url(../img/healthRecord/ico_edit.png)no-repeat 0 0;background-size: 100%;width:100%;height: 100%;margin-left: 1vw;}
.recordBlood .dataBox ul li > .box .flexBox .btn a span{display: inline-block;text-indent: -9999px;}
.recordBlood .dataBox ul li > .box .connectBox{position: absolute;top:50%;right:5.128vw;margin-top:-4.1vw;width:8.2vw;height: 8.2vw;}
.recordBlood .dataBox ul li > .box .connectBox .btn.del{width:100%;height: 100%;}
.recordBlood .dataBox ul li > .box .connectBox .btn.del a{width:100%;height: 100%;background: url(../img/ico_del.png)no-repeat right center;background-size: 5.12vw;}
.recordBlood .dataBox ul li > .box .connectBox .btn.del a span{display: inline-block;text-indent: -99999px;}
.recordBlood .dataBox ul li.cnn > .box .flexBox .btn{display: none;}
.recordBlood .dataBox ul li.cnn > .box .connectBox .btn.del{display: none;}
.recordBlood .dataBox ul li.cnn > .box .connectBox .ico{background:url(../img/healthRecord/ico_health_aos_l.png)no-repeat 0 0;background-size:100%;width:100%;height: 100%;}
body.ios .recordBlood .dataBox ul li.cnn > .box .connectBox .ico{background:url(../img/healthRecord/ico_health_ios_l.png)no-repeat 0 0;background-size:100%;}

/* 혈압 상세 */
.recordBlood .dataBox.bp .imgBox{height: 37.948vw;background: url(../img/healthRecord/img_d_pressure.png)no-repeat center 5.128vw;background-size: 27.179vw 27.9vw;position: relative;}
.recordBlood .dataBox.bp .imgBox > div{position: absolute;}
.recordBlood .dataBox.bp .imgBox > div:nth-child(1){position: absolute;top:9.7vw;left:25.6vw;width: 15.128vw;height: 13.33vw;background:url(../img/healthRecord/img_d_pressure01.png)no-repeat 0 0;background-size: 100% 100%;
    animation: moveHeartbeat01 2s 0.5s linear infinite;
}
.recordBlood .dataBox.bp .imgBox > div:nth-child(2){
    top: 12.1vw;
    left: 25.5vw;
    width: 11vw;
    height: 5.37vw;
    background:url(../img/healthRecord/img_d_pressure02.png)no-repeat 0 0;background-size: 100% 100%;
    clip-path: inset(0 100% 0 0);
    animation: moveHeartbeat02 2.5s linear infinite;
}
@keyframes moveHeartbeat01 {
    0% {transform: scale(1.05);}
    10% {transform: scale(1);}
    20% {transform: scale(1.05);}
    30% {transform: scale(1);}
    100% {transform: scale(1);}
}
@keyframes moveHeartbeat02 {
    0% {clip-path: inset(0 100% 0 0);}
    100% {clip-path: inset(0 0 0 0);}
}





.recordBlood .dataBox.bp ul li > .box{padding:6.9vw 5.128vw;}
.recordBlood .dataBox.bp ul li > .box .flexBox .val{line-height: 8.2vw;}
.recordBlood .dataBox.bp ul li > .box .flexBox .val > span{margin-right: 0;}

/* 몸무게 상세 */
.wrap.bgWeight{background:linear-gradient(180deg, #FFFFFF 55%, #6BB8FE 200%)}
.recordWeight .topCon .txtBox .btn.goal{display: flex;justify-content: flex-start;}
.recordWeight .topCon .txtBox .btn.goal a{border-radius: 23vw;padding:1.5vw 3vw;display: block;border:1px solid #DEE4EE;}
.recordWeight .topCon .txtBox .btn.goal a span{display: inline-block;color:#222;line-height: 5.64vw;font-size: 3.589vw;font-weight: 700;letter-spacing: 0;}
.recordWeight .topCon .txtBox .btn.goal a span.txt{padding-left: 7.179vw;padding-right: 4vw;position: relative;background:url(../img/ico_arrow_r_g02.png)no-repeat right center;background-size: 3vw;}
.recordWeight .topCon .txtBox .btn.goal a span.txt::before{content:'';position: absolute;left: 0;top:0;width: 6.15vw;height: 6.15vw;background: url(../img/healthRecord/ico_btn_goal.png)no-repeat 0 0;background-size:100%;}
.recordWeight .topCon .txtBox .btn.goal a span span{margin:0 1vw;}
.recordWeight .flexBox > div{width: 50%;text-align: center;}
.recordWeight .flexBox > div:first-child{padding-right: 5.128vw;}
.recordWeight .flexBox > div:last-child{border-left: 1px dashed rgba(0,0,0,0.2);padding-left: 5.128vw;}
.recordWeight .flexBox > div .tit{font-size: 4vw;line-height: 6.15vw;color:#6D7B85;font-weight: 500;margin-bottom: 1.538vw;}
.recordWeight .flexBox > div .imgBox{width: 20.5vw;height: 20.5vw;position: relative;margin:0 auto;margin-bottom: 2vw;}
.recordWeight .flexBox > div:nth-child(1) .imgBox{background: url(../img/healthRecord/img_weight.png)no-repeat 0 0;background-size: 100% 100%;}
.recordWeight .flexBox > div:nth-child(2) .imgBox{background: url(../img/healthRecord/img_height01.png)no-repeat 0.5128vw 0.5vw;background-size: 5.128vw 19.74vw;}
.recordWeight .flexBox > div:nth-child(2) .imgBox > div{position: absolute;}
.recordWeight .flexBox > div:nth-child(2) .imgBox > div:nth-child(1){background: url(../img/healthRecord/img_height02.png)no-repeat 0 0;width: 15.726vw;height: 19.145vw;left:4.87vw;bottom: 0.256vw;background-size: 100% 100%;
    animation: moveHeight01 1s linear forwards;
}
.recordWeight .flexBox > div:nth-child(2) .imgBox > div:nth-child(2){height:0.5vw;width: 18.7179vw;border-top:0.5vw dashed rgba(0, 0, 0, 0.5);left:0.52vw;top:0;
    animation: moveHeight02 2s linear forwards;
}
@keyframes moveHeight01 {
    0% {height: 18.145vw;}
    33% {height: 19.145vw;}
    66% {height: 18.145vw;}
    100% {height:19.145vw;}
}
@keyframes moveHeight02 {
    0% {top:1.25vw;}
    50% {top:9vw;}
    100% {top:1.25vw;}
}
.recordWeight .flexBox > div .editBox{display: flex;justify-content: space-between;align-items: center;padding:3.33vw 4vw;border-radius: 3vw;background:#F6F8F9;}
.recordWeight .flexBox > div .editBox > p{font-family: 'gSans';display: flex;font-size: 3.589vw;line-height:5.64vw;color:#6D7B85;align-items: center;}
.recordWeight .flexBox > div .editBox > p span{font-weight: 700;display: inline-block;font-size: 4.6vw;line-height: 7.69vw;color:#222;margin-right: 1vw;}
.recordWeight .flexBox > div .editBox > .btn.edit{width:4.6vw;height: 4.6vw;}
.recordWeight .flexBox > div .editBox > .btn.edit a{display: block;background:url(../img/healthRecord/ico_edit.png)no-repeat 0 0;background-size: 100%;width:100%;height: 100%;margin-left: 1vw;}
.recordWeight .flexBox > div .editBox > .btn.edit a span{display: inline-block;text-indent: -9999px;}
.recordWeight .flexBox > div .editBox.nodata > p span{color:#A7ADBB}
.recordWeight .dataBox{margin-top:6.4vw;}
.recordWeight .dataBox .detailBox{background:#fff;box-shadow: 0px 0.5vw 3.84vw 0px rgba(53, 62, 113, 0.1);border-radius: 6.15vw;padding:6.15vw;text-align: center;}
.recordWeight .dataBox .detailBox + .detailBox{margin-top:4vw;}
.recordWeight .dataBox .detailBox div + div{margin-top:1.538vw;}
.recordWeight .dataBox .detailBox .bmi,
.recordWeight .dataBox .detailBox .weight{display: flex;justify-content: center;align-items: center;}
.recordWeight .dataBox .detailBox .bmi,
.recordWeight .dataBox .detailBox .weight{color:#6D7B85;font-weight: 500;}
.recordWeight .dataBox .detailBox .num{background:#E4F3FB;border-radius: 15.38vw;padding:0.769vw 2vw;margin:0 1vw;font-family: 'gSans';font-weight: 700;color:#222;}
.recordWeight .dataBox .detailBox .num span{font-family: 'gSans';font-weight: 700;color:#222;font-size:3.8vw;line-height: 6.66vw;padding-left: 7.179vw;display: inline-block;position: relative;}
.recordWeight .dataBox .detailBox .weight .num span{background:url(../img/healthRecord/ico_weight.png)no-repeat left center;background-size:6.15vw;}
.recordWeight .dataBox .detailBox .bmi.ty01 .num span{background:url(../img/healthRecord/ico_bmi01.png)no-repeat left center;background-size:6.15vw;}
.recordWeight .dataBox .detailBox .bmi.ty02 .num span{background:url(../img/healthRecord/ico_bmi02.png)no-repeat left center;background-size:6.15vw;}
.recordWeight .dataBox .detailBox .bmi.ty03 .num span,
.recordWeight .dataBox .detailBox .bmi.ty04 .num span,
.recordWeight .dataBox .detailBox .bmi.ty05 .num span{background:url(../img/healthRecord/ico_bmi03.png)no-repeat left center;background-size:6.15vw;}
.recordWeight .dataBox .detailBox .bmi .num span:after{font-family:'Pretendard','Poppins','dotum','돋움';margin-left: 0.5vw;}
.recordWeight .dataBox .detailBox .bmi.ty01 .num span::after{content:'(저체중)';}
.recordWeight .dataBox .detailBox .bmi.ty02 .num span::after{content:'(정상)';}
.recordWeight .dataBox .detailBox .bmi.ty03 .num span::after{content:'(과체중)';}
.recordWeight .dataBox .detailBox .bmi.ty04 .num span::after{content:'(비만)';}
.recordWeight .dataBox .detailBox .bmi.ty05 .num span::after{content:'(고도비만)';}
.recordWeight .dataBox .detailBox .point{padding-right: 7.179vw;background:url(../img/healthRecord/ico_walk_safe.png)no-repeat right center;background-size:6.15vw;display: inline-block;}

/***************************
    3. 생체 나이 분석
***************************/
.bodyAge{}
.bodyAge .visual{width:calc(100% + 12.3vw);margin-left:-6.15vw;height:107.69vw;background:url(../img/bodyAge/bg_visual.png)no-repeat 0 0;background-size: 100% auto;position: relative;text-align: center;}
.bodyAge .visual .h1{padding-top:9.23vw;}
.bodyAge .visual .fs3{padding-top:6.15vw;}
.bodyAge .visual .imgBox > div:nth-child(1){position: absolute;bottom:22.3vw;left: 0;width: 100%;height: 28.46vw;background:url(../img/bodyAge/img_visual01.png)no-repeat 0 0;background-size: 100% 100%;
    animation: bodyAge01 1s 2 linear forwards;
}
@keyframes bodyAge01 {
    0% {height: 28.46vw;}
    25% {height: 26.46vw;}
    50% {height: 28.46vw;}
    75% {height: 26.46vw;}
    100% {height:28.46vw;}
}

.bodyAge .visual .imgBox > div:nth-child(2){position: absolute;top:34.6vw;left: 21.538vw;width: 56.923vw;height: 28.46vw;background:url(../img/bodyAge/img_visual02.png)no-repeat 0 0;background-size: 100% auto;}
.bodyAge .visual .imgBox > div:nth-child(3){position: absolute;bottom:11.28vw;left:13.33vw;width: 73.33vw;height: 47.69vw;background:url(../img/bodyAge/img_visual03.png)no-repeat 0 0;background-size: 100% auto;}
.bodyAge .visual .imgBox > div:nth-child(4){position: absolute;bottom:45.5vw;left:40vw;width: 20.17vw;height: 6.4vw;background:url(../img/bodyAge/img_visual04.png)no-repeat 0 0;background-size: 100% auto;
    animation: bodyAge02 0.4s 2s linear forwards;
}
@keyframes bodyAge02 {
    0% {bottom:45.5vw;}
    100% {bottom:50.5vw;}
}

.bodyAge .checkList{text-align: center;}
.bodyAge .checkList .label{width: 20.5vw;height: 7.179vw;line-height: 7.179vw;background:rgba(217, 217, 217, 0.4);border-radius: 12.8vw;font-size: 3vw;font-weight: 700;font-family: 'gSans';text-align: center;margin: 0 auto;margin-bottom: 4vw;}
.bodyAge .checkList .tit{font-size: 6.15vw;line-height: 8.7179vw;font-weight: 700;}
.bodyAge .checkList .txt{font-size: 4vw;line-height: 6.15vw;color: #6D7B85;}
.bodyAge .checkList .tit + .txt{margin-top: 3vw;}
.bodyAge .checkList li{margin-top:20.5vw;}
.bodyAge .checkList li:first-child{margin-top: 10.25vw;}
.bodyAge .checkList li .imgBox{width:calc(100% + 12.3vw);margin-left: -6.15vw;}
.bodyAge .checkList li .imgBox > div{position: absolute;}
.bodyAge .checkList li:nth-child(1) .imgBox{height: 71.28vw;position: relative;margin-top:5.128vw;}
.bodyAge .checkList li:nth-child(1) .imgBox.is-active > div:nth-child(1){position: absolute;bottom:0;left:50%;margin-left:-28.974vw;width: 57.948vw;height: 71.28vw;background:url(../img/bodyAge/img_checkList_01_1.png)no-repeat 0 0;background-size: 100% auto;z-index: 2;opacity: 0;
    transform-origin: bottom center;
    animation: checkList01_1 0.2s 1s linear forwards;
}
@keyframes checkList01_1 {
    0% {transform: rotate(0);opacity: 1;}
    100% {transform: rotate(-11deg);opacity: 1;}
}
.bodyAge .checkList li:nth-child(1) .imgBox.is-active > div:nth-child(2){position: absolute;bottom:-2vw;left:50%;margin-left:-28.974vw;width: 57.948vw;height: 71.28vw;background:url(../img/bodyAge/img_checkList_01_2.png)no-repeat 0 0;background-size: 100% auto;opacity: 0.5;z-index: 3;
    animation: checkList01_2 0.8s linear forwards;
}
@keyframes checkList01_2 {
    0% {bottom:-4vw;opacity: 0.3;}
    100% {bottom:0;opacity:1;}
}
.bodyAge .checkList li:nth-child(1) .imgBox.is-active > div:nth-child(3){position: absolute;bottom:0;left:50%;margin-left:-28.974vw;width: 57.948vw;height: 71.28vw;background:url(../img/bodyAge/img_checkList_01_3.png)no-repeat 0 0;background-size: 100% auto;z-index: 1;opacity: 0;
    transform-origin: bottom center;
    animation: checkList01_3 0.2s 1s linear forwards;
}
@keyframes checkList01_3 {
    0% {transform: rotate(0);opacity: 1;}
    100% {transform: rotate(11deg);opacity: 1;}
}


.bodyAge .checkList li:nth-child(2) .imgBox{height: 84.6vw;margin-top:6.15vw;overflow: hidden;position: relative;}
.bodyAge .checkList li:nth-child(2) .imgBox.is-active > div:nth-child(1){height: 34.87vw;background: url(../img/bodyAge/img_checkList_02_1.png)no-repeat 0 0;background-size: 100% auto;z-index: 2;width: 100%;bottom:0;left:0;
    opacity: 0;
    animation: checkList02_1 0.6s 1.2s linear forwards;
}
@keyframes checkList02_1 {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
.bodyAge .checkList li:nth-child(2) .imgBox.is-active > div:nth-child(2){position: absolute;bottom:0;left:50%;margin-left:-34.87vw;width: 69.74vw;height: 84.6vw;background:url(../img/bodyAge/img_checkList_02_2.png)no-repeat 0 0;background-size: 100% auto;
    z-index: 1;
    clip-path: inset(0 0 100% 0);
    animation: checkList02_2 1.2s linear forwards;
}
@keyframes checkList02_2 {
    0% {clip-path: inset(0 0 100% 0);}
    100% {clip-path: inset(0 0 0 0);}
}


.bodyAge .checkList li:nth-child(3) .imgBox{height: 84.6vw;background: url(../img/bodyAge/img_checkList_03.png)no-repeat center bottom 5.89vw;background-size: 100% auto;position: relative;margin-top:6.15vw;}
.bodyAge .checkList li:nth-child(3) .imgBox.is-active > div:nth-child(1){position: absolute;bottom:13vw;left:6.66vw;width: 41vw;height: 28.2vw;background:url(../img/bodyAge/img_checkList_03_1.png)no-repeat 0 0;background-size: 100% 100%;
    z-index: 2;
    animation: checkList03_1 1s 2 linear forwards;
}
@keyframes checkList03_1 {
    0% {height: 28.2vw;}
    25% {height: 26.2vw;}
    50% {height: 28.2vw;}
    75% {height: 26.2vw;}
    100% {height:28.2vw;}
}
.bodyAge .checkList li:nth-child(3) .imgBox.is-active > div:nth-child(2){position: absolute;bottom:26.15vw;left:13.589vw;width: 26.66vw;height: 48.7179vw;background:url(../img/bodyAge/img_checkList_03_2.png)no-repeat 0 0;background-size: 100% 100%;z-index: 1;
    clip-path: inset(100% 0 0 0);
    animation: checkList03_2 0.4s 2s linear forwards;
}
@keyframes checkList03_2 {
    0% {clip-path: inset(100% 0 0 0);}
    100% {clip-path: inset(0 0 0 0);}
}
.bodyAge .checkList li:nth-child(3) .imgBox.is-active > div:nth-child(3){position: absolute;bottom:27.948vw;left:10.5vw;width: 32.8vw;height: 14.35vw;background:url(../img/bodyAge/img_checkList_03_3.png)no-repeat 0 0;background-size: 100% 100%;z-index: 1;
    transform: scale(0.1);
    animation: checkList03_3 0.2s 2.6s linear forwards;
}
@keyframes checkList03_3 {
    0% {transform: scale(0.1);}
    100% {transform: scale(1);}
}


.certiList .dotList li{color:#6D7B85;font-size: 3.589vw;line-height: 5.6vw;}
.certiList .dotList li::before{background:#A7ADBB;}

.certiStepList li{display: flex;align-items: center;}
.certiStepList li + li{margin-top:6.15vw;}
.certiStepList li .imgBox{margin-right: 8.2vw;width: 23.589vw;}
.certiStepList li .label{font-size: 3vw;line-height: 5.128vw;font-weight: 500;font-family: 'gSans';margin-bottom: 1vw;color: #A7ADBB;}
.certiStepList li .txt{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;}

.bodyAgeMain .topCon{width:calc(100% + 12.3vw);margin-left:-6.15vw;min-height: 133.33vw;background: linear-gradient(360deg, #FFFFFF -2.61%, #A7CDE4 100%);}
.bodyAgeMain .topCon .titArea{position: relative;padding:0 6.15vw;padding-top:9.23vw;}
.bodyAgeMain .topCon .popHelp{position: absolute;top:9.23vw;right:6.15vw;width: auto;}
.bodyAgeMain .topCon .popHelp span{display: inline-block;text-indent: -99999px;}
.bodyAgeMain .topCon .ageCon{position: relative;min-height: 67.69vw;margin-top:14.3589vw;}
.bodyAgeMain .topCon .ageCon .txt{font-size: 5.128vw;line-height: 1.5;font-weight: 700;color:#6D7B85;text-align: center;top:-4vw;position: relative;}
.bodyAgeMain .topCon .ageCon .line{position:absolute;height: 67.69vw;right:2.56vw;bottom:0;background: url(../img/bodyAge/img_ageLine.png)repeat-y 0 0;width: 5.128vw;background-size: 100% auto;}
.bodyAgeMain .topCon .ageCon .line > p{position: absolute;right:13.846vw;height: 10.769vw;min-width: 21vw;background: #000;border-radius: 3vw;color:#fff;font-weight: 700;font-size: 4.6vw;line-height: 10.769vw;padding:0 3vw;text-align: center;display: flex;justify-content: center;margin-top: -5.3845vw;top:50%;animation: upDown 3s linear forwards;}
@keyframes upDown {
    0% {top:50%;}
    25% {top:10%;}
    75% {top:90%;}
    100% {top:50%;}
}
.bodyAgeMain .topCon .ageCon .line > p span{color: #3DD18A;margin-right: 0.5vw;font-family: 'gSans';vertical-align: top;}
.bodyAgeMain .topCon .ageCon .line p::before{content:'';position: absolute;width: 0px;height: 0px;border-top:2vw solid transparent;border-left: 2.3vw solid #000;border-bottom: 2vw solid transparent;right: -2vw;top: 50%;margin-top: -1.79vw;}
.bodyAgeMain .topCon .ageCon .line p::after{content:'';position: absolute;width:15.79vw;height: 2px;top:50%;margin-top:-1px;right:-13.79vw;background:#000;}
.bodyAgeMain .topCon .ageCon .imgBox{width:73.33vw;height: 47.69vw;position: absolute;top:11.79vw;left:13.33vw;background: url(../img/bodyAge/img_main_visual.png)no-repeat 0 0;background-size: 100% auto;}
.bodyAgeMain .topCon .ageCon .line .age{}

.bodyAgeMain .noData{position: relative;margin-top:-12.3vw;padding-top:13.33vw;margin-bottom: 10.256vw;}
.bodyAgeMain .noData::before{content: '';position: absolute;left:-6.15vw;top:0;width:calc(100% + 13.3vw);height:3.07vw;background:#F0F2F5;}

.bodyAgeMain .fullData{position: relative;margin-top:-29.74vw;}
.bodyAgeMain .fullData .cntWalkBox{display: flex;padding:2.8vw 5.128vw;border-radius: 17.9vw;background: linear-gradient(90deg, #358ADA 0%, #42DBAF 100%);width: max-content;margin:0 auto;}
.bodyAgeMain .fullData .cntWalkBox dl{display: flex;position: relative;}
.bodyAgeMain .fullData .cntWalkBox dl + dl{margin-left: 2vw;padding-left: 2.5vw;}
.bodyAgeMain .fullData .cntWalkBox dl + dl::before{content:'';position: absolute;top:50%;margin-top:-0.5vw;left:0;width: 1vw;height: 1vw;border-radius: 50%;background:#fff;}
.bodyAgeMain .fullData .cntWalkBox dl dt{color:#fff;font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;margin-right: 2vw;}
.bodyAgeMain .fullData .cntWalkBox dl dd{color:#fff;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;font-family: 'gSans';letter-spacing: 0;}
.bodyAgeMain .fullData .cntWalkBox dl dd .counter{color:#fff;font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;font-family: 'gSans';letter-spacing: 0;}
.bodyAgeMain .fullData .fewYearsBox{display: flex;position: relative;margin-top:4vw;}
.bodyAgeMain .fullData .fewYearsBox > div{box-shadow: 0px 1vw 5.128vw 0px rgba(124, 135, 176, 0.2);border-radius: 6.15vw;width:100%;height: 36.4vw;text-align: center;display: flex;align-items: center;justify-content: center;}
.bodyAgeMain .fullData .fewYearsBox > div.age{margin-left: 3vw;}
.bodyAgeMain .fullData .fewYearsBox > div.age p{background:url(../img/bodyAge/ico_few_age.png)no-repeat center 0;background-size: 15.897vw;}
.bodyAgeMain .fullData .fewYearsBox > div.walk p{background:url(../img/bodyAge/ico_few_walk.png)no-repeat center 0;background-size: 15.897vw;}
.bodyAgeMain .fullData .fewYearsBox > div p{padding-top:15.89vw;font-size: 4vw;line-height: 6.15vw;font-weight: 700;}
.bodyAgeMain .fullData .fewYearsBox > p{position: absolute;display:flex;left:50%;margin-left:-7.9485vw;width: 15.897vw;height: 12.3vw;top:50%;margin-top:-6.15vw;background: url(../img/bodyAge/ico_arrow_blue.png)no-repeat 0 0;background-size: 100% auto;justify-content: center;align-items: center;font-size: 3vw;line-height: 5.128vw;color:#fff;font-weight: 700;}
.bodyAgeMain .halfData{position: relative;margin-top:-19.487vw;}
.bodyAgeMain .halfData .btnFewYears a{display:block;padding:4vw 5.128vw;border-radius: 5.128vw;background:#E0F1FF url(../img/bodyAge/img_btn_fewYear.png)no-repeat right 5.128vw center;background-size: 32.8vw;}

.bodyAgeMain .dataList{margin-top:4vw;margin-bottom: 10.25vw;}
.bodyAgeMain .dataList ul{}
.bodyAgeMain .dataList ul li{border-bottom: 1px solid #DEE4EE;}
.bodyAgeMain .dataList ul li a{display:block;position:relative;padding:6.15vw 4vw 6.15vw 10.256vw;background: url(../img/bodyAge/ico_analysis.png)no-repeat left center, url(../img/ico_arrow_r_bk.png)no-repeat right center;background-size:6.15vw, 4vw;}
.bodyAgeMain .dataList ul li a .date{font-size: 3vw;line-height: 5.128vw;color:#6D7B85;font-family: 'gSans';margin-bottom: 0.5vw;}
.bodyAgeMain .dataList ul li a .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;}

.btnGrayBox > div{background:#F3F4F6;border-radius: 4vw;overflow: hidden;}
.btnGrayBox > div a{padding:2vw 5.128vw;text-align: left;width: 100%;}
.btnGrayBox > div a span{padding-left: 16.4vw;line-height: 13.33vw;display: block;font-size: 4vw;font-weight: 700;}
.btnGrayBox > div.ageFirst span{background: url(../img/bodyAge/ico_ageFirst.png)no-repeat left center;background-size: 13.33vw;}
.btnGrayBox > div.ageLately span{background: url(../img/bodyAge/ico_ageLately.png)no-repeat left center;background-size: 13.33vw;}

.popCon .checkupCon .nameBox{background: #F6F8F9;border-radius: 5.128vw;padding:5.128vw 0;text-align: center;margin-bottom: 8.2vw;margin-top:6.15vw;}
.popCon .checkupCon .bodyInfoList .myList{display: block;}
.popCon .checkupCon .bodyInfoList .myListEdit{display: none;}
.popCon .checkupCon .bodyInfoList ul li{display: flex;justify-content: space-between;margin-top:8.2vw;}
.popCon .checkupCon .bodyInfoList ul li .tit{font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;margin-top:1vw;}
.popCon .checkupCon .bodyInfoList ul li .valBox{max-width: 48.7vw;text-align: right;display: flex;justify-content: flex-end;}
.popCon .checkupCon .bodyInfoList ul li .valBox .val{font-family: 'gSans';font-size: 4vw;line-height: 6.15vw;}
.popCon .checkupCon .bodyInfoList ul li .valBox .unit{font-family: 'gSans';font-size: 3.589vw;line-height: 5.64vw;color:#6D7B85;margin-left: 0.5vw;}
.popCon .checkupCon .bodyInfoList ul li .valBox .errorTxt{text-align: left;}
.popCon .checkupCon .bodyInfoList .save,
.popCon .checkupCon .bodyInfoList .myListEdit{display: none;}
.popCon .checkupCon .bodyInfoList .radioTxtBox input[type="radio"] + label{width:23vw;}


/* 분석데이터 */
.anlysDataCon .resultCon {margin-top:6.15vw;}
.anlysDataCon .resultCon .titArea{display: flex;justify-content: space-between;align-items: center;}
.anlysDataCon .resultCon .titArea .btn.down{width: auto;}
.anlysDataCon .resultCon .titArea .btn.down a{padding-left: 5.64vw;background: url(../img/ico_down.png)no-repeat left center;background-size: 4.6vw;color: #6D7B85;font-weight: 500;}

.anlysDataCon .resultCon .ageBox{}
.anlysDataCon .resultCon .ageBox{display: flex;position: relative;margin-top:4vw;}
.anlysDataCon .resultCon .ageBox > div{box-shadow: 0px 1vw 5.128vw 0px rgba(124, 135, 176, 0.2);border-radius: 6.15vw;width:100%;height: 28.2vw;text-align: center;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.anlysDataCon .resultCon .ageBox > div:last-child{margin-left: 2vw;}
.anlysDataCon .resultCon .ageBox > div p{color:#6D7B85;font-weight: 500;}
.anlysDataCon .resultCon .ageBox > div p:last-child{font-size: 5.64vw;line-height: 8.2vw;font-weight: 700;color:#222;}
.anlysDataCon .resultCon .ageBox > div p span{font-size: 6.15vw;line-height: 8.2vw;font-family: 'gSans';}
.anlysDataCon .resultCon .ageBox > p{position: absolute;display:flex;left:50%;margin-left:-7.9485vw;width: 15.897vw;height: 12.3vw;top:50%;margin-top:-6.15vw;background: url(../img/bodyAge/ico_arrow_red.png)no-repeat 0 0;background-size: 100% auto;justify-content: center;align-items: center;font-size: 3.589vw;line-height: 5.64vw;color:#fff;font-weight: 700;}
.anlysDataCon .resultCon .ageBox > p.good{position: absolute;display:flex;left:50%;margin-left:-7.9485vw;width: 15.897vw;height: 12.3vw;top:50%;margin-top:-6.15vw;background: url(../img/bodyAge/ico_arrow_blue.png)no-repeat 0 0;background-size: 100% auto;justify-content: center;align-items: center;font-size: 3.589vw;line-height: 5.64vw;color:#fff;font-weight: 700;}

.anlysDataCon .resultCon.metsAge .totalAvgBox{background:#F6F8F9;border-radius: 5.128vw;padding:9.23vw 0;text-align: center;margin-top:8.2vw;}
.anlysDataCon .resultCon.metsAge .totalAvgBox p{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;}

.anlysDataCon .resultCon.metsAge .detailAge{display: flex;margin-top:5.128vw;}
.anlysDataCon .resultCon.metsAge .detailAge li{border-left: 1px solid #DEE4EE;width: calc(100%/4);text-align: center;}
.anlysDataCon .resultCon.metsAge .detailAge li:first-child{border-left: 0;}
.anlysDataCon .resultCon.metsAge .detailAge li .tit{color:#6D7B85;font-size: 3.589vw;line-height: 5.64vw;}
.anlysDataCon .resultCon.metsAge .detailAge li p:nth-child(2){font-size: 4vw;line-height: 6.15vw;font-weight: 700;font-family: 'gSans';margin-bottom: 2vw;}
.anlysDataCon .resultCon.metsAge .detailAge li p span{padding-left: 4vw;}
.anlysDataCon .resultCon.metsAge .detailAge li p.up span{background:url(../img/bodyAge/ico_age_up.png)no-repeat left center;background-size: 4vw;}
.anlysDataCon .resultCon.metsAge .detailAge li p.down span{background:url(../img/bodyAge/ico_age_down.png)no-repeat left center;background-size: 4vw;}
.anlysDataCon .resultCon.metsAge .detailAge li .label{font-size: 3vw;line-height: 5.128vw;font-weight: 700;border-radius: 1.5vw;padding:0 1.5vw;display: inline-block;vertical-align: top;}
.anlysDataCon .resultCon.metsAge .detailAge li .label.vBad{color:#F26363;background: rgba(242, 99, 99, 0.15);;}
.anlysDataCon .resultCon.metsAge .detailAge li .label.bad{color:#FC7C51;background:rgba(242, 161, 99, 0.15)}
.anlysDataCon .resultCon.metsAge .detailAge li .label.good{color:#4299FF;background:rgba(66, 153, 255, 0.2);}
.anlysDataCon .resultCon.metsAge .reportTxt{text-align: center;margin-top:5.128vw;}
.anlysDataCon .resultCon.metsAge .reportTxt span{line-height: 10.256vw;padding-left: 12.3vw;background: url(../img/bodyAge/ico_report.png)no-repeat left center;background-size: 10.256vw;color: #6D7B85;font-weight: 500;display: inline-block;}
.anlysDataCon .resultCon.metsAge .medicalCert{padding:0 6.15vw;margin-top:10.256vw;padding-top:10.256vw;border-top:3vw solid #F0F2F5;width: calc(100% + 12.3vw);margin-left: -6.15vw;}
.anlysDataCon .resultCon .resultTbl .tHeader{background: #EBEEF4;border-radius: 2vw;display: flex;}
.anlysDataCon .resultCon .resultTbl .tHeader p{font-weight: 700;font-size: 3.589vw;line-height: 5.64vw;padding:2.56vw 0;}
.anlysDataCon .resultCon .resultTbl .tHeader p:first-child{padding-left: 4.87vw;width: 55%;}
.anlysDataCon .resultCon .resultTbl .tHeader p:nth-child(2){width: 25%;text-align: center;}
.anlysDataCon .resultCon .resultTbl .tHeader p:nth-child(3){width: 20%;text-align: center;padding-right: 4vw;}
.anlysDataCon .resultCon .resultTbl .tBody .tr{border-bottom:1px solid #DEE4EE;display: flex;align-items: center;}
.anlysDataCon .resultCon .resultTbl .tBody .td{padding:4vw;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td:nth-child(1){padding-left: 3vw;width: 55%;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td:nth-child(2){width: 25%;text-align: center;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td:nth-child(3){width: 20%;text-align: center;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td > p{color: #6D7B85;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td > p strong{font-weight: 700;font-family: 'gSans';color:#222;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td:nth-child(2) > p{font-size: 3.589vw;line-height: 5.64vw;font-family: 'gSans';}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td .check{width: 4vw;height: 4vw;background: url(../img/bodyAge/ico_result_check.png)no-repeat 0 0;background-size: 100% auto;margin-left:2vw;}
.anlysDataCon .resultCon .resultTbl .tBody .tr .td .check.on{width: 4vw;height: 4vw;background: url(../img/bodyAge/ico_result_check_on.png)no-repeat 0 0;background-size: 100% auto;}

.anlysDataCon .resultCon.metsAge .manageGoal{padding:0 6.15vw;margin-top:10.256vw;padding-top:10.256vw;border-top:3vw solid #F0F2F5;width: calc(100% + 12.3vw);margin-left: -6.15vw;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea{display: flex;align-items: center;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea > p{width: 100%;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea > p + p{margin-left: 3vw;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea p{border-radius: 6.15vw;background: #868E96;text-align: center;font-weight: 700;color:#fff;padding:2vw 0;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea p:nth-child(2){background:#50CD98;}
.anlysDataCon .resultCon.metsAge .manageGoal .titArea p:nth-child(2) span{padding-left: 7.69vw;background: url(../img/healthRecord/ico_btn_goal.png)no-repeat left center;background-size: 6.15vw;line-height: 6.15vw;display: inline-block;}
.anlysDataCon .resultCon.metsAge .manageGoal ul{margin-top:3vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li{display: flex;text-align: center;align-items:stretch;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div{width: 100%;padding:4vw;position: relative;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div::before{content:'';position: absolute;top:0;left:4.1vw;border-top:1px dashed rgba(0,0,0,0.3);width:calc(100% - 8.2vw);}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:first-child div::before{content:none;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div + div{margin-left: 3vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:first-child div:first-child{background: #F6F8F9;border-radius: 5.128vw 5.128vw 0 0;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div:first-child{background: #F6F8F9;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:last-child div:first-child{background: #F6F8F9;border-radius:0 0 5.128vw 5.128vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div p:first-child{font-size: 3.589vw;line-height: 5.64vw;color:#6D7B85;margin-bottom: 0.5vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div p:last-child{font-weight: 500;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li div:last-child{border-left:1px solid #000;border-right:1px solid #000;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:first-child div:last-child{border:1px solid #000;border-bottom:0;border-radius: 5.128vw 5.128vw 0 0;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:last-child div:last-child{border:1px solid #000;border-top:0;border-radius: 0 0 5.128vw 5.128vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:first-child div{padding-top:6.15vw;}
.anlysDataCon .resultCon.metsAge .manageGoal ul li:last-child div{padding-bottom:6.15vw;}


/* 비만 체형 나이 */
.anlysDataCon .resultCon.obesityCon .obesityAgeBox{display: flex;margin-top:8.2vw;align-items: stretch;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age{width: 100%;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div{border-radius: 3vw;background:#FFF4F4;display: flex;justify-content: space-between;align-items: center;padding:4vw 5.128vw;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div + div{margin-top:2vw;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div p{font-size: 3.589vw;line-height: 5.64vw;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div p:last-child{color:#F27C63;padding-left: 4vw;font-weight: 700;font-family: 'gSans';}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div p:last-child span{padding-left: 4vw;background: url(../img/bodyAge/ico_age_up.png)no-repeat left center;background-size: 4vw;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div.good{background:#E6F2FF;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div.good p:last-child{color:#4299FF;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .age div.good p:last-child span{background: url(../img/bodyAge/ico_age_down.png)no-repeat left center;background-size: 4vw;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .rank{width: 100%;margin-left: 2vw;background:#F6F8F9;border-radius: 4vw;display: flex;justify-content: center;align-items: center;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .rank > div p{font-size: 3.589vw;line-height: 5.64vw;color:#6D7B85;font-weight: 500;}
.anlysDataCon .resultCon.obesityCon .obesityAgeBox .rank > div p:last-child{margin-top:0.5vw;font-weight: 700;font-size: 5.128vw;line-height: 1.5;color: #222;}

.anlysDataCon .resultCon.obesityCon .anlysList{padding:0 6.15vw;margin-top:10.256vw;padding-top:10.256vw;border-top:3vw solid #F0F2F5;width: calc(100% + 12.3vw);margin-left: -6.15vw;}
.anlysDataCon .resultCon.obesityCon .anlysList .checkPoint{padding:5.128vw;background: #F6F8F9;border-radius: 5.128vw;}
.anlysDataCon .resultCon.obesityCon .anlysList .checkPoint > p{padding-left: 7.435vw;font-size: 4vw;line-height: 6.15vw;font-weight: 700;font-family: 'gSans';background: url(../img/bodyAge/ico_pin.png)no-repeat left center;background-size: 6.15vw;margin-bottom: 3vw;}
.anlysDataCon .resultCon.obesityCon .anlysList .dotList li::before{background: #A7ADBB;}
.anlysDataCon .resultCon.obesityCon .anlysList .dotList li{font-size: 4vw;line-height: 6.15vw;}
.anlysDataCon .resultCon.obesityCon .anlysList .dotList li + li{margin-top:3vw;}

.anlysDataCon .resultCon.obesityCon .manageObesity{padding:0 6.15vw;margin-top:10.256vw;padding-top:10.256vw;border-top:3vw solid #F0F2F5;width: calc(100% + 12.3vw);margin-left: -6.15vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health li + li{margin-top:10.256vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity li div{padding-left: 23.589vw;min-height: 19.487vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity li div p{color:#6D7B85;}
.anlysDataCon .resultCon.obesityCon .manageObesity li div p:first-child{font-weight: 700;font-size: 4vw;line-height: 6.15vw;color:#222;margin-bottom:1vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health .bgBox{background:#F5F9FF;border-radius: 4vw;padding:4.6vw 5.128vw;margin-top:3vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health li.ty01 div{background:url(../img/bodyAge/img_health01.png)no-repeat left top;background-size: 19.487vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health li.ty02 div{background:url(../img/bodyAge/img_health02.png)no-repeat left top;background-size: 19.487vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health li.ty03 div{background:url(../img/bodyAge/img_health03.png)no-repeat left top;background-size: 19.487vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .health li.ty04 div{background:url(../img/bodyAge/img_health04.png)no-repeat left top;background-size: 19.487vw;}

.anlysDataCon .resultCon.obesityCon .manageObesity .eating li + li{margin-top:8.2vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .eating li.ty01 div{background:url(../img/bodyAge/img_eating01.png)no-repeat left top;background-size: 19.487vw;}
.anlysDataCon .resultCon.obesityCon .manageObesity .eating li.ty02 div{background:url(../img/bodyAge/img_eating02.png)no-repeat left top;background-size: 19.487vw;}



/***************************
    5. 바른자세 도우미
***************************/
/* 바른자세도우미 */
.postureCon .topCon{width:calc(100% + 12.3vw);margin-left: -6.15vw;background: #fff;padding:0 6.15vw;}
.bgGray .postureCon .topCon{padding-bottom:6.15vw;}
.postureCon .infoBox{margin-top:6.15vw;border-radius: 4vw;}
.postureCon .infoBox.more{padding:3vw 5.128vw;background:#F3F4F6;}
.postureCon .infoBox.more > p{padding-left: 5.64vw;background:url(../img/ico_info.png)no-repeat left center;background-size: 4.6vw;color:#6D7B85;font-weight: 500;font-size: 3.589vw;line-height: 5.64vw;}
.postureCon .infoBox.check{background:#EAF7FF;border-radius: 4vw;}
.postureCon .infoBox.check .btn.poseCheck{padding:2.3vw 5.128vw 2.3vw 4.3578vw;text-align: left;}
.postureCon .infoBox.check .btn.poseCheck span{position:relative;font-size: 3.589vw;font-weight: 700;line-height: 7.69vw;padding-left: 11vw;background-image: linear-gradient(90.18deg, #0EC5ED 0.26%, #4670DB 95.84%);background-clip: text;-webkit-background-clip: text;color: transparent;display: block;}
.postureCon .infoBox.check .btn.poseCheck span::before{content:'';position: absolute;left:0;top:50%;margin-top:-3.845vw;background:none;width:7.69vw;height:7.69vw;background-size: 100% auto;background: url(../img/posture/ico_pose_ai.png)no-repeat 0 0;background-size: 100% 100%;}
.postureCon .infoBox.check .btn.poseCheck span::after{content:'';position: absolute;right:0;top:50%;margin-top:-1.28vw;background:url(../img/ico_arrow_r_g.png)no-repeat 0 0;width:1.538vw;height:2.56vw;background-size: 100% auto;}
.postureCon .dataBox{margin-top:6.15vw;}
.postureCon .dataBox li{padding:4vw 5.128vw;background: #fff;border-radius: 6.15vw;position: relative;}
.postureCon .dataBox li + li{margin-top:3vw;}
.postureCon .dataBox li .top .date{color:#A7ADBB;font-size: 2.8vw;line-height: 2;font-weight: 500;}
.postureCon .dataBox li .top .date span{font-family: 'gSans';font-weight: 300;}
.postureCon .dataBox li .top .cntBox{display: flex;align-items: center;}
.postureCon .dataBox li .top .cntBox > p:nth-child(1){font-weight: 700;margin-right:3vw;}
.postureCon .dataBox li .top .cntBox > p:nth-child(2){font-weight: 700;font-size: 4vw;line-height: 6.15vw;font-family: 'gSans';margin-right: 0.5vw;}
.postureCon .dataBox li .top .cntBox > p:nth-child(3){font-weight: 700;color:#A7ADBB;font-size:3.589vw;line-height: 7.69vw;font-weight: 500;margin-right: 0.5vw;}
.postureCon .dataBox li .top .cntBox > p:nth-child(4){font-weight: 700;color:#A7ADBB;font-size: 4vw;line-height: 6.15vw;font-family: 'gSans';margin-right: 0.5vw;}
.postureCon .dataBox li .top .cntBox > p:nth-child(5){font-weight: 700;color:#A7ADBB;}
.postureCon .dataBox li .top .label{display: none;}
.postureCon .dataBox li.stop .top .label{display: block;font-size: 3vw;line-height: 5.128vw;height:5.128vw;padding:0 1vw;color:#F27C63;background:rgba(242, 124, 99, 0.2);border-radius: 1.5vw;font-weight: 700;}
.postureCon .dataBox li .bottom{border-top:1px dashed #ddd;padding-top:3vw;margin-top:2vw;}
.postureCon .dataBox li .bottom > dl{display: flex;}
.postureCon .dataBox li .bottom > dl dt{color:#6D7B85;padding-left: 5.128vw;font-weight: 500;line-height: 6.15vw;margin-right:2vw;}
.postureCon .dataBox li .bottom > dl:nth-child(1) dt{background: url(../img/posture/ico_pose_o.png)no-repeat left center;background-size:4vw;}
.postureCon .dataBox li .bottom > dl:nth-child(2) dt{background: url(../img/posture/ico_pose_x.png)no-repeat left center;background-size:4vw;}
.postureCon .dataBox li .bottom > dl dd{min-width: 8.97vw;font-weight: 700;line-height: 6.15vw;text-align: right;}
.postureCon .dataBox li .bottom > dl dd span{font-family: 'gSans';line-height: 6.66vw;margin-right: 0.5vw;}
.postureCon .dataBox li .imgBox{display: none;}
.postureCon .dataBox li.first .imgBox{display: block;position:absolute;right:0;bottom:0;background: url(../img/posture/img_pose_success.png)no-repeat 0 0;background-size: 100% 100%;width: 35.89vw;height:100%;}
.postureCon .dataBox li.first .imgBox > div{position: absolute;}
.postureCon .dataBox li.first .imgBox > div:nth-child(1){background: url(../img/posture/img_pose_success_1.png)no-repeat 0 0;background-size: 100% 100%;width: 35.89vw;height:100%;
    z-index: 2;
    animation: stamp05 0.6s 1.2s 1 linear forwards;
}

@keyframes stamp05 {
    0% {
        transform: translate(0, 0);
    }
    /* 50% {
        transform: translate(-4vw, 5vw);
    } */
    50% {
        transform: translate(-2vw, 3vw);
    }
    100% {
        transform: translate(0, 0);
    }
}
.postureCon .dataBox li.first .imgBox > div:nth-child(2){background: url(../img/posture/img_pose_success_2.png)no-repeat 0 0;background-size: 100% 100%;width: 35.89vw;height:100%;
    z-index: 1;
    opacity: 0;
    animation: pose03_2 0.8s 1.2s 1 ease-in-out forwards;
}


.popup .imgBox.aiStretch{background: #F3F4F6;border-radius: 4vw;padding:4vw 5.128vw;}
.popup .imgBox.aiStretch p{font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;padding-left: 20.5vw;background:url(../img/posture/img_aiStretch.png)no-repeat left center;background-size: 16.4vw;min-height: 16.4vw;}

.timerCon {display: flex;justify-content: center;}
.timer {position: relative;width: 64vw;height: 64vw;}
.timerRing {transform: rotate(90deg) scaleX(-1);transform-origin: center;}
.timerCon circle {width: 64vw;height: 64vw;/* opacity: 0; */stroke:#d8f3dc;/* animation: stepS 0s linear forwards; */transition: stroke-dashoffset 1s linear, stroke 0s linear;}
.timerTxt {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 5.128vw;font-weight: 700;text-align: center;line-height: 1.5;}
.timerTxt span{display: block;font-size: 10.256vw;line-height: 1.5;font-weight: 700;font-family: 'gSans';margin-bottom: 1vw;}
.tipBox{margin-top:9.23vw;}
.tipBox li{background: #fff;border-radius: 8.2vw;padding:5.128vw;box-shadow: 0px 6.4vw 10.256vw 0px rgba(31, 58, 74, 0.24);display: none;}
.tipBox li p.label{background:#FAF3CE;padding:0 2vw;border-radius: 17.9vw;display: inline-block;vertical-align: top;margin-bottom: 3vw;}
.tipBox li p.label span{font-family: 'gSans';font-size: 3vw;line-height: 6.15vw;font-weight: 700;padding-left: 5.64vw;background:url(../img/posture/ico_tip.png)no-repeat left center;background-size: 4.6vw;display: inline-block;}
.tipBox li p.tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;margin-bottom: 1vw;}
.tipBox li p.txt{font-family: 4vw;line-height: 6.15vw;color:#6D7B85;font-weight: 500;}
.anlysCon{display: none;text-align: center;}
.anlysCon .imgBox{width: calc(100% + 12.3vw);height:38.97vw;margin-left: -6.15vw;background: url(../img/posture/img_pose_scan.png)no-repeat 0 0;background-size: 100% 100%;position: relative;margin-top:10.5vw;}
.anlysCon .imgBox > div{position: absolute;}
.anlysCon .imgBox > div:nth-child(1){
    width: 41.53vw;height: 31.53vw;bottom:0;left:50%;margin-left: -20.765vw;
    background: url(../img/posture/img_pose_scan01.png)no-repeat 0 0;background-size: 100% 100%;
    animation: scan01move 2.5s linear infinite;
}
@keyframes scan01move {
    0% {height:31.53vw;}
    50% {height:15.53vw;}
    100% {height:31.53vw;}
}

.anlysCon .imgBox > div:nth-child(2){top:-7.9487vw;left:50%;margin-left:-4.87vw;width: 9.74vw;height: 9.74vw;background: url(../img/posture/img_pose_scan02.png)no-repeat 0 0;background-size: 100% 100%;
    animation: scan02move 2.5s linear infinite;
}
@keyframes scan02move {
    0% {transform: translate(0, 0) rotate(0);}
    15% {transform: translate(0, 1vw) rotate(0);}
    30% {transform: translate(0, 0) rotate(0);}
    45% {transform: translate(0, 1vw) rotate(-10deg);}
    70% {transform: translate(0, 0) rotate(0);}
    85% {transform: translate(0, 1vw) rotate(10deg);}
    100% {transform: translate(0, 0) rotate(0);}
}

.anlysCon .anlysTxt{font-size: 5.128vw;font-weight: 700;text-align: center;line-height: 1.5;display: inline-block;position: relative;margin-top:5.12vw;}
.anlysCon .anlysTxt::after {content: "";animation: dotAnimation 3s infinite steps(2);text-align: left;width: 4vw;display: inline-block;}
@keyframes dotAnimation {
    0% { content: ""; }
    33.3% { content: "."; }
    66.6% { content: ".."; }
    100% { content: "..."; }
}

.popup.posePop .imgBox{width: calc(100% + 12.3vw);height:71.28vw;margin:2vw 0;margin-left:-6.15vw;}
.popup.posePop .imgBox.pose01{background: url(../img/posture/img_posePop01.png)no-repeat 0 0;background-size:100% auto;position: relative}
.popup.posePop .imgBox.pose01 > div{position: absolute;}
.popup.posePop.on .imgBox.pose01 > div:nth-child(1){width: 43vw;height: 35.89vw;background: url(../img/posture/img_posePop01_1.png)no-repeat 0 0;background-size: 100% 100%;
    opacity: 0;
    right: 14vw;bottom:0;
    animation: stamp 1s 1s 1 linear forwards;
}
@keyframes stamp {
    0% {
        transform: scale(0) rotate(0deg);
        opacity: 0;
    }
    50% {
        transform: scale(1.2) rotate(10deg);
        opacity: 1;
    }
    70% {
        transform: scale(0.9) rotate(-5deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
}

.popup.posePop.on .imgBox.pose01 > div:nth-child(2){width: 11.28vw;height: 6.9vw;background: url(../img/posture/img_posePop01_2.png)no-repeat 0 0;background-size: 100% 100%;
    left:43.8vw;top:12.56vw;
    clip-path: inset(0 0 100% 0);
    animation: pose01_2 1s 1s linear infinite;
}
@keyframes pose01_2 {
    0% {clip-path: inset(0 0 100% 0);}
    80% {clip-path: inset(0 0 0 0);}
    100% {clip-path: inset(0 0 0 0);}
}
.popup.posePop .imgBox.pose02{background: url(../img/posture/img_posePop02.png)no-repeat 0 0;background-size:100% auto;position: relative}
.popup.posePop .imgBox.pose02 > div{position: absolute;}
.popup.posePop.on .imgBox.pose02 > div:nth-child(1){width: 44.87vw;height:40vw;background: url(../img/posture/img_posePop02_1.png)no-repeat 0 0;background-size: 100% 100%;
    opacity: 0;
    right: 0;bottom:0;
    animation: stamp 1s 1s 1 linear forwards;
}
.popup.posePop.on .imgBox.pose02 > div:nth-child(2){width: 11.28vw;height:11.28vw;background: url(../img/posture/img_posePop02_2.png)no-repeat 0 0;background-size: 100% 100%;
    left:50%;margin-left:-5.64vw;top:5.38vw;
    animation: pose02_2 2.5s linear infinite;
}
@keyframes pose02_2 {
    0% {transform: rotateY(0deg) translateY(0);}
    50% {transform: rotateY(180deg) translateY(1vw);}
    10% {transform: rotateY(0deg) translateY(0);}
}
.popup.posePop .imgBox.pose03{background: url(../img/posture/img_posePop03.png)no-repeat 0 bottom;background-size:100% auto;position: relative;}
.popup.posePop .imgBox.pose03 > div{position: absolute;}
.popup.posePop.on .imgBox.pose03 > div:nth-child(1){width: 100%;height:58.46vw;background: url(../img/posture/img_posePop03_1.png)no-repeat 0 0;background-size: 100% 100%;
    left: 0;top:0;
    z-index: 2;
    animation: stamp02 0.6s 1.2s 1 linear forwards;
}
@keyframes stamp02 {
    0% {
        transform: translate(0, 0);
    }
    /* 50% {
        transform: translate(-4vw, 5vw);
    } */
    50% {
        transform: translate(-4vw, 5vw);
    }
    100% {
        transform: translate(0, 0);
    }
}
.popup.posePop.on .imgBox.pose03 > div:nth-child(2){width: 100%;height:100%;background: url(../img/posture/img_posePop03_2.png)no-repeat 0 0;background-size: 100% 100%;
    left: 0;top:0;
    opacity: 0;
    z-index: 1;
    animation: pose03_2 0.8s 1.2s 1 ease-in-out forwards;
}
@keyframes pose03_2 {
    0% {opacity: 0;transform: scale(0);}
    100% {opacity: 1;transform: scale(1);}
}
.popup.posePop .imgBox.pose04{background: url(../img/posture/img_posePop04.png)no-repeat 34.35vw 14.1vw;background-size:28.7vw auto;position: relative;}
.popup.posePop .imgBox.pose04 > div{position: absolute;}
.popup.posePop.on .imgBox.pose04 > div:nth-child(1){width: 46.239vw;height:27.9vw;background: url(../img/posture/img_posePop04_1.png)no-repeat 0 0;background-size: 100% 100%;
    left: 31vw;bottom:17.9vw;
    z-index: 2;
    animation: stamp04 0.6s 1s 2 linear forwards;
}
@keyframes stamp04 {
    0% {transform: rotate(0deg);}
    33% {transform: rotate(10deg);}
    66% {transform: rotate(-10deg);}
    100% {transform: rotate(0deg);}
}

.popup.posePop.on .imgBox.pose04 > div:nth-child(2){width: 100%;height:100%;background: url(../img/posture/img_posePop04_2.png)no-repeat 0 0;background-size: 100% 100%;
    left: 0;top:0;
    opacity: 0;
    z-index: 1;
    animation: pose03_2 0.8s 2s 1 ease-in-out forwards;
}

/* 스트레칭 알람 */
.stretchCon .topCon{width:calc(100% + 12.3vw);margin-left: -6.15vw;background: #fff;padding:0 6.15vw;}
.stretchCon .ingAlrm {margin-top:15.38vw;}
.stretchCon .ingAlrm .imgBox{height:42.56vw;margin-bottom:2vw;background: url(../img/posture/img_stretch_bg.png)no-repeat 0 0;background-size: 100% auto;position: relative;
    width: calc(100% + 12.3vw);margin-left: -6.15vw;
}
.stretchCon .ingAlrm .imgBox > div{position: absolute;}
.stretchCon .ingAlrm .imgBox > div:nth-child(1){height: 25.64vw;width: 100%;background: url(../img/posture/img_stretch_bg01.png)no-repeat 0 0;background-size: 100% auto;left: 0;bottom:0;}
.stretchCon .ingAlrm .imgBox > div:nth-child(2){width: 33.33vw;height: 42.56vw;background: url(../img/posture/img_stretch_bg02.png)no-repeat 0 0;background-size: 100% 100%;
    left: 50%;margin-left: -16.665vw;bottom:0;
    z-index: 2;
    animation: sleep01 1s 2 linear forwards;
}
@keyframes sleep01 {
    0% {height: 39.56vw;}
    100% {height: 42.56vw;}
}

.stretchCon .ingAlrm .imgBox > div:nth-child(3){width: 13.84vw;height: 7.69vw;background: url(../img/posture/img_stretch_bg03.png)no-repeat 0 0;background-size: 100% 100%;
    right: 24.87vw;top:0;
    z-index: 2;
    clip-path: inset(0 100% 0 0);
    animation: sleep02 1s 2 linear forwards;
}
@keyframes sleep02 {
    0% {clip-path: inset(0 100% 0 0);}
    80% {clip-path: inset(0 0 0 0);}
    100% {clip-path: inset(0 0 0 0);}
}

.stretchCon .stretchList{background:#F3F4F6;}
.bgGray .stretchCon .topCon{padding-bottom:6.15vw;}
.stretchCon .stretchList ul{margin-top:6.15vw;}
.stretchCon .stretchList ul li{display: flex;align-items: center;position: relative;}
.stretchCon .stretchList ul li + li{padding-top:3vw;}
.stretchCon .stretchList ul li + li::before{content:'';position: absolute;left:3.8vw;top: -50%;background:#DEE4EE;width:1px;height: 100%;z-index: 1;}
.stretchCon .stretchList ul li > .date{min-width:8.7179vw;font-size: 3vw;line-height: 5.128vw;color:#6D7B85;margin-right: 4vw;background: #F3F4F6;position: relative;padding:2vw 0;z-index: 2;font-family: 'gSans';}
.stretchCon .stretchList ul li > .box{background:#fff;border-radius: 4vw;padding:3.33vw 5.128vw;width: 100%;position: relative;}
.stretchCon .stretchList ul li > .box .meal{font-size:3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;margin-bottom: 0.5vw;}
.stretchCon .stretchList ul li > .box .flexBox{align-items: center;justify-content: space-between;}
.stretchCon .stretchList ul li > .box .flexBox .label{font-size: 3vw;height:5.128vw;line-height: 5.128vw;padding:0 1.538vw;border-radius: 1.538vw;font-weight: 700;background:rgba(66, 153, 255, 0.2);color:#4299FF;margin-right: 2vw;}
.stretchCon .stretchList ul li > .box .flexBox .label.fail{background: rgba(242, 124, 99, 0.15);color:#F27C63;}
.stretchCon .stretchList ul li > .box .flexBox .progress{font-size: 3.589vw;line-height: 5.64vw;font-weight: 500;color:#6D7B85;}
.stretchCon .stretchList ul li > .box .flexBox .progress .cnt,
.stretchCon .stretchList ul li > .box .flexBox .progress .allCnt{font-size: 4vw;line-height: 6.15vw;font-weight: 700;font-family: 'gSans';}
.stretchCon .stretchList ul li > .box .flexBox .progress .cnt{color:#222;margin-left: 1vw;}
.stretchCon .stretchList ul li > .box .flexBox .progress .allCnt{color:#A7ADBB;margin-right: 0.5vw;}
.stretchCon .stretchList ul li > .box .flexBox .progress .slash{font-size: 3.589vw;line-height: 7.69vw;font-weight: 500;color:#A7ADBB;margin:0 0.5vw;}

.postureCon .postureGuide{margin-top:6.15vw;}
.postureCon .postureGuide dl + dl{margin-top:10.25vw;}
.postureCon .postureGuide dt{font-size: 4vw;line-height: 6.15vw;font-weight: 700;position: relative;padding-left: 3.6vw;text-indent: -3.6vw;}
.postureCon .postureGuide dt + dd{margin-top:4vw;}
.postureCon .postureGuide dd .imgBox{display: flex;justify-content: space-between;}
.postureCon .postureGuide dd .imgBox > div + div{margin-left: 3vw;}

.popCon .alrmBox{position: relative;padding-left: 16.4vw;min-height: 13.33vw;}
.popCon .alrmBox::before{content:'';position: absolute;left:0;top:0;border-radius: 50%;width:13.33vw;height:13.33vw;background:#F2F8FA url(../img/login/ico_alrm.png)no-repeat center center;background-size: 8.2vw;}
.popCon .alrmBox > p{margin-top:0.5vw;}
.popCon .alrmCount{position:relative;width:calc(100% + 12.3vw);margin-left:-6.15vw;height:64vw;background: url(../img/posture/img_stretch_alrmCount.png)no-repeat 0 0;background-size: 100% auto;}
.popCon .alrmCount::before{content:'';position: absolute;left: 12.56vw;top:0;width: 27.69vw;height: 27.69vw;background: url(../img/posture/img_stretch_alrmCount_1.png)no-repeat 0 0;background-size: 100% auto;
    animation: alrmM01 2s 1s 1 ease-in-out forwards;
}
@keyframes alrmM01 {
    0% {transform: rotate(0deg);}
    33% {transform: rotate(10deg);}
    66% {transform: rotate(-10deg);}
    100% {transform: rotate(0deg);}
}


.on .popCon .alrmCount > div{position: absolute;left:0;bottom:0;width: 100%;height: 39.48vw;background: url(../img/posture/img_stretch_alrmCount_2.png)no-repeat 0 0;background-size: 100% auto;
    animation: alrmM02 0.8s 1s 2 ease-in-out forwards;
}
@keyframes alrmM02 {
    0% {transform: rotate(0deg);}
    20% {transform: rotate(3deg);}
    40% {transform: rotate(-3deg);}
    60% {transform: rotate(3deg);}
    80% {transform: rotate(-3deg);}
    100% {transform: rotate(0deg);}
}

.popCon .alrmCount > p{position: absolute;font-size: 3.589vw;line-height: 3.6vw;color:#A7ADBB;font-weight: 700;text-align: center;left: 36vw;top: 17.8vw;}
.popCon .alrmCount > p span{font-size: 11.28vw;line-height:15.38vw;font-family: 'gSans';color:#222;font-weight: 700;}






/***************************
    6. 건강정보
***************************/
.tabList ul li.diet a span{padding-left: 5.128vw;background:url(../img/healthInfo/ico_diet.png)no-repeat left center;background-size:4.1vw;}
.tabList ul li.sugar a span{padding-left: 5.128vw;background:url(../img/healthInfo/ico_sugar.png)no-repeat left center;background-size:4.1vw;}
.tabList ul li.pressure a span{padding-left: 5.128vw;background:url(../img/healthInfo/ico_pressure.png)no-repeat left center;background-size:4.1vw;}
.infoHealth .titArea{padding-top:9.23vw;}
.infoHealth .titArea .tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;margin-bottom: 0.5vw;}
.infoHealth .titArea .date{font-size: 2.8vw;line-height: 2;color:#A7ADBB;font-family: 'gSans';}
.infoHealth .txtArea{margin-top:5.12vw;}
.infoHealth .txtArea > div,
.infoHealth .txtArea > p{margin-top:5.12vw;}
.infoHealth .txtArea > div:first-child,
.infoHealth .txtArea > p:first-child{margin-top:0;}
.infoHealth .txtArea p{color: #6D7B85;}
.videoCon{width: 100%;}
.videoCon a{display: block;width:100%;height:100%;border:1px solid #DEE4EE;padding:4.6vw 4vw;border-radius: 4vw;display: flex;align-items: center;background: url(../img/ico_arrow_r_g_02.png)no-repeat right 4vw center;background-size: 3vw;}
.videoCon a .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;color:#222;}
.videoCon a > .imgBox img{object-fit: cover;width: 100%;height: 100%;}


/***************************
    7. 이벤트
***************************/
.eventList{}
.eventList li{margin-top:6.15vw;}
.eventList li .imgBox {position: relative;width:100%;height:38.46vw;margin-bottom: 3vw;overflow: hidden;border-radius: 6.15vw;}
.eventList li .imgBox img {width: 100%;height: 100%;object-fit: cover;position: relative;}
.eventList li .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;margin-bottom: 1vw;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.eventList li .date{font-size: 2.8vw;line-height: 2;color:#A7ADBB;font-family: 'gSans';font-weight: 300;}
.eventList.finish li .imgBox::before{content:'종료된 이벤트예요.';position: absolute;background:rgba(0, 0, 0, 0.5);width:100%;height:100%;color:#fff;left:0;top:0;z-index: 1;display: flex;justify-content: center;align-items: center;font-weight: 700;font-size:4.6vw;}

.eventDetail .titArea {margin-bottom: 5.128vw;}
.eventDetail .titArea .tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;margin-bottom: 0.5vw;}
.eventDetail .titArea .date{font-size: 2.8vw;line-height: 2;color:#A7ADBB;font-family: 'gSans';}
.eventDetail .imgBox{width:calc(100% + 12.3vw);margin-left: -6.15vw;}
.eventDetail .eventInfoBox{margin-top:10.25vw;}
.eventDetail .eventInfoBox dl{display: flex;align-items: center;}
.eventDetail .eventInfoBox dl + dl{margin-top:3vw;}
.eventDetail .eventInfoBox dl dt{border-radius: 12.8vw;background:#222;font-size: 3.589vw;font-weight: 700;min-width: 21.5vw;padding:0 2.56vw;line-height: 6.66vw;height: 6.66vw;color:#fff;text-align: center;margin-right: 3vw;}
.eventDetail .eventInfoBox dl dd{font-family: 'gSans';}



/***************************
    8. 마이페이지
***************************/
.profilBox{margin-top:9.23vw;text-align: center;}
.profilBox .imgBox{display: flex;align-items: center;justify-content: center;position: relative;}
.profilBox .imgBox .roundBox{width: 28.2vw;height: 28.75vw;border-radius: 10.256vw;background:url(../img/mypage/bg_profile.png)no-repeat 0 0;background-size:100% auto;position: relative;overflow: hidden;padding-bottom: 0.64vw;}
.profilBox .imgBox .roundBox > div{width: 28.2vw;height: 28.2vw;position: absolute;}
.profilBox .imgBox .roundBox > div:nth-child(1){right:-28.2vw;top:0;animation: character01 0.6s 0.4s ease-in forwards;background:url(../img/mypage/img_profile_c01.png)no-repeat 0 0;background-size: cover;}
.profilBox .imgBox .roundBox > div:nth-child(2){left:-28.2vw;top:0;animation: character02 0.6s 0.8s ease-in forwards;background:url(../img/mypage/img_profile_c02.png)no-repeat 0 0;background-size: cover;}
.profilBox .imgBox .roundBox > div:nth-child(3){bottom:-28.2vw;left:0;animation: character03 0.8s 1.4s ease-in forwards;background:url(../img/mypage/img_profile_c03.png)no-repeat 0 0;background-size: cover;}
.profilBox .imgBox .roundBox > div:nth-child(4){width:14.87vw;height:3.33vw;bottom:-28.2vw;left:6.66vw;animation: character03_2 0.6s 1.0s ease-in forwards;background:url(../img/mypage/img_profile_c04.png)no-repeat 0 0;background-size: cover;}
@keyframes character01 {
    0% {right:-28.2vw;top:0;}
    100% {right:0;top:0;}
}
@keyframes character02 {
    0% {left:-28.2vw;top:0;}
    100% {left:0;top:0;}
}
@keyframes character03 {
    0% {bottom:-28.2vw;left:0;}
    100% {bottom:0.55vw;left:0;}
}
@keyframes character03_2 {
    0% {bottom:-28.2vw;left:6.66vw;}
    100% {bottom:0;left:6.66vw;}
}

.profilBox .imgBox + .txt{font-size:6.15vw;line-height: 8.7179vw;font-weight: 700;margin-top:3vw;}
.profilBox .btn{display: flex;justify-content: center;margin-top:2vw;}
.profilBox .btn a{padding:1vw 2vw;display: block;border-radius: 2vw;background: #E3F6F3;}
.profilBox .btn a span{font-size: 3.589vw;line-height: 5.64vw;font-weight: 700;display: inline-block;color:#3DD18A;}
.profilBox + .barList{margin-top:8.2vw;}
.btn.logOut{display: flex;justify-content: flex-end;margin-top:10.256vw;}
.btn.logOut a span{padding-left: 5.64vw;display: inline-block;background: url(../img/mypage/ico_logout.png)no-repeat left center;background-size:4.6vw;font-weight: 500;color: #6D7B85;}
.btn.memberOut{display: flex;justify-content: flex-end;margin-top:10.256vw;}
.btn.memberOut a span{padding-left: 5.64vw;display: inline-block;background: url(../img/mypage/ico_memberout.png)no-repeat left center;background-size:4.6vw;font-weight: 500;color: #6D7B85;}
.iptCon .iptBox .flexBox button.btnIpt{flex-shrink: 0;}
.snsCon{padding-top:13.33vw;margin-top:10.25vw;position: relative;}
.snsCon::before{content: '';position: absolute;left:-6.15vw;top:0;width:calc(100% + 13.3vw);height:3.07vw;background:#F0F2F5;}
.snsCon .txt{font-size:4.1vw;line-height: 6.15vw;font-weight: 500;text-align: center;}
.snsCon .easyLoingBox{display: flex;justify-content: center;margin-top:7.179vw;margin-bottom: 10.256vw;}
.snsCon .easyLoingBox li + li{margin-left: 11vw;}
.snsCon .easyLoingBox li a{padding-top:13.84vw;display: block;min-width: 12.3vw;position: relative;}
.snsCon .easyLoingBox li a::before{content:'연결하기';font-size:3.589vw;line-height: 5.64vw;color:#A7ADBB;}
.snsCon .easyLoingBox li.on a::before{content:'연결완료';font-size:3.589vw;line-height: 5.64vw;color:#222;}
.snsCon .easyLoingBox li.naver{background: url(../img/mypage/ico_naver.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}
.snsCon .easyLoingBox li.google{background: url(../img/mypage/ico_google.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}
.snsCon .easyLoingBox li.kakao{background: url(../img/mypage/ico_kakao.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}
.snsCon .easyLoingBox li.naver.on{background: url(../img/mypage/ico_naver_on.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}
.snsCon .easyLoingBox li.google.on{background: url(../img/mypage/ico_google_on.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}
.snsCon .easyLoingBox li.kakao.on{background: url(../img/mypage/ico_kakao_on.png)no-repeat 0 0;background-size:12.3vw 12.3vw;}

.contents.setAlrm .toggleSwitch .fullW{padding:9.23vw 6.15vw 5.128vw;background:#fff;}
.contents.setAlrm .toggleSwitch .fullW .tit{font-size:4.6vw;line-height: 7.179vw;font-weight: 700;}

/***************************
        9. 고객센터
***************************/
/* 공지사항 */
.noticeList{margin-top:4vw;}
.noticeList li{border-bottom:1px solid #DEE4EE;background:url(../img/ico_notice.png)no-repeat left 5.128vw;background-size:6.15vw;}
.noticeList li a{padding:5.128vw 0;padding-left: 9.23vw;display: block;}
.noticeList li a .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;margin-bottom:1vw;}
.noticeList li a .date{position: relative;}
.noticeList li a .date span{position: relative;display: inline-block;color:#A7ADBB;font-size: 2.8vw;line-height: 2;font-family: 'gSans';}
.noticeList li.new a .date span::before{content: '';position: absolute;width: 1.28vw;height: 1.28vw;border-radius: 50%;background:#F26C63;top:1vw;right:-2vw;}
.noticeDetail{margin-top:9.23vw;}
.noticeDetail .tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;margin-bottom: 0.5vw;}
.noticeDetail .date{margin-bottom:5.128vw;}
.noticeDetail .date span{color:#A7ADBB;font-size: 2.8vw;line-height: 2;font-family: 'gSans';position: relative;display: inline-block;}
.noticeDetail .txt{color:#6D7B85;}

/* 1:1문의 */
.inquiryList{margin-top:4vw;}
.inquiryList li{border-bottom:1px solid #DEE4EE;}
.inquiryList li a{padding:5.128vw 0;display: block;}
.inquiryList li a .label{color:#A7ADBB;font-size: 3.589vw;line-height: 5.64vw;margin-bottom: 2.3vw;}
.inquiryList li a .label span{display: inline-block;margin-left: 1vw;font-size: 3vw;line-height: 5.128vw;font-weight: 700;padding:0 2vw;background: #E4E8F1;border-radius: 1.538vw;}
.inquiryList li a .label.finish span{background:#3DD18A;color:#fff;}
.inquiryList li a .tit{font-size: 4vw;line-height: 6.15vw;font-weight: 700;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;margin-bottom:1vw;}
.inquiryList li a .date{position: relative;}
.inquiryList li a .date span{position: relative;display: inline-block;color:#A7ADBB;font-size: 2.8vw;line-height: 2;font-family: 'gSans';}

.inquiryEdit .iptCon textarea{height: 84.6vw;}

.imgUploadCon{display: flex;}
.imgUploadCon .uploadBox{border:1px solid #DEE4EE;border-radius: 4vw;background:#fff;width:20vw;height:20vw;padding:3.33vw 0;text-align: center;}
.imgUploadCon .uploadBox .btnUpload{font-size: 3vw;line-height: 5.128vw;padding-top:8.2vw;background: url(../img/ico_camera.png)no-repeat center top;background-size: 7.179vw;color:#6D7B85;font-weight: 500;display: block;}
.imgUploadCon .imgList {display: flex;flex-wrap: wrap;}
.imgUploadCon .imgList .uploadImg {position: relative;margin-left: 2.56vw;width:20vw;height:20vw;}
.imgUploadCon .imgList .uploadImg img {width: 100%;height: 100%;object-fit: cover;overflow: hidden;border: 1px solid #DEE4EE;border-radius: 4vw;}
.imgUploadCon .imgList .btnImgDel {position: absolute;top: -1vw;right: -1vw;background: #AFB8C9 url(../img/ico_menu_close.png)no-repeat center center;background-size: 2.56vw;cursor: pointer;border-radius: 50%;width: 5.128vw;height:5.128vw;}
.regPhotoBox > div{background:#F3F4F6;border-radius: 4vw;overflow: hidden;}
.regPhotoBox > div .btnUploadAlbum,
.regPhotoBox > div a{padding:2vw 5.128vw;text-align: left;width: 100%;}
.regPhotoBox > div .btnUploadAlbum span,
.regPhotoBox > div a span{padding-left: 16.4vw;line-height: 13.33vw;display: block;font-size: 4vw;font-weight: 700;}
.regPhotoBox > div .btnUploadAlbum span{background: url(../img/ico_album.png)no-repeat left center;background-size: 13.33vw;}
.regPhotoBox > div.camera span{background: url(../img/ico_camera02.png)no-repeat left center;background-size: 13.33vw;}

.inquiryDetail{margin-top:9.23vw;position: relative;}
.inquiryDetail .tit{font-size: 4.6vw;line-height: 7.179vw;font-weight: 700;margin-bottom: 0.5vw;}
.inquiryDetail .date{color:#A7ADBB;font-size: 2.8vw;line-height: 2;font-family: 'gSans';margin-bottom: 5.128vw;}
.inquiryDetail .imgBox{border: 1px solid #DEE4EE;border-radius: 6.15vw;margin-bottom: 5.128vw;}
.inquiryDetail .imgBox img{height: 100%;object-fit: cover;}
.inquiryDetail .txt{color:#6D7B85;}
.inquiryDetail .editBox{position: absolute;right:0;top:0;background:url(../img/ico_more_menu.png)no-repeat right 0;background-size: 1vw 4.6vw;width:4.6vw;height:4.6vw;}
.inquiryDetail .editBox .selBox.sm {position: relative;z-index: 1;height: 100%;border-bottom: none;min-width: auto;}
.inquiryDetail .editBox .selBox:before {content:none;}
.inquiryDetail .editBox .selBox.sm .label{padding-right: 0;width: 100%;height: 100%;line-height: 1;text-indent: -99999px;}
.inquiryDetail .editBox .selBox .selOpt{padding:0 3.07vw;}
.inquiryDetail .editBox .selBox .selOpt .selItem{text-align: center;border-radius: 0;padding:2vw;}
.inquiryDetail .editBox .selBox .selOpt .selItem + .selItem{border-top:1px solid #DEE4EE;margin-top:0;}
.inquiryDetail .editBox .selBox .selOpt .selItem.active{background: none;}

.inquiryDetail .label{color:#A7ADBB;font-size: 3.589vw;line-height: 5.64vw;margin-bottom: 2vw;}
.inquiryDetail .label span{display: inline-block;font-size: 3vw;line-height: 5.128vw;font-weight: 700;padding:0 2vw;background: #E4E8F1;border-radius: 1.538vw;color:#6D7B85;margin-left: 1vw;}
.inquiryDetail .label.finish span{background:#3DD18A;color:#fff;}
.answerBox{padding:0 6.15vw;margin-top:8.2vw;padding-top:11.28vw;border-top:3vw solid #F0F2F5;width:calc(100% + 12.3vw);margin-left: -6.15vw;}
.answerBox .tit{position:relative;padding-left: 11.28vw;line-height: 9.23vw;font-size: 4vw;font-weight: 700;margin-bottom: 2vw;}
.answerBox .tit::before{content:'';position: absolute;left:0;top:0;width: 9.23vw;height: 9.23vw;background:#373955 url(../img/ico_answer.png)no-repeat left center;background-size: 100%;border-radius: 50%;}
.answerBox .txt{color:#6D7B85;}