@charset "utf-8";

/* 새글 스킨 (latest) */
* {font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
.main_flex_box {display: flex;}
.calender_box {width: 50%;}
.left_box {width: 50%; margin-left: 25px; border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;}
.left_box .date_box {font-size: 30px; text-align: center; border-bottom: 1px solid #d7d7d7; font-weight: 700; height: 114px; display: grid; place-content: center;}
.left_box .items {height: 404px; display: grid; place-content: center; padding: 0 10%;}
.left_box .items.no-schedule .item--empty .desc {font-size: 16px; color: #999;}

/* 일정 아이템 */
.left_box .items.is-filled {display: flex; flex-direction: column; justify-content: center; gap: 30px;}
.left_box .items.is-filled .item {display: flex; flex-direction: column;}
.lat_wrap {display: flex; flex-direction: column; gap: 8px;}
.lat_cate {}
.lat_badge {display: inline-block; padding: 9px 20px; border-radius: 20px; font-size: 14px; font-weight: 500; border: 1px solid #111; color: #111;}
.lat_badge.badge_open {background: #000000; border-color: #000000; color: #fff;}
.lat_badge.badge_closed {background: #fff; border-color: #111; color: #111;}
.lat_subject {font-size: 22px; font-weight: 700; color: #111; margin: 0; line-height: 1.5; word-break: keep-all; margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.lat_price {font-size: 16px; color: #ff5e00; margin: 0; font-weight: 600;}
.lat_date {font-size:16px; color:#999999; margin:0; font-weight: 600;}
.lat_btns {display: flex; gap: 5px; margin-top: 5px;}
.btn_detail {width: 130px; text-align: center; padding: 13px 5px; border: none; color: #111; font-size: 16px; background: #eeeeee; transition: all 0.5s ease;}
.btn_apply {width: 130px; text-align: center; padding: 13px 5px; background: #0a4bad; color: #fff; font-size: 16px; border: none; transition: all 0.5s ease;}
.btn_detail:hover {background: #ccc;}
.btn_apply:hover {background: #1665cc;}
.btn_apply.btn_disabled {background: #cccccc; color: #999999; cursor: default; pointer-events: none;}

.main_calendar {border-collapse: collapse;}
.main_calendar tr:nth-child(2) td.invalid:first-child {border-left: none;}
.main_calendar tr:last-child td.invalid:last-child {border-right: none;}

.tit_flex {display: flex; margin-bottom: 30px; justify-content: center; align-items: center; gap: 15px; border-top: 1px solid #d7d7d7; padding-top: 30px;}
.tit_flex .cal_prev {display: block; border-radius: 50%; border: 1px solid #121212; background-color: #121212; width: 20px; aspect-ratio: 1 / 1; display: grid; place-content: center;}
.tit_flex .cal_prev i {color: #fff;}
.tit_flex .cal_next {display: block; border-radius: 50%; border: 1px solid #121212; background-color: #121212; width: 20px; aspect-ratio: 1 / 1; display: grid; place-content: center;}
.tit_flex .cal_next i {color: #fff;}

td.title {text-align: center; padding-top: 1px; padding-bottom: 1px; height: 25px; font-weight: bold;}
td.invalid {text-align: center; width: calc(100% / 7); aspect-ratio: 1 / 1; border: 1px solid #d7d7d7;}
td.valid {border: 1px solid #d7d7d7; width: calc(100% / 7);}
td.today {border-top: 1px solid #d7d7d7;}

.bgsun {text-align: center; font-size: 16px; color: #fe0000; font-weight: 700; padding-bottom: 15px;}
.bgsat {text-align: center; font-size: 16px; color: #121212; font-weight: 700; padding-bottom: 15px;}
.bgweek {text-align: center; font-size: 16px; color: #121212; font-weight: 700; padding-bottom: 15px;}

p.title {font-size: 1em; font-weight: bold;}
p.sunday {padding: 10px; height: 80px; font-size: 14px; color: #121212;}
p.saturday {padding: 10px; height: 80px; font-size: 14px; color: #121212;}
p.weekday {padding: 10px; height: 80px; font-size: 14px; color: #121212;}

a:link.writeday, a:visited.writeday {display: block; height: 80px; position: relative; font-size: 14px; padding: 10px;}
a.writeday.has-schedule::before, a:visited.writeday::before {content: ""; position: absolute; left: 10px; top: 38px; width: 8px; aspect-ratio: 1 / 1; border-radius: 50%; background-color: #ee4300;}
a.writeday.closed-schedule::before {background-color: #707070;}
a:link.writeday b, a:visited.writeday b {display: block; font-weight: 400; color: #121212; font-size: 14px;}
img {border: 0;}
.cal_tit {font-size: 24px; color: #121212;}

.calender_more {font-size: 11px; color: #fff; font-weight: bold; display: none;}
.calender_more:hover {color: #e1c501;}

.calender_box .dot_txt {margin-top: 10px; font-size: 16px;}
.calender_box .dot_txt span:last-child {margin-left: 15px;}
.main_calendar td.selected {background-color: #0a4bad;}
.main_calendar td.selected a {color: #fff;}
.main_calendar td.selected a:link.writeday b {color: #fff;}
.main_calendar td.selected a.writeday.has-schedule::before {background-color: #fff;}
.cal_order {display: block; font-size: 12px; color: #121212; line-height: 1.2; margin-top: 10px; margin-left: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main_calendar td.selected .cal_order {color: #fff;}

@media screen and (max-width: 960px) {
    .main_flex_box {flex-wrap: wrap; gap: 30px;}
    .calender_box {width: 100%;}
    .left_box {width: 100%; margin-left: 0;}
		.left_box .items {height: 300px; padding: 0 20px;}
		.left_box .date_box {height: 80px; font-size: 26px;}
}
@media screen and (max-width: 640px) {
    .cal_tit {font-size: 20px;}
    .bgsun, .bgsat, .bgweek {font-size: 14px;}
    a.writeday.has-schedule::before, a:visited.writeday::before {width: 5px; top: 27px; left: 5px;}
    p.sunday, p.saturday, p.weekday, a:link.writeday, a:visited.writeday {height: 45px; font-size: 11px; padding: 5px;}
    a:link.writeday b, a:visited.writeday b {font-size: 11px;}
    .left_box .date_box {font-size: 20px; height: auto; padding: 15px 0;}
    .left_box .items {height: auto; padding: 20px 15px;}
    .left_box .items.no-schedule .item--empty .desc {font-size: 14px;}
    .lat_badge {padding: 7px 16px; font-size: 12px;}
    .lat_subject {font-size: 16px;}
    .lat_price {font-size: 14px;}
		.lat_date {font-size: 14px;}
    .btn_detail, .btn_apply {font-size: 14px; padding: 10px 5px;}
    .cal_order {font-size: 10px; margin-top: 5px; margin-left: 8px;}
    .calender_box .dot_txt {font-size: 13px;}
}