.btn {
	display: inline-block; cursor: pointer;
	font-weight: 400; font-size: 15px; line-height: 1.5em; text-align: center;
	background-color: transparent; color: #212529;
	border: 1px solid transparent; border-radius: 0.25rem;
	vertical-align: middle; padding: 0.375rem 0.75rem;
	-webkit-user-select:none;
	-moz-user-select:	none;
	-ms-user-select:	none;
	user-select:		none;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.btn-info       { background-color: #17a2b8 !important; border: 1px solid #17a2b8 !important; color: #fff !important; box-shadow: none !important; }
.btn-primary    { background-color: #007bff !important; border: 1px solid #007bff !important; color: #fff !important; box-shadow: none !important; }
.btn-warning    { background-color: #ffc107 !important; border: 1px solid #ffc107 !important; color: #1f2d3d !important; box-shadow: none !important; }
.btn-danger     { background-color: #dc3545 !important; border: 1px solid #dc3545 !important; color: #fff !important; box-shadow: none !important; }
.btn-purple     { background-color: #a855f7 !important; border: 1px solid #a855f7 !important; color: #fff !important; box-shadow: none !important; }
.btn-success    { background-color: #28a745 !important; border: 1px solid #28a745 !important; color: #fff !important; box-shadow: none !important; }
.btn-dark       { background-color: #1d3338 !important; border: 1px solid #1d3338 !important; color: #fff !important; box-shadow: none !important; }
.btn-point      { background-color: var(--point-main) !important; border: 1px solid var(--point-main) !important; color: #fff !important; box-shadow: none !important; }


.btn-grey,
.btn-grey:link,
.btn-grey:visited {
    color: #fff;
    border: 1px solid #53565c; border-bottom-color: #4a4e53;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.04); text-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    background: #5c6066;
    background: linear-gradient(to bottom, #666b70 40%, #5c6066 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbbfc5', endColorstr='#b0b6bd', GradientType=0);
}
.btn-grey:focus,
.btn-grey:hover {
    border: 1px solid #44474c;
    background: #4d5056;
    background: linear-gradient(to bottom, #565a5f 0%, #4d5056 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#adb2b9', endColorstr='#a6acb3', GradientType=0);
}
.btn-grey:active,
.btn-grey.-active {
    color: #bbb;
    border: 1px solid #44474c;
    background: #4d5056;
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.07);
}

.btn-lgrey,
.btn-lgrey:link,
.btn-lgrey:visited {
    color: #333;
    border: 1px solid #d3d4d6;
    border-bottom-color: #ccced0;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.04);
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    background: #e6e7e9;
    background: linear-gradient(to bottom, #e6e7e9 40%, #e0e2e4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6e7e9', endColorstr='#e0e2e4', GradientType=0);
}
.btn-lgrey:focus,
.btn-lgrey:hover {
    border: 1px solid #d4d5d8;
    background: #dcdee0;
    background: linear-gradient(to bottom, #dcdee0 0%, #d9dadc 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dcdee0', endColorstr='#d9dadc', GradientType=0);
}
.btn-lgrey:active,
.btn-lgrey.-active {
    color: #333;
    border: 1px solid #d4d5d8;
    background: #dcdee0;
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.07);
}

.btn-black,
.btn-black:link,
.btn-black:visited {
    color: #fff;
    border: 1px solid #131719;
    border-bottom-color: #0c0f10;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.04);
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    background: #1e2427;
    background: linear-gradient(to bottom, #262c2f 100%, #1e2427 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#26353e', endColorstr='#26353e', GradientType=0);
}

.btn-black:focus,
.btn-black:hover {
    border: 1px solid #272f32;
    background: #323b3f;
    background: linear-gradient(to bottom, #3c4549 0%, #323b3f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#374954', endColorstr='#374954', GradientType=0);
}

.btn-black:active,
.btn-black.-active {
    color: #ddd;
    border: 1px solid #272f32;
    background: #323b3f;
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.07);
}

.btn-white,
.btn-white:link,
.btn-white:visited {
    color: #555;
    border: 1px solid #ebebeb;
    border-bottom-color: #c6c6c6;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.04);
    text-shadow: 0 0 2px rgba(255, 255, 255, 1);
    background: #fff;
    background: linear-gradient(to bottom, #ffffff 40%, #f6f6f6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0);
}
.btn-white:focus,
.btn-white:hover {
    background: #fff;
    background: linear-gradient(to bottom, #fafafa 0%, #fff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fafafa', endColorstr='#ffffff', GradientType=0);
}
.btn-white:active,
.btn-white.-active {
    color: #9298a1;
    text-shadow: 0 1px 0px #fff;
    border-color: #ebebeb;
    border-top-color: #ddd;
    background: #f4f4f4;
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.04);
}

.btn-xs { font-size: .8rem !important; padding: 0.188rem 0.38rem; }
.btn-xsm { font-size: .6rem !important; padding: 0.188rem 0.38rem; }

.form-control {
	display: block; width: calc(100% - 1.5rem); height: 1.8rem;
    padding: 0.375rem 0.75rem;
    font-size: 1rem; font-weight: 400; line-height: 1.5;
    color: #495057; background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da; border-radius: 0.25rem;
    box-shadow: inset 0 0 0 transparent;
    outline: none;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
input.form-control {
	width: calc(100% - 1.5rem);
}

.txt-point { color: var(--point-main) !important; }
.txt-info { color: #17a2b8 !important; }
.txt-primary { color: #007bff !important; }
.txt-warning { color: #ffc107 !important; }
.txt-danger { color: #dc3545 !important; }
.txt-blue { color: #3498db !important; }
.txt-yellow { color: #ffe400 !important; }
.txt-grey { color: #999 !important; }

.nodata-txt { text-align: center; font-size: 16px; color: #a00; }
.ellipsis { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.decoration { display: block !important; clear: both !important; height: 15px !important; }

.division-line {
	position: relative; margin: 0 auto 30px;
    clear: both; width: 100%; height: 29px;
    border-bottom: 1px solid #ccc;
}
.division-line:before {
	content: 'or'; position: absolute; bottom: 0; left: 50%;
    -webkit-transform:  translate(-50%, 50%);
    -moz-transform:     translate(-50%, 50%);
    -ms-transform:      translate(-50%, 50%);
    -o-transform:       translate(-50%, 50%);
    transform:          translate(-50%, 50%);
    padding: 0 10px;
    background-color: #fff; color: #bbb;
}

.line-title {
    position: relative; padding: 10px; text-align: center;
}
.line-title:before,
.line-title:after {
    position: absolute; top: 50%;
    content: ''; display: block; width: calc(50% - 100px);
    border-bottom: 1px solid var(--color-line);
}
.line-title:before { left: 0; }
.line-title:after { right: 0; }
.line-title span { display: block; text-align: center; }

/* image button */
.sign-kakao-btn {
    position: relative;
    width: 100%; height: 40px; line-height: 32px;
    color: #280a0c; text-align: center;
    background-color: #feda30; border-radius: 3px; border: 1px solid #ffe932;
    letter-spacing: -0.1em;
    -webkit-box-shadow: 1px 2px 5px rgba(32, 7, 9, .4);
    -moz-box-shadow:    1px 2px 5px rgba(32, 7, 9, .4);
    box-shadow:         1px 2px 5px rgba(32, 7, 9, .4);
}
.sign-kakao-btn i {
    width: 42px; height: 38px; display: inline-block;
    position: absolute; top: 0; left: 0;
    background-image: url('/resource/images/icons/icon-kakao-square.jpg?v=7');
}
.sign-naver-btn {
    position: relative;
    width: 100%; height: 40px; line-height: 32px;
    color: #fff; text-align: center;
    background-color: #61c457; border-radius: 3px; border: 1px solid #4fbe3c;
    letter-spacing: -0.1em;
    -webkit-box-shadow: 1px 2px 5px rgba(32, 7, 9, .4);
    -moz-box-shadow:    1px 2px 5px rgba(32, 7, 9, .4);
    box-shadow:         1px 2px 5px rgba(32, 7, 9, .4);
}
.sign-naver-btn i {
    width: 42px; height: 38px; display: inline-block;
    position: absolute; top: 0; left: 0;
    background-image: url('/resource/images/icons/icon-naver-square.jpg?v=7');
}

.-spring_x {
    -webkit-transition: all .3s ease; transition: all .3s ease;
    animation-name: spring_x; animation-duration: 3.5s; animation-iteration-count: infinite; animation-timing-function: ease; animation-direction: normal;
    -webkit-animation-name: spring_x; -webkit-animation-duration: 3.5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease; -webkit-animation-direction: normal;
}
@keyframes spring_x {
    0% {
        transform: translate(0px, 0px)
    }
    80% {
        transform: translate(0px, 0px)
    }
    85% {
        transform: translate(4px, 0px)
    }
    90% {
        transform: translate(0px, 0px)
    }
    95% {
        transform: translate(4px, 0px)
    }
    100% {
        transform: translate(0px, 0px)
    }
}
@-webkit-keyframes spring_x {
    0% {
        transform: translate(0px, 0px)
    }
    80% {
        transform: translate(0px, 0px)
    }
    85% {
        transform: translate(0px, 4px)
    }
    90% {
        transform: translate(0px, 0px)
    }
    95% {
        transform: translate(0px, 4px)
    }
    100% {
        transform: translate(0px, 0px)
    }
}

.-spring_y {
    -webkit-transition: all .3s ease; transition: all .3s ease;
    animation-name: spring_y; animation-duration: 3.5s; animation-iteration-count: infinite; animation-timing-function: ease; animation-direction: normal;
    -webkit-animation-name: spring_y; -webkit-animation-duration: 3.5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease; -webkit-animation-direction: normal;
}
@keyframes spring_y {
    0% {
        transform: translate(0px, 0px)
    }
    80% {
        transform: translate(0px, 0px)
    }
    85% {
        transform: translate(0px, 4px)
    }
    90% {
        transform: translate(0px, 0px)
    }
    95% {
        transform: translate(0px, 4px)
    }
    100% {
        transform: translate(0px, 0px)
    }
}
@-webkit-keyframes spring_y {
    0% {
        transform: translate(0px, 0px)
    }
    80% {
        transform: translate(0px, 0px)
    }
    85% {
        transform: translate(0px, 4px)
    }
    90% {
        transform: translate(0px, 0px)
    }
    95% {
        transform: translate(0px, 4px)
    }
    100% {
        transform: translate(0px, 0px)
    }
}

.user-level {display: none !important;
    position: relative; top: 4px;
    display: inline-block; width: 18px; height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px;
}

.user-level.level-1 { background-image: url(/resource/images/icons/level/1.png?v=7); }
.user-level.level-2 { background-image: url(/resource/images/icons/level/2.png?v=7); }
.user-level.level-3 { background-image: url(/resource/images/icons/level/3.png?v=7); }
.user-level.level-4 { background-image: url(/resource/images/icons/level/4.png?v=7); }
.user-level.level-5 { background-image: url(/resource/images/icons/level/5.png?v=7); }
.user-level.level-6 { background-image: url(/resource/images/icons/level/6.png?v=7); }
.user-level.level-7 { background-image: url(/resource/images/icons/level/7.png?v=7); }
.user-level.level-8 { background-image: url(/resource/images/icons/level/8.png?v=7); }
.user-level.level-9 { background-image: url(/resource/images/icons/level/9.png?v=7); }
.user-level.level-10 { background-image: url(/resource/images/icons/level/10.png?v=7); }
.user-level.level-11 { background-image: url(/resource/images/icons/level/11.png?v=7); }
.user-level.level-12 { background-image: url(/resource/images/icons/level/12.png?v=7); }
.user-level.level-13 { background-image: url(/resource/images/icons/level/13.png?v=7); }
.user-level.level-14 { background-image: url(/resource/images/icons/level/14.png?v=7); }
.user-level.level-15 { background-image: url(/resource/images/icons/level/15.png?v=7); }
.user-level.level-16 { background-image: url(/resource/images/icons/level/16.png?v=7); }
.user-level.level-17 { background-image: url(/resource/images/icons/level/17.png?v=7); }
.user-level.level-18 { background-image: url(/resource/images/icons/level/18.png?v=7); }
.user-level.level-19 { background-image: url(/resource/images/icons/level/19.png?v=7); }
.user-level.level-20 { background-image: url(/resource/images/icons/level/20.png?v=7); }
.user-level.level-21 { background-image: url(/resource/images/icons/level/21.png?v=7); }
.user-level.level-22 { background-image: url(/resource/images/icons/level/22.png?v=7); }
.user-level.level-23 { background-image: url(/resource/images/icons/level/23.png?v=7); }
.user-level.level-24 { background-image: url(/resource/images/icons/level/24.png?v=7); }
.user-level.level-25 { background-image: url(/resource/images/icons/level/25.png?v=7); }
.user-level.level-26 { background-image: url(/resource/images/icons/level/26.png?v=7); }
.user-level.level-27 { background-image: url(/resource/images/icons/level/27.png?v=7); }
.user-level.level-28 { background-image: url(/resource/images/icons/level/28.png?v=7); }
.user-level.level-29 { background-image: url(/resource/images/icons/level/29.png?v=7); }
.user-level.level-30 { background-image: url(/resource/images/icons/level/30.png?v=7); }
.user-level.level-31 { background-image: url(/resource/images/icons/level/31.png?v=7); }
.user-level.level-32 { background-image: url(/resource/images/icons/level/32.png?v=7); }
.user-level.level-33 { background-image: url(/resource/images/icons/level/33.png?v=7); }
.user-level.level-34 { background-image: url(/resource/images/icons/level/34.png?v=7); }
.user-level.level-35 { background-image: url(/resource/images/icons/level/35.png?v=7); }
.user-level.level-36 { background-image: url(/resource/images/icons/level/36.png?v=7); }
.user-level.level-37 { background-image: url(/resource/images/icons/level/37.png?v=7); }
.user-level.level-38 { background-image: url(/resource/images/icons/level/38.png?v=7); }
.user-level.level-39 { background-image: url(/resource/images/icons/level/39.png?v=7); }
.user-level.level-40 { background-image: url(/resource/images/icons/level/40.png?v=7); }
.user-level.level-41 { background-image: url(/resource/images/icons/level/41.png?v=7); }
.user-level.level-42 { background-image: url(/resource/images/icons/level/42.png?v=7); }
.user-level.level-43 { background-image: url(/resource/images/icons/level/43.png?v=7); }
.user-level.level-44 { background-image: url(/resource/images/icons/level/44.png?v=7); }
.user-level.level-45 { background-image: url(/resource/images/icons/level/45.png?v=7); }
.user-level.level-46 { background-image: url(/resource/images/icons/level/46.png?v=7); }
.user-level.level-47 { background-image: url(/resource/images/icons/level/47.png?v=7); }
.user-level.level-48 { background-image: url(/resource/images/icons/level/48.png?v=7); }
.user-level.level-49 { background-image: url(/resource/images/icons/level/49.png?v=7); }
.user-level.level-50 { background-image: url(/resource/images/icons/level/50.png?v=7); }
.user-level.level-51 { background-image: url(/resource/images/icons/level/51.png?v=7); }
.user-level.level-52 { background-image: url(/resource/images/icons/level/52.png?v=7); }
.user-level.level-53 { background-image: url(/resource/images/icons/level/53.png?v=7); }
.user-level.level-54 { background-image: url(/resource/images/icons/level/54.png?v=7); }
.user-level.level-55 { background-image: url(/resource/images/icons/level/55.png?v=7); }
.user-level.level-56 { background-image: url(/resource/images/icons/level/56.png?v=7); }
.user-level.level-57 { background-image: url(/resource/images/icons/level/57.png?v=7); }
.user-level.level-58 { background-image: url(/resource/images/icons/level/58.png?v=7); }
.user-level.level-59 { background-image: url(/resource/images/icons/level/59.png?v=7); }
.user-level.level-60 { background-image: url(/resource/images/icons/level/60.png?v=7); }
.user-level.level-61 { background-image: url(/resource/images/icons/level/61.png?v=7); }
.user-level.level-62 { background-image: url(/resource/images/icons/level/62.png?v=7); }
.user-level.level-63 { background-image: url(/resource/images/icons/level/63.png?v=7); }
.user-level.level-64 { background-image: url(/resource/images/icons/level/64.png?v=7); }
.user-level.level-65 { background-image: url(/resource/images/icons/level/65.png?v=7); }
.user-level.level-66 { background-image: url(/resource/images/icons/level/66.png?v=7); }
.user-level.level-67 { background-image: url(/resource/images/icons/level/67.png?v=7); }
.user-level.level-68 { background-image: url(/resource/images/icons/level/68.png?v=7); }
.user-level.level-69 { background-image: url(/resource/images/icons/level/69.png?v=7); }
.user-level.level-70 { background-image: url(/resource/images/icons/level/70.png?v=7); }
.user-level.level-71 { background-image: url(/resource/images/icons/level/71.png?v=7); }
.user-level.level-72 { background-image: url(/resource/images/icons/level/72.png?v=7); }
.user-level.level-73 { background-image: url(/resource/images/icons/level/73.png?v=7); }
.user-level.level-74 { background-image: url(/resource/images/icons/level/74.png?v=7); }
.user-level.level-75 { background-image: url(/resource/images/icons/level/75.png?v=7); }
.user-level.level-76 { background-image: url(/resource/images/icons/level/76.png?v=7); }
.user-level.level-77 { background-image: url(/resource/images/icons/level/77.png?v=7); }
.user-level.level-78 { background-image: url(/resource/images/icons/level/78.png?v=7); }
.user-level.level-79 { background-image: url(/resource/images/icons/level/79.png?v=7); }
.user-level.level-80 { background-image: url(/resource/images/icons/level/80.png?v=7); }
.user-level.level-81 { background-image: url(/resource/images/icons/level/81.png?v=7); }
.user-level.level-82 { background-image: url(/resource/images/icons/level/82.png?v=7); }
.user-level.level-83 { background-image: url(/resource/images/icons/level/83.png?v=7); }
.user-level.level-84 { background-image: url(/resource/images/icons/level/84.png?v=7); }
.user-level.level-85 { background-image: url(/resource/images/icons/level/85.png?v=7); }
.user-level.level-86 { background-image: url(/resource/images/icons/level/86.png?v=7); }
.user-level.level-87 { background-image: url(/resource/images/icons/level/87.png?v=7); }
.user-level.level-88 { background-image: url(/resource/images/icons/level/88.png?v=7); }
.user-level.level-89 { background-image: url(/resource/images/icons/level/89.png?v=7); }
.user-level.level-90 { background-image: url(/resource/images/icons/level/90.png?v=7); }
.user-level.level-91 { background-image: url(/resource/images/icons/level/91.png?v=7); }
.user-level.level-92 { background-image: url(/resource/images/icons/level/92.png?v=7); }
.user-level.level-93 { background-image: url(/resource/images/icons/level/93.png?v=7); }
.user-level.level-94 { background-image: url(/resource/images/icons/level/94.png?v=7); }
.user-level.level-95 { background-image: url(/resource/images/icons/level/95.png?v=7); }
.user-level.level-96 { background-image: url(/resource/images/icons/level/96.png?v=7); }
.user-level.level-97 { background-image: url(/resource/images/icons/level/97.png?v=7); }
.user-level.level-98 { background-image: url(/resource/images/icons/level/98.png?v=7); }
.user-level.level-99 { background-image: url(/resource/images/icons/level/99.png?v=7); }
.user-level.level-100 { background-image: url(/resource/images/icons/level/100.png?v=7); }