@charset "utf-8";

/* 캘린더 */
.container_part, 
.container_side { display: none; }

/* 캘린더 목록 */
.bbs_calender .bbs_listing { margin-top: 40px; }
.bbs_listing .cal_nav { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; align-items: flex-end; -ms-flex-wrap: nowrap; flex-wrap: nowrap; text-align: center; }

.bbs_listing .cal_nav .nav_date { display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: flex-end; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin: 0 50px; }
.bbs_listing .cal_nav .nav_date > span { position: relative; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.bbs_listing .cal_nav .nav_date > span::after { content: "."; font-size: 1em; }
.bbs_listing .cal_nav .nav_date em { display: none; }
.bbs_listing .cal_nav #cal_year,
.bbs_listing .cal_nav #cal_month { line-height: 1; letter-spacing: -0.04em; }
.bbs_listing .cal_nav #cal_year { color: #222; font-size: 21px; font-weight: 700; }
.bbs_listing .cal_nav #cal_month { margin: 0 0 -2px 5px; font-size: 32px; font-weight: 800; color: #214397; }

.bbs_listing .cal_nav .nav_move { }
.bbs_listing .cal_nav .nav_prev { position: absolute; left: 360px; top:7px; }
.bbs_listing .cal_nav .nav_next { position: absolute; right: 360px; top:7px; }
.bbs_listing .cal_nav .nav_prev a,
.bbs_listing .cal_nav .nav_next a { position: relative; text-indent: -9999em; display: block; width: 20px; height: 20px; overflow: hidden; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.bbs_listing .cal_nav .nav_prev a {}
.bbs_listing .cal_nav .nav_next a {}
.bbs_listing .cal_nav .nav_prev a::after,
.bbs_listing .cal_nav .nav_next a::after { font-family: 'Diam'; display: block; text-indent: 0; color: #999; font-size: 18px; }
.bbs_listing .cal_nav .nav_prev a::after { content: "\64"; }
.bbs_listing .cal_nav .nav_next a::after { content: "\66"; }
.bbs_listing .cal_nav .nav_prev a:hover::after,
.bbs_listing .cal_nav .nav_next a:hover::after { color: #394881; }

.bbs_listing .cal_btn p { font-size: 17px; font-weight: 300; color: #707070; }

.bbs_listing .cal_btn { margin-top: 10px; margin-bottom: 10px; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.bbs_listing .cal_btn .bbs_cate { margin: 0; }
.bbs_listing .cal_btn .bbs_cate > ul { font-size: 1.125rem; }
.bbs_listing .cal_btn .bbs_cate > ul > li { margin: 0 0 0 1.125rem; }
.bbs_listing .cal_btn .bbs_cate > ul > li > a { position: relative; z-index: 1; padding: 0; background: none; color: inherit; padding-left: 1.25rem; color: #999; }
.bbs_listing .cal_btn .bbs_cate > ul > li > a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); display: block; width: 10px; height: 10px; border-radius: 5px; background-color: #eee; }
.bbs_listing .cal_btn .bbs_cate > ul > li.on > a { background: none; color: #000; }


.bbs_listing .cal_plus .addCalendar { display: block; width: 146px; height: 44px; padding: 5px; color: #394881; background-color: #fff; border: 1px solid #394881; border-radius: 5px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; transition: all 0.25s ease-in-out; font-size: 14px; }
.bbs_listing .cal_plus .addCalendar:hover { background-color: #394881; color: #fff; }

.bbs_listing .cal_div { margin-top: 10px; }

.bbs_listing table.calendar { width: 100%; border-collapse: collapse; border-spacing: 0; border-top: 1px solid #394881; margin-bottom: 100px; table-layout: fixed; }
.bbs_listing table.calendar th, 
.bbs_listing table.calendar td { width: 14.285%; border-bottom: 1px solid #ddd; }
.bbs_listing table.calendar thead th, 
.bbs_listing table.calendar thead td { height: 46px; text-align: center; font-weight: normal; font-size: 18px; border-bottom: 1px solid #e9e9e9; background-color: #F9F9F9; }
.bbs_listing table.calendar tbody th, 
.bbs_listing table.calendar tbody td { height: 160px; padding: 13px; position: relative; vertical-align: top; border-radius: 0.25rem; border: 1px solid #e9e9e9; }
.bbs_listing table.calendar tbody td.cell { position: relative; }
.bbs_listing table.calendar tbody td.cell:hover { background-color: rgba(0,0,0,0.03125); }
.bbs_listing table.calendar tbody td.cell .cellin { position: relative; height: 100%; font-size: 12px; }

.bbs_listing table.calendar tbody td.cell .addCalendar { position: absolute; top: 0; right: 0; display: block; width: 20px; height: 20px; overflow: hidden; margin: auto; line-height: 1; color: #999; font-size: 16px; float: left; margin-left: 5px; background-color: #eee; border: 0;  display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; text-indent: -9999em; border-radius: 10px; }
.bbs_listing table.calendar tbody td.cell .addCalendar::after { content: "\61"; font-family: 'Diam'; text-indent: 0; font-size: 10px; }
.bbs_listing table.calendar tbody td.cell .addCalendar:hover { background-color: #394881; color: #fff; }

.bbs_listing table.calendar tbody td.cell .dayheader { clear: both; overflow: hidden; }
.bbs_listing table.calendar tbody td.cell .dayheader:after { display: block; visibility: hidden; clear: both; content: ""; }
.bbs_listing table.calendar tbody td.cell .daytext { float: left; font-weight: normal; font-size: 20px; color: #555; line-height: 1; font-weight: 400; letter-spacing: -0.03em; }
.bbs_listing table.calendar tbody td.cell .daycont { float: left; margin-left: 5px; line-height: 1.25; }
.bbs_listing table.calendar tbody td.cell .daybody { clear: both; overflow: hidden; margin: 10px 0 0 0; padding: 0; height: 130px; overflow-x: hidden; overflow-y: auto; scrollbar-face-color: #ccc; scrollbar-arrow-color: #ccc; scrollbar-shadow-color: #eee; scrollbar-track-color: #eee; }
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-corner,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-track,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:start:decrement, 
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:end:increment,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar { background-color: transparent; }
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar { width: 3px; }
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-track { background-color: #eee; }
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-thumb { background-color: #ccc; border-radius: 3px; }
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-thumb:hover {}
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:horizontal:increment,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:horizontal:decrement,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:vertical:increment,
.bbs_listing table.calendar tbody td.cell .daybody::-webkit-scrollbar-button:vertical:decrement { background-position: center center; background-repeat: no-repeat; display: none; }

.bbs_listing table.calendar tbody td.cell .daybody .wr_row { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; padding:2px; }
.bbs_listing table.calendar tbody td.cell .daybody .wr_row .wr_2 { color: #777; margin-right: 0.25rem; }
/*
.bbs_listing table.calendar tbody td.cell .daybody .cate {}
.bbs_listing table.calendar tbody td.cell .daybody .cate0 {}
.bbs_listing table.calendar tbody td.cell .daybody .cate1 {}
.bbs_listing table.calendar tbody td.cell .daybody .cate2 {}
*/
.bbs_listing table.calendar tbody td.cell .daybody .ca_name { position: relative; padding-left: 15px; }
.bbs_listing table.calendar tbody td.cell .daybody .ca_name::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); display: block; width: 10px; height: 10px; background-color: #eee; border-radius: 5px; }

.bbs_listing table.calendar tbody td.cell .daybody .breakinfo_sub { color: #214397; font-size: 14px; font-weight:800; }
.bbs_listing table.calendar tbody td.cell .daybody .breakinfo_con { white-space: pre-line; padding-bottom: 5px; font-size: 14px; }
.bbs_listing table.calendar tbody td.cell .daybody .breakinfo_con .breakinfo_time { margin-left: 4px; padding: 1.7px 5.2px 1.7px 3.2px; color: white; font-size: 12px; }

.bbs_listing table.calendar tbody td.cell .dayfooter { clear: both; overflow: hidden; padding: 0; position: absolute; top: 0; right: 0; }

.bbs_listing table.calendar tbody td.cell_today { background-color: #F5F9FF; outline: 1px solid #214397; }
.bbs_listing table.calendar tbody td.cell_today .daytext { color: #222; }
.bbs_listing table.calendar tbody td.week_sat .daytext { color: #2D447C; }
.bbs_listing table.calendar tbody td.week_sun .daytext { color: #DC3545; }
.bbs_listing table.calendar tbody td .holiday { color: #DC3545 !important; }
.bbs_listing table.calendar tbody td .daycont_blue { color: #2D447C; }
.bbs_listing table.calendar tbody td .daycont_red { color: #DC3545; }

/*.calModal .custom-control-input:checked~.custom-control-label::before { border-color: #394881; background-color: #394881; }*/
.calModal .custom-control-input:focus~.custom-control-label::before { box-shadow: 0 0 0 0.2rem rgb(57 72 129 / 25%); }

/* 캘린더 등록 */
.table-form-cal tbody td label { text-align: center; }
.table-form-cal tbody td #txt_1 { width:93%; margin-right:10px;}
.table-form-cal tbody td #txt_21 { width: 50%; margin-right: 10px; }
.table-form-cal tbody td #txt_22 { width: 50%; margin-left: 10px; }


/* 캘린더 뷰 */
.calModal .table { border-bottom: 1px solid #dee2e6; }
.calModal .table th { font-weight: 400; white-space: nowrap; background: rgba(0,0,0,.05); vertical-align: middle; }
.calModal .table th label { display: inline; }
.calModal .table th, 
.calModal .table td {}
.calModal .table th { width: 80px; } 
.calModal .table td { text-align: left; white-space: normal; word-break: keep-all; }
.calModal .modal-body button.close { font-size: 1rem; position: absolute; top: 1rem; right: 1rem; line-height: 1; width: 1.5rem; height: 1.5rem; padding: 0; }
.calModal .modal-button {text-align: center;}
.calModal .table td textarea {height:100px; border:1px solid #ccd4da;}
.calModal .table td .cal_time #allday { margin-left:10px;}


.calViewModal {}
.calViewModal .modal-title { display: -ms-flexbox; display: flex; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; font-size: 22px; letter-spacing: -0.04em; font-weight: 800; padding-right: 1.5rem; }
.calViewModal .modal-title > em { -ms-flex: 0 0 auto; flex: 0 0 auto; margin-right: 0.75rem; padding: 0 0.75rem; font-size: 15px; background-color: #f5f5f5; height: 25px; border-radius: 12.5px; font-weight: 400;  display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.calViewModal .modal-title > span { -ms-flex: 1 1 auto; flex: 1 1 auto; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.bbs_cal_viewbtn { display: flex; margin:0 auto; }
.bbs_cal_viewbtn a { margin-right: 10px; }

.calModal .modal-button .calendarModify,
.calModal .modal-button .calendarDelete,
.calModal .modal-button .btn_cancel,
.calModal .modal-button .btn_submit { padding: 0.375rem 1rem; letter-spacing: -0.03em; }
.calModal .modal-button .btn_cancel { border: 1px solid #ddd; background-color: #fff; color: #767676; }
.calModal .modal-button .btn_submit { background-color: #394881; color: #fff; }
.calModal .modal-button .calendarModify { background-color: #394881; color: #fff; }
.calModal .modal-button .calendarDelete { background-color: #333; color: #fff; }



/* 카테고리 색상 */
.bbs_listing table.calendar tbody td.cell .daybody .ca_name_0::before { background-color: #394881; }
.bbs_listing table.calendar tbody td.cell .daybody .ca_name_1::before { background-color: #FCCD11; }
.bbs_listing .cal_btn .bbs_cate > ul > li > a.cate_0::before { background-color: #394881; }
.bbs_listing .cal_btn .bbs_cate > ul > li > a.cate_1::before { background-color: #FCCD11; }
.calViewModal .modal-title > em.ca_view_0 { background-color: #394881; color: #fff; }
.calViewModal .modal-title > em.ca_view_1 { background-color: #FCCD11; color: #fff; }

@media ( max-width: 991.98px ) {
    .bbs_listing .cal_btn > div { flex-direction: column; }
    .bbs_listing .cal_btn p { margin-top: 10px; }
}
@media (max-width: 767.98px) {
  .bbs_listing table.calendar thead { display:none; }
  .bbs_listing table.calendar tbody td { display:block; width:100%; }
  #txt_21, #txt_22 { width:auto; }
  .bbs_listing .cal_nav .nav_prev { left: 0; right: 290px; }
  .bbs_listing .cal_nav .nav_next { right: 0; }
  .bbs_listing table.calendar tbody td.cell { margin: 5px 0; }
  .bbs_listing table.calendar tbody td.cell .cellin { overflow: hidden; }
  .bbs_listing table.calendar tbody td.cell .daybody { height: 95px; }
  .bbs_listing table.calendar tbody td.cell .daybody .wr_row { padding: 3px; }
}