header > ul li #back_btn { width:65px; height:100%; margin-right:10px; border:0; border-radius:20px; box-shadow:0 2px 5px rgba(0,0,0,0.1); background:#000; }
header > ul li.notify { width:calc(100% - 65px); border:0; border-radius:20px; box-shadow:0 2px 5px rgba(0,0,0,0.1); text-align:center; font-weight:700; line-height:65px; position:relative; background:#FFF500; }
header > ul li.notify img { position:absolute;  top:50%; left:20px; transform:translateY(-50%); }

main { height:calc(100% - 65px); padding-bottom:10px; overflow-y:auto; -ms-overflow-style:none; scrollbar-width:none; }
main::-webkit-scrollbar { display:none; }
main .content_box { margin-top:30px; }
main .content_box h3 { margin:0; font-size:24px; font-weight:700; }
main .content_box .calender { margin-top:30px; }
main .content_box .calender .calender_header { display:flex; justify-content:center; position:relative; }
main .content_box .calender .calender_header .nav_btn { width:30px; height:30px; padding:0; border:0; display:flex; justify-content:center; align-items:center; background:none; }
main .content_box .calender .calender_header .nav_btn.prev { position:absolute; left:10px; top:0; }
main .content_box .calender .calender_header .nav_btn.prev img { width:50%; transform:rotate(90deg); }
main .content_box .calender .calender_header .nav_btn.next { position:absolute; right:10px; top:0; }
main .content_box .calender .calender_header .nav_btn.next img { width:50%; transform:rotate(-90deg); }
main .content_box .calender .calender_header .ym_box { font-size:19px; font-weight:700; }
main .content_box .calender .calender_main { margin-top:30px; }
main .content_box .calender .calender_main .days { padding:15px 0; border-radius:5px; display:flex; background:#E9ECF0; }
main .content_box .calender .calender_main .days p { width:calc(100% / 7); font-weight:700; text-align:center; }
main .content_box .calender .calender_main .dates { margin-top:20px; display:flex; flex-flow:row wrap; }
main .content_box .calender .calender_main .dates .date { width:calc(100% / 7); padding:4% 0; font-size:16px; text-align:center; border-radius:5px; cursor:pointer; transition:all .3s; }
main .content_box .calender .calender_main .dates .date:hover { background:#eee; }
main .content_box .calender .calender_main .days p:nth-child(7n+1),
main .content_box .calender .calender_main .dates .date:nth-child(7n+1) { color:#D13E3E; }
main .content_box .calender .calender_main .days p:nth-child(7n),
main .content_box .calender .calender_main .dates .date:nth-child(7n) { color:#396EE2; }
main .content_box .calender .calender_main .dates .date.other { color:rgba(88, 88, 88, 0.315)!important; }
main .content_box .calender .calender_main .dates .date.today { position:relative; position:relative; }
main .content_box .calender .calender_main .dates .date.today::after { content:''; display:block; width:5px; height:5px; border-radius:50%; position:absolute; left:50%; top:7px; transform:translateX(-50%); background:#3985EA; }
main .content_box .calender .calender_main .dates .date.on { color:#fff; background:#3985EA; }
main .content_box .calender .calender_main .dates .date.prev { color: lightgrey; /* 이전 달 날짜 색상 */}
main .content_box .calender .calender_main .dates .date.next { color: lightgrey; /* 이전 달 날짜 색상 */}
main .content_box .calender .calender_main .dates .date.past {color: #e7e7e7; cursor: not-allowed;}
main .content_box .calender .calender_main .dates .date.disabled {pointer-events: none;}
main .content_box .times { width:100%; margin-top:30px; padding-top:30px; border-top:1px solid #d2d2d2; }
main .content_box .times button { width:calc((100% - 30px) / 4); height:36px; margin-left:10px; font-weight:700; border-radius:10px; border:1px solid #d2d2d2; background:none; }
main .content_box .times button:hover { color:#3985EA; }
main .content_box .times button.on { color:#fff; background:#3985EA; }
main .content_box .times button:nth-child(4n+1) { margin-left:0; }
main .content_box .times button:nth-child(n+5) { margin-top:10px; }
main .content_box ul.clinic_list { margin-top:30px; display:flex; }
main .content_box ul.clinic_list li { width:calc((100% - 30px) / 4); margin-left:10px; }
main .content_box ul.clinic_list li.first { margin-left:0; }
main .content_box ul.clinic_list li button { width:100%; height:36px; font-weight:700; border-radius:10px; border:1px solid #d2d2d2; background:none; }
main .content_box ul.clinic_list li button.on { color:#fff; background:#3985EA; }
main .content_box ul.reservation_list { margin-top:30px; padding-top:30px; border-top:1px solid #d2d2d2; }
main .content_box ul.reservation_list li:not(.first) { margin-top:10px; }
main .content_box ul.reservation_list li input { display:none; }
main .content_box ul.reservation_list li label { font-size:18px; font-weight:700; text-indent:30px; position:relative; }
main .content_box ul.reservation_list li label::after { content:''; display:block; width:18px; height:18px; border:2px solid #3985EA; border-radius:3px; position:absolute; top:4px; left:0; }
main .content_box ul.reservation_list li input:checked + label::after { background:#3985EA; }
main .content_box ul.reservation_list li input:checked + label::before { content:''; display:block; width:11px; height:6px; border-left:2px solid #fff; border-bottom:2px solid #fff; position:absolute; top:8px; left:4px; transform:rotate(-45deg); z-index:1; }
main .button_box { margin-top:30px; }
main .button_box .next_btn { width:100%; height:48px; border:0; border-radius:15px; color:#fff; background:#A9A9A9; }
main .button_box .next_btn.active { width:100%; height:48px; border:0; border-radius:15px; color:#fff; background:#3985EA; }










