@charset "utf-8";

/*********************************************************************************************************/
/** 공통, 태그 스타일 초기화 */
/*********************************************************************************************************/
*{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
}
html,body,p,h1,h2,ul,ol,button,input,textarea{margin:0;padding:0}
body,input,textarea{
	font-family:"Roboto",'Noto Sans KR',NotoSansKR,'돋움',Dotum,Helvetica,"Apple SD Gothic Neo",sans-serif;
	color:#000;font-size:14px;line-height:22px;
}
select{font-family:"Roboto",'Noto Sans KR',NotoSansKR,'돋움',Dotum,Helvetica,"Apple SD Gothic Neo",sans-serif}
ul,ol{list-style:none}
a{color:#000;text-decoration:none;font-size:14px;line-height:22px}
a:hover, a:focus, a:active{outline:none}
p{font-size:14px;line-height:22px}
h1,h2,h3,h4,h5,h6{font-size:20px;line-height:40px}
h1,h2,h3,h4,h5,h6,strong{font-weight:500}
img{max-width:100%}
button{border:0}
input,textarea{background-color:#dfefff;border:1px solid #dfefff;border-radius:5px;padding:5px 10px;font-size:14px;line-height:22px}
input,textarea{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
select:focus{outline:none}
input:focus,textarea:focus{border-color:#0673f1;outline:none}
input:focus,textarea:focus{
	-webkit-box-shadow:0px 0px 5px 0px rgba(6, 115, 241, 0.5);
	-moz-box-shadow:0px 0px 5px 0px rgba(6, 115, 241, 0.5);
	-ms-box-shadow:0px 0px 5px 0px rgba(6, 115, 241, 0.5);
	-o-box-shadow:0px 0px 5px 0px rgba(6, 115, 241, 0.5);
	box-shadow:0px 0px 5px 0px rgba(6, 115, 241, 0.5);
}
/* Chrome/Opera/Safari */
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#a5c7ee}
/* Firefox 19+ */
input::-moz-placeholder,textarea::-moz-placeholder{color:#a5c7ee}
/* IE 10+ */
input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a5c7ee}
/* Firefox 18- */
input:-moz-placeholder,textarea:-moz-placeholder{color:#a5c7ee}

.clear:before, .clear:after{display:block;content:'';line-height:0;clear:both}

.dp-flex{display:flex}

.text-blue{color:#0293cf}
.text-blue-2{color:#3a96ff}
.text-red{color:#e54b4b}
.text-skyblue{color:#57a5ff}
.text-center{text-align:center}
.text-left{text-align:left !important}
.text-right{text-align:right !important}

.btn{display:inline-block;width:100%;color:#fff;font-size:24px;line-height:56px;border-radius:56px;text-align:center;font-weight:600;cursor:pointer}
.btn.btn-blue{background-color:#0673f1}
.btn.btn-skyblue{background-color:#57a5ff}
.btn.btn-skyblue-o{background-color:#dfefff;border:2px solid #a5c7ee;line-height:52px;color:#000}
.btn.btn-gray{background-color:#e9e9e9;color:#000}
.btn.btn-gray-o{background-color:#f6f6f4;border:2px solid #e1e1e1;line-height:52px;color:#000}
.btn.btn-red{background-color:#e54b4b}

.bg-step-1{background-color:#dfefff;color:#000}
.bg-step-2{background-color:#cbdf48;color:#000}
.bg-step-3{background-color:#dec132;color:#000}
.bg-step-4{background-color:#df9e48;color:#000}
.bg-step-5{background-color:#f6785e;color:#000}
.bg-step-6{background-color:#ff2f04}

.mt10{margin-top:10px}
.mt30{margin-top:30px}
.mr5{margin-right:5px}
.mr10{margin-right:10px}
.ml5{margin-left:5px}
.ml10{margin-left:10px}
.mb0{margin-bottom:0px !important}
.mb10{margin-bottom:10px}
.mb10i{margin-bottom:10px !important}
.mb20{margin-bottom:20px}

/*********************************************************************************************************/
/** 페이징 */
/*********************************************************************************************************/
.page-wrap{float:left;width:100%;padding:5px 20px 0;margin-bottom:15px}
.paginationWrap{float:left;width:100%;text-align:center;position:relative}
.paginationWrap > .totalRows{float:left;font-size:14px;line-height:34px;position:absolute;top:0;left:0}
.paginationWrap > .btn-group{float:right;position:absolute;top:0;right:0}
.pagination{display:inline-block;border-radius:4px;margin:0}
.pagination > li{float:left}
.pagination > li > a{position:relative;float:left;padding:6px 12px;margin-left:-1px;color:#444;text-decoration:none;background-color:#fff;border:1px solid #ddd}
.pagination > li > a{transition:color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out}
.pagination > li > a
, .pagination > li > a > strong{font-size:17px;line-height:20px}
.pagination > li > a > .fa{font-size:18px}
.pagination > li:first-child > a{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px}
.pagination > li:last-child > a{border-top-right-radius:4px;border-bottom-right-radius:4px}
.pagination > li > a.on{background-color:#e6e6e6}
.pagination > li > a:hover
, .pagination > li > a:focus{z-index:2;color:#23527c;background-color:#eaf5ff;border-color:#ddd}

header#header{position:fixed;z-index:2;top:0;left:0;display:inline-block;width:100%;background-color:#dfefff}
header#header .container{display:flex;max-width:375px;height:60px;margin:0 auto;padding:0;position:relative}
header#header .container h1{float:left;width:100%;line-height:60px;text-align:center;font-size:25px}
header#header .container h1.bg-white{background-color:#fff}
header#header .container h1 .txt{display:inline-block;position:relative}
header#header .container .btn-back{position:absolute;top:10px;left:20px;width:40px;height:40px;background:url(/lib/img/arrow-back.png) no-repeat left center / 30px auto}

footer#footer{position:fixed;z-index:2;bottom:0;left:0;display:inline-block;width:100%;background-color:#ebebeb}
footer#footer.search{background-color:#57a5ff}
footer#footer .container{display:flex;max-width:375px;height:80px;margin:0 auto;padding:0}
footer#footer .container a{float:left;width:100%;height:100%;text-align:center;color:#9f9f9f;font-size:14px;line-height:20px;padding-top:10px}
footer#footer .container a{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
footer#footer .container a:hover
, footer#footer .container a.active{color:#000}
footer#footer .container a img{height:40px;filter:invert(25%)}
footer#footer .container a img{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
footer#footer .container a:hover img
, footer#footer .container a.active img{filter:invert(100%)}
footer#footer .container a span{display:block;width:100%;margin-top:-5px;font-weight:500}

#wrap .main-container{display:block;max-width:375px;margin:0 auto;padding:60px 0 80px}

/* 메인페이지 */
body.main{background-color:#dfefff}
#wrap.main .main-container{padding:50px 30px;text-align:center}
#wrap.main .main-container .main-image{margin-bottom:10px}
#wrap.main .main-container .btn.btn-skyblue{margin-bottom:10px}
#wrap.main .main-container .logo{margin-top:40px}
#wrap.main .main-container .logo img{max-width:200px}

/* 인적사항 작성 및 로그인 */
body.login{background-color:#dfefff}
#wrap.login .main-container{padding:50px 20px;text-align:center}
#wrap.login.modify .main-container{padding:60px 0 0;background-color:#fff}
#wrap.login .main-container .title{font-size:30px;line-height:60px;font-weight:500;margin-bottom:10px}
#wrap.login .main-container .container-box{border:1px solid #d4d4d4;border-radius:5px;background-color:#fff;padding:40px 20px}
#wrap.login .main-container .container-box{display:inline-block;width:100%}
#wrap.login.modify .main-container .container-box{border:0;border-radius:0;padding:40px 25px 80px}
#wrap.login .main-container .container-box hr{float:left;width:100%;border:0;height:2px;background-color:#707070;margin:0}
#wrap.login .main-container .container-box .input-box{float:left;width:100%;margin-bottom:30px}
#wrap.login .main-container .container-box .input-box .input-title{font-size:26px;line-height:40px;font-weight:500;margin-bottom:10px}
#wrap.login .main-container .container-box .input-box .input-title .text-blue{font-weight:600}
#wrap.login .main-container .container-box .input-box .input-group{display:flex;align-items:center;justify-content:center}
#wrap.login .main-container .container-box .input-box .input-group > *{margin-left:10px}
#wrap.login .main-container .container-box .input-box .input-group > *:first-child{margin-left:0}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn{border:1px solid #d4d4d4;border-radius:5px;margin-bottom:10px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt{position:relative;display:inline-block;color:#bbb;font-size:35px;line-height:78px;font-weight:400}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt.disease-1{padding-left:60px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt.disease-2{padding-left:50px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt.sex-m{padding-left:65px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt.sex-f{padding-left:65px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt img{position:absolute;top:13px;left:0;width:50px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt img.active{opacity:0}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt.disease-1 img{top:10px}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn
, #wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt
, #wrap.login .main-container .container-box .input-box .img-btn-group .btn .txt img{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn.selected{border-color:#000}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn.selected{
	-webkit-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-ms-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-o-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn.selected .txt{color:#000}
#wrap.login .main-container .container-box .input-box .img-btn-group .btn.selected .txt img.active{opacity:1}
#wrap.login .main-container .container-box .input-box .input-control{display:inline-block;width:100%;font-size:30px;line-height:48px;text-align:center;font-weight:500;margin-bottom:10px}
#wrap.login .main-container .container-box .input-box textarea.input-control{line-height:40px;margin-bottom:0;padding:10px}
#wrap.login .main-container .container-box .input-box.dp-flex.view{align-items:center;justify-content:center;margin-bottom:0}
#wrap.login .main-container .container-box .input-box.dp-flex.view > *{margin-bottom:0}
#wrap.login .main-container .container-box .input-box.dp-flex.view .input-title{width:30%}

/* 혈압, 혈당 메인 */
body.blood.search.list{background-color:#dfefff}
#wrap.blood #header h1 .txt{padding-left:45px}
#wrap.blood #header h1 .txt img{position:absolute;top:13px;left:0;width:35px}
#wrap.blood.bloodSugar #header h1 .txt{padding-left:35px}
#wrap.blood.bloodSugar #header h1 .txt img{width:25px}
#wrap.blood.search #header h1 .txt{padding-left:35px}
#wrap.blood.search #header h1 .txt img{top:14px;width:26px}
#wrap.blood .main-container{background-color:#fff}
#wrap.blood .main-container .info-wrap{float:left;width:100%;padding:0 25px 50px}
#wrap.blood .main-container .info-wrap .recent-data{float:left;width:100%;padding:30px 10px}
#wrap.blood .main-container .info-wrap .recent-data > div{float:left;width:50%;min-height:140px;padding:10px}
#wrap.blood .main-container .info-wrap .recent-data > div.pul{background:url(/lib/img/icon-heart.png) no-repeat right 27px / 35px auto}
#wrap.blood .main-container .info-wrap .recent-data > div p{float:left;width:100%}
#wrap.blood .main-container .info-wrap .recent-data > div.memo a{float:left;width:100%}
#wrap.blood .main-container .info-wrap .recent-data > div .num{color:#57a5ff;font-size:60px;line-height:70px;font-weight:300}
#wrap.blood .main-container .info-wrap .recent-data > div .num img{float:left;height:46px;margin:12px 0 12px 22px}
#wrap.blood .main-container .info-wrap .recent-data > div .title{font-size:24px;line-height:30px;font-weight:500}
#wrap.blood .main-container .info-wrap .recent-data > div .unit{line-height:20px}
#wrap.blood .main-container .info-wrap .recent-data > div.btn-group{width:100%;min-height:auto;padding:10px 0}
#wrap.blood .main-container .info-wrap .recent-data > div.btn-group .btn{border:1px solid #d4d4d4;border-radius:5px;color:#000;font-size:24px;line-height:48px;font-weight:500;cursor:default}
#wrap.blood .main-container .info-wrap .btn-skyblue-o{margin-top:20px}
#wrap.blood .main-container .btn-pannel{float:left;width:100%;padding:35px 20px;background-color:#dfefff}
#wrap.blood .main-container .btn-pannel > li{float:left;width:50%;text-align:center}
#wrap.blood .main-container .btn-pannel > li a{display:inline-block;width:120px;height:120px;border-radius:120px;border:1px solid #969696;color:#707070;background-color:#fff;padding:20px}
#wrap.blood .main-container .btn-pannel > li a img{display:inline-block;height:40px}
#wrap.blood .main-container .btn-pannel > li a .txt{display:block;width:100%;font-size:24px;line-height:30px}
#wrap.blood .main-container .btn-pannel > li.regist a{color:#57a5ff;border-color:#57a5ff}

/* 혈압, 혈당 등록 */
#wrap.regist .main-container .container-box{padding:30px 25px 40px}
#wrap.regist .main-container .container-box .input-box{margin-bottom:20px}
#wrap.regist .main-container .container-box .input-box .input-title{font-size:24px;line-height:30px;font-weight:500;margin-bottom:10px}
#wrap.regist .main-container .container-box .input-box .input-title .unit{font-size:16px;font-weight:300;padding-left:15px}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn{border:1px solid #d4d4d4;border-radius:5px;margin-bottom:10px}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn .txt{position:relative;display:inline-block;color:#bbb;font-size:24px;line-height:58px;font-weight:400}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn
, #wrap.regist .main-container .container-box .input-box .img-btn-group .btn .txt
, #wrap.regist .main-container .container-box .input-box .img-btn-group .btn .txt img{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn.selected{border-color:#000}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn.selected{
	-webkit-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-ms-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	-o-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
	box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 1.0);
}
#wrap.regist .main-container .container-box .input-box .img-btn-group .btn.selected .txt{color:#000}
#wrap.regist .main-container .container-box .input-box .input-control{display:inline-block;width:100%;font-size:30px;line-height:48px;text-align:center;font-weight:500;margin-bottom:10px}
#wrap.regist .main-container .container-box .input-box .input-control.text-control{font-size:22px;line-height:30px;text-align:left;padding:15px}
#wrap.regist .main-container .container-box .input-box .input-control.select-control{background-color:#fff;color:#000;border:1px solid #d4d4d4;border-radius:5px;font-size:24px}
#wrap.regist .main-container .container-box .btn-group{display:flex;align-items:center;justify-content:space-between}
#wrap.regist .main-container .container-box .btn-group > .btn{margin:0 15px}
#wrap.regist .main-container .container-box .btn-group > .btn:first-child{margin-left:0}
#wrap.regist .main-container .container-box .btn-group > .btn:last-child{margin-right:0}

/* 혈압, 혈당 조회 */
#wrap.blood.search #header .btn-mode{position:absolute;top:13px;right:20px;float:right;width:auto;font-size:18px;line-height:34px;padding:0 15px 0 35px;font-weight:400}
#wrap.blood.search #header .btn-mode img{position:absolute;top:8px;left:15px;height:16px}
#wrap.blood.search #header .btn-mode .txt{}
#wrap.blood.search #header h1{padding-right:140px}
#wrap.blood.search #footer .container{height:145px;display:block;padding:20px}
#wrap.blood.search #footer .container .search-menu{float:left;width:100%;display:flex}
#wrap.blood.search #footer .container .search-menu a{color:#fff;font-size:19px;font-weight:500;line-height:35px;height:auto;padding:0;margin-right:2px;position:relative;opacity:0.8}
#wrap.blood.search #footer .container .search-menu a.active{color:#000;opacity:1}
#wrap.blood.search #footer .container .search-menu a:before{content:"";position:absolute;top:0;left:0;float:left;width:100%;height:100%;background-color:#fff;opacity:0.5}
#wrap.blood.search #footer .container .search-menu a:last-child{margin-right:0}
#wrap.blood.search #footer .container .search-menu a span{position:relative;float:left;width:100%;margin:0}
#wrap.blood.search #footer .container .search-menu a.active:before{opacity:1}
#wrap.blood.search #footer .container .average{float:left;width:100%}
#wrap.blood.search #footer .container .average .tab{float:left;width:100%}
#wrap.blood.search #footer .container .average .tab a{float:left;width:auto;padding:10px 15px 5px;color:#000;font-size:19px;font-weight:500;background-color:#d4d4d4;color:#aeaeae}
#wrap.blood.search #footer .container .average .tab a.active{background-color:#fff;color:#000}
#wrap.blood.search #footer .container .average .box{float:left;width:100%;background-color:#fff;height:70px;position:relative}
#wrap.blood.search #footer .container .average .box > div{float:left;width:100%;padding:10px 40px;position:absolute;top:0;left:0;opacity:0}
#wrap.blood.search.bloodSugar #footer .container .average .box > div{padding:10px 20px}
#wrap.blood.search #footer .container .average .box > div.active{opacity:1}
#wrap.blood.search #footer .container .average .box > div{
	-webkit-transition:all 0.20s ease;
	-moz-transition:all 0.20s ease;
	-ms-transition:all 0.20s ease;
	-o-transition:all 0.20s ease;
	transition:all 0.20s ease;
}
#wrap.blood.search #footer .container .average .box .txt{float:left;font-size:40px;line-height:50px;font-weight:300;color:#d3d3d3}
#wrap.blood.search #footer .container .average .box .txt.sys{color:#ee3131}
#wrap.blood.search #footer .container .average .box .txt.dia{color:#2b89dc}
#wrap.blood.search #footer .container .average .box .txt.pul{float:right;color:#000;font-size:26px;padding-right:25px;background:url(/lib/img/icon-heart.png) no-repeat right 15px / 20px auto}
#wrap.blood.search #footer .container .average .box .txt .unit{font-size:25px;line-height:30px;letter-spacing:-1px}
#wrap.blood.search .main-container{background-color:transparent;padding-bottom:145px}
#wrap.blood.search.graph .main-container{background-color:#fff}
#wrap.blood.search .main-container .list-box{float:left;width:100%;padding:0 20px 20px}
#wrap.blood.search .main-container .list-box ul{float:left;width:100%;border-top:1px solid #a5c7ee}
#wrap.blood.search .main-container .list-box ul li{float:left;width:100%;border-bottom:1px solid #a5c7ee;padding:20px 0}
#wrap.blood.search .main-container .list-box ul li .top{float:left;width:100%;margin-bottom:10px}
#wrap.blood.search .main-container .list-box ul li .top span{float:left;font-size:20px;line-height:26px}
#wrap.blood.search .main-container .list-box ul li .top span.date{font-weight:500}
#wrap.blood.search .main-container .list-box ul li .top span.txt{min-width:80px;font-weight:300;margin-left:20px;padding-left:22px;position:relative}
#wrap.blood.search .main-container .list-box ul li .top span.txt:before{content:"";position:absolute;top:5px;left:0;float:left;width:16px;height:16px;border-radius:16px}
#wrap.blood.search .main-container .list-box ul li .top span.txt.sys:before{background-color:#ee3131}
#wrap.blood.search .main-container .list-box ul li .top span.txt.dia:before{background-color:#2b89dc}
#wrap.blood.search .main-container .list-box ul li .box{float:left;width:100%;background-color:#fff;padding:15px 40px;border-radius:5px}
#wrap.blood.search.bloodSugar .main-container .list-box ul li .box{padding:15px 20px}
#wrap.blood.search .main-container .list-box ul li .box .txt{float:left;font-size:40px;line-height:50px;font-weight:300;color:#d3d3d3}
#wrap.blood.search .main-container .list-box ul li .box .txt.sys{color:#ee3131}
#wrap.blood.search .main-container .list-box ul li .box .txt.dia{color:#2b89dc}
#wrap.blood.search .main-container .list-box ul li .box .txt.pul{float:right;color:#000;font-size:26px;padding-right:25px;background:url(/lib/img/icon-heart.png) no-repeat right 15px / 20px auto}
#wrap.blood.search .main-container .list-box ul li .box .txt .unit{font-size:25px;line-height:30px;letter-spacing:-1px}
#wrap.blood.search .main-container .list-box ul li .box .memo{float:left;width:100%;font-size:20px;line-height:28px;font-weight:300;margin-top:10px}
#wrap.blood.search .main-container .graph-box{float:left;width:100%;padding:20px;background-color:#fff}
#wrap.blood.search .main-container .graph-box .top{float:left;width:100%;text-align:center}
#wrap.blood.search .main-container .graph-box .top span{display:inline-block;font-size:20px;line-height:26px}
#wrap.blood.search .main-container .graph-box .top span.txt{min-width:80px;font-weight:300;margin-left:20px;padding-left:22px;position:relative}
#wrap.blood.search .main-container .graph-box .top span.txt:before{content:"";position:absolute;top:5px;left:0;float:left;width:16px;height:16px;border-radius:16px}
#wrap.blood.search .main-container .graph-box .top span.txt.sys{margin-left:0}
#wrap.blood.search .main-container .graph-box .top span.txt.sys:before{background-color:#ee3131}
#wrap.blood.search .main-container .graph-box .top span.txt.dia:before{background-color:#2b89dc}
#wrap.blood.search .main-container .graph-box .chartWrapper{float:left;width:100%;position:relative}
#wrap.blood.search .main-container .graph-box .chartWrapper > ul{position:absolute;top:3px;left:0;float:left;height:85%;text-align:right;background-color:rgba(255,255,255,0.9);padding-right:10px}
#wrap.blood.search .main-container .graph-box .chartWrapper > ul li{font-size:15px;line-height:2.135;color:#000}
#wrap.blood.search .main-container .graph-box .chartAreaWrapper{width:100%;overflow-x:scroll}


/* 모달 */
.blocker{padding:0}
.modal{padding:15px;background-color:#dfefff}
#modal-memo.modal a.close-modal{filter:invert(100%)}
.modal .memo_view{font-size:20px;line-height:28px;margin-bottom:15px}
.modal .memo_view:last-of-type{margin-bottom:0}
.modal.modal-blood{padding:20px 25px;background-color:#fff;width:100%;min-height:100%;border-radius:0}
.modal.modal-blood .close-modal{width:25px;height:25px;top:35px;right:20px;background:url(/lib/img/close-black.png) no-repeat center center / 100% auto}
.modal.modal-blood .modal-title{float:left;width:100%;line-height:60px;text-align:center;font-size:25px;margin-bottom:20px}
.modal.modal-blood .modal-title .txt{display:inline-block;position:relative}
.modal.modal-blood .modal-title .txt{padding-left:45px}
.modal.modal-blood .modal-title .txt img{position:absolute;top:13px;left:0;width:35px}
#modal-bloodSugar.modal.modal-blood .modal-title .txt{padding-left:35px}
#modal-bloodSugar.modal.modal-blood .modal-title .txt img{width:25px}
.modal.modal-blood .step{float:left;width:100%;margin:0;display:flex;margin-bottom:15px;border-radius:5px;padding:20px 25px}
.modal.modal-blood .step.bg-step-6{color:#fff}
.modal.modal-blood .step{
	-webkit-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.25);
	-moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.25);
	-ms-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.25);
	-o-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.25);
	box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.25);
}
.modal.modal-blood .step dt
, .modal.modal-blood .step dd
, .modal.modal-blood .step dd p{float:left;width:100%;margin:0;font-size:20px;line-height:28px}
.modal.modal-blood .step dt{width:130px;font-weight:500}
.modal.modal-blood .step dd{font-weight:300}
.modal.modal-blood .meal{float:left;width:100%;margin:0;margin-bottom:15px}
.modal.modal-blood .meal.after{margin-bottom:30px}
.modal.modal-blood .meal dt
, .modal.modal-blood .meal dd{float:left;width:100%;font-size:20px;line-height:28px;margin:0}
.modal.modal-blood .meal dt{margin-bottom:10px}
.modal.modal-blood .meal dd .bar{float:left;width:100%;height:40px;position:relative}
.modal.modal-blood .meal dd .bar span{float:left;height:100%;position:absolute;top:0}
.modal.modal-blood .meal dd .bar span.bg-step-2{left:45%;width:16%}
.modal.modal-blood .meal dd .bar span.bg-step-6{left:61%;width:39%}
.modal.modal-blood .meal.after dd .bar span.bg-step-2{left:67%;width:22%}
.modal.modal-blood .meal.after dd .bar span.bg-step-6{left:89%;width:11%}
.modal.modal-blood .meal dd .txt{float:left;width:100%;height:30px;font-size:20px;line-height:30px;position:relative}
.modal.modal-blood .meal dd .txt span{float:left;height:100%;position:absolute;top:0;margin-left:-14px}
.modal.modal-blood .meal dd .txt span.step-2{left:45%}
.modal.modal-blood .meal dd .txt span.step-6{left:61%}
.modal.modal-blood .meal.after dd .txt span.step-2{left:67%}
.modal.modal-blood .meal.after dd .txt span.step-6{left:89%}

/* 건강관리 */
/*body.healthManage{background-color:#fff}*/
body.healthManage header#header{background-color:#f6f6f4}
#wrap.healthManage .main-container .info-wrap{float:left;width:100%;padding:0 25px 50px;text-align:center}
#wrap.healthManage .main-container .info-wrap .title{color:#707070;font-size:32px;line-height:44px;font-weight:300;margin-bottom:40px}
#wrap.healthManage .main-container .info-wrap img{max-width:55%;margin-top:70px}
#wrap.healthManage .main-container .info-wrap .btn{font-size:22px;margin:10px 0;font-weight:400}
#wrap.healthManage .main-container .img-wrap{float:left;width:100%;padding:30px 0 50px;text-align:center}
#wrap.healthManage .main-container .img-wrap > img{float:left;width:100%}
#wrap.healthManage .main-container .method-wrap{float:left;width:100%;padding:30px 25px 0}
#wrap.healthManage .main-container .method-wrap .method-box{float:left;width:100%;margin-bottom:30px}
#wrap.healthManage .main-container .method-wrap .method-box .title{float:left;width:100%;position:relative;padding-left:45px;font-size:24px;line-height:45px;font-weight:600;margin-bottom:10px}
#wrap.healthManage .main-container .method-wrap .method-box .title.text-center{padding-left:0}
#wrap.healthManage .main-container .method-wrap .method-box .title img{position:absolute;top:2px;left:0;width:38px}
#wrap.healthManage .main-container .method-wrap .method-box .check-list{float:left;width:100%;background-color:#dfefff;padding:25px 10px;border-radius:10px}
#wrap.healthManage .main-container .method-wrap .method-box .check-list .text-blue{color:#0082cd}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li{float:left;width:100%;padding-left:30px;background:url(/lib/img/icon-check.png) no-repeat 0 5px / 20px auto;font-size:19px;line-height:26px;font-weight:300;margin-bottom:20px}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li:last-child{margin-bottom:0}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li.img{padding:0 15px;background:none}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li.img.type2{padding:0 40px}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li strong{font-weight:600}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li.dash{background:none;position:relative}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li.dash:before{content:"-";position:absolute;top:-2px;left:14px;font-weight:400}
#wrap.healthManage .main-container .method-wrap .method-box .check-list li.dash strong{font-weight:500}
#wrap.healthManage .main-container .method-wrap .method-box .info-list{float:left;width:100%}
#wrap.healthManage .main-container .method-wrap .method-box .info-list li{float:left;width:100%;margin-top:10px;border:2px solid #000;border-radius:5px;padding:15px}
#wrap.healthManage .main-container .method-wrap .method-box .info-list li{
	-webkit-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.3);
	-ms-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.3);
	-o-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.3);
	box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.3);
}
#wrap.healthManage .main-container .method-wrap .method-box .info-list li p{font-size:17px;line-height:26px;font-weight:500}
#wrap.healthManage .main-container .method-wrap .method-box .info-list li p strong{font-size:22px}

/* 설정 */
/*body.mypage{background-color:#fff}*/
#wrap.mypage .main-container{background-color:#fff;padding-top:0}
#wrap.mypage .main-container .mypage-header{float:left;width:100%;background-color:#0673f1;padding:40px}
#wrap.mypage .main-container .mypage-header .name{font-size:30px;line-height:40px;color:#fff}
#wrap.mypage .main-container .mypage-header .name strong{font-weight:600}
#wrap.mypage .main-container .mypage-header .btn{background-color:#fff;color:#000;border-radius:5px;line-height:50px;font-size:18px;font-weight:400;position:relative;text-align:left;margin-top:15px}
#wrap.mypage .main-container .mypage-header .btn .txt{float:left;width:100%;padding-left:60px}
#wrap.mypage .main-container .mypage-header .btn .fa{float:left;line-height:50px;position:absolute;top:0;font-size:30px}
#wrap.mypage .main-container .mypage-header .btn .fa.fa-user{left:20px}
#wrap.mypage .main-container .mypage-header .btn .fa.fa-angle-right{right:20px}
#wrap.mypage .main-container .mypage-menu{float:left;width:100%}
#wrap.mypage .main-container .mypage-menu li{float:left;width:100%;border-bottom:1px solid #eee}
#wrap.mypage .main-container .mypage-menu li a{float:left;width:100%;padding:20px 25px;font-size:20px;line-height:30px}
#wrap.mypage .main-container .mypage-menu li .fa{float:left;width:20px;line-height:30px;margin-right:10px}
#wrap.mypage .main-container .mypage-menu li .txt{float:left}
#wrap.mypage .main-container .logout{float:left;width:100%;margin-top:50px;padding:0 25px}
/* 임시 */
#wrap.mypage .main-container .mypage-temp{position:fixed;top:0;left:0;float:left;width:100%;height:100%;text-align:center;display:inline-table}
#wrap.mypage .main-container .mypage-temp:before{content:"";position:absolute;top:0;left:0;float:left;width:100%;height:100%;background-color:#000;opacity:0.75}
#wrap.mypage .main-container .mypage-temp p{display:table-cell;vertical-align:middle;width:100%;height:100%;position:relative;color:#fff;font-size:35px;line-height:50px;font-weight:600;padding-bottom:80px}

/* 금연 메인 */
#wrap.blood.smoking #header h1 .txt{padding-left:40px}
#wrap.blood.smoking #header h1 .txt img{width:30px}
#wrap.blood.drink.regist #header h1 .txt img{top:9px}
#wrap.blood.smoking .main-container .bg-box-wrap{float:left;width:100%;padding:30px 20px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;margin-bottom:20px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap.btn-wrap{padding:10px 0}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap.bg-step-1{border-radius:5px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap *{float:left}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div{width:100%}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p{width:100%;font-size:17px;line-height:25px;font-weight:500}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p *{float:none;font-size:inherit;line-height:inherit;font-weight:inherit}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p.count{font-size:55px;line-height:65px;font-weight:300}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p.date{font-size:20px;font-weight:600;margin-top:10px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p.head{font-size:28px;line-height:40px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p.head strong{font-size:35px;font-weight:500}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div p.desc{font-size:20px}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div.btn-wrap{width:auto}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div.btn-wrap a{}
#wrap.blood.smoking .main-container .bg-box-wrap .info-wrap > div.btn-wrap a img{max-width:90px}
/* 신체변화 공통 */
.change-box{float:left;display:inline-block !important;width:100%;padding:10px 20px;margin-bottom:20px;border-radius:5px}
.change-box > div:first-child{float:left;width:100%;margin-bottom:10px}
.change-box > div:first-child > p{float:left;width:auto !important;font-size:17px;line-height:30px !important;font-weight:500}
.change-box > div:first-child > strong{float:right !important;font-size:17px;line-height:30px;font-weight:500}
.change-box > div:first-child > strong span{float:left}
.change-box > div:first-child > strong span:first-child{font-size:22px;line-height:30px;font-weight:600;margin-right:5px}
.change-box > p.sub-desc{float:left;font-size:16px;line-height:25px}
/* 신체변화 공통 모달 */
.modal.modal-change-box{padding:20px 25px;background-color:#fff;width:100%;min-height:100%;border-radius:0}
.modal.modal-change-box .close-modal{width:25px;height:25px;top:35px;right:20px;background:url(/lib/img/close-black.png) no-repeat center center / 100% auto}
.modal.modal-change-box .modal-title{float:left;width:100%;line-height:60px;text-align:center;font-size:25px;margin-bottom:20px}
.modal.modal-change-box .modal-title .txt{display:inline-block;position:relative}

#wrap.smoking.search .main-container{padding-top:0}
#wrap.smoking.search .main-container .circle{display:inline-block;width:20px;height:20px;background-color:#0673f1;border-radius:20px}
#wrap.smoking.search .main-container .circle.red{background-color:#e54b4b}
#wrap.smoking.search .main-container .circle.blue{background-color:#0673f1}
#wrap.smoking.search .main-container .info-wrap{float:left;width:100%;padding:40px 0;display:flex;align-items:center;justify-content:center}
#wrap.smoking.search .main-container .info-wrap > div{float:left;margin:0 20px}
#wrap.smoking.search .main-container .info-wrap > div span{float:left;margin-right:10px}
#wrap.smoking.search .main-container .info-wrap > div p{float:left;font-size:17px;line-height:20px;font-weight:500}
#wrap.smoking.search .main-container .calendar-box .calendar table td div{min-height:55px;padding:0 8px}
#wrap.smoking.search .main-container .calendar-box .calendar table td div span.addData{display:inline-block;width:100%;background-color:#57a5ff;color:#fff;font-weight:500;border-radius:5px;line-height:24px}
#wrap.smoking.drink.search .main-container .calendar-box .calendar table td div span.addData{background-color:transparent}
#wrap.smoking.search .main-container .calendar-box .calendar table thead tr:first-child th{padding:0}
#wrap.smoking.search .main-container .calendar-box .calendar table th
, #wrap.smoking.search .main-container .calendar-box .calendar table td{padding:5px 0}

/* 공통 달력 */
.calendar-box{float:left;width:100%}
.calendar-box .calendar{float:left;width:100%}
.calendar-box .calendar table{width:100%;padding:0;border:0;border-spacing:0px;border-collapse:collapse}
.calendar-box .calendar table thead tr:first-child th{font-size:25px;line-height:30px;padding:0}
.calendar-box .calendar table thead tr:first-child th > *{padding:15px 0}
.calendar-box .calendar table thead tr:first-child th a{display:inline-block;width:100%}
.calendar-box .calendar table thead tr:first-child th a .fa{font-size:20px;line-height:30px}
.calendar-box .calendar table thead tr:last-child th{padding-top:10px}
.calendar-box .calendar table th{vertical-align:middle;font-weight:500;background-color:#dfefff}
.calendar-box .calendar table th, .calendar-box .calendar table td{padding:0;text-align:center;padding:15px 0;font-size:17px;line-height:27px}
.calendar-box .calendar table tr > *{width:14.28571428571429%}
.calendar-box .calendar table .sun{color:#ff0000}
.calendar-box .calendar table .sat{color:#03a9f4}
.calendar-box .calendar table td div{display:inline-block;width:100%}
.calendar-box .calendar table td div span.date{display:inline-block;width:100%}
.calendar-box .calendar table td{vertical-align:top}