@charset "UTF-8";

.ui-datepicker {
	--krds-calendar--radius: var(--krds-radius-xlarge2);
    --krds-calendar--head-pc-font-size: var(--krds-pc-font-size-heading-xsmall);
    --krds-calendar--head-mobile-font-size: var(--krds-mobile-font-size-heading-xsmall);
    --krds-calendar--head-btn-cal-switch-pc-font-size: var(--krds-pc-font-size-label-medium);
    --krds-calendar--head-btn-cal-switch-mobile-font-size: var(--krds-mobile-font-size-label-medium);
    --krds-calendar--head-btn-cal-switch-radius: var(--krds-radius-medium1);
    --krds-calendar--head-btn-cal-move-size: var(--krds-size-height-5);
    --krds-calendar--table-wrap-padding: var(--krds-gap-5);
    --krds-calendar--table-head-pc-font-size: var(--krds-pc-font-size-label-small);
    --krds-calendar--table-head-mobile-font-size: var(--krds-mobile-font-size-label-small);
    --krds-calendar--table-caption-pc-font-size: var(--krds-pc-font-size-heading-xxsmall);
    --krds-calendar--table-caption-mobile-font-size: var(--krds-pc-font-size-heading-xxsmall);
    --krds-calendar--set-date-radius: var(--krds-radius-max);
    --krds-calendar--color-border: var(--krds-light-color-border-secondary-light);
    --krds-calendar--color-surface: var(--krds-light-color-surface-secondary-subtler);
    --krds-calendar--color-text-sub: var(--krds-light-color-text-subtle);
    --krds-calendar--head-btn-cal-move-color-text-active: var(--krds-light-color-text-secondary);
    --krds-calendar--head-btn-cal-move-color-border: var(--krds-light-color-border-gray-light);
    --krds-calendar--head-btn-cal-move-color-border-active: var(--krds-light-color-border-secondary);
    --krds-calendar--head-btn-cal-move-color-action: var(--krds-light-color-action-white);
    --krds-calendar--head-btn-cal-switch-color-action-hover: var(--krds-light-color-action-secondary-hover);
    --krds-calendar--head-btn-cal-switch-color-action-active: var(--krds-light-color-action-secondary-pressed);
    --krds-calendar--head-btn-cal-switch-color-text-disabled: var(--krds-light-color-text-disabled-on);
    --krds-calendar--head-drop-down-shadow: 0 0 0.2rem 0 var(--krds-light-color-alpha-shadow1), 0 0.4rem 0.8rem 0 var(--krds-light-color-alpha-shadow2);
    --krds-calendar--date-set-color-action: var(--krds-light-color-action-secondary-active);
    --krds-calendar--date-set-color-text: var(--krds-light-color-text-inverse-static);
    --krds-calendar--date-set-color-text-day-off: var(--krds-light-color-text-danger);
    --krds-calendar--date-set-color-text-day-event: var(--krds-light-color-text-information);
    --krds-calendar--date-set-color-text-disabled: var(--krds-light-color-text-disabled);
    --krds-calendar--date-set-color-action-pressed: var(--krds-light-color-action-secondary-on-pressed);
    --krds-calendar--date-set-color-action-period: var(--krds-light-color-action-secondary-on-selected);
    --krds-calendar--date-set-color-element-today: var(--krds-light-color-element-point);
    --krds-calendar--action-btn-wrap-color-border: var(--krds-light-color-divider-gray-light);
    --krds-calendar--action-btn-wrap-color-surface: var(--krds-light-color-surface-white);
    --krds-form-select--padding-default: var(--krds-padding-4);
    position: relative;
    z-index: 70 !important;
    width: 100%;
    color: var(--krds-light-color-text-subtle);
    position: absolute !important;
    top: 0.8rem;
    left: 0;
    width: 38.4rem !important;
    background-color: var(--krds-calendar--color-surface) !important;
    border: 1px solid var(--krds-calendar--color-border) !important;
    border-radius: var(--krds-calendar--radius) !important;
    overflow: hidden !important;
    padding: 0px !important;
}

.ui-datepicker-header{
	display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-direction: row !important;
    padding: var(--krds-padding-8) !important;
    font-size: var(--krds-calendar--head-pc-font-size) !important;
    font-weight: var(--krds-font-weight-bold) !important;
    gap: var(--krds-gap-5) !important;
    background-color: var(--krds-calendar--color-surface) !important;
    border:none !important;
}

.ui-datepicker-prev, .ui-datepicker-next{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: var(--krds-calendar--head-btn-cal-move-size) !important;
    height: var(--krds-calendar--head-btn-cal-move-size) !important;
    background-color: var(--krds-calendar--head-btn-cal-move-color-action);
    border: 1px solid var(--krds-calendar--head-btn-cal-move-color-border);
    border-radius: var(--krds-radius-max) !important;
    flex-shrink: 0;
    top: unset !important;
}

.ui-datepicker .ui-datepicker-prev{
	left: 20px !important;
}

.ui-datepicker .ui-datepicker-next{
	right: 20px !important;
}

.ui-datepicker .ui-datepicker-prev span,.ui-datepicker .ui-datepicker-next span{
	content: "";
    display: inline-flex;
    width: var(--krds-size-height-3);
    height: var(--krds-size-height-3);
    background-color: var(--krds-light-color-text-basic);
    forced-color-adjust: none;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center center;
    mask-size: contain;
    -webkit-mask-image: url(/images/component/icon/ico_angle.svg);
    mask-image: url(/images/component/icon/ico_angle.svg);
    transform: rotate(90deg) !important;
    margin-left: -9px !important;
	margin-top: -9px !important;
}

.ui-datepicker .ui-datepicker-next span{
	transform: rotate(-90deg) !important;
}

.ui-datepicker-calendar{
	position: relative;
	padding: 0 var(--krds-calendar--table-wrap-padding);
}

.ui-datepicker th,.ui-datepicker td{
	width: 14.2857142857%;
}

.ui-datepicker th{
	padding-bottom: 4.6rem;
    font-weight: var(--krds-font-weight-regular);
    font-size: var(--krds-calendar--table-head-pc-font-size);
}

.ui-state-default ui-priority-secondary{
	color: var(--krds-calendar--date-set-color-text-disabled);
}

.ui-datepicker td{
    padding: var(--krds-padding-1) 0;
}

.ui-state-default, .ui-widget-content .ui-state-default{
	display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    height: 100%;
    position: relative;
    width: 44px;
    height: 44px;
    margin-inline: auto;
    border: none !important;
    background: unset !important;
}



.ui-state-active, .ui-widget-content .ui-state-active{
	border-top-right-radius: var(--krds-calendar--set-date-radius);
    border-bottom-right-radius: var(--krds-calendar--set-date-radius);
    border-top-left-radius: var(--krds-calendar--set-date-radius);
    border-bottom-left-radius: var(--krds-calendar--set-date-radius);
    background: var(--krds-calendar--date-set-color-action) !important;
    color: var(--krds-calendar--date-set-color-text) !important;
    border: 0 !important;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight::before{
	content: "";
    width: 0.4rem;
    height: 0.4rem;
    position: absolute;
    bottom: 20%;
    left: 50%;
    transform: translateX(-50%);
    border-radius: var(--krds-radius-max);
    background-color: var(--krds-calendar--date-set-color-element-today);
}

.ui-state-hover{
	background-color: var(--krds-calendar--date-set-color-action-period);
}

.ui-datepicker-buttonpane{
	margin-top: var(--krds-calendar--table-wrap-padding) !important;
	display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-direction: row !important;
    gap: var(--krds-gap-3) !important;
    padding: var(--krds-padding-2) !important;
    border-top: 1px solid var(--krds-calendar--action-btn-wrap-color-border) !important;
    background-color: var(--krds-calendar--action-btn-wrap-color-surface) !important;
}

.ui-datepicker-title{
	display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: var(--krds-gap-2);
    margin: unset !important;
}

.ui-datepicker-month, .ui-datepicker-year{
    --krds-calendar-drop-down-btn-height: var(--krds-size-height-6);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: var(--krds-gap-2);
    height: var(--krds-size-height-6);
    border-radius: var(--krds-calendar--head-btn-cal-switch-radius);
    padding: 0 var(--krds-padding-3);
    transition: var(--krds-transition-base);
    width: 100px !important;
    background-image: url(/images/component/icon/ico_angle.svg);
    background-color: transparent !important;
    background-repeat: no-repeat;
    background-position: center right var(--krds-form-select--padding-default);
    border: unset;
}

.ui-datepicker-week-end.sunday a {
	color:#bd2c0f !important;
}

.ui-datepicker-week-end.saturday a {
	color:#2e3cb6!important;
}

.bold{
	font-weight: bold !important;
}

.main-row{
	cursor: pointer;
}

.card-info {
	padding: 3px;
	height: 100%;
	text-align: center;
}
.card-info > div {
	border-radius: .8rem;
	height: 100%;
}
.card-info > div > div {
	text-align: center;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.card-info > div > span{
	font-size: var(--krds-pc-font-size-display-small);
}
.card-info > div > div:last-child {
	font-size: 14px;align-content: center;
}
.cutn-info {
	border: .1rem solid var(--risk-color-caution-second);
}
.warn-info {
	border: .1rem solid var(--risk-color-severe-second);
}