/***********************************************************************************
* Copyright (C)RFLOGIX since 2010.08.24 (rflogix@rflogix.com)
************************************************************************************
* ● 프로젝트	: 크로닉
* ○ 파일명		: record.css
************************************************************************************/




/***********************************************************************************
* 3번째 탭 - 기록
***********************************************************************************/

.popup_record_page {background-color:#262626;}
.popup_record_page .btn_wrap {width:100%; height:100%; left:0; top:0; position:absolute;}
.popup_record_page .btn_wrap > div {width:50%; height:calc(100% / 3); float:left;}

.popup_record_page .btn_close {width:auto; padding:0 20px; right:0; top:0; position:absolute; color:white; font-size:30px;}

.popup_record {width:87%; height:100%; padding:0 6.5%; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_record .content_wrap {width:100%; height:auto; position:relative; background:white; border-radius:10px; overflow:hidden;}
.popup_record .content_wrap > .title {width:calc(100% - 60px); height:55px; margin:0 30px 0 30px; font-size:18px; font-weight:bold; color:#333340; border-bottom:1px solid #c2c2c2;}

.popup_record .content_wrap > .btn_close {width:auto; height:55px; padding:0 30px; right:0; top:0; position:absolute; color:#333340; font-size:30px;}

.popup_record .content_wrap > .content {width:100%; height:auto; font-size:18px; color:#333340; overflow-x:hidden; overflow-y:auto;}
/*width:calc(100% - 60px); height:auto; max-height:calc(100% - 68px - 68px); margin:0 30px 40px 30px;*/
.popup_record .date_wrap {width:calc(100% - 60px); margin:14.5px 30px 0 30px; overflow:hidden; display:none;}
.popup_record .date_wrap.active {display:inline-block;}
.popup_record .date_wrap .title {width:100%; font-size:16px; line-height:24px; color:#444445;}
.popup_record .date_wrap .input_wrap {width:calc(100% - 2px); height:48px; margin-top:15px; border:1px solid #c2c2c2; border-radius:10px; overflow:hidden;}
.popup_record .date_wrap .input_wrap .btn_prev {font-size:16px; color:#c2c2c2;}
.popup_record .date_wrap .input_wrap .btn_prev.active {opacity:1!important;}
.popup_record .date_wrap .input_wrap .btn_prev i {font-size:18px; padding:0 14px;}
.popup_record .date_wrap .input_wrap .date_show {flex:1; font-size:16px; color:#444445; letter-spacing:1px;}
.popup_record .date_wrap .input_wrap .btn_next {font-size:16px; color:#c2c2c2; opacity:0.2; transition:opacity 0.3s;}
.popup_record .date_wrap .input_wrap .btn_next.active {opacity:1!important;}
.popup_record .date_wrap .input_wrap .btn_next i {font-size:18px; padding:0 14px;}
.popup_record .date_wrap .input_wrap .btn_calendar {font-size:16px; color:#c2c2c2;}
.popup_record .date_wrap .input_wrap .btn_calendar i {padding:0 18px 0 3px;}

.popup_record .record_wrap {width:calc(100% - 60px); margin:14.5px 30px 0 30px; overflow:hidden; display:none;}
.popup_record .record_wrap.active {display:inline-block;}
.popup_record .record_wrap .title {width:100%; font-size:16px; line-height:24px; color:#444445;}
.popup_record .record_wrap .input_wrap {width:calc(100% - 2px); height:48px; margin-top:15px; border:1px solid #c2c2c2; border-radius:10px; overflow:hidden;}
.popup_record .record_wrap .input_wrap input {font-size:18px; max-width:100px; text-align:center;}

/* .popup_record .record_wrap.bp_3 {margin-bottom:30px;} */
.popup_record .record_wrap.bp.guide {width:100%; margin:0; line-height:33px; text-align:center;}
.popup_record .record_wrap.bs_2 {margin-bottom:30px;}
.popup_record .record_wrap.ip {margin-bottom:30px;}

.popup_record .record_wrap .option_wrap {height:auto; border:0;}
.popup_record .record_wrap .option_wrap div:first-child {padding-right:6px;}
.popup_record .record_wrap .option_wrap input {font-size:18px; max-width:100px; text-align:center;}
.popup_record .record_wrap .option_wrap div:last-child {padding-left:6px;}
.popup_record .record_wrap .option_wrap img {width:100%; height:35px; margin-top:17px; background-image:url('../image/common/option_n_new.jpg'); transition:background 0.3s;}
.popup_record .record_wrap .option_wrap img.active {background-image:url('../image/common/option_y_new.jpg');}

.popup_record .content_wrap > .btn_wrap {width:100%; height:68px;}
.popup_record .btn_wrap .btn_close {width:50%; height:100%; font-size:18px; color:white; background-color:#444445;}
.popup_record .btn_wrap .btn_save {width:50%; height:100%; font-size:18px; color:white; background-color:#79d2de;}

.popup_record .btn_wrap .btn_no {width:50%; height:100%; display:none; font-size:18px; color:white; background-color:#444445;}
.popup_record .btn_wrap .btn_yes {width:50%; height:100%; display:none; font-size:18px; color:white; background-color:#79d2de;}
.popup_record .btn_wrap.yes_no .btn_close {display:none;}
.popup_record .btn_wrap.yes_no .btn_save {display:none;}
.popup_record .btn_wrap.yes_no .btn_no {display:flex;}
.popup_record .btn_wrap.yes_no .btn_yes {display:flex;}


.popup_meal_info {width:calc(100% - 30px); height:100%; padding:0 15px; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_meal_info .content_wrap {width:100%; max-height:calc(100% - 30px); background:white; border-radius:10px; overflow:hidden;}
.popup_meal_info .content_wrap > .title {width:calc(100% - 30px); height:54px; margin:13.5px 15px 0 15px; font-size:18px; font-weight:bold; color:#333340; border-bottom:1px solid #c2c2c2;}
.popup_meal_info .content_wrap > .content {width:calc(100% - 30px); height:auto; flex:1; padding:20px 15px 20px 15px; font-size:18px; color:#333340; overflow-y:auto;}
.popup_meal_info .content_wrap .btn_close {width:54px; height:54px; right:0; top:0; position:absolute;}







.popup_md {width:87%; height:100%; padding:0 6.5%; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_md .content_wrap {width:100%; height:auto; position:relative; background:white; border-radius:10px; overflow:hidden;}
.popup_md .content_wrap > .title {width:calc(100% - 60px); height:55px; margin:0 30px 0 30px; font-size:18px; font-weight:bold; color:#333340; border-bottom:1px solid #c2c2c2;}

.popup_md .content_wrap > .btn_close {width:auto; height:55px; padding:0 30px; right:0; top:0; position:absolute; color:#333340; font-size:30px;}

.popup_md .content_wrap > .content {width:100%; height:auto; font-size:18px; color:#333340; overflow-x:hidden; overflow-y:auto;}

.popup_md .content_html {width:calc(100% - 40px); height:200px; padding:20px; font-size:18px;}

.popup_md .btn_wrap {width:100%; height:68px;}
.popup_md .btn_wrap .btn_close {width:50%; height:100%; font-size:18px; color:white; background-color:#444445;}
.popup_md .btn_wrap .btn_save {width:50%; height:100%; font-size:18px; color:white; background-color:#79d2de;}