@charset "utf-8";

/*===== STYLES =====*/
:root {
  /* 버튼 및 인풋 폼 높이 */
  --height-xs: 20px;
  --height-sm: 28px;
  --height-md: 32px;
  --height-lg: 44px;
  --height-xl: 48px;
  --height-2xl: 56px;
  --height-3xl: 64px;
}

.container-380{max-width:408px;}
.container-640{max-width:668px;}
.container-884{max-width:912px;}

.sec_wrap{overflow:hidden; min-height:calc(100vh - 208px);}
.wh_bg_wrap{position:relative; width:90%; max-width:640px; min-height:100vh; margin:0 auto; background-color:var(--white);}
.wh_bg_wrap.maxw_900{max-width:900px;}

.border-top{border-top:1px solid var(--line);}
.border-bottom{border-bottom:1px solid var(--line);}

/* Button custom */
.btn-md{height:var(--height-md); border-radius:4px; font-size:14px;}
.btn-lg{height:var(--height-lg); border-radius:2px; font-size:14px;}
.btn-2xl{height:var(--height-2xl); border-radius:4px; font-size:16px;}
.btn-3xl{height:var(--height-3xl); border-radius:4px; font-size:18px;}
.btn_style01, .btn_style01:hover{color:var(--white); background-color:var(--point-sub);}
.btn_style01:disabled{background-color:var(--line); cursor:default; opacity:1;}
.btn_style02, .btn_style02:hover{color:var(--white); background-color:var(--point);}
.btn_style02:disabled{background-color:var(--line); cursor:default; opacity:1;}
.btn_style03, .btn_style03:hover{color:var(--white); background-color:var(--btn);}
.btn_style04, .btn_style04:hover{color:var(--point); background-color:var(--white); border:1px solid var(--point);}
.btn_style04, .btn_style04:hover{color:var(--point); background-color:var(--white); border:1px solid var(--point);}

.btn_prev,
.btn_next{width:24px; height:24px; background-repeat:no-repeat; background-position:center; background-size:contain;}
.btn_prev{background-image:url('../img/ic_prev_on.png');}
.btn_prev:disabled{background-image:url('../img/ic_prev_off.png');}
.btn_next{background-image:url('../img/ic_next_on.png');}
.btn_next:disabled{background-image:url('../img/ic_next_off.png');}

.top_btn_wrap{position:fixed; top:80px; left:0; display:block; width:100%; background-color:var(--white); z-index:100;}
.bot_btn_wrap{position:fixed; bottom:0; left:50%; width:100%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); z-index:100;}
.bot_btn_wrap > div{padding-top:16px; padding-bottom:60px; background:linear-gradient(180deg, rgba(255,255,255,0.3), rgba(255,255,255,1) 50%);}
.bot_btn_wrap.grid02 > div{display:flex; align-items:center; gap:8px;}
.bot_btn_wrap.grid02 button{width:calc(50% - 4px);}
.bot_btn_wrap_m > div{padding:0;}
.bot_btn_wrap_m.grid02 > div{display:flex; align-items:center; gap:8px;}
.bot_btn_wrap_m.grid02 button{width:calc(50% - 4px);}
.write_btn{position:fixed; bottom:40px; right:19%; z-index:100;}
.write_btn a{display:block; width:56px; padding:8px; border-radius:50%; background-color:var(--point); box-shadow:0 0 8px rgba(0,0,0,0.2);}
.write_btn a img{width:40px;}

/* Input, Select, Textarea custom */
input{width:100%; height:var(--height-xl); padding:0 16px; border:1px solid var(--line); border-radius:4px; background-color:var(--white); font-size:14px; color:var(--thick);}
input::-ms-clear{display:none;}
input::placeholder{color:var(--placeholder);}
input:focus{border-color:var(--point);}
input:disabled{color:var(--light); background-color:var(--bg);}

input.d-none{position:absolute; display:none; width:0; height:0; padding:0; margin:0; border:0; opacity:0; visibility:hidden; overflow:hidden;}

.input_btn_wrap{position:relative;}
.input_btn_wrap input{padding-right:74px;}
.input_btn_wrap button{position:absolute; top:2px; right:2px; width:58px; padding:0;}
.input_btn_wrap .time_text{position:absolute; top:50%; right:68px; font-size:12px; color:var(--thick); transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%);}

.chk_custom label{display:inline-flex; align-items:center; gap:8px; cursor:pointer;}
.chk_custom label i{display:block; width:var(--height-xs); height:var(--height-xs); background:var(--line) url('../img/ic_check.svg') no-repeat center center / 15px; border-radius:2px;}
.chk_custom label span{flex:1; word-break:keep-all;}
.chk_custom input:checked + label i{background-color:var(--point);}
.chk_custom.type02 label i{background-color:transparent; background-image:url('../img/ic_check02.svg');}
.chk_custom.type02 input:checked + label i{background-color:transparent;background-image:url('../img/ic_check03.svg');}

.rdo_custom label{cursor:pointer;}
.rdo_custom label span{display:flex; align-items:center; justify-content:center; width:var(--height-lg); height:var(--height-lg); border-radius:2px; font-size:14px; color:var(--placeholder); background-color:var(--white);}
.rdo_custom input:checked + label span{color:var(--white); background-color:var(--point-sub);}
.rdo_custom input:disabled:checked + label span{color:var(--white); background-color:var(--btn);}

.rdo_custom02 label{display:flex; align-items:center; height:var(--height-xl); padding:0 40px 0 24px; border:1px solid var(--line); border-radius:4px; font-size:14px; color:var(--light); cursor:pointer;}
.rdo_custom02 input:checked + label{color:var(--thick); border-color:var(--point); background:var(--white) url('../img/ic_check03.svg') no-repeat right 18px center;}

.rdo_custom03{width:100%; max-width:calc(25% - 12px);}
.rdo_custom03 label{display:flex; align-items:center; justify-content:center; height:var(--height-sm); border:1px solid var(--line); border-radius:4px; font-size:14px; color:var(--light); cursor:pointer;}
.rdo_custom03 input:checked + label{color:var(--white); border-color:var(--point); background-color:var(--point);}
.rdo_custom03 input:disabled + label{color:var(--btn); background-color:var(--bg); cursor:default;}

.radio_wrap{display:inline-flex; align-items:center; padding:1px; border:1px solid var(--line); border-radius:4px;}

select{width:100%; height:var(--height-xl); padding:0 33px 0 16px; border:1px solid var(--line); border-radius:4px; background-color:var(--white); font-size:14px; color:var(--thick); appearance:none; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; -o-appearance:none;}
select::-ms-expand{display:none;}
select:focus{border-color:var(--point);}
select:disabled{color:var(--light); background-color:var(--bg);}
select option{height:var(--height-xl);}
.select_custom{position:relative;}
.select_custom i{position:absolute; top:calc(50% - 4px); right:13px; display:block; width:14px; height:8px; background:url('../img/ic_select_arrow.svg') no-repeat center center / contain; transition:all 0.3s;}
.select_custom select:focus + i{transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);}

textarea{width:100%; padding:12px 16px; border:1px solid var(--line); border-radius:4px; background-color:var(--white); font-size:14px; color:var(--thick); resize:none;}
textarea::placeholder{color:var(--placeholder);}
textarea:focus{border-color:var(--point);}

.valid_msg{display:block; padding-left:16px; margin-top:8px; font-size:12px; word-break:keep-all;}

/* Tab */
.tab_btns ul{display:flex; align-items:center; gap:4px;}
.tab_btns ul li a,
.tab_btns ul li button{display:flex; align-items:center; height:36px; padding:0 12px; border:1px solid var(--btn); border-radius:18px; background-color:var(--white); font-size:13px; color:var(--placeholder); font-weight:500; line-height:1.2; word-break:keep-all;}
.tab_btns ul li.on a,
.tab_btns ul li.on button{border-color:var(--point); background-color:var(--point); color:var(--white);}
.tab_btns.tab_scroll{overflow-x:auto; white-space:nowrap; padding-bottom:5px; scrollbar-width:thin;}
.tab_btns.tab_scroll::-webkit-scrollbar{height:5px;}
.tab_btns.tab_scroll::-webkit-scrollbar-thumb{background-color:rgb(34 34 34 / 10%); border-radius:5px;}
.tab_conts > div{display:none;}
.tab_conts > div:first-of-type{display:block;}

/* Text Line */
.line1_text{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.line2_text{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.4rem; height:2.8rem;}

/* Img Size */
.img_wrap{position:relative; width:100%; border-radius:4px; overflow:hidden;}
.img_wrap::before{content:''; display:block;}
.img_wrap img{position:absolute; top:50%; left:50%; width:100%; height:100%; object-fit:cover; object-position:center; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%);}
.img_wrap.rect01::before{padding-bottom:60%;}
.img_wrap.rect02::before{padding-bottom:25%;}
.img_wrap.square::before{padding-bottom:100%;}
.img_wrap.no_image img{width:60%; object-fit:contain;}

/* Video Size */
.video_wrap{position:relative; padding-bottom:56.5%; overflow:hidden;}
.video_wrap iframe{position:absolute; top:0; left:0; width:100%; height:100%;}

/* Scroll */
.scroll_wrap{height:160px; padding:12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg); overflow-y:auto; font-size:14px; color:var(--light);}

/* No Data */
.nodata_wrap{padding:16px 12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg); font-size:14px; color:var(--placeholder); word-break:keep-all;}

/* Editor */
.editor_wrap img{display:block; width:100%;}

/* List style */
.list_grid03 ul{display:flex; flex-wrap:wrap; gap:40px 16px;}
.list_grid03 ul li{width:calc((100% - 32px) / 3);}

.list_type01{padding:8px 12px; border-radius:4px; background-color:var(--bg);}
.list_type01 ul li a{display:block; padding:12px;}
.list_type01 ul li + li{border-top:1px solid var(--line);}

.list_type02 ul{border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.list_type02 ul li a{position:relative; display:block; padding:12px 20px 12px 0;}
.list_type02 ul li a::before{content:''; position:absolute; top:calc(50% - 7px); right:10px; display:block; width:7px; height:14px; background:url('../img/hd_arrow.svg') no-repeat center center / contain;}
.list_type02 ul li + li{border-top:1px solid var(--line);}

.list_type03 ul{display:flex; flex-direction:column; gap:16px;}
.list_type03 ul li{padding:12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg);}
.list_type03 ul li .text{min-height:52px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid var(--line);}

.list_type04 ul li{padding:12px; border-radius:4px; background-color:var(--bg);}
.list_type04 ul li .consult_state{color:var(--light);}
.list_type04 ul li.wait{background-color:var(--point-bg);}
.list_type04 ul li.wait .consult_state{color:var(--thick);}

.list_type05 ul li{border-bottom:1px solid var(--line);}
.list_type05 ul li .tit a{position:relative; display:flex; gap:4px; padding:14px 32px 13px 0;}
.list_type05 ul li .tit b{color:var(--thick); line-height:1.2;}
.list_type05 ul li .tit span{display:block;}
.list_type05 ul li .tit i{position:absolute; top:calc(50% - 4px); right:5px; display:block; width:14px; height:8px; background:url('../img/ic_select_arrow.svg') no-repeat center center / contain; transition:all 0.3s;}
.list_type05 ul li .conts{display:none; padding:12px; background-color:var(--bg); font-size:14px; color:var(--light);}
.list_type05 ul li.on .tit b{color:var(--point);}
.list_type05 ul li.on .tit i{transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);}

.list_type06 ul li{padding:0 12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg); transition:all 0.3s;}
.list_type06 ul li i.icon01{display:block; width:16px; height:16px; margin:1px 0; background:url('../img/ic_location.png') no-repeat center / contain;}
.list_type06 ul li i.icon02{display:block; width:16px; height:16px; margin:1px 0; background:url('../img/ic_home.png') no-repeat center / contain;}
.list_type06 ul li .tit{position:relative; padding:12px 0;}
.list_type06 ul li .tit a{display:block;}
.list_type06 ul li .tit i.arrow{width:14px; height:8px; background:url('../img/ic_select_arrow.svg') no-repeat center center / contain; transition:all 0.3s;}
.list_type06 ul li .tit i.check{width:20px; height:20px; border-radius:2px; background:var(--line) url('../img/ic_check.svg') no-repeat center center / 15px; transition:all 0.3s;}
.list_type06 ul li .conts{display:none; padding:12px 0; border-top:1px solid var(--line);}
.list_type06 ul li.on{border-color:var(--point); background-color:var(--white);}
.list_type06 ul li.on .tit i.arrow{transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);}
.list_type06 ul li.on .tit i.check{background-color:var(--point);}

/* Calendar */
.cal_month{display:flex; align-items:center; justify-content:center;}
.cal_month p{margin:0 18px; font-size:16px; color:var(--thick); font-weight:700; letter-spacing:-0.02rem;}
.cal_month button{display:flex; align-items:center; justify-content:center; width:24px; height:24px; padding:0;}
.cal_dates{margin-top:4px;}
.cal_dates ul{display:flex; align-items:center; flex-wrap:wrap;}
.cal_dates ul li{width:calc(100% / 7); text-align:center;}
.cal_dates ul.cal_week li{padding:8px 0; font-size:14px; color:var(--light);}
.cal_dates ul.cal_date li button{position:relative; width:100%; height:42px; font-size:14px; color:var(--thick); background:transparent; z-index:1;}
.cal_dates ul.cal_date li button:disabled{color:var(--placeholder); cursor:default;}
.cal_dates ul.cal_date li button.holiday:not(:disabled){color:var(--error);}
.cal_dates ul.cal_date li button.active{color:var(--white) !important;}
.cal_dates ul.cal_date li button.active::before{content:''; position:absolute; top:calc(50% - 18px); left:calc(50% - 18px); display:block; width:36px; height:36px; border-radius:50%; background-color:var(--point); z-index:-1;}

/* Chart */
.chart_wrap{width:100%; height:216px;}
.chart_wrap canvas{width:100% !important; height:100% !important;}

/* Round Slider */
.slider_wrap{position:relative; width:235px; padding:25px; margin:0 auto;}
.slider_wrap > span{position:absolute; font-size:14px; color:var(--light);}
.slider_wrap > span:nth-of-type(1){top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%);}
.slider_wrap > span:nth-of-type(2){bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%);}
.slider_wrap > span:nth-of-type(3){top:50%; left:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%);}
.slider_wrap > span:nth-of-type(4){top:50%; right:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%);}
.slider_wrap .slider_conts{position:relative;}
.slider_wrap .slider_emo{position:absolute; top:calc(50% - 58px); left:calc(50% - 58px); display:flex; align-items:center; justify-content:center; width:116px; height:116px; border-radius:50%; background-color:var(--white); box-shadow:0 0 8px rgba(0,0,0,0.15); z-index:5;}
.slider_wrap .slider_emo img{max-width:100%;}
.slider_wrap .slider_box{margin:0 auto; background:url('../img/emo_bg.png') no-repeat center / 95%;}
.slider_wrap .rs-handle{width:20px !important; height:20px !important; border:2px solid var(--white); background-color:var(--point); box-shadow:0 0 6px rgba(0,0,0,0.15);}
.slider_wrap .rs-svg-mode .rs-range{stroke-width:10;}
.slider_wrap .rs-svg-mode .rs-path{stroke:transparent;}

/* JAlert */
.jconfirm.jconfirm-white .jconfirm-box, .jconfirm.jconfirm-light .jconfirm-box{border-radius:8px;}
.jconfirm .jconfirm-box{padding:40px 24px 24px; text-align:center;}
.jconfirm .jconfirm-box div.jconfirm-title-c{font-size:18px; font-weight:700; padding-bottom:20px;}
.jconfirm .jconfirm-box div.jconfirm-title-c img{max-width:48px; margin:0 auto;}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content{font-size:14px; color:var(--regular); font-weight:500; overflow:visible !important;}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content *{word-break:break-all; white-space:pre-line;}
.jconfirm .jconfirm-box .jconfirm-buttons{display:flex; align-items:center; gap:8px; width:100%; margin-top:15px; padding-bottom:0;}
.jconfirm .jconfirm-box .jconfirm-buttons button,
.jconfirm .jconfirm-box .jconfirm-buttons button.btn-default,
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default,
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default:hover{flex:1; width:100%; margin:0;}

/* Modal */
.modal_bg{position:fixed; top:0; left:0; bottom:0; right:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:10000; opacity:0; visibility:hidden; transition:all 0.5s;}
.modal_wrap{display:block; width:90%; max-width:360px; border-radius:8px; background-color:var(--white); transition:all 0.5s;}
.modal_wrap.md_delete{padding:0 24px;}
.modal_wrap.md_delete ul li{padding:12px 0; border-bottom:1px solid var(--line);}
.modal_wrap.md_delete ul li:last-of-type{border-bottom:0;}
.modal_wrap.md_delete ul li a,
.modal_wrap.md_delete ul li button{display:flex; align-items:center; justify-content:center; width:100%; height:var(--height-xl); font-size:14px; color:var(--light);}
.modal_wrap.md_report{height:86%; max-height:78vh; padding:40px 24px;}
.modal_wrap.md_report ul{height:calc(100% - 120px); overflow-y:auto;}
.modal_wrap.md_report ul li{padding:12px 0; border-bottom:1px solid var(--line);}
.modal_wrap.md_report ul li .chk_custom label{min-height:48px;}
.modal_wrap.md_calendar{min-height:460px; padding:40px 24px;}
.modal_wrap.md_calendar .tit{display:flex; align-items:center; gap:4px;}
.modal_wrap.md_calendar .tit i{display:block; width:24px; height:24px; background:url('../img/ic_calendar.png') no-repeat center center / contain;}
.modal_bg.show{opacity:1; visibility:visible;}

/* Loading */
.loading_wrap_lg{position:fixed; top:0; left:0; display:none; align-items:center; justify-content:center; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:1100;}
.loading_wrap_lg.show{display:flex;}
.loading_wrap_lg img{width:150px;}
.loading_wrap_sm{text-align:center;}
.loading_wrap_sm img{width:60px; margin:0 auto;}

/* Pagination */
.page_wrap{margin-top:24px;}
.page_wrap .page-link{color:var(--point); padding:4px 8px !important; font-size:14px !important;}
.page_wrap .page-item.active .page-link{background-color:var(--point); border-color:var(--point);}


/*===== PAGES =====*/
/* 로그인 */
.login_wrap input{height:var(--height-2xl); font-size:16px;}

/* 회원가입 */
.join_step{display:flex; align-items:center; gap:8px;}
.join_step p{display:flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background-color:var(--line); font-size:14px; color:var(--placeholder);}
.join_step p.active{color:var(--white); background-color:var(--point);}

/* 척도검사 */
.scale_text{display:inline-block; padding:6px 10px; border:1px solid var(--point); border-radius:4px; background-color:var(--white);}
.scale_text p{line-height:1;}
.scale_step > p{font-weight:700;}
.scale_step .line{position:relative; display:block; width:100%; height:2px; margin-top:4px; background-color:var(--line);}
.scale_step .line i{position:absolute; top:0; left:0; display:block; height:100%; background-color:var(--point);}
.scale_step .date_score{display:flex; align-items:center; justify-content:space-between; margin-top:4px;}
.scale_step .date_score p{font-size:12px; color:var(--light); font-weight:400;}
.scale_step .date_score span{font-size:12px; color:var(--thick); font-weight:700;}
.scale_step.end .line i{width:100%; background-color:var(--btn);}
.scale_result{min-height:120px; padding:12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg); font-size:14px; color:var(--light);}
.scale_result img{width:100%; margin-top:12px;}
.scale_score{display:flex; flex-direction:column; gap:15px; order:2; width:calc(50% - 8px);}
.scale_score dl{display:flex; align-items:center; gap:16px; padding:5px 12px; border-radius:4px; background-color:var(--bg);}
.scale_score dl dt{width:26px; font-size:12px; color:var(--regular); font-weight:700;}
.scale_score dl dd{flex:1; font-size:12px; color:var(--light);}
.scale_graph{width:calc(50% - 8px);}

/* 커뮤니티 */
.cmt_list ul li{padding:12px 10px; border-top:1px solid var(--line);}
.cmt_list ul li .container-640{padding-right:0;}
/* .cmt_list ul li button{margin:8px 0;} */
.cmt_list ul li.recmt{background-color:var(--bg);}

.cmt_write{display:flex; height:var(--height-2xl); border:1px solid var(--line);}
.cmt_write input, .cmt_write textarea{width:calc(100% - 74px); height:100%; border:0; border-radius:0; padding:16px; -webkit-text-size-adjust:none;}
.cmt_write button{width:74px; border-radius:0; font-size:14px;}
#cmt_recmt_inputs .cmt_write_wrap{margin-top:12px;}

/* 병원예약 */
.rsvt_wrap{display:flex; align-items:flex-start; gap:24px;}
.rsvt_wrap > *:nth-child(1){width:360px;}
.rsvt_wrap > *:nth-child(2){flex:1;}
.rsvt_wrap02{display:flex; align-items:flex-start; gap:24px;}
.rsvt_wrap02 > *:nth-child(1){flex:1;}
.rsvt_wrap02 > *:nth-child(2){width:360px;}
.rsvt_date_time{padding:0 24px 24px; border-radius:4px; background-color:var(--bg);}
.rsvt_date_time i.cal{display:block; width:24px; height:24px; background:url('../img/ic_calendar.png') no-repeat center center / contain;}
.rsvt_date_time i.time{display:block; width:24px; height:24px; background:url('../img/ic_time.png') no-repeat center center / contain;}
.rsvt_date_time i.hpt{display:block; width:24px; height:24px; background:url('../img/ic_hospital.png') no-repeat center center / contain;}
.rsvt_date_time .tit{display:flex; align-items:center; gap:4px; padding:12px 0 16px; border-bottom:1px solid var(--line);}
.rsvt_date_time .tit_hpt{display:flex; align-items:center; gap:4px; padding:12px 0 16px; border-bottom:1px solid var(--line);}
.rsvt_date_time .time_list{display:flex; flex-wrap:wrap; gap:16px;}
.rsvt_date_time .time_list > div{width:calc((100% - 48px) / 4);}
.rsvt_date_time .cal_dates ul.cal_date{min-height:210px;}
.rsvt_select{position:relative; display:flex; align-items:center; height:48px; border:1px solid var(--placeholder); border-radius:4px; cursor:pointer;}
.rsvt_select::before{content:''; position:absolute; top:calc(50% - 8px); left:50%; display:block; width:1px; height:16px; background-color:var(--btn); z-index:2;}
.rsvt_select > *{width:50%; padding:0 16px;}
.rsvt_select > *:last-child{position:relative; padding:0 33px 0 16px;}
.rsvt_select > *:last-child::before{content:''; position:absolute; top:calc(50% - 4px); right:13px; display:block; width:14px; height:8px; background:url('../img/ic_select_arrow.svg') no-repeat center center / contain;}

/* 마이페이지 */
.mypage_menu ul{display:flex; gap:16px;}
.mypage_menu ul li{width:calc(50% - 8px); border-radius:4px; background-color:var(--bg);}
.mypage_menu ul li a{display:flex; align-items:center; justify-content:space-between; padding:16px;}
.mypage_menu ul li a > div{display:flex; align-items:center; gap:8px;}
.consult_state{padding:1px 4px; border:1px solid var(--point); border-radius:4px; background-color:var(--white); font-size:12px;}
.consult_answer{padding:12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg);}
.diary_text{display:flex; align-items:center; justify-content:center; height:80px; padding:0 12px; border:1px solid var(--line); border-radius:4px; background-color:var(--bg); text-align:center;}

/* 인트로 */
.intro_wrap{overflow:hidden;}
.intro_wrap .top_box{display:flex; align-items:center; justify-content:center; height:calc(100vh - 190px); cursor:pointer;}
.intro_wrap .top_box img{width:300px; max-width:60%; max-height:100%;}
.intro_wrap .bot_box{padding:40px 20px; background-color:var(--point-bg); text-align:center;}
.intro_wrap .bot_box p{font-size:14px; letter-spacing:0; line-height:1.5; color:var(--light);}



/* 반응형 max 1200px xl */
@media (max-width: 1199.98px) {
  .write_btn{right:40px;}
}

/* 반응형 max 992px lg */
@media (max-width: 991.98px) {
  .container-884{max-width:720px;}

  .wh_bg_wrap{width:100%;}
  .sec_line_m{display:block; width:100%; height:12px; background-color:var(--bg);}
  .btn-3xl{height:var(--height-2xl); font-size:16px;}
  .top_btn_wrap{top:56px;}
  .bot_btn_wrap > div{padding-bottom:40px;}
  .bot_btn_wrap_m{position:fixed; bottom:0; left:50%; width:100%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); z-index:100;}
  .bot_btn_wrap_m > div{padding:16px 14px 40px; background:linear-gradient(180deg, rgba(255,255,255,0.3), rgba(255,255,255,1) 50%);}
  .write_btn{right:16px;}
  .write_btn.type02{bottom:104px;}
  .list_grid03 ul li{width:calc((100% - 16px) / 2);}
  .list_type02 ul{border-top:0; border-bottom:0;}
  .modal_bg{align-items:flex-end;}
  .modal_wrap{position:fixed; bottom:-100%; left:50%; width:100%; max-width:640px; border-radius:24px 24px 0 0; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%);}
  .modal_wrap.md_delete{padding:28px 24px 40px;}
  .modal_wrap.md_delete ul li:last-of-type{border-bottom:1px solid var(--line);}
  .modal_wrap.md_report{max-height:100vh;}
  .modal_bg.show .modal_wrap{bottom:0;}
  
  .login_wrap button{height:var(--height-3xl);}
  .scale_text{padding:6px 8px;}
  .scale_score{width:100%; order:0;}
  .scale_graph{width:100%;}
  .cmt_list > .container-640{max-width:100%; padding:0;}
  .cmt_list ul li{padding:12px 0;}
  .cmt_list ul li .container-640{padding-right:10px;}
  .cmt_write_wrap{position:fixed; bottom:0; left:50%; width:100%; max-width:640px; border:0; box-shadow:0 -2px 16px rgba(0,0,0,0.1); transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); z-index:100;}
  .cmt_write_wrap.type02{z-index:110;}

  .rsvt_date_time .tit{position:relative; cursor:pointer;}
  .rsvt_date_time .tit::before{content:''; position:absolute; top:calc(50% - 4px); right:13px; display:block; width:14px; height:8px; background:url('../img/ic_select_arrow.svg') no-repeat center / contain; transition:all 0.3s;}
  .rsvt_date_time ul li .conts{display:none;}
  .rsvt_date_time ul li.on .tit::before{transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg);}

  .rsvt_modal_m{position:fixed; top:0; left:0; bottom:0; right:0; display:flex; align-items:center; justify-content:center; width:100% !important; height:100%; background:rgba(0,0,0,0.5); z-index:10000; opacity:0; visibility:hidden; transition:background-color 0.5s, opacity 0.5s, visibility 0.5s;}
  .rsvt_modal_m .scroll_m{height:calc(100% - 80px); overflow-y:auto;}
  .rsvt_modal_m .rsvt_date_time{position:fixed; bottom:-100%; left:50%; width:100%; max-width:720px; height:90%; max-height:100vh; padding:48px 24px 40px; border-radius:24px 24px 0 0; background-color:var(--white); transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transition:all 0.5s;}
  .rsvt_modal_m .rsvt_date_time::before{content:''; position:absolute; top:16px; left:calc(50% - 30px); display:block; width:60px; height:4px; border-radius:2px; background-color:var(--btn);}
  .rsvt_modal_m.show{opacity:1; visibility:visible;}
  .rsvt_modal_m.show .rsvt_date_time{bottom:0;}
  
  .rsvt_wrap02{flex-direction:column;}
  .rsvt_wrap02 > *{width:100% !important;}
  .rsvt_wrap02 .rsvt_date_time{padding:0; background-color:transparent;}

  .mypage_menu{width:calc(100% + 16px); margin-left:-8px;}
  .mypage_menu ul li a{padding:16px 8px;}
}

/* 반응형 max 767px md */
@media (max-width: 767.98px) {
  .container-884{max-width:540px;}
  .container-640{max-width:540px;}
  .bot_btn_wrap_m > div{padding-left:24px; padding-right:24px;}
  .list_grid03 ul{gap:16px;}
  .list_grid03 ul li{width:100%;}
  .modal_wrap{max-width:540px;}

  .cmt_write_wrap{max-width:540px;}

  .intro_wrap .top_box{height:calc(100vh - 193px);}
  .intro_wrap .bot_box p{font-size:12px;}
}

/* 반응형 max 576px sm */
@media (max-width: 575.98px) {
}

/* 반응형 max 375px */
@media (max-width: 374.98px) {
  input{padding:0 10px;}
  .input_btn_wrap input{padding-right:70px;}
  .rdo_custom02 label{padding:0 32px 0 12px;}
  .rdo_custom02 input:checked + label{background-position:right 10px center;}
  select{padding:0 28px 0 10px;}
  .select_custom i{right:10px;}
  textarea{padding:10px 12px;}
  .rsvt_select > *{padding:0 10px;}
  .rsvt_select > *:last-child{padding:0 28px 0 10px;}
  .rsvt_select > *:last-child::before{right:10px;}
}

/* 반응형 max 320px */
@media (max-width: 319.98px) {
  .bot_btn_wrap_m > div{padding-left:15px; padding-right:15px;}
}