@charset "utf-8";

#inc01{padding:140px 0 120px;line-height:1}
#inc01 .inner{display:flex;justify-content:space-between;margin:0 auto;width:1500px}
#inc01 .cal_box{display:flex;flex-wrap:wrap;justify-content:space-between;width:100%}

#calenDar{min-width:25%;background:#f5f5f5;font-family:var(--k-font)}
/* calendar */
#lat_calendar_Wrap{width:50%;background:#fff}
#lat_calendar_Wrap .cal_top{display:flex;align-items:center;justify-content:space-between;margin-bottom:60px;padding-bottom:35px;border-bottom:2px solid #000}
#lat_calendar_Wrap .date{padding-bottom:31px;border-bottom:1px solid #E1E1E1}
#lat_calendar_Wrap #calendar_wrap{overflow:hidden;display:flex;align-items:flex-start;justify-content:space-between;gap:25px}
#lat_calendar_Wrap #calendar_wrap #lat_calendar_Wrap{width:100%;padding:25px 40px;border:1px solid #e1e1e1;border-radius:20px}

/* calendar_title + nav */
#lat_calendar_Wrap .title_wrap{display:flex;align-items:center;justify-content:center;gap:19px;position:relative}
#lat_calendar_Wrap .title_wrap #date_txt h3{display:inline-block;font-size:30px;font-weight:700;color:#111;font-family:var(--sub-font)}
#lat_calendar_Wrap .title_wrap #date_txt{display:inline-block;font-size:30px;font-weight:700;color:#111;font-family:var(--sub-font)}
#lat_calendar_Wrap .title_wrap .np_btn{display:flex;align-items:center;justify-content:center;width:35px;height:35px;background:#F4F4F6;border-radius:50pt;color:rgba(17,17,17,0.5);cursor:pointer;transition:all .5s}
#lat_calendar_Wrap .title_wrap .np_btn svg{width:16px}

/* date*/
#lat_calendar_Wrap table{width:100%;border-collapse:collapse}
#lat_calendar_Wrap table tr td{position:relative}
#lat_calendar_Wrap table thead tr th{padding:0 0 30px;font-size:18px;font-weight:700;color:#222}
#lat_calendar_Wrap table .ca_red{color:#f86b4f;transition:all .5s}
#lat_calendar_Wrap table .ca_blue{color:#37a3ff;transition:all .5s}
#lat_calendar_Wrap table tbody tr td p{position:relative;line-height:70px;text-align:center}
#lat_calendar_Wrap table tbody tr td button{width:55px;height:55px;border:none;font-size:19px;font-weight:400;color:#777;text-align:center;background-color:transparent;font-family:var(--sub-font);transition:all .5s}
#lat_calendar_Wrap table tbody tr td button:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1;opacity:0;content:"";display:block;width:55px;height:55px;border-radius:8px;background:#F5F5F5;transition:all .5s}

/*calendar list*/
.calendar_list{width:44%;max-height:577px;overflow-y:auto}
.calendar_list ul li{overflow:hidden;border:1px solid #E1E1E1;border-radius:13px;transition:all .5s}
.calendar_list ul li a{display:flex;align-items:center;gap:20px;padding:18px 23px}
.calendar_list ul li.no{padding:18px 23px}
.calendar_list ul li+li{margin-top:15px}
.calendar_list ul li a .lt_date{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;flex-shrink:0;width:95px;height:95px;background:#F5F5F5;border-radius:13px;font-size:15px;font-weight:500;color:#111;transition:all .5s}
.calendar_list ul li a .lt_date .day{font-size:30px;font-weight:700;color:var(--primary)}
.calendar_list ul li.list_event a .lt_date .day{color:#F65D62 !important}
.calendar_list ul li a .lt_tit{display: flex;flex-direction: column;gap: 10px;min-width:0;width:100%}
.calendar_list ul li a .lt_tit .title{display:inline-block;width:max-content;border-radius:3px;background:var(--primary);font-weight:600;padding:8px 8px;color:#fff;font-size:13px}
.calendar_list ul li.list_event a .lt_tit .title{background:#F65D62 !important}
.calendar_list ul li a .lt_tit .tit{overflow:hidden;width:100%;font-size:18px;font-weight:600;color:#111;word-break:keep-all;white-space:nowrap;text-overflow:ellipsis}
.calendar_list ul li a .lt_tit .date{display:flex;align-items:center;gap: 5px;font-size:14px;font-weight:400;color:#AAA;word-break:keep-all;}
.calendar_list ul li a .lt_tit .date span{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.calendar_list ul li a .lt_tit .date svg{flex-shrink:0;width: 14px;height: 14px;}
.calendar_list ul li a .lt_tit .date .date_icon{display:inline-block;margin-right:8px;color:#AAA;font-size:16px}
.calendar_list ul li a .lt_tit .where{display:flex;align-items:center;gap: 5px;font-size:14px;font-weight:400;color:#AAA;word-break:keep-all;}
.calendar_list ul li a .lt_tit .where span{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.calendar_list ul li a .lt_tit .where svg{flex-shrink:0;width: 14px;height: 14px;}

.calendar_list .cal_more_btn{display:flex;align-items:center;justify-content:center;margin-top:26px;height:87px;background:#333;border-radius:13px;color:#fff;font-weight:700;font-size:20px;transition:all .5s}
.calendar_list .cal_more_btn .cal_more_icon{margin-left:22px;transition:transform .3s ease}
.cal_more_btn:hover .cal_more_icon{animation:arrowMove .6s ease}



@keyframes arrowMove{0%{transform:translateX(0)}40%{transform:translateX(6px)}100%{transform:translateX(0)}}

.dot_box{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center}
.dot_list{display:flex;align-items:center;gap:3px;margin-bottom:3px}
.subja .dot{width:6px;height:6px;border-radius:50%;background:#ff5252}
.subja .dot.edu{background:var(--primary) !important}

/* 반응형 [s] */
@media (hover:hover){
.calendar_list ul li.no:hover{background:transparent !important}
.calendar_list ul li:hover{background:rgba(52,169,160,0.1)}
.calendar_list ul li:hover a .lt_date{background:#fff}
.calendar_list ul li.list_event:hover{background:rgba(246,93,98,0.1)}
#lat_calendar_Wrap table td.ca_blue:hover{border-bottom:1px solid #f86b4f !important}
#lat_calendar_Wrap table td.ca_blue:hover{border-bottom:1px solid #37a3ff !important}
#lat_calendar_Wrap table tbody tr td p:hover button:after{opacity:1}
#lat_calendar_Wrap .title_wrap .np_btn:hover{background:#EEEFF2;color:rgba(17, 17, 17, 1)}
.calendar_list .cal_more_btn:hover{background:#111}
}
@media (max-width:1600px){
#inc01{padding:150px 0}
#inc01 .inner{width:95%}
#lat_calendar_Wrap{width:53%}
.calendar_list .cal_more_btn{height:80px}
}
@media (max-width:1200px){
#inc01{padding:120px 0}
#inc01 .all_txt_wrap01 .all_tit{margin-bottom:40px}
#lat_calendar_Wrap{width:100%;margin-bottom:30px}
#lat_calendar_Wrap .cal_top{flex-direction:column;padding-bottom:30px}
.calendar_list{width:100%;max-height:unset}
}
@media (max-width:1024px){
#inc01{padding:100px 0}
#inc01 .all_txt_wrap01 .all_tit{margin-bottom:30px}
#lat_calendar_Wrap .title_wrap #date_txt,#lat_calendar_Wrap .title_wrap #date_txt h3{font-size:25px}
.calendar_list .cal_more_btn{height:70px;font-size:18px}
}
@media (max-width:768px){
#inc01{padding:80px 0}
#inc01 .inner{width:100%;padding:0 15px}   
#lat_calendar_Wrap .cal_top{margin-bottom:50px;padding-bottom:20px}
.calendar_list ul li a .lt_date{width:90px;height:90px}
.calendar_list ul li a .lt_date .day{font-size:25px}
.calendar_list .cal_more_btn{margin-top:20px;height:65px;border-radius:10px;font-size:17px}
.calendar_list .cal_more_btn .cal_more_icon{width:20px;margin-left:15px}

.calendar_list ul li a .lt_tit .tit{font-size: 16px;}
}
@media (max-width:580px){
#lat_calendar_Wrap .cal_top{margin-bottom:40px}
#lat_calendar_Wrap table thead tr th{padding:0 0 20px;font-size:17px}
#lat_calendar_Wrap .title_wrap #date_txt,#lat_calendar_Wrap .title_wrap #date_txt h3{font-size:23px}
#lat_calendar_Wrap table tbody tr td button{font-size:18px}
#lat_calendar_Wrap table tbody tr td p{line-height:60px}
.calendar_list ul li{border-radius:8px}
.calendar_list ul li a{padding:15px}
/* .calendar_list ul li a .lt_tit .tit{font-size:17px} */
.calendar_list ul li a .lt_tit .title{padding:6px 8px}
.calendar_list ul li a .lt_date{width:80px;height:80px;border-radius:8px;font-size:14px}
.calendar_list ul li a .lt_date .day{font-size:20px}
.calendar_list .cal_more_btn{height:55px;font-size:16px}
#lat_calendar_Wrap table tbody tr td button{width:50px;height:50px}
#lat_calendar_Wrap table tbody tr td button:after{width:50px;height:50px;border-radius:5px}
}
@media (max-width:480px){
#inc01{padding:70px 0}
#lat_calendar_Wrap .cal_top{margin-bottom:30px}
#lat_calendar_Wrap .title_wrap #date_txt,#lat_calendar_Wrap .title_wrap #date_txt h3{font-size:20px}
#lat_calendar_Wrap .date{padding-bottom:15px}
#lat_calendar_Wrap table tbody tr td p{line-height:50px}
#lat_calendar_Wrap table thead tr th{padding:0 0 15px;font-size:16px}
#lat_calendar_Wrap table tbody tr td button{font-size:17px}
.calendar_list ul li a{padding:13px;gap:15px}
.calendar_list ul li.no{font-size:15px}
.calendar_list ul li a .lt_date{width:63px;height:63px;font-size:13px}
.calendar_list ul li a .lt_date .day{font-size:17px}
.calendar_list ul li a .lt_tit{gap: 6px;}
.calendar_list ul li a .lt_tit .tit{font-size:15px}
.calendar_list ul li a .lt_tit .date{font-size: 13px;}
.calendar_list ul li a .lt_tit .where{font-size: 13px;}
.calendar_list ul li a .lt_tit .title{font-size:12px}
.calendar_list .cal_more_btn{height:50px;font-size:15px}
.calendar_list .cal_more_btn .cal_more_icon{width:18px;margin-left:10px}
.subja .dot{width:4px;height:4px}
#lat_calendar_Wrap table tbody tr td button{width:45px;height:45px}
#lat_calendar_Wrap table tbody tr td button:after{width:45px;height:45px}
}
@media (max-width:390px){
#lat_calendar_Wrap table tbody tr td p{line-height:45px}
#lat_calendar_Wrap table tbody tr td button{font-size:16px}
#lat_calendar_Wrap .title_wrap .np_btn{width:33px;height:33px}
#lat_calendar_Wrap table tbody tr td button{width:40px;height:40px}
#lat_calendar_Wrap table tbody tr td button:after{width:40px;height:40px}
.dot_list{margin-bottom:0}
}
/* 반응형 [e] */
