@charset "utf-8";

#mainVisual{overflow:hidden;position:relative;width:100%;height:785px;background-color:#222;transform:translateZ(0);will-change:transform}
#mainVisual .main_bnr{width:100%;height:100%}
#mainVisual .main_bnr ul{height:100%}
#mainVisual .main_bnr li{height:100%;background-size:cover;background-position:center}
#mainVisual .bg01{background-image:url('./img/main_banner_01.jpg')}
#mainVisual .bg02{background-image:url('./img/main_banner_02.jpg')}
#mainVisual .bg03{background-image:url('./img/main_banner_03.jpg')}

#calenDar{min-width:25%;font-family:var(--k-font);background:#f5f5f5}

/* calendar */
#lat_calendar_Wrap{height:500px;padding:50px;background:#fff}
#lat_calendar_Wrap .s_tit{margin-bottom:35px;font-size:20px;font-weight:700;color:#111;text-transform:uppercase;font-family:var(--e-font)}
#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:30px;position:relative;width:100%;text-align:center}
#lat_calendar_Wrap .title_wrap #date_txt h3{display:inline-block;font-size:16px;font-weight:700;color:#222;font-family:var(--point-font)}
#lat_calendar_Wrap .title_wrap #date_txt{display:inline-block;font-size:16px;font-weight:700;color:#222;font-family:var(--point-font)}
#lat_calendar_Wrap .title_wrap .np_btn{display:flex;align-items:center;justify-content:center;color:#111;cursor:pointer}
#lat_calendar_Wrap .title_wrap .np_btn svg{width:16px}

/* date*/
#lat_calendar_Wrap table{width:100%;border-collapse:collapse}
#lat_calendar_Wrap table thead tr th{padding:22px 0 10px;font-size:15px;font-weight:500;color:#222}
#lat_calendar_Wrap table .ca_red{color:#f86b4f}
#lat_calendar_Wrap table .ca_blue{color:#37a3ff}
#lat_calendar_Wrap table tbody tr td p{line-height:42px;text-align:center}
#lat_calendar_Wrap table tbody tr td button{border:none;font-size:15px;font-weight:400;color:#777;text-align:center;background-color:transparent;font-family:var(--e-font)}
#lat_calendar_Wrap table tbody tr td button.subject{position:relative}
#lat_calendar_Wrap table tbody tr td button.subject::before{content:"";display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:40px;height:40px;border-radius:100%;background:rgba(0,0,0,.05)}

/*calendar list*/
#calenDar .calendar_list{width:100%;height:285px;padding:30px 50px}
#calenDar .calendar_list ul li a{display:flex;align-items:center;gap:20px}
#calenDar .calendar_list ul li+li{margin-top:15px}
#calenDar .calendar_list ul li a .lt_date{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;flex-shrink:0;width:65px;height:65px;border-radius:10px;font-size:12px;font-weight:500;color:#777;background:#fff;transition:0.2s}
#calenDar .calendar_list ul li a .lt_date .day{font-size:17px;font-weight:700;color:var(--brand-color)}
#calenDar .calendar_list ul li a .lt_tit{min-width:0;width:100%}
#calenDar .calendar_list ul li a .lt_tit .tit{padding-bottom:7px;font-size:15px;font-weight:700;color:#222;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
#calenDar .calendar_list ul li a .lt_tit .date{font-size:13px;font-weight:500;color:#777;word-break:keep-all}

/* 반응형 [s] */
@media (max-width:1600px){
#mainVisual{height:auto}
#calenDar .calendar_list{height:auto;max-width:600px;padding:30px}
#lat_calendar_Wrap{padding:30px 30px 15px;height:auto}
}
@media (max-width:1500px){
#main_banner{flex-direction:column}
#mainVisual{height:690px}
#calenDar{display:flex;align-items:center}
#calenDar > *{flex:1}
#lat_calendar_Wrap table tbody tr td p{line-height:46px}
#lat_calendar_Wrap .s_tit{margin-bottom:15px}
}
@media (max-width:1200px){
#mainVisual{height:595px}
}
@media (max-width:1024px){
#mainVisual{height:505px}
#lat_calendar_Wrap .s_tit{margin-bottom:8px;font-size:18px}
#lat_calendar_Wrap .title_wrap{gap:25px}
#lat_calendar_Wrap .title_wrap #date_txt{font-size:15px}
#lat_calendar_Wrap table thead tr th{font-size:14px}
#lat_calendar_Wrap table tbody tr td button{font-size:14px}
#lat_calendar_Wrap table tbody tr td button.subject::before{width:38px;height:38px}
}
@media (max-width:768px){
#mainVisual{height:370px}
#calenDar{flex-direction:column}
#calenDar .calendar_list{max-width:none;padding:20px}
#calenDar .calendar_list ul li a .lt_tit .date{font-size:12px}
#lat_calendar_Wrap{width:100%;padding:30px 15px 15px}
#lat_calendar_Wrap .s_tit{margin-bottom:20px;font-size:22px;text-align:center}
#lat_calendar_Wrap .title_wrap{gap:20px}
#lat_calendar_Wrap .title_wrap #date_txt{font-size:14px}
#lat_calendar_Wrap table tbody tr td p{line-height:42px}
}
@media (max-width:480px){
#mainVisual{height:240px}
#calenDar .calendar_list ul li a .lt_date{gap:6px;width:60px;height:60px;font-size:11px}
#calenDar .calendar_list ul li a .lt_date .day{font-size:15px}
#calenDar .calendar_list ul li a .lt_tit .tit{font-size:14px}
}
@media (max-width:390px){
#calenDar .calendar_list ul li a{gap:14px}
#calenDar .calendar_list ul li a .lt_date{width:52px;height:52px}
#calenDar .calendar_list ul li a .lt_date .day{font-size:14px}
#lat_calendar_Wrap table tbody tr td button.subject::before{top:100%;transform:translateX(-50%);width:14px;height:1px;margin-top:4px;background:rgba(0,0,0,0.07)}
}
/* 반응형 [e] */