@charset "utf-8";
/* Reset
--------------------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,
strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,
figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
margin: 0;padding: 0;border: 0;vertical-align: baseline;background: transparent;line-height: 1.4;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;word-break: inherit;-ms-word-break: inherit;
}
html, body {font-size: 16px; font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif}
html[lang="ko"] {word-break: keep-all;-ms-word-break: keep-all}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,small {display: block}
blockquote,q {quotes: none}
mark {background-color: #ff9;color: #333;font-style: italic;font-weight: bold}
del {text-decoration: line-through}
blockquote,blockquote:after,q:before,q:after {content: '';content: none}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0}
img,fieldset {border: 0;vertical-align: middle}
img {display: block;max-width: 100%}
ul,ol {list-style: none}
em,address {font-style: normal}
table {border-collapse: collapse;border-spacing: 0;table-layout: auto}
a {text-decoration: none;color: inherit;vertical-align: baseline}
a:hover,a:active,a:focus {text-decoration: none}
input[type=text], input[type=button], input[type=submit], input[type=reset], button, select, textarea, input[type=color], input[type=date], input[type=datetime-local], input[type=file], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=time], input[type=url], input[type=email], input[type=week] {appearance: none;-webkit-appearance: none;-moz-appearance: none;-moz-appearance: none;border-radius: 0}
select::-ms-expand,
input::-ms-clear {display: none}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {-webkit-box-shadow: 0 0 0 30px white inset}
input[type=button], input[type=submit], button {cursor: pointer;-webkit-appearance: none}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0}
::placeholder {color: #b7b7b7;opacity: 1}
:-ms-input-placeholder {color: #b7b7b7}

small {font-size: 11px;padding-left: 10px}
.blind {overflow: hidden;position: absolute;clip: rect(0,0,0,0);width: 1px;height: 1px;margin: -1px;border: 0;padding: 0}
caption.blind {position: static}

::selection {background: rgb(6, 159, 189, 0.2)}
*::-webkit-scrollbar {width: 8px;height: 8px;background-color: #fff}
*::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.15);background-color: #fff}
*::-webkit-scrollbar-thumb {background-color: #999; border-radius: 30px}


/* width
--------------------------*/
.wd5 {width: 5%}
.wd10 {width: 10%}
.wd15 {width: 15%}
.wd20 {width: 20%}
.wd25 {width: 25%}
.wd30 {width: 30%}
.wd35 {width: 35%}
.wd40 {width: 40%}
.wd45 {width: 45%}
.wd50 {width: 50%}
.wd55 {width: 55%}
.wd60 {width: 60%}
.wd65 {width: 65%}
.wd70 {width: 70%}
.wd75 {width: 75%}
.wd80 {width: 80%}
.wd85 {width: 85%}
.wd90 {width: 90%}
.wd95 {width: 95%}
.wd100 {width: 100%}

body * {-webkit-tap-highlight-color: rgba(0,0,0,0)}

@media screen and (max-width: 1024px) {
    html,body {font-size: 14px}
}
@media screen and (max-width: 599px) {
    html,body {font-size: 12px}
}
@media screen and (max-width: 320px) {
    html,body {font-size: 10px}
}


/* Form reset
--------------------------*/
input,
label,
select,
button,
textarea {display: inline-block;vertical-align: middle;white-space: normal;background: none;line-height: 1.5;font-size: 1rem;font-family: inherit}
input,
select,
textarea {background-color: #fff}
textarea {white-space: pre;resize: none;height: auto}
input,
textarea,
button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
select option[value=""][disabled] {display: none}
button {padding: 0;border: 0}

/* Search Input & date Input
--------------------------*/
input[type=search] {-webkit-appearance: none;box-sizing: content-box;-webkit-box-sizing: content-box}
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button { display: none}
input[type=time]::-webkit-calendar-picker-indicator,
input[type=date]::-webkit-calendar-picker-indicator,
input[type=datetime-local]::-webkit-calendar-picker-indicator,
input[type=month]::-webkit-calendar-picker-indicator {background: none;border: 1px solid red}

/* Form Checkbox & Radio
--------------------------*/
.chkbox {position: relative;display: inline-block;padding-left: 1.5rem;min-height: 1.333rem;font-size: 1.333rem;line-height: 1.5;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: pointer}
.chkbox input[type=checkbox] {display: none}
.chkbox .chk_marker {position: absolute;display: block;top: calc(1.333rem * 1.5 / 2);border-radius: 4px;left: 0;width: 1.375rem;height: 1.375rem;border: 1px solid #E9E9E9;transform: translateY(-50%);background-color: #fff;transition: background-color 0.3s, border-color 0.3s}
.chkbox .chk_marker::before {content: '';display: block;position: absolute;top: 50%;left: 50%;transform: translate(-45%,-65%) rotate(-135deg);height: 45%;width: 25%;border: 2px solid #fff;border-bottom: 0;border-right: 0;opacity: 0;transition: opacity 0.3s}
.chkbox .chk_marker + * {margin-left: 5px}
.chkbox input[type=checkbox]:checked ~ .chk_marker {background-color: #F9BD03;border-color: #F9BD03}
.chkbox input[type=checkbox]:checked ~ .chk_marker::before {opacity: 1}
.chkbox input[type=checkbox]:disabled ~ .chk_marker,
.chkbox input[type=checkbox]:disabled ~ .chk_txt {opacity: 0.5}
.chkbox--right {display: flex;padding-left: 0;padding-right: 1.5rem}
.chkbox--right .chk_marker {left: inherit;right: 0}
.chkbox--right .chk_marker + * {margin-left: 0}

.radiobox {position: relative;display: inline-block;padding-left: 1.5rem;min-height: 1.333rem;font-size: 1.333rem;line-height: 1.5;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: pointer}
.radiobox input[type=radio] {display: none}
.radiobox .radio_marker {position: absolute;display: block;top: calc(1.333rem * 1.5 / 2);border-radius: 50%;left: 0;width: 1.375rem;height: 1.375rem;border: 1px solid #E9E9E9;transform: translateY(-50%);background-color: #fff;transition: background-color 0.3s, border-color 0.3s}
.radiobox .radio_marker::before {content: '';display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) scale(0);width: 50%;height: 50%;background-color: #fff;border-radius: 50%;opacity: 0;transition: transform 0.3s, opacity 0.3s}
.radiobox .radio_marker + * {margin-left: 5px}
.radiobox input[type=radio]:checked ~ .radio_marker {background-color: #F9BD03;border-color: #F9BD03}
.radiobox input[type=radio]:checked ~ .radio_marker::before {transform: translate(-50%,-50%) scale(1);opacity: 1}
.radiobox input[type=radio]:disabled ~ .radio_marker,
.radiobox input[type=radio]:disabled ~ .radio_txt {opacity: 0.5}

.chkbox-group > * + *,
.radiobox-group > * + * {margin-left: 1em}

input,
textarea,
select {position: relative;padding: 0.5rem 0.8rem;border: 1px solid #e9e9e9;border-radius: 0.5em;transition: border-color 0.3s;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;line-height: normal}
input[type=time],
input[type=month],
input[type=date],
input[type=datetime-local] {min-height: 43px}
input:hover,
textarea:hover,
select:hover {border-color: #999}
input:focus,
input:disabled,
textarea:disabled,
select:disabled {opacity: 0.5}
input::placeholder,
textarea::placeholder {color: rgba(51,51,51,0.5)}
textarea.dhtmleditor {border: 1px solid #e5e6e7;outline: 0 none;padding: 5px 3px 3px 5px;background-color: #FFFFFF;background-image: none;border-radius: 5px;width: 100%;height: 350px}
input.error,
textarea.error,
select.error {border-color: #f00}
input[type=search] {padding-left: 2.5em;background: url('../images/icon/search.svg') 0.5em center no-repeat}
input[data-value=won] {padding-right: 2.5em!important;background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30"><text x="0" y="1em" style="font: 1.333rem Pretendard; fill:gray">원</text></svg>') center right no-repeat;text-align: right}
input[data-value=percent] {padding-right: 2.5em!important;background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30"><text x="0" y="1em" style="font: 1.333rem Pretendard; fill:gray">%</text></svg>') center right no-repeat;text-align: right}

@media screen and (max-width: 1024px) {

}

/* textarea
--------------------------*/
textarea {resize: vertical}

/* select
--------------------------*/
select {padding-right: calc(1.75rem + 10px);background-image: url('../images/icon/order-arrow.svg');background-position: calc(100% - 10px) 55%;background-repeat: no-repeat}

.value-toggle {position: relative;padding-right: 2.5em;border: 1px solid #e9e9e9;border-radius: 0.5em;font-size: 1rem}
.value-toggle__btn {position: absolute;right: 0;top: 0;width: 3em;height: 100%;background: url('/assets/images/icon/order-arrow.svg') center no-repeat}
.value-toggle__list {display: none;position: absolute;right: 0;top: 70%;padding: 0.25em 0.75em;background: #fff;border: 1px solid #e9e9e9;border-radius: 0.25em;font-size: 1.333rem}
.value-toggle__item {line-height: 1.7;color: #666;cursor: pointer}
.value-toggle__item:hover {color:#38A8FF}
.value-toggle__input {border:0 !important;outline: 0}

/* fileuploser custom
--------------------------*/
.fileuploader {padding: 0;margin: 0;background-color:#fff}
.fileuploader-input {align-items: center;padding: 0.5rem 0.8rem;border-radius: 0.25em;border-color: #ccc}
.fileuploader-input .fileuploader-input-caption {align-self: auto;padding: 0;margin: 0;border-radius: 0;border-color: transparent;color: rgba(51,51,51,0.5)}
.fileuploader-input .fileuploader-input-button,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success {width: 1.2em;height: 1.2em;padding: 0;border-radius: 0}
.fileuploader-input .fileuploader-input-button,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success {background: url('../images/icon/upload.svg') center/contain no-repeat;box-shadow: none}
.fileuploader-input .fileuploader-input-button span {overflow: hidden;text-indent: -100%;color: transparent;font-size: 0;line-height: 0}
.fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action]:hover {border-bottom-color: #069FBD}
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success {width: inherit;height: inherit;padding: 0.35rem 0.75rem}
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button:hover,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button:active,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success:hover,
.fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success:active {background: none;color: #fff}
.fileuploader-items .fileuploader-item .column-title {color:#666}
.file-ext-rar .fileuploader-item-icon,
.file-ext-zip .fileuploader-item-icon {background-color: #F9BD03!important}
.file-ext-pps .fileuploader-item-icon,
.file-ext-ppsx .fileuploader-item-icon,
.fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove {background: #f94c03}
.fileuploader-popup-zoomer{display: none!important}

/* font color
--------------------------*/
.ft-default{color:#999}
.ft-success{color:#F9BD03}
.ft-primary{color:#069FBD}
.ft-danger{color:#CC2200}

/* label
--------------------------*/
.label {display: inline;padding: .5em 0.75em;font-size: 11px;line-height: 1;color: #fff;text-align: center;white-space: nowrap;vertical-align: baseline;border-radius: 5px}
.label[href]:hover,
.label[href]:focus {color: #fff;text-decoration: none;cursor: pointer}
.label:empty {display: none}
.btn .label {position: relative;top: -1px}
.label-default {background-color: #F6F6F6;color: #069FBD}
.label-default[href]:hover,
.label-default[href]:focus {background-color: #F6F6F6}
.label-success {background-color: #F9BD03}
.label-success[href]:hover,
.label-success[href]:focus {background-color: #F9BD03}
.label-primary {background-color: #069FBD}
.label-primary[href]:hover,
.label-primary[href]:focus {background-color: #069FBD}
.label-danger {background-color: #CC2200}
.label-danger[href]:hover,
.label-danger[href]:focus {background-color: #CC2200}

/* switch Custom
--------------------------*/
.switch {position: relative;display: inline-block;padding-left: 35px;margin: 4px 0 4px 4px;font-size: 1rem}
.switch input[type=radio] {height: 0;width: 0;visibility: hidden}
.switch .marker {display: block;position: absolute;top: 0;left: 0;transition: all .3s ease-in-out;cursor: pointer;width: 35px;height: 15px;background-color: #ddd;display: block;border-radius: 2em}
.switch .marker:after  {content: '';position: absolute;top: -2px;left: -2px;width: 19px;height: 19px;background-color: #fff;border-radius: 50%;transition: 0.3s;box-shadow: 0 0 5px rgba(0, 0, 0, 0.4)}
.switch input[type=radio]:checked + .marker  {transition: all .4s ease-in-out;background-color: #2A89EF}
.switch input[type=radio]:checked + .marker::after {left: 37px;-webkit-transform: translateX(-100%);transform: translateX(-100%)}
.switch input[type=radio]:disabled + .marker::after {background-color: #ddd}
.switch input[type=radio]:disabled + .marker  {background-color: #bbb}

/* toggle btn custom
--------------------------*/
.btn-toggle-group {display: flex}
.btn-toggle-group .btn-toggle {position: relative;width: 100%;cursor: pointer}
.btn-toggle-group .btn-toggle__marker {display: block;padding: 1rem;border: 1px solid #E9E9E9;font-size: 1.333rem;text-align: center}
.btn-toggle-group .btn-toggle__input {display: none}
.btn-toggle-group .btn-toggle:first-child .btn-toggle__marker {border-top-left-radius: 0.5em;border-bottom-left-radius: 0.5em}
.btn-toggle-group .btn-toggle:last-child .btn-toggle__marker {border-top-right-radius: 0.5em;border-bottom-right-radius: 0.5em}
.btn-toggle-group .btn-toggle__input:checked + .btn-toggle__marker {border-color: #38A8FF;color: #2A89EF}
.btn-toggle-group .btn-toggle__input:disabled + .btn-toggle__marker {opacity: 0.5}
.btn-toggle-group .btn-toggle__input.is-cancel:checked + .btn-toggle__marker {border-color: #FF0000;color: #FF0000}

.btn-toggle-group.btn-toggle--sm .btn-toggle__marker {padding: 0.75rem}

.btn-toggle-group[class *= col] {flex-wrap: wrap;margin: -0.25em}
.btn-toggle-group[class *= col] .btn-toggle {margin: 0.25em}
.btn-toggle-group[class *= col] .btn-toggle__marker {border-radius: 0.5em}
.btn-toggle-group.col2 .btn-toggle {width: calc((100% / 2) - 0.5em)}
.btn-toggle-group.col3 .btn-toggle {width: calc((100% / 3) - 0.5em)}
.btn-toggle-group.col4 .btn-toggle {width: calc((100% / 4) - 0.5em)}

/* button
--------------------------*/
.btn {display: inline-flex;align-items: center;justify-content: center;position: relative;padding: 0.6rem 1.4rem;border: 1px solid;line-height: inherit;box-sizing: border-box}
.btn.disabled,
.btn:disabled {opacity: 0.5;pointer-events: none}
.btn * {margin: 0 0.4rem}
.btn *:not(.fa) {font-weight: inherit;font-style: normal}
.btn *:first-child {margin-left: 0}
.btn *:last-child {margin-right: 0}
.btn.btn-default {background-color: #fff;color: #333;border-color: #e9e9e9}
.btn.btn-success {background-color: #F9BD03;color: #fff;border-color: #F9BD03}
.btn.btn-primary {background-color: #069FBD;color: #fff;border-color: #069FBD}
.btn.btn-bordered {background-color: transparent;color: #333;border-color: inherit}

.btn .plus {position: relative;margin: 0 0.5em;width: 0.75em;height: 0.75em;transform: translateY(-1px)}
.btn .plus::before,
.btn .plus::after {content: '';position: absolute;left: 0;top: calc(50% - 1px);width: 100%;height: 1px;background-color: #333}
.btn .plus::after {transform: rotate(90deg)}

.btn.btn-success .plus::before,
.btn.btn-success .plus::after,
.btn.btn-primary .plus::before,
.btn.btn-primary .plus::after {background-color: #fff}

/* msg bubble
--------------------------*/
.bubble-title {display: flex;align-items: center;justify-content: center;width: 100%}
.bubble-title .bubble-title__ico {display: inline-block;width: 1em;height: 1em;margin: 0 5px;background: url('../images/icon/help.svg') center/contain no-repeat;border-radius: 50%}
.bubble {display: flex;align-items: center;position: relative}
.bubble[data-position=top],
.bubble[data-position=bottom] {}
.bubble .bubble__msg {display: none;position: absolute;z-index: 200;padding: 0.45rem 0.65rem;border-radius: 0.45rem;background-color: #fff;border: 1px solid #ddd;color: #666;line-height: 1;font-size: 1rem;text-align: left}
.bubble .bubble__arrow {display: none;position: absolute;top: calc(2em - 13px);left: 4px;z-index: 201}
.bubble .bubble__arrow:before {content: '';position: absolute;left: 0;top: -1px;width: 0;height: 0;border: 7px solid;border-color: transparent transparent #ccc transparent}
.bubble .bubble__arrow:after {content: '';position: absolute;width: 0;height: 0;border: 7px solid;border-color: transparent transparent #fff transparent}

.bubble:hover .bubble__msg,
.bubble:hover .bubble__arrow {display: block}

.bubble__msg--top .bubble__msg {top: 2em;left: 0}
.bubble__msg--top .bubble__arrow {}
.bubble__msg--bottom .bubble__msg {top: 0;left: 0;transform: translateY(calc(-100% - 1em))}
.bubble__msg--bottom .bubble__arrow {top: -2px;left: 1em;transform: rotate(180deg)}
.bubble__msg--left .bubble__msg {left: calc(100% + 5px)}
.bubble__msg--left .bubble__arrow {left: calc(100% - 7px);top: 50%;transform: rotate(270deg) translateX(-6px)}
.bubble__msg--right .bubble__arrow {left: calc(100% + 14px);top: 50%;transform: rotate(450deg) translateX(-6px)}


/* time picker
---------------------------*/
.time-picker {position: relative;overflow: hidden}
.time-picker__bg {position: absolute;z-index: -1;left: 0;top: 50%;transform: translateY(-50%);height: 2.5em;width: 100%;background-color: #F2F2F2;border-radius: 0.25em}
.time-picker-inn {margin: 0 auto;padding-left: 5em;max-width: 390px}
.time-picker .swiper-container {float: left;width: calc(100% / 3);min-height: 7em;max-height: 7em}
.time-picker .swiper-slide {display: flex;justify-content: center;align-items: center;user-select: none;opacity: 0.25;transition: opacity 0.3s ease;cursor: default;-webkit-tap-highlight-color: transparent;text-align: center;font-size: 1.333rem}
.time-picker .swiper-slide-prev,
.time-picker .swiper-slide-next {cursor: pointer}
.time-picker .swiper-slide-active {opacity: 1}
.time-picker .swiper-slide {min-height: 2em;height: auto}

.time-picker--hour {display: flex;align-items: center;justify-content: flex-end}
.time-picker--hour .time-picker-inn {position: relative;float: none;width: 2.5em;max-width: inherit;height: 7em;margin: 0 1em 0 0;padding-left: 0}
.time-picker--hour .time-picker-inn .swiper-container {width: 100%}
.time-picker--hour .time-picker__txt {}

/* layer
--------------------------*/
.layer-bg {position: fixed;z-index: 299;left: 0;top: 0;bottom: 0;right: 0;background-color: rgba(0,0,0,0.7)}
.layer {display: none;overflow: hidden;position: fixed;z-index: 300;left: 50%; top: 50%;transform: translate(-50%, -50%);width: calc(100% - 10%);height: calc(100% - 10%);max-width: 599px;padding: 4em 0;background-color: #fff}
.layer--full {width: 100%;height: 100%}
.layer__btn-close {position: absolute;right: 0.5em;top: 0.5em;width: 3em;height: 3em}
.layer__btn-close i {position: absolute;left: 10%;top: 50%;width: 80%;height: 1px;background-color: #000}
.layer__btn-close i:nth-child(1) {transform: rotate(45deg)}
.layer__btn-close i:nth-child(2) {transform: rotate(-45deg)}
.layer__content {height: 100%;max-height: 100%;padding:0 1.5em 3em;overflow: hidden;overflow-y: auto}
.layer__content__btn-group {display: flex;align-items: center;height: 4em}
.layer__content__btn-group .layer__content-btn {width: 100%;height: 100%;font-size: 1.333rem}

.layer--btn-fixed {padding-bottom: 4em; box-shadow: 0px 0px 15px 10px rgb(0 0 0 / 10%); border-radius: 10px;}
.layer--btn-fixed::after{content: ''; }
.layer--btn-fixed .layer__content__btn-group {position: absolute;left: 0;bottom: 0;width: 100%}


/* Alert
--------------------------*/
.alert {overflow: hidden;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width: calc(100% - 4em);max-width: 500px;padding-bottom: 4em;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);text-align: center}
.alert__cont {margin: 2em;font-size: 1.1333rem}
.alert__cont img {margin: 2em auto}
.alert__foot {display: flex;position: absolute;left: 0;bottom: 0;width: 100%;height: 4em}
.alert__foot-btn {width: 100%;height: 100%;font-size: 1.333rem}
.alert__foot-btn.btn-default {border: 0;border-top: 1px solid #ddd}


/* style
--------------------------*/
.board-list {margin-bottom: 42px;}
.board-list__item {background-color: #fff}
.board-list__head {padding: 1rem 0;border-bottom: 1px solid #ddd}
.board-list__head .layout-fix {display: flex;justify-content: space-between;;align-items: center}
.board-list__head-title {font-size: 1.333rem;font-weight: bold}
.board-list__head-title.is-cancel {color: #D10015}
.board-list__head-date {color: #999}
.board-list__stat {border: solid #ddd;border-width: 1px 0 1px 0}
.board-list__thumb {display: flex;gap: 1.5rem;justify-content: space-between;padding: 2em 0}
.board-list__thumb-img {width: 30%}
.board-list__thumb-img img {width: 100%}
.board-list__thumb__info {display: flex;flex-wrap: wrap;width: 70%;font-size: 1.333rem}
.board-list__thumb__info-name {display: flex;flex-direction: column;width: calc(100% - 100px);color: #888}
.board-list__thumb__info-name strong {line-height: 1.15;font-size: 1.5rem;color:#000}
.board-list__thumb__info-stat {width: 100px;text-align: right;color: #069FBD}
.board-list__thumb__info-cost {width: 100%;margin-top: auto;text-align: right;font-weight: bold}
.board-list__thumb__info-place {margin-top: auto;padding-left: 1.125rem;background: url('/assets/images/icon/place.svg') 0 center no-repeat;color: #999}
.board-list__stat {display: flex;font-size: 1.333rem;font-weight: bold}
.board-list__stat > * {position: relative;width: 100%;padding: 0.65em 0;text-align: center}
.board-list__stat > *:after {content: '';position: absolute;left: 0;top: 0;bottom: 0;width: 1px;background-color: #ddd}
.board-list__stat > *:first-child:after {display: none}
.board-list__stat-sale {display: inline-flex;align-items: center;justify-content: center;position: relative}
.board-list__stat-sale__icon {margin-right: 5px;width: 1em}
.board-list__stat-btn {font-size: 1.333rem;font-weight: bold}
.board-list__stat-btn.btn--success {color: #00D0FF}
.board-list__stat-btn.btn--cancel {color: #555}
.board-list__stat--stop {color: #999}
.board-list__stat--stop .board-list__stat-sale__icon {fill: #999}
.board-list__stat--start .board-list__stat-sale {color:#F9BD03}
.board-list__stat--start .board-list__stat-sale__icon {fill: #F9BD03}
@media screen and (min-width: 1024px){
    .board-list__thumb__info-place {margin-top: 0}
}

.board-view__thumb {display: flex;gap: 1.5rem;justify-content: space-between;padding: 2em 0}
.board-view__thumb > .layout-fix {display: flex;gap: 1.5rem;justify-content: space-between}
.board-view__thumb-img {width: 30%}
.board-view__thumb-img img {width: 100%}
.board-view__thumb__info {display: flex;flex-wrap: wrap;width: 70%;font-size: 1.333rem}
.board-view__thumb__info-name {display: flex;flex-direction: column;width: calc(100% - 100px);color: #888}
.board-view__thumb__info-name strong {line-height: 1.15;font-size: 1.5rem;color:#000}
.board-view__thumb__info-stat {width: 100px;text-align: right;color: #069FBD}
.board-view__thumb__info-cost {width: 100%;margin-top: auto;text-align: right;font-weight: bold}
.board-view__thumb__info-place {margin-top: auto;padding-left: 1.125rem;background: url('/assets/images/icon/place.svg') 0 center no-repeat;color: #999}
@media screen and (min-width: 1024px){
    .board-view__thumb__info-place {margin-top: 0}
}

.gallery-list {display: flex;flex-wrap: wrap;margin: 0 -0.75em}
.gallery-list__item {position: relative;width: calc(50% - 1.5em);margin: 0.75em;border-radius: 0.75em;background-color: #fff;box-shadow: 0 3px 6px rgba(0,0,0,0.2)}
.gallery-list__item:after {content: '';display: block;padding-top:100%}
.gallery-list__btn {position: absolute;display: flex;flex-direction: column;justify-content: center;align-items: center;width: 100%;height: 100%;padding-top: 10%}
.gallery-list__thumb {width: 75%;max-height: 60%;margin: 0 auto 10%}
.gallery-list__thumb-img {width: 100%;max-width: 100%;max-height: 100%}
.gallery-list__thumb-img.is-hover {display: none}
.gallery-list__tt {font-size: 1.333rem;letter-spacing: -1px}
.gallery-list__tt .bubble__title-ico {width: 0.85em}
/* .gallery-list__item:hover{background-color: #ffd966;} */
.gallery-list__item.is-active{background-color: #F9BD03}
.gallery-list__item.is-active .un-hover{display: none;}
.gallery-list__item.is-active .is-hover{display: block;}
.gallery-list__item:hover .gallery-list__tt{color: #000;}
/* .gallery-list__item.is-active:hover {background-color: #ffd966} */
/* .gallery-list__item:hover .is-hover,
.gallery-list__item.is-active .is-hover {display: block} */
/* .gallery-list__item:hover .un-hover,
.gallery-list__item.is-active .un-hover {display: none} */
/* .gallery-list__item:hover .gallery-list__tt, */
.gallery-list__item.is-active .gallery-list__tt {color: #fff}
.gallery-list__item:hover .gallery-list__tt .bubble__title-ico,
.gallery-list__item.is-active .gallery-list__tt .bubble__title-ico {box-shadow: 0 1px 2px 1px rgba(255,255,255,0.5)}
.gallery-list__item .bubble {justify-content: center}
.gallery-list--col3 .gallery-list__item {width: calc((100% / 3) - 1.5em)}
.gallery-list--col4 .gallery-list__item {width: calc((100% / 4) - 1.5em)}
.gallery-list--col5 .gallery-list__item {width: calc((100% / 5) - 1.5em)}

.gallery-list--ico {margin:0 -0.4em}
.gallery-list--ico .gallery-list__item {margin: 0.4em;border-radius: 0.35em;border: 1px solid #e9e9e9;box-shadow: none}
.gallery-list--ico .gallery-list__thumb {width: 50%;max-height: 55%}
.gallery-list--ico.gallery-list--col3 .gallery-list__item {width: calc((100% / 3) - 0.8em)}
.gallery-list--ico.gallery-list--col4 .gallery-list__item {width: calc((100% / 4) - 0.8em)}
.gallery-list--ico.gallery-list--col5 .gallery-list__item {width: calc((100% / 5) - 0.8em)}

.step {color: #069FBD;font-size: 1.333rem}
.step span:after {content:'/'}

/* form set */
.form {font-size: 1.333rem}
.form .form__item {}
.form .form__item + .form__item {margin-top:3em}
.form .form__title {margin-bottom: 0.5em;font-weight: bold}
.form .form__title *[class*=ft-] {margin: 0 2px;font-weight: normal}
.form .form__title .bubble-title {display: inline-flex;width: inherit}
.form .form__title .bubble__title-ico {width: 0.85em;height: 0.85em}
.form .form__title--group {display: flex;justify-content: space-between;align-items: center}
.form__title__arrow {width: 0.65em}
.form__title__arrow img {width: 100%}
.form .form__cont {}
.form .form__cont .btn {padding: 0.85rem 2rem;border-radius: 0.25em;font-size: 1.333rem}
.form .form__cont input,
.form .form__cont textarea,
.form .fileuploader-input {padding: 0.85rem 1rem;font-size: 1.333rem}
.form .form__cont select {padding-top: 0.85rem;padding-bottom: 0.85rem;font-size: 1.333rem}
.form .form__cont textarea {min-height: 7em;resize: none;white-space: pre-wrap;}
.form .fileuploader-input .fileuploader-input-caption {font-size: 1.333rem}
.form__btn-full {width: 100%;margin: 0.5em 0;border-radius: 0.25em;font-size: 1.333rem}

.form__cont--vt {display: flex;gap: 0.5rem;align-items: center}
.form__cont--hr {display: flex;gap: 0.5rem;flex-direction: column}

.form--vt {display: flex;flex-wrap: wrap;margin: -5px}
.form--vt .form__item {width: 100%;margin: 5px}
.form--vt .form__item + .form__item {margin-top: 1em}
.form--vt .form__title {font-weight:normal}
.form--vt[class*=col] {flex-wrap: nowrap;align-items: center}
.form--vt[class*=col] .form__item + .form__item {margin-top: 5px}
.form--vt.col2 .form__item {width: 50%}

.form__count {display: flex;justify-content: space-between}
.form__count + .form__count {margin-top: 0.5em}
.form__count__num {width: 2em;padding: 0 !important;border: 0 !important;text-align: center}
.form__count__btn-group {display: flex;alignw-items: center;gap: 0.5em}
.form__count__btn {opacity: 0.5;border-radius: 50%}
.form__count__btn.is-active {opacity: 1}
.form__count__ico {width: 1.75em;height: 1.75em}

.btn-toggle-group + .form__cont-option {margin-top:0.75em}
.form__cont-option {background-color: #F3F3F3}
.form__cont-option-title {padding: 0.75em 0;border: 1px solid #e9e9e9;text-align: center;font-weight: bold}
.form__cont-option-cont {padding: 0.75em; color:#666}
.form__cont-option-cont > * + * {margin-top: 0.5em}
.form__cont-option[class*=col] .form__cont-option-title {display: flex;padding:0}
.form__cont-option[class*=col] .form__cont-option-title > * {padding: 0.7em 0;width: 50%}
.form__cont-option[class*=col] .form__cont-option-title > * + * {position: relative}
.form__cont-option[class*=col] .form__cont-option-title > * + *:before {content: '';position: absolute;left: 0;top: 0;bottom: 0;width: 1px;background-color: #e9e9e9}
.form__cont-option[class*=col] .form__cont-option-cont dl {display: flex;justify-content: space-between}

.form__item--agree {display: flex;flex-direction: column}
.agree__chkbox + .agree__chkbox {margin-top: 0.5rem}
.agree__chkbox {padding-left: 2rem;font-size: 1.125rem}
.agree__chkbox .chk_marker {width: 1.625rem;height: 1.625rem;border-color: transparent}
.agree__chkbox .chk_marker::before {border-color: #aaa;opacity: 1}
.agree__chkbox .chk_txt {color: #6E6E6E}
.agree__chkbox .chk_txt a {text-decoration: underline}
.agree__chkbox input[type=checkbox]:checked ~ .chk_marker {border-color: #fff;background-color: #fff}
.agree__chkbox input[type=checkbox]:checked ~ .chk_marker::before {border-color: #F9BD03}
.agree__chkbox--all {margin-bottom: 0.5rem;font-size: 1.375rem}
.agree__chkbox--all .chk_marker {border-radius: 50%;border-color: #d5d5d5}
.agree__chkbox--all .chk_marker::before {border-color: #fff}
.agree__chkbox--all .chk_txt {font-weight: bold;color: #333}
.agree__chkbox--all input[type=checkbox]:checked ~ .chk_marker {border-color: #F9BD03;background-color: #F9BD03}
.agree__chkbox--all input[type=checkbox]:checked ~ .chk_marker::before {border-color: #fff}

/* calendar
--------------------------*/
.calendar {}
.calendar__head {display: flex;justify-content: space-between;border-bottom: 1px solid #eee}
.calendar__head-item {display: flex;align-items: center;justify-content: center;width: 5rem;height: 5rem;font-size: 1.167rem;color: #666}
.calendar__body {}
.calendar__body-row {display: flex;justify-content: space-between;}
.calendar__body-item {display: flex;align-items: center;justify-content: center;width: 5rem;height: 5rem;font-size: 1.333rem;cursor: pointer}
.calendar__body-item.is-active {background-color: #222;border-radius: 0.5rem;color: #fff;}
.calendar__body-item.is-disabled {opacity: 0.4;cursor: default}
.calendar__body-item.is-cancel {opacity: 0.4;text-decoration: line-through}


/* table list
--------------------------*/
.title-list {display: flex;border: 1px solid #ddd;color: #666}
.title-list + .title-list {margin-top: -1px}
.title-list__tt {display: inline-flex;align-items: center;justify-content: center;flex-direction: column;flex: 1;background-color: #f5f5f5;border-right: 1px solid #ddd}
.title-list__tt-sm {font-size: 0.875rem;text-align: center}
.title-list__item {flex: 3;padding: 0.5em}
.title-list__item span {display: block;position: relative;padding-left: 15px}
.title-list__item span::before {content: '-';position: absolute;left: 0}


/* layout
--------------------------*/
.layout-fix {width: calc(100% - 2em);max-width: 1280px;margin: 0 auto}

.header {position: fixed;z-index: 100;left: 0;top: 0;width: 100%;height: 7em;background-color: #fff}
.header__top {height: 3.5em;border-bottom: 1px solid #ddd;box-sizing: border-box}
.header__top .layout-fix {display: flex;align-items: center;justify-content: space-between;height: 100%}
.header__logo img {width: 3.5rem}
.header__menu {display: flex;flex-direction: column;justify-content: space-between;align-items: center;position: relative;width: 2em;height: 1.35em}
.header__menu span {position: absolute;overflow: hidden;font-size: 0;color: transparent;text-indent: -100%}
.header__menu i {width: 100%;height: 2px;background-color: #000}
.header__alarm {position: relative;width: 2.5em;height: 2.5em;background: url('../images/icon/bell.svg') center/70% no-repeat; cursor: pointer}
.header__alarm-label {position: absolute;right: 0;top: 0;width: 1em;height: 1em;border-radius: 50%;background: #F9BD03 url('../images/icon/alarm.png') center no-repeat}
.header__page-head {position: absolute;z-index: 100;left: 0;top: 3.5em;width: 100%;height: 3.5em;border-bottom: 1px solid #ddd;background-color: #fff}
.header__page-head .layout-fix {display: flex;align-items: center;justify-content: center;position: relative;height: 100%}
.header__page-head__btn {position: absolute;left: 0;top: 50%;width: 2em;height: 2em;transform: translateY(-50%)}
.header__page-head__btn i {position: absolute;left: 10%;top: 50%;width: 45%;height: 45%;border: solid #000;border-width: 1px 1px 0 0;transform-origin: top left;transform: rotate(-135deg) translateX(-100%)}
.header__page-head__tt {font-size: 1.333rem}
.header__page-head__date-view {display: flex;align-items: center;gap: 0.5rem;position: absolute;right: 0;top: 50%;transform: translateY(-50%);padding: 0.5rem 0.75rem;background-color: #28336E;border-radius: 0.25rem;border: 0;color: #fff}
.header__page-head__date-view img {width: 1rem}
.header__page-head__date-view span {font-size: 0.8333rem}

.head-non {}
.head-non .header {height: 3.5rem}
.head-non .header__page-head {display: none}

.container{padding: 7em 0 5.5em;min-height: calc(100vh - 140px);overflow: hidden;background-color: #fff}
.container__title {margin: 0.5em 0;font-size: 1.5rem;text-align: center}
.container__add-car-btn {position: fixed;bottom: 66px;right: 0;left: 0;width: 100%;height: 40px;border-radius: 0;z-index: 1;display: flex;align-items: center; gap: 4px; background-color: #069FBD; justify-content: center;color: #fff;font-size: .875rem;}
/* .container__add-car-btn {display: flex;align-items: center;justify-content: center;flex-direction: column;position: fixed;right: 2em;bottom: 8em;width: 6em;height: 6em;border-radius: 500%;color: #Ffff;font-size: .875rem} */
.container__add-car-btn * + * {font-size: 14px;}
.container--foot{min-height: calc(100vh - 7em - 4.25em);padding-bottom: 4.25em}
.container__foot-btn {display: flex;position: fixed;z-index: 100;left: 0;bottom: 0;width: 100%;height: 4.25em}
.container__foot-btn .btn {width: 100%;height: 100%;padding: 0;font-size: 1.333rem}

.category {background-color: #fff;border-bottom: 1px solid #cdcdcd}
.category-list {display: flex;justify-content: space-around}
.category-list__link {display: block;position: relative;padding: 1.25rem 0.5rem 1rem;line-height: 1;font-size: 1.333rem;color: #666}
.category-list__link:after {content: '';position: absolute;left: 0;bottom: 0;height: 0;width: 100%;background-color: #000}
.category-list__link.is-active {font-weight: bold;color: #000}
.category-list__link.is-active:after {height: 3px}

.footer {position: fixed;z-index: 100;left: 0;bottom: 0;width: 100%;height: 5.5em;border-top: 1px solid #ddd;background-color: #fff}
.footer .layout-fix {display: flex;align-items: center;height: 100%}
.footer__link {display: inline-flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;transition: color 0.3s}
.footer__link-ico {height:2em; transition: fill 0.3s}
.footer__link-txt {margin-top: 5px}
.footer__link:nth-child(2) .footer__link-ico {width: 2.35em}
.footer__link.is-active,
.footer__link:hover {color: #F9BD03}
.footer__link.is-active .footer__link-ico,
.footer__link:hover .footer__link-ico{fill: #F9BD03}
.footer__link.is-active .footer__link-txt,
.footer__link:hover .footer__link-txt{font-weight: bold}




/* sub layout
--------------------------*/
.layer-camp {display: flex;align-items: center;justify-content: center;height: 100%;overflow-y: auto}
.layer-camp .layer__content {padding:0 2em;width: 100%;height: auto}
.layer-camp-inn {overflow: hidden}
.layer-camp__title {display: flex;flex-direction: column;gap: 1.5em}
.layer-camp__title-main {font-size: 2.333rem;line-height: 1;}
.layer-camp__title-sub {font-size: 1.333rem;}
.layer-camp__img {position: relative;width: 100%;height: 35vh;margin: 3em auto 1.5em}
.layer-camp__info {text-align: center;font-size: 1.167rem}
.layer-camp__info-help {justify-content: center;font-weight: bold}
.layer-camp__info-help .bubble-ico {margin: -0.17em 0 0 0.25em}
.layer-camp__btn {width: 100%;padding: 1.25rem 0;margin-top: 3em;border-radius: 0.5em;font-size: 1.333rem}


/* 차량등록 차고지 입력 */
.container--car-add {min-height: calc(100vh - 80px);padding-bottom: 0}
.container--car-add > .layout-fix{padding: 1.5em 0}
.container--car-add--addr {display: flex;flex-direction: column;height: calc(100vh - 80px)}
.container--car-add .step {text-align: right}
.container--car-add .addr-search {padding-top: 1.5em}
.container--car-add .addr-search__input {width: 100%;padding-top: 0.75em;padding-bottom: 0.75em;background-color: #F6F6F6;border: 0;font-size: 1.333rem}
.container--car-add .addr-seardh__btn {display: flex;align-items: center;gap: 0.5em;width: 100%;padding: 0.5em 0;font-size: 1.333rem}
.container--car-add .addr-seardh__btn .arrow {width: 0.5em;height: 0.5em;margin:0 1em 0 auto;transform: rotate(45deg);border: solid #c9c9c9;border-width: 1px 1px 0 0}
.container--car-add .addr-search-list {width: 100%;height: 100%;padding: 1.5em 0;background-color: #F6F6F6;border-top: 1px solid #C9C9C9;font-size: 1.333rem}
.container--car-add .addr-search-list-title {font-weight: bold}
.container--car-add .addr-search-list__info {margin-top: 1.5em}
.container--car-add .addr-search-list__info-item {position: relative;padding-left: 0.7em}
.container--car-add .addr-search-list__info-item + .addr-search-list__info-item {margin-top:1.5em}
.container--car-add .addr-search-list__info-item:before {content: '';position: absolute;left: 0;top: 0.65em;width: 2px;height: 2px;background-color: #666}
.container--car-add .addr-search-list__info-ex {color: #999}
.container--car-add .addr-select {padding: 3em 0;font-size: 1.333rem}
.container--car-add .addr-select__address {}
.container--car-add .addr-select__address-base {font-size: 1.5rem;font-weight: bold}
.container--car-add .addr-select__address-street {display: flex;align-items: center;gap: 0.5em;margin-top: 0.5em;color: #666}
.container--car-add .addr-select__input {width: 100%;margin-top: 1em;padding: 0.75em 1em;border: 1px solid #e9e9e9;font-size: 1.333rem}


/* 차량관리 */
.container--car-edit .layout-fix {width: 100%}
.container--car-edit .car-thumb-info {display: flex;padding: 2em;border-bottom: 2px solid #e9e9e9}
.container--car-edit .car-thumb-info__img {width: 20%}
.container--car-edit .car-thumb-info__cont {width: 80%;padding-left: 1.5em}
.container--car-edit .car-thumb-info__cont-name {font-size: 1.333rem;color: #888}
.container--car-edit .car-thumb-info__cont-name strong {display: block;font-size: 1.5rem;color: #222}
.container--car-edit .car-edit-form {width: calc(100% - 4em);margin: 1em auto 2em}

/* 로그인 */
.container--login {}
.container--login .page__title {margin-bottom: 1.5rem;padding-bottom: 0.5rem;border-bottom: 1px solid #000;font-size: 1.5rem;text-align: center}
.container--login .form__item {text-align: center}
.container--login .form__item  *[class *= ft] {font-size: 1rem}
.container--login .form__cont + .form__cont {margin-top: 0.75rem}
.container--login .form__cont input {border-radius: 0}
.container--login .btn {font-weight: bold;color: #222}

/* 회원가입 */
.container--regist {}
.container--regist .layout-fix {padding-bottom: 4rem}
.container--regist .page__title {margin-bottom: 1.5rem;padding-bottom: 0.5rem;border-bottom: 1px solid #000;font-size: 1.5rem;text-align: center}
.container--regist .form__item  *[class *= ft] {font-size: 1rem}
.container--regist .form__cont input {border-radius: 0}
.container--regist .btn {font-weight: bold;color: #222}

/* 가입완료 */
.container--regist-suc {}
.container--regist-suc .layout-fix {padding-bottom: 4rem}
.container--regist-suc .regist-scu__title {display: flex;flex-direction: column;font-size: 2.5rem;font-weight: normal;line-height: 1.2}
.container--regist-suc .regist-suc__img {display: block;width: 30%;min-width: 18rem;margin: 6rem auto 1rem}
.container--regist-suc .regist-suc__text {text-align: center;font-size: 1.25rem}
.container--regist-suc .regist-suc__text + .regist-suc__text {margin-top: 2rem}
.container--regist-suc .regist-suc__text strong {font-size: 1.75rem}
.container--regist-suc .regist-suc__text a {text-decoration: underline}
.container--regist-suc .regist-suc__text--line {padding-top: 4rem;border-top: 1px solid #e5e5e5}
.container--regist-suc .regist-suc__text--bg {padding: 2rem;background: #f9f9f9}
.container--regist-suc .btn {width: 100%;margin-top: 5rem;padding: 0.75rem 0;font-size: 1.375rem;font-weight: bold;color: #222}

/* 예약확인 */
.container--reserv {background-color: #f3f3f3}
.container--reserv .board-list__item {margin-top: 1rem}
.container--reserv .board-list__thumb__info-name {width: 100%}

/* 날짜설정 */
.container--dating,
.container--dating-view {padding-bottom: 4.25rem;background-color: #f3f3f3}
.container--dating .board-list__item + .board-list__item {margin-top: 1rem}
.container--dating .board-list__thumb__info {flex-direction: column}
.container--dating .board-list__thumb__info-name {width: 100%}
.container--dating-view > * {background-color: #fff}
.container--dating-view > * + * {margin-top: 1rem}
.container--dating-view .month-list {padding-bottom: 3rem}
.container--dating-view .board-view__thumb__info {flex-direction: column}
.container--dating-view .board-view__thumb__info-name {width: 100%}
.container--dating-view .form .form__title {margin-bottom: 1rem}
.container--dating-view .form__cont > .form--vt + .form--vt {position: relative;margin-top: 2rem}
.container--dating-view .form__cont > .form--vt + .form--vt:before {content: '';position: absolute;left: 0;top: -1rem;width: 100%;height: 1px;background-color: #eee}
.container--dating-view .form--vt[class*=col] {align-items: flex-start;}
.container--dating-view .form--vt[class*=col] .form__title {padding-top: 0.75rem}
.container--dating-view .form__cont--hr {gap: 5px}
.container--dating-view .form__cont--hr .is-disabled {display: none}
.container--dating-view select {border-radius: 0}
.container--dating-view .btn-toggle-group .btn-toggle:first-child .btn-toggle__marker {border-top-left-radius: 0;border-bottom-left-radius: 0}
.container--dating-view .btn-toggle-group .btn-toggle:last-child .btn-toggle__marker {border-top-right-radius: 0;border-bottom-right-radius: 0}
.container--dating-view .calendar + .form {margin-top: 3rem}
@media screen and (min-width: 1024px){
    .container--dating .board-list__thumb__info {justify-content: center;gap: 1rem}
    .container--dating-view .board-view__thumb__info {justify-content: center;gap: 1rem}
}

/* 매출통계 */
.month-select {display: flex;align-items: center;padding: 2rem 0}
.month-select__arrow {position: relative;width: 3rem;height: 3rem;background-color: #f0f0f0;border-radius: 50%}
.month-select__arrow.is-disabled {opacity: 0.5}
.month-select__arrow--prev:after,
.month-select__arrow--next:after {content: '';position: absolute;top: 45%;width: 30%;height: 30%;transform-origin: left bottom}
.month-select__arrow--prev:after {left: 60%;border-top: 1px solid #000;border-left: 1px solid #000;transform: rotate(-45deg)}
.month-select__arrow--next:after {left: 40%;border-bottom: 1px solid #000;border-right: 1px solid #000;transform: rotate(-45deg)}
.month-select__title {margin: 0 auto;font-size: 1.5rem}
.month-stats {display: flex;flex-direction: column;gap: 2rem}
.month-stats__select {width: 100%;height: 4rem;padding-left: 1.5rem;background-image: url('/assets/images/icon/desc-arrow.svg');font-size: 1.333rem;font-weight: bold}
.month-stats__value {display: inline-flex;flex-direction: column;align-items: center;gap: 1rem}
.month-stats__value .title {padding-left: 1.65rem;background: url('/assets/images/icon/won.svg') center left no-repeat;font-size: 1.333rem}
.month-stats__value .price {display: flex;justify-content: center;align-items: center;gap: 5px;z-index: 1;position: relative;font-weight: 600;font-size: 2.8333rem}
.month-stats__value .price:before {content: '';z-index: -1;position: absolute;left: 0;bottom: 0.7rem;width: 100%;height: 8px;background-color: #F9BE03}
.month-stats__value .price .won {font-size: 2rem}

/* 알림페이지 */
.alarm-msg {}
.alarm-msg__item {position: relative;padding: 1.5rem 5rem 1.5rem 4rem;border-bottom: 1px solid #ddd;background: url('/assets/images/icon/calendar-check.svg') 1.5rem 1.65rem no-repeat}
.alarm-msg__item + .alarm-msg__item {}
.alarm-msg__title {font-size: 1.333rem;font-weight: bold}
.alarm-msg__desc {margin-top: 0.5rem;font-size: 1.167rem;color: #555}
.alarm-msg__desc-title,
.alarm-msg__desc-text {display: inline}
.alarm-msg__desc-title:after {content: ':';margin-right: 5px}
.alarm-msg__close {position: absolute;right: 1.5rem;top: 50%;transform: translateY(-50%);width: 3rem;height: 3rem;background-color: #F9F9F9;border-radius: 50%;cursor: pointer}
.alarm-msg__close:before,
.alarm-msg__close:after {content: '';position: absolute;left: 20%;top: 50%;width: 60%;height: 1px;background-color: #777}
.alarm-msg__close:before {transform: rotate(45deg)}
.alarm-msg__close:after {transform: rotate(-45deg)}