/*font*/
/* @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); */
/* @import url(https://cdn.jsdelivr.net/font-kopub/1.0/kopubdotum.css); */
@import url(kopubdotum.css);
@import url(notosanskr.css);

/* html5요소 하위브라우져 적용 */
header,
footer,
section,
article,
aside,
nav,
hgroup,
details,
menu,
figure,
figcaption {
    display: block
}

/* 모든 Device를 위한 공통 로드 */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
h7,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
figure,
figcaption,
span {
    margin: 0;
    padding: 0;
    color: rgb(0, 0, 0);
    letter-spacing: -0.5px;
}

* {
    -webkit-text-size-adjust: none;
}

body {
    height: 100%;
    font-size: 10px;
    font-family: 'Noto Sans KR', 'Noto Sans Korean', sans-serif;
}

textarea,
input,
button,
select {
    font-family: inherit;
    font-size: inherit;
}

button {
    cursor: pointer;
    border: none;
}

table {
    border-spacing: 0;
    *border-collapse: collapse;
}

fieldset,
img {
    border: 0
}

img {
    object-fit: contain;
    vertical-align: middle;
    width: 100%;
    image-rendering: -webkit-optimize-contrast;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-perspective: 1;
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
    font-style: normal;
    font-weight: normal;
}

ol,
ul {
    list-style: none;
}

legend,
caption {
    text-indent: -100%;
    *text-indent: 0;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    text-shadow: none;
    color: transparent;
}

a {
    text-decoration: none;
    outline: 0;
    color: rgb(0, 0, 0);
}

select,
input {
    vertical-align: middle;
}

section {
    overflow: hidden;
}

:root,
html {
    /* font-size: 10px; */
}


.ir {
    overflow: hidden;
    text-indent: -9999px;
    position: absolute;
    z-index: -9999;
    top: -10000px;
    left: -100000px;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.block {
    display: block;
}

.inline {
    display: inline;
}

.inlineBlock {
    display: inline-block;
    *zoom: 1;
    *display: inline;
}

.clear::after {
    content: "";
    clear: both;
}

.oh {
    overflow: hidden
}

.fl {
    float: left !important;
}

.fr {
    float: right !important;
}

.ovh {
    overflow: hidden;
}


.d_hidden {
    display: block !important;
}

.m_hidden {
    display: none !important;
}

/*slick*/
.slick-slide,
.slick-slide:focus {
    outline: 0;
}

/*font*/
@import url(https://cdn.jsdelivr.net/npm/noto-sans-kr@0.1.1/styles.css);

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 100;
    src: url(../../font/AppleSDGothicNeoT.ttf) format('truetype');
    /*For IE6~8*/
}

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 300;
    src: url(../../font/AppleSDGothicNeoT.ttf) format('truetype');
    /*For IE6~8*/
}

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 300;
    src: url(../../font/AppleSDGothicNeoL.ttf) format('truetype');
    /*For IE6~8*/
}

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 500;
    src: url(../../font/AppleSDGothicNeoR.ttf) format('truetype');
    /*For IE6~8*/
}

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 700;
    src: url(../../font/AppleSDGothicNeoSB.ttf) format('truetype');
    /*For IE6~8*/
}

@font-face {
    font-family: AppleSDGothicNeo;
    font-style: normal;
    font-weight: 900;
    src: url(../../font/AppleSDGothicNeoB.ttf) format('truetype');
    /*For IE6~8*/
}

/* input 기본 스타일 초기화 */
input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* IE10 이상에서 input box 에 추가된 지우기 버튼 제거 */
input::-ms-clear {
    display: none;
}

/* input type number 에서 화살표 제거 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

body {}

/* margin */
/* margin */
.mr0 {
    margin-right: 0 !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mt0 {
    margin-top: 0 !important;
}

.mt10 {
    margin-top: 10px !important;
}

.mt15 {
    margin-top: 15px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mt24 {
    margin-top: 24px !important;
}

.mt30 {
    margin-top: 30px !important;
}

.mt40 {
    margin-top: 40px !important;
}

.mt50 {
    margin-top: 50px !important;
}

.mt100 {
    margin-top: 100px !important;
}


.mtM10 {
    margin-top: -10px !important
}

.ml0 {
    margin-left: 0 !important;
}

.ml5 {
    margin-left: 5px !important;
}

.mr1 {
    margin-right: 1px !important;
}

.mb0 {
    margin-bottom: 0 !important;
}

.mb10 {
    margin-bottom: 10px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mr30 {
    margin-right: 30px !important;
}

/* padding */
.pt0 {
    padding-top: 0 !important;
}

.pt30 {
    padding-top: 30px !important;
}

.pb0 {
    padding-bottom: 0px !important;
}

.pb6 {
    padding-bottom: 6px !important;
}

.pl0 {
    padding-left: 0 !important;
}

.pr0 {
    padding-right: 0 !important;
}

.pr10 {
    padding-right: 10px !important;
}

.pb20 {
    padding-bottom: 20px !important;
}

.pb30 {
    padding-bottom: 30px !important;
}

.pb40 {
    padding-bottom: 40px !important;
}

.bn {
    border: none !important
}

/* text type */

/* btns */
.btn_bg {
    background: linear-gradient(to right, #FF9559, #FF4063);
}

.btn_bg2 {
    background: linear-gradient(to right, #4AD4FF, #2189FF);
}

.mh480 {
    min-height: 480px;
}

.mh550 {
    min-height: 550px;
}

.mh630 {
    min-height: 630px;
}

.mh650 {
    min-height: 650px;
}

.mh700 {
    min-height: 700px;
}

.mh750 {
    min-height: 750px;
}

/* align */
.cl_left {
    clear: left
}

.center {
    text-align: center !important;
}

.top {
    vertical-align: top !important
}

.bottom {
    vertical-align: bottom
}

.middle {
    vertical-align: middle !important
}

.alignRight {
    text-align: right !important
}

.alignLeft {
    text-align: left !important
}

/* position */
.posRel {
    position: relative;
    z-index: 1;
}

/* width */
.w50 {
    width: 50% !important
}

.w33 {
    width: 33.33% !important
}

/* height */
.h30 {
    height: 30px;
}

/* text style */
.bold {
    font-weight: 700;
}

.redTxt {
    color: red !important
}

.blueTxt {
    color: blue !important
}

.greenTxt {
    color: #548826 !important
}

.color777 {
    color: #777 !important
}

/* display */
.displayNone {
    display: none;
}

/* lineheight */
.lineHeight0 {
    line-height: 0px !important;
}

.table_wrap {
    height: 130px;
    overflow-y: scroll;
    width: 100%;
}

.table_wrap01 {
    height: 290px;
    overflow-y: scroll;
    width: 100%;
}

.table_wrap02 {
    height: 350px;
    overflow-y: scroll;
    width: 100%;
}

.table_wrap03 {
    height: 400px;
    overflow-y: scroll;
    width: 100%;
}

.scroll_box::-webkit-scrollbar {
    width: 2px;
    height: 2px;
}

.scroll_box::-webkit-scrollbar-track {
    background-color: transparent;
}

.scroll_box::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background-color: #fff;
}

.scroll_box::-webkit-scrollbar-button {
    width: 0;
    height: 0;
}

.scroll_box2::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.scroll_box2::-webkit-scrollbar-track {
    background-color: transparent;
}

.scroll_box2::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #E2E2E2;
}

.scroll_box2::-webkit-scrollbar-button {
    width: 0;
    height: 0;
}



input,
button {
    border-radius: 0;
    -webkit-appearance: none
}

input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
	/* visibility: hidden; */
    display: none;
}

input[type="checkbox"]:checked + label:after {
    background: url(/assets/image/common/bg_checkbox_on.png) center left 0 no-repeat;
}

input[type="checkbox"] + label {
    position: relative;
    padding-left: 18px;
    font-size: 12px;
    color: #676767;
    cursor: pointer;
}

input[type="checkbox"] + label:after {
    position: absolute;
    top: 55%;
    left: 0;
    transform: translate(0, -50%);
    content: '';
    width: 15px;
    height: 15px;
    background: url(/assets/image/common/bg_checkbox_off.png) center left 0 no-repeat;
}


input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    display: none;
}

input[type="radio"]:checked + label:after {
    background: url(/assets/image/common/bg_radio_on.png) center left 0 no-repeat;
}

input[type="radio"] + label {
    position: relative;
    padding-left: 30px;
    font-size: 1.6em;
    color: #000000;
    cursor: pointer;
}

input[type="radio"] + label:after {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    content: '';
    width: 20px;
    height: 20px;
    background: url(/assets/image/common/bg_radio_off.png) center left 0 no-repeat;
}

.chk_table input[type="checkbox"] + label::after {
    left: 50%;
    transform: translate(-50%, -50%);
    padding-left: 0;
}


/* Smartphones (portrait and landscape) */
@media only screen and (min-device-width : 320px) {
    body {
        -webkit-text-size-adjust: none;
    }
}

/* Smartphones (landscape) */
@media only screen and (min-width : 321px) {
    /* Styles */
}

/* Smartphones (portrait) */
@media only screen and (max-width : 320px) {
    /* Styles */
}

/* iPads (portrait and landscape) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

    /* paging */
    /* Styles */
}

/* iPads (landscape) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    /* Styles */
}

/* iPads (portrait) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    /* Styles */
}

/* Desktops and laptops */
@media only screen and (min-width : 1025px) {
    /* Styles */
    /* paging */

}

/* Large screens  */
@media only screen and (min-width : 1824px) {
    /* Styles */
}

/* iPhone 4 */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
    /* Styles */
}

/*animation*/
@keyframes menuOpne {
    0% {
        height: 3px;
    }

    50% {
        width: 100%;
        height: 3px;
    }

    100% {
        width: 100%;
        height: 100%;
    }
}

@keyframes menuClose {
    0% {
        width: 100%;
        height: 100%;
    }

    50% {
        width: 100%;
        height: 3px;
    }

    100% {
        width: 0%;
        height: 3px;
    }
}

@keyframes hide {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        display: none;
    }
}

body {}

.clb::after {
    content: "";
    display: block;
    clear: both;
}

#wrap {
    width: 100%;
    min-height: calc(100vh - 60px);
    max-width: 500px;
    margin: auto;
    overflow: hidden;
    position: relative;
    background: #fff;
}

#wrap.splash{
    position: fixed;
    margin: 0 auto;
    left: 0;
    right: 0;
    z-index: 1;
    /* background: linear-gradient(to top, #FF9559, #FF4063); */
}

#wrap.splash .title{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 4.5em;
    font-weight: 700;
    color: #fff;
}

#wrap.bg {
    background: #f5f5f5;
}

#wrap.horizontal{
    max-width: 812px;
    min-height: 375px;
    max-height: 400px;
    /* background: url(/assets/image/common/hori_bg.png) center no-repeat; */
    background-size: cover;
}

#wrap.horizontal.horizontal2{
    /* background: url(/assets/image/common/hori_bg2.png) center no-repeat; */
}

#wrap.horizontal .div_wrap{
    width: calc(100% - 120px);
    margin: auto;
    height: 100%;
}

#metaWrap.metaHorizontal .hori_modal_bg{
    width: 100%;
    height: calc(100% - 60px);
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(20,20,20,0.7);
    border-radius: 30px 30px 0 0;
    display: none;
    z-index: 2;
}

#wrap.horizontal .hori_modal_bg.on{
    display: block;
}

#wrap.nav {
    /* padding-bottom: 80px; */
    min-height: calc(100vh - 70px);
}

#content {
    width: 100%;
    margin: 0 auto;
    font-size: 10px;
}

.div_wrap {
    width: calc(100% - 40px);
    margin: auto;
    position: relative;
}

.div_wrap::after {
    content: "";
    display: block;
    clear: both;
}

.bg_line {
    width: 100%;
    height: 10px;
    background: #F5F5F5;
}

#content .inner.menu {
    padding-top: 60px;
}

#content .inner.bk {
    background: #F5F5F5;
    padding: 20px 0;
}

#content::after {
    content: "";
    display: block;
    clear: both;
}

.next_btn {
    width: calc(100% - 40px);
    margin : 0 auto 95px auto;
    height: 60px;
    line-height: 60px;
    border-radius: 30px;
    font-size: 1.6em;
    font-weight: 500;
    color: #fff;
    border: none;
    cursor: pointer;
}

.next_btn:disabled {
    background: #DDDDDD;
    color: #B8B8B8;
    cursor: unset;
}

.submit_btn {
    width: 100%;
    max-width: 460px;
    height: 60px;
    line-height: 60px;
    border-radius: 30px;
    font-size: 1.6em;
    font-weight: 500;
    color: #fff;
    border: none;
    cursor: pointer;
    margin-top: 60px;
    margin-bottom: 35px;
    display: block;
    text-align: center;
}

.submit_btn.fix{
    width: calc(100% - 40px);
    position: fixed;
    left: 50%;
    bottom: 35px;
    transform: translate(-50%,0);
    margin: 0;
}

.submit_btn + .submit_btn{
    margin-top: 16px;
}

.submit_btn.line {
    background: none;
    color: #FF5A47;
    border: 1px solid #FF5A47;
    box-sizing: border-box;
}

.submit_btn:disabled {
    background: #DDDDDD;
    color: #B8B8B8 !important;
    cursor: unset;
}

.submit_btn.check span {
    padding-left: 32px;
    background: url(/assets/image/common/btn_check.png) center left 0 no-repeat;
    color: #fff;
}
/* 
#nav {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 80px;
    background: #fff;
    max-width: 500px;
    z-index: 1;
} */
#nav {
	position: fixed;
    bottom: 0;
    width: 100%;
    height: 55px;
    padding-bottom: 1rem;
    background: #fff;
    max-width: 500px;
    z-index: 1;
}
.nav_wrap {
    width: calc(100% - 40px);
    margin: 18px auto 0 auto;
    display: flex;
    justify-content: space-between;
}

.nav_wrap button {
    font-size: 11px;
    color: #C2C7CE;
    padding-top: 28px;
    width: 30%;
}

.nav_wrap button.on {
    color: #FF5A47;
}

.nav_wrap button.home {
    background: url(/assets/image/common/home.png) top 0 center no-repeat;
}

.nav_wrap button.home.on {
    background: url(/assets/image/common/home_on.svg) top 0 center no-repeat;
}

.nav_wrap button.daily {
    display: inline-block;
    background: url(/assets/image/common/daily.svg) top 0 center no-repeat;
}

.nav_wrap button.daily.on {
    background: url(/assets/image/common/daily_on.png) top 0 center no-repeat;
}

.nav_wrap button.report {
    background: url(/assets/image/common/report.svg) top 0 center no-repeat;
}

.nav_wrap button.report.on {
    background: url(/assets/image/common/report_on.png) top 0 center no-repeat;
}

.dp:before {
    background: #23D0B5 !important;
}

.dp-selected:hover,
.dp-selected:focus,
.dp-selected {
    background: #23D0B5 !important;
}

.dp-day:hover,
.dp-month:hover,
.dp-year:hover,
.dp-current:focus,
.dp-current,
.dp-day:focus,
.dp-month:focus,
.dp-year:focus {
    background: #23D0B5 !important;
}

.dp-close:hover,
.dp-close:focus,
.dp-clear:hover,
.dp-clear:focus,
.dp-today:hover,
.dp-today:focus,
.dp-next:hover,
.dp-next:focus,
.dp-prev:hover,
.dp-prev:focus,
.dp-cal-month:focus,
.dp-cal-month:hover,
.dp-cal-year:hover,
.dp-cal-year:focus {
    background: #23D0B5 !important;
}

.dp-day-today:after {
    border: 7px solid #1FA691 !important;
    border-bottom-color: transparent !important;
    border-left-color: transparent !important;
}

select{
    width: 35%;
    height: 58px;
    line-height: 58px;
    border-radius: 10px;
    text-indent: 16px;
    background: url(/assets/image/common/select_arrow2.png) center right 16px no-repeat;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
    color: #000000;
    font-size: 1.6em;
    font-weight: 500;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

.horizontal input[type="text"],
.horizontal input[type="password"]{
    height: 50px;
    line-height: 50px;
}

input[type="text"],
input[type="password"],
input[type="date"] {
    width: 100%;
    height: 58px;
    line-height: 58px;
    border-radius: 10px;
    text-indent: 16px;
    background: #fff;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
    color: #000000;
    font-size: 1.6em;
    font-weight: 500;
}

input[type="text"]::placeholder,
input[type="password"]::placeholder{
    color: #D0D0D2;
}

input[type="text"]:focus,
input[type="password"]:focus {
    border: 1px solid #FF5A47;
    outline: none;
}

input[type="password"] {
    letter-spacing: 3px;
}

input[type="password"]::placeholder {
    letter-spacing: 0;
}

input[type="text"].bg {
    background: #F5F5F5;
    border: none;
}

input[type="text"]:disabled,
input[type="password"]:disabled {
    background: #F8F8F8;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
}

.horizontal textarea{
    display: block;
    width: 100%;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
    border-radius: 10px;
    resize: none;
    height: 140px;
    padding: 13px 16px;
    font-size: 1.6em;
}

.horizontal textarea::placeholder{
    color: #D0D0D2;
}

.horizontal textarea:focus{
    border: 1px solid #FF5A47;
    outline: none;
}

input[type="file"] {
    text-indent: -9999px;
    position: absolute;
    top: 0;
    left: 0;
}

.input_date {
    width: 32% !important;
    height: 38px;
    line-height: 38px;
    background: #2C2E36;
    border-radius: 4px;
    border: none;
    text-indent: 10px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    vertical-align: middle;
}

.input_date::-webkit-calendar-picker-indicator {
    filter: invert(1);
}


input:disabled,
textarea:disabled,
select:disabled {
    color: #7C7C7C !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

.input_date.start:before {
    color: lightgrey;
    content: "시작일" !important;
    margin-left: 10px;
    margin-right: 40px;
}

.input_date.end:before {
    color: lightgrey;
    content: "종료일" !important;
    margin-left: 10px;
    margin-right: 40px;
}

.tab_btn {
    cursor: pointer;
}

.tab_btn.on {
    background: #333;
}

.input_date.off::before {
    content: "" !important;
    margin-right: 0;
}

.input_div .input_div_btn {
    position: absolute;
    top: 50%;
    right: 5%;
    transform: translate(0, -50%);
    width: 74px;
    height: 30px;
    line-height: 30px;
    color: #23D0B5;
    border-radius: 4px;
    background: rgba(43, 43, 46, 0.8);
    text-align: center;
    font-size: 11px;
}

.input_div .input_div_btn.red {
    background: #2C2E36;
}

.input_div .input_div_btn.normal {
    color: #fff;
}

.input_div .input_div_btn.left {
    right: unset;
    left: calc(5% + 145px);
}

.input_div .input_div_btn.widAuto {
    width: auto;
    padding: 0 10px;
}

.input_div .text_info {
    font-size: 14px;
    color: #fff;
    text-align: center;
    width: 85%;
    margin: 30px auto 0 auto;
}

.input_div .red_txt {
    position: absolute;
    top: 50%;
    left: 5%;
    transform: translate(0, -50%);
    font-size: 15px;
    color: #C12E55;
}

.red_btn {
    width: auto;
    height: 40px;
    line-height: 40px;
    text-align: center;
    display: inline-block;
    border-radius: 4px;
    padding: 0 15px;
    float: right;
    background: rgba(44, 46, 54, 0.8);
    color: #FF067C;
    font-size: 15px;
}

.date_select {
    display: block;
    margin: 20px auto 0 auto;
    text-align: center;
}

.date_select > a {
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 22px;
}

.date_select span {
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    display: inline-block;
    vertical-align: middle;
    margin: 16px;
}

.alert_box {
    width: calc(100% - 40px);
    max-width: 460px;
    height: auto;
    padding-bottom: 16px;
    background: #FFFFFF;
    border-radius: 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    text-align: center;
    display: none;
}

.alert_box.on{
    display: block;
    position: fixed;
}

.alert_box.calendar{
    position: fixed;
}

.alert_box.calendar.on{
    display: block;
}

.alert_box.calendar.on{
    display: block;
}

.alert_box .title {
    height: 48px;
    line-height: 48px;
    border-bottom: 1px solid #F4F4F4;
    box-sizing: border-box;
    font-size: 1.6em;
    font-weight: 500;
}


.alert_box .alert_banner{
    text-align: left;
    text-indent: 16px;
    height: 84px;
    background: url(/assets/images/main/alert_banner.png) 0 no-repeat;
    background-size: cover;
    border-radius: 15px 15px 0 0;
}

.alert_box .alert_banner .sub{
    padding-top: 20px;
    font-size: 11px;
    color: #000;
}

.alert_box .alert_banner .tit{
    font-size: 2em;
    color: #000;
    font-weight: 400;
}

.alert_box .alert_text {
    margin: 30px 0;
}

.horizontal .alert_box .alert_text{
    margin: 30px 0 20px 0;
}

.alert_box .alert_text p {
    font-size: 1.6em;
    color: #000;
    text-align: center;
    margin: auto;
    width: 90%;
}


.alert_box .alert_text p.msg {
    font-size: 1.2em;
    color:#676767;
}

.alert_box .alert_text .sub{
    font-size: 12px;
    margin-top: 8px;
    display: block;
}

.alert_box .alert_text .list{
    text-align: left;
    width: calc(100% - 60px);
    margin: 20px auto 0 auto;
}

.alert_box .alert_text .list li{
    position: relative;
    padding-left: 14px;
    font-size: 1.2em;
    color: #000;
    margin-bottom: 8px;
    word-break: keep-all;
}

.alert_box .alert_text .list li:last-child{
    margin-bottom: 0;
}

.alert_box .alert_text .list li::before{
    content: "";
    display: block;
    width: 5px;
    height: 1px;
    background: #000;
    position: absolute;
    top: 10px;
    left: 0;
}

.alert_box .input_wrap{
    width: calc(100% - 32px);
    margin: 0 auto 30px auto;
    position: relative;
}

.alert_box .input_wrap::after{
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(/assets/image/common/input_edit.png) 0 no-repeat;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(0,-50%);
}

.alert_box .input_wrap.none::after{
    display: none;
}

.alert_box .input_wrap input::placeholder{
    font-weight: 400;
}

.alert_box .confirm {
    width: calc(100% - 32px);
    margin: auto;
    height: 50px;
    line-height: 50px;
    border-radius: 8px;
    color: #fff;
    font-size: 1.6em;
}

.alert_box .btn_wrap {
    width: calc(100% - 32px);
    margin: auto;
}

.alert_box .btn_wrap::after {
    content: "";
    display: block;
    clear: both;
}

.alert_box .btn_wrap.full button{
    width: 100%;
    float: unset;
    margin-left: 0;
}

.alert_box .btn_wrap.full button + button{
    margin-top: 12px;
}

.alert_box .btn_wrap button {
    width: calc(50% - 5px);
    float: left;
    height: 50px;
    line-height: 48px;
    text-align: center;
    display: block;
    border-radius: 8px;
    color: #A6A5A5;
    border: 1px solid #DDDDDD;
    box-sizing: border-box;
    background: #fff;
    font-size: 1.6em;
}

.alert_box .btn_wrap button + button {
    margin-left: 10px;
}

.alert_box .btn_wrap button.confirm {
    color: #fff;
    background: #FF5A47;
}

.alert_box .alert_title{
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 1.6em;
    font-weight: 600;
    color: #000;
    border-bottom: 1px solid #F4F4F4;
    box-sizing: border-box;
}

.alert_box .textarea{
    margin: 16px auto;
    width: calc(100% - 32px);
}

.alert_box .textarea textarea{
    width: 100%;
    height: 140px;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
    border-radius: 10px;
    resize: none;
    padding: 12px;
    font-size: 1.2em;
}

.alert_box .textarea textarea::placeholder{
    color: #D0D0D2;
}

/* .alert_box .date{
    display: inline-block;
    text-align: center;
    margin: 20px 0;
    padding: 0 30px;
    height: 40px;
    line-height: 40px;
    background: #FF5A47;
    color: #fff;
    font-size: 1.6em;
    font-weight: 500;
    border-radius: 10px;
} */


.filebox .upload-name {
    display: block;
    width: 100%;
    height: 58px;
    background: #fff;
    border: 1px solid #EEEEEE;
    box-sizing: border-box;
    /* label의 패딩값과 일치 */
    font-size: inherit;
    font-family: inherit;
    line-height: normal;
    vertical-align: middle;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    appearance: none;
    font-size: 14px;
    text-indent: 10px;
    border-radius: 10px;
}

.filebox .upload-name:disabled {
    color: #000;
}

.filebox .upload-name::placeholder {
    color: #D0D0D2 !important;
}

.filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.filebox {
    position: relative;
}

.filebox + label {
    display: block;
    cursor: pointer;
    height: 58px;
    position: absolute;
    bottom: 0;
    width: 100%;
    background: url(/assets/image/common/file_icon.png) center right 16px no-repeat;
}

.day_of_week::after {
    content: "";
    display: block;
    clear: both;
}

.day_of_week a {
    width: 13%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 6px;
    background: #2C2C2E;
    color: #fff;
    display: inline-block;
    float: left;
    margin-right: 1.5%;
    font-size: 13px;
}

.day_of_week a:last-child {
    margin-right: 0;
}

.day_of_week a.on {
    background: #23D0B5;
    color: #222127;
}

.hypen {
    text-align: center;
    color: #fff;
    font-size: 13px;
    display: inline-block;
}

.sub_depth_menu {
    width: 90%;
    margin: 0 auto 20px auto;
}

.sub_depth_menu a {
    display: inline-block;
    margin-right: 20px;
    font-size: 12px;
    color: #fff;
}

.sub_depth_menu a.on {
    height: 26px;
    line-height: 26px;
    text-align: center;
    background: #2B2B2E;
    border-radius: 4px;
    display: inline-block;
    color: #23D0B5;
    padding: 0 10px;
}

.slot_div {
    width: 90%;
    margin: auto;
    text-align: center;
}

.slot_div::after {
    content: "";
    display: block;
    clear: both;
}

.slot_div > div {
    width: 31%;
    margin-right: 3.5%;
    float: left;
    background: #2C2C2E;
    border-radius: 6px;
    padding: 12px 0;
    margin-bottom: 10px;
}

.slot_div > div:hover {
    background: #2C2E36;
}

.slot_div > div.red {
    background: #C12E55;
}

.slot_div > div.red:hover {
    background: #AA2246;
}

.slot_div > div p {
    color: #fff;
    font-size: 12px;
}

.slot_div > div .number {
    color: rgba(225, 228, 240, 0.2);
}

.slot_div > div p {
    margin-bottom: 5px;
}

.slot_div > div p:last-child {
    margin-bottom: 0;
}

.slot_div > div:nth-child(3n) {
    margin-right: 0;
}

.blue {
    color: #30B0D6;
}

.red {
    color: #C12E55;
}

.input_chk_area {
    width: 90%;
    margin: auto;
}

.input_chk_area::after {
    content: "";
    display: block;
    clear: both;
}

.input_chk_area > div {
    float: left;
    margin-right: 18px;
}

.input_chk_area > div:last-child {
    margin-right: 0;
}

.input_chk_area > div label {
    font-size: 16px;
}

.day_btn_area {
    width: 90%;
    margin: 0 auto 10px auto;
}

.day_btn_area::after {
    content: "";
    display: block;
    clear: both;
}

.day_btn_area > a {
    display: inline-block;
    float: left;
    font-size: 12px;
    width: 24%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    border-radius: 6px;
    background: #2C2E36;
    margin-right: 1.3333%;
}

.day_btn_area > a.on {
    color: #23D0B5;
    background: #202028;
}

.day_btn_area > a:last-child {
    margin-right: 0;
}

.day_btn_area.btn_3 {
    margin-top: 20px;
}

.day_btn_area.btn_3 > a {
    width: 32%;
    margin-right: 2%;
}

.day_btn_area.btn_3 > a:last-child {
    margin-right: 0;
}

.battery_wrap {
    border-bottom: 1px solid #444447;
    box-sizing: border-box;
}

.battery_list {
    height: 75px;
    border-top: 1px solid #444447;
    box-sizing: border-box;
}

.battery_list .date {
    float: left;
    width: 20%;
    text-align: center;
    line-height: 75px;
}

.battery_list .date p {
    font-size: 11px;
    color: #fff;
}

.battery_list .battery_graph {
    float: right;
    width: 80%;
}

.battery_list p,
.battery_list p span {
    color: #fff;
    font-size: 11px;
}

.battery_top {
    margin-top: 15px;
}

.battery_top::after {
    content: "";
    display: block;
    clear: both;
}

.battery_top .won,
.battery_top .bp {
    float: left;
}

.battery_bottom p {
    float: left;
}

.battery_top .total {
    float: right;
    margin-right: 5px;
}

.battery_top > p:nth-child(2),
.battery_bottom > p:nth-child(2) {
    margin-left: 20px;
}

.battery_top .won,
.battery_bottom .rental {
    margin-left: 5px;
}

.graph_box {
    width: 100%;
    margin: 4px auto;
    height: 9px;
}

.graph_box .graph_left {
    background: #FF067C;
    border-radius: 4px;
    height: 100%;
    float: left;
}

.graph_box .graph_right {
    background: #00CCF2;
    border-radius: 4px;
    height: 100%;
    float: right;
}

.controll_btn {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    height: 30px;
    line-height: 30px;
    border-radius: 6px;
    overflow: hidden;
}

.controll_btn > a {
    font-size: 16px;
    font-weight: 700;
    color: #23D0B5;
    display: inline-block;
    background: #202028;
    width: 50%;
    float: left;
    text-align: center;
}

.controll_btn > a:hover {
    background: #121219;
}

.controll_btn > a.minus {
    font-size: 22px;
}

.table_btn_wrap > a:last-child {
    margin-bottom: 0;
}

.table_btn {
    width: 56px;
    height: 26px;
    line-height: 26px;
    font-size: 11px;
    border-radius: 4px;
    background: #2B2B2E;
    display: block;
    margin: 0 auto 10px auto;
}

.option_select_box {
    width: 90%;
    margin: 40px auto 0 auto;
}

.option_select_box .option_box {
    background: #2C2E36;
    border-radius: 6px;
    padding: 10px;
    overflow: hidden;
    margin-bottom: 20px;
}

.tit_option_box {
    margin-bottom: 10px;
}

.tit_option_box label {
    font-size: 14px !important;
}

.con_option_box .list label {
    font-size: 12px !important;
}

.con_option_box .list {
    width: calc(50% - 12px);
    float: left;
    display: block;
    padding-left: 12px;
    margin-bottom: 8px;
}

#footer .copyright {
    position: absolute;
    bottom: 60px;
    left: 50%;
    transform: translate(-50%, 0);
    color: rgba(255, 255, 255, 0.4);
    font-size: 11px;
    font-weight: 300;
    text-align: center;
}
