/* LAYOUT */

.scrollbar-inner { padding-right:0 !important; }

.text-left { text-align:left; }
.text-center { text-align:center; }
.text-right { text-align:right; }

.row { margin-left:-5px; margin-right:-5px; }
.row:after { display:block; content:""; clear:both; }
.col { float:left; padding-left:5px; padding-right:5px; }


.col-12 { float:left; width:100%; padding-left:5px; padding-right:5px; }
.col-9 { float:left; width:75%; padding-left:5px; padding-right:5px; }
.col-8 { float:left; width:66.666%; padding-left:5px; padding-right:5px; }
.col-7 { float:left; width:58.333%; padding-left:5px; padding-right:5px; }
.col-6 { float:left; width:50%; padding-left:5px; padding-right:5px; }
.col-5 { float:left; width:41.666%; padding-left:5px; padding-right:5px; }
.col-4 { float:left; width:33.333%; padding-left:5px; padding-right:5px; }
.col-3 { float:left; width:25%; padding-left:5px; padding-right:5px; }
.col-2 { float:left; width:16.666%; padding-left:5px; padding-right:5px; }


.float-left { float:left; }
.float-right { float:right; }

.clear { display:block; clear:both; }

.wid-auto { width:auto; }

.wid-20 { width:20px !important; }
.wid-30 { width:30px !important; }
.wid-35 { width:35px !important; }
.wid-40 { width:40px !important; }
.wid-45 { width:45px !important; }
.wid-50 { width:50px !important; }
.wid-60 { width:60px !important; }
.wid-70 { width:70px !important; }
.wid-80 { width:80px !important; }
.wid-90 { width:90px !important; }
.wid-100 { width:100px !important; }
.wid-110 { width:110px !important; }
.wid-120 { width:120px !important; }
.wid-130 { width:130px !important; }
.wid-140 { width:140px !important; }
.wid-150 { width:150px !important; }
.wid-200 { width:200px !important; }
.wid-300 { width:300px !important; }
.wid-400 { width:400px !important; }
.wid-500 { width:500px !important; }
.wid-600 { width:600px !important; }
.wid-700 { width:700px !important; }
.wid-800 { width:800px !important; }
.wid-900 { width:900px !important; }
.wid-1000 { width:1000px !important; }
.wid-1100 { width:1100px !important; }
.wid-1200 { width:1200px !important; }
.wid-1300 { width:1300px !important; }
.wid-1400 { width:1400px !important; }
.wid-1500 { width:1500px !important; }
.wid-1600 { width:1600px !important; }
.wid-1700 { width:1700px !important; }
.wid-1800 { width:1800px !important; }


.detail-wrap { position:relative; }
.detail-wrap .detail { display:none; position:absolute; left:0; bottom:100%; width:250px; min-height:110px; padding:10px; background-color:#faf5c9; border:1px solid #afab88;  text-align:left; z-index:1000;}

.detail-wrap .detail.detail-white { background-color:#fff; }
.detail-wrap .detail.detail-lg { width:500px; }

.detail-wrap .detail .detail-clip { position:absolute; right:10px; top:10px; opacity:.5; z-index:27;}


.detail-wrap:hover .detail { display:block; }
.detail-wrap.open .detail { display:block !important; }
.detail-wrap.open .detail .detail-clip { opacity:1; }

.form-transparent { background-color:transparent; border:none; width:100%; height:100%; }
.form-transparent:focus {  }

/* STACK CHART */
.stack-chart { height:16px; border-radius:5px; background-color:#e8e2e2; }
.stack-chart:after { display:block; content:""; clear:both; }
.stack-chart .stack-item { position:relative; float:left; height:100%; line-height:16px; cursor:pointer; text-align:center; color:#fff; font-size:12px; }
.stack-chart .stack-item:last-child { border-top-right-radius:5px; border-bottom-right-radius:5px; }
.stack-chart .stack-item:first-child { border-radius:0; border-top-left-radius:5px; border-bottom-left-radius:5px; }
.stack-chart .stack-item:after { display:block; content:""; width:1px; height:100%; background-color:rgba(255,255,255,.2); }
.stack-chart .stack-item .tool-tip { display:none; position:absolute; left:50%; top:100%; padding:3px 5px; width:80px; margin-left:-30px; text-align:center; background-color:#3e435f; color:#fff; z-index:10; border-radius:5px; font-size:12px; }
.stack-chart .stack-item .tool-tip span { display:block; }

.stack-chart .stack-item .label { display:block; position:absolute; left:100%; top:6px; min-width:80px; padding-left:5px; text-align:center; color:#fff; line-height:1; font-weight:bold; }

.stack-chart label { display:block; cursor:pointer; }
.stack-chart label input { display:none; }

.stack-chart .stack-item:hover .tool-tip { display:inline-block; }

/* BAR CHART */
.bar-chart { position:relative; padding:30px; }
.bar-chart .axis-area { height:100%; }
.bar-chart .axis-area:after { display:block; content:""; clear:both; }
.bar-chart .axis-area .axis { position:relative; float:left; height:100%; width:16.666%; }

.bar-chart .axis-area .axis .label { position:absolute; left:0; bottom:-30px; width:100%; font-size:16px; text-align:center; }
.bar-chart .axis-area .axis .item-list { height:100%; text-align:center; }
.bar-chart .axis-area .axis .item-list:after { display:block; content:""; clear:both; }
.bar-chart .axis-area .axis .item-list .item { position:relative; display:inline-block; width:40px; height:100%; }
.bar-chart .axis-area .axis .item-list .item .bar { position:absolute; left:0; bottom:0; width:100%; cursor:pointer; }
.bar-chart .axis-area .axis .item-list .item .bar .div-bar { display:none; position:absolute; left:0; bottom:0; width:100%; }
.bar-chart .axis-area .axis .item-list .item .bar .div-bar .div-bar-title {display: block;position:absolute;left:100%;top: -30px;font-size:12px;text-align:left;z-index:11;padding: 2px;background-color: rgba(0,0,0,.7);color: #fff;border-radius: 3px;text-align: center;}


.bar-chart .axis-area .axis .item-list .item .bar .inner { display:none; position:absolute; left:100%; bottom:70%; width:200px; z-index:10; background-color:#fff; }
.bar-chart .axis-area .axis .item-list .item .bar:hover .inner { display:block; }

.bar-chart .axis-area .axis .item-list .item .bar-title { position:absolute; left:0; top:-20px; width:100%; font-size:12px; }

.bar-chart .tick-area { position:absolute; left:0; top:0; width:100%; height:100%; padding:30px; }
.bar-chart .tick-area .inner { position:relative; width:100%; height:100%; border-left:1px solid #ddd }
.bar-chart .tick-area .inner .ayis { position:absolute; left:0; width:100%; border-bottom:1px solid #ddd; }
.bar-chart .tick-area .inner .ayis span { position:absolute; left:-25px; top:-10px; }




/* AUTOCOMPLETE */
.ui-autocomplete-category { font-weight:bold; }


/* FORM */

.th-input { width:100%; background-color:transparent; border:none; text-align:center; }

.pointer { cursor:pointer; }

/*
input:focus,select,focus,a:focus,i:focus { outline:#333 solid 2px; }
*/

.form-group { margin-bottom:8px; }

.form-control { display:inline-block; padding:0px 8px; height:24px; line-height:24px; border:1px solid #aab0b8; color:#424549; font-size:14px;  border-radius:3px; max-width:100%; }
input[type=file].form-control { font-size:12px; }
textarea.form-control { font-size:12px; }



.form-control.full { width:100%; }

textarea.form-control { display:block; width:100%; height:52px; }

textarea.apology-form-control {display:block; width:100%; height:245px;}

/* 접수처리 text-area */

textarea.rp-item-form {height:310px}

.no-resize { resize:none; }

input[type=date] { padding:0 2px; width:100px; }
input::-webkit-calendar-picker-indicator{
    width:12px;
	margin:0;
	padding:0;
	padding-top:5px;
}

.input-1 { width:25px; }
.input-2 { width:35px; }
.input-3 { width:45px; }
.input-4 { width:50px; }
.input-5 { width:60px; }

.input-120 { width:120px; }
.input-date { width:120px; }

.label-btn { display:inline-block; cursor:pointer; }
.label-btn .label-chk { display:none; }
.label-btn .btn { cursor:pointer; }

.label-btn-sm .btn { font-size:12px; padding:0 3px; line-height:16px; }

.label-hlt {  }
.label-hlt .label-chk { display:none; }
.label-hlt .label-txt { position:relative; }
.label-hlt .label-txt:after { display:block; content:""; position:absolute; left:0; bottom:0; width:100%; height:3px; background-color:#fc5; z-index:0; opacity:0; }
.label-hlt .label-chk:checked+.label-txt:after { opacity:1; }

/* detail-btn */
.detail-btn { position:relative; }
.detail-btn > .inner { display:none; position:fixed; left:100%; top:-80px; width:360px; min-height:230px; padding:10px; border-radius:10px; border-top-left-radius:0; background-color:#fff; z-index:10; color:#424549; font-size:12px; border:1px solid #d7d9dc; box-shadow: 0px 0px 20px rgba(92,111,139,0.12); text-align:left;  }
.detail-btn > .inner .btn { font-size:12px; }
.detail-btn > .inner.inner-lg { width:500px; }
.detail-btn > .inner.inner-xl { width:600px; }

.detail-btn > .inner.inner-left { bottom:0; left:auto; right:100%; }
.detail-btn > .inner.inner-left .table { margin-bottom:0; }


/* overflow-box */
.overflow-box {  }

/* label-list */
.label-list { margin:0; }
.label-list:after { display:block; content:""; clear:both; }
.label-list .label,.label-list .content { float:left; }
.label-list .label { width:90px; }
.label-list .content { padding-left:5px; width:calc(100% - 90px); }

/* TABLE */
.table { width:100%; border:1px solid #d9d9d9; border-spacing:0; border-collapse:collapse; }
.table thead tr th,.table tbody tr th { background-color:#eaecf2; }
.table tr th,.table tr td { padding:5px; border:1px solid #d9d9d9; }

.table-sm { font-size:12px; }
.table-sm tr th,.table-sm tr td { padding:10px 3px; }
.table-sm .form-control { padding:2px 5px; height:24px; line-height:24px; font-size:12px;  }

.table-xs { font-size:12px; }
.table-xs tr th,.table-xs tr td { padding:2px; }
.table-xs .form-control { padding:2px 5px; height:24px; line-height:24px; font-size:12px;  }

.tbody-striped > tbody:nth-child(odd) { background-color:#f2fbff; }
.tbody-hover tbody:hover {  }

.table-striped tr:nth-child(odd) { background-color:#f2fbff; }
.table-hover tr:hover {  }

.table tr th.focus, .table tr td.focus { background-color:#faffe9; }
.table tr th.focus { background-color:#f2ffc4; }


/* BADGE */
.badge { display:inline-block; padding:2px 8px; height:24px; line-height:24px; background-color:#eaecf2; color:#424549 !important; border-radius:50%; font-size:12px; }
.badge-circle { padding:0; width:24px; text-align:center; }

.badge-basic { background-color:#7f99e2; color:#fff !important; }
.badge-danger { background-color:#f36767; color:#fff !important; }
.badge-primary { background-color:#3f51b5; color:#fff !important; }
.badge-success { background-color:#4caf50; color:#fff !important; }
.badge-mint { background-color:#009688; color:#fff !important; }

.text-basic { color:#7f99e2; }
.text-danger { color:#f36767; }
.text-primary { color:#3f51b5; }
.text-success { color:#4caf50; }
.text-warning { color:#ff9800; }
.text-mint { color:#009688; }

/* CARD */
.card { background-color:#fff; border:1px solid #d7d9dc; box-shadow: 0px 0px 20px rgba(92,111,139,0.30);  border-radius: 5px;}
.card-header { padding:10px; border-bottom: 1px solid #d7d9dc; }
.card-body { padding:10px; position:relative; }

.card-header { font-size:16px; }


/* BUTTONS */
button { border:none; }

.btn { position:relative; display:inline-block; line-height:24px; padding:0 4px; border-radius:3px; text-align:center; font-size:14px; background-color:#fff; font-weight: 500; }

.btn-sm { font-size:12px; }

.btn.disabled { opacity:.5; }

.text-default { color:#eaecf2 !important; }
.text-dark { color:#192b36 !important; }
.text-basic { color:#aaa !important; }
.text-red { color:#F44336 !important; }
.text-danger { color:#f36767 !important; }
.text-warning { color:#ffc107 !important; }
.text-orange { color:#ff9800 !important; }
.text-purple { color:#673ab7 !important; }
.text-info { color:#00bcd4 !important; }
.text-primary { color:#3f51b5 !important; }
.text-success { color:#4caf50 !important; }
.text-mint { color:#009688 !important; }
.text-nuk { color:#1b8954 !important; }
.text-skyblue { color:#03a9f4 !important; }



.bg-default { background-color:#fff !important; color:#666 !important; }
.bg-dark { background-color:#192b36 !important; color:#fff !important; }
.bg-skygray { background-color:#607d8b !important; color:#fff !important; }
.bg-basic { background-color:#aaa !important; color:#fff !important; }
.bg-red { background-color:#F44336 !important; color:#fff !important; }
.bg-danger { background-color:#f36767 !important; color:#fff !important; }
.bg-warning { background-color:#ffc107 !important; color:#fff !important; }
.bg-orange { background-color:#ff5722 !important; color:#fff !important; }
.bg-purple { background-color:#673ab7 !important; color:#fff !important; }
.bg-info { background-color:#00bcd4 !important; color:#fff !important; }
.bg-primary { background-color:#3f51b5 !important; color:#fff !important; }
.bg-success { background-color:#4caf50 !important; color:#fff !important; }
.bg-mint { background-color:#009688 !important; color:#fff !important; }
.bg-nuk { background-color:#1b8954 !important; color:#fff !important; }
.bg-skyblue { background-color:#03a9f4 !important; color:#fff !important; }


.btn-default { background-color:#fff; color:#333 !important; border:1px solid #aaa; }
.btn-basic { background-color:#aaa; color:#fff !important; }
.btn-red { background-color:#F44336; color:#fff !important; }
.btn-danger { background-color:#f36767; color:#fff !important; }
.btn-warning { background-color:#ffc107; color:#fff !important; }
.btn-orange { background-color:#ff5722; color:#fff !important; }
.btn-purple { background-color:#673ab7; color:#fff !important; }
.btn-info { background-color:#00bcd4; color:#fff !important; }
.btn-primary { background-color:#3f51b5; color:#fff !important; }
.btn-success { background-color:#4caf50; color:#fff !important; }
.btn-mint { background-color:#009688; color:#fff !important; }
.btn-nuk { background-color:#1b8954; color:#fff !important; }
.btn-skyblue { background-color:#03a9f4; color:#fff !important; }

.btn-outline-default { border:1px solid #666; color:#666 !important; }
.btn-outline-basic { border:1px solid #7f99e2; color:#7f99e2 !important; }
.btn-outline-red { border:1px solid #F44336; color:#F44336 !important; }
.btn-outline-danger { border:1px solid #f36767; color:#f36767 !important; }
.btn-outline-warning { border:1px solid #ffc107; color:#ffc107 !important; }
.btn-outline-orange { border:1px solid #ff5722; color:#ff5722 !important; }
.btn-outline-purple { border:1px solid #673ab7; color:#673ab7 !important; }
.btn-outline-info { border:1px solid #00bcd4; color:#00bcd4 !important; }
.btn-outline-primary { border:1px solid #3f51b5; color:#3f51b5 !important; }
.btn-outline-success { border:1px solid #4caf50; color:#4caf50 !important; }
.btn-outline-mint { border:1px solid #009688; color:#009688 !important; }
.btn-outline-nuk { border:1px solid #1b8954; color:#1b8954 !important; }
.btn-outline-skyblue { border:1px solid #03a9f4; color:#c5c9ca !important; }

.btn-line-basic { border-radius:0; background-color:transparent; border-bottom:2px solid #7f99e2; color:#7f99e2 !important; }
.btn-line-red { border-radius:0; background-color:transparent; border-bottom:2px solid #F44336; color:#F44336 !important; }
.btn-line-danger { border-radius:0; background-color:transparent; border-bottom:2px solid #f36767; color:#f36767 !important; }
.btn-line-warning { border-radius:0; background-color:transparent; border-bottom:2px solid #ffc107; color:#ffc107 !important; }
.btn-line-orange { border-radius:0; background-color:transparent; border-bottom:2px solid #ff5722; color:#ff9800 !important; }
.btn-line-purple { border-radius:0; background-color:transparent; border-bottom:2px solid #673ab7; color:#673ab7 !important; }
.btn-line-info { border-radius:0; background-color:transparent; border-bottom:2px solid #00bcd4; color:#00bcd4 !important; }
.btn-line-primary { border-radius:0; background-color:transparent; border-bottom:2px solid #3f51b5; color:#3f51b5 !important; }
.btn-line-success { border-radius:0; background-color:transparent; border-bottom:2px solid #4caf50; color:#4caf50 !important; }
.btn-line-mint { border-radius:0; background-color:transparent; border-bottom:2px solid #009688; color:#009688 !important; }
.btn-line-nuk { border-radius:0; background-color:transparent; border-bottom:2px solid #1b8954; color:#1b8954 !important; }
.btn-line-dark { border-radius:0; background-color:transparent; border-bottom:2px solid #444; color:#444 !important; }
.btn-line-skyblue { border-radius:0; background-color:transparent; border-bottom:2px solid #03a9f4; color:#03a9f4 !important; }


.btn-outline-default.active, .btn-outline-default:hover,.btn-line-default.active, .btn-line-default:hover { background-color:#eaecf2; color:#424549 !important; }
.btn-outline-basic.active, .btn-outline-basic:hover,.btn-line-basic.active, .btn-line-basic:hover { background-color:#7f99e2; color:#fff !important; }
.btn-outline-red.active, .btn-outline-red:hover,.btn-line-red.active, .btn-line-red:hover { background-color:#F44336; color:#fff !important; }
.btn-outline-danger.active, .btn-outline-danger:hover,.btn-line-danger.active, .btn-line-danger:hover { background-color:#f36767; color:#fff !important; }
.btn-outline-warning.active, .btn-outline-warning:hover,.btn-line-warning.active, .btn-line-warning:hover { background-color:#ffc107; color:#fff !important; }
.btn-outline-orange.active, .btn-outline-orange:hover,.btn-line-orange.active, .btn-line-orange:hover { background-color:#ff5722; color:#fff !important; }
.btn-outline-purple.active, .btn-outline-purple:hover,.btn-line-purple.active, .btn-line-purple:hover { background-color:#673ab7; color:#fff !important; }
.btn-outline-info.active, .btn-outline-info:hover,.btn-line-info.active, .btn-line-info:hover { background-color:#00bcd4; color:#fff !important; }
.btn-outline-primary.active, .btn-outline-primary:hover,.btn-line-primary.active, .btn-line-primary:hover { background-color:#3f51b5; color:#fff !important; }
.btn-outline-success.active, .btn-outline-success:hover,.btn-line-success.active, .btn-line-success:hover { background-color:#4caf50; color:#fff !important; }
.btn-outline-mint.active, .btn-outline-mint:hover,.btn-line-mint.active, .btn-line-mint:hover { background-color:#009688; color:#fff !important; }
.btn-outline-nuk.active, .btn-outline-nuk:hover,.btn-line-nuk.active, .btn-line-nuk:hover { background-color:#1b8954; color:#fff !important; }
.btn-outline-skyblue.active, .btn-outline-skyblue:hover,.btn-line-skyblue.active, .btn-line-skyblue:hover { background-color:#03a9f4; color:#fff !important; }

.label-btn .label-chk:checked+.btn-default { background-color:#eaecf2; color:#424549 !important; }

.label-btn .label-chk:checked+.btn-outline-basic { background-color:#7f99e2; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-red	{ background-color:#F44336; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-danger { background-color:#f36767; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-warning { background-color:#ffc107; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-orange { background-color:#ff9800; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-purple { background-color:#673ab7; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-info { background-color:#00bcd4; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-primary { background-color:#3f51b5; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-success { background-color:#4caf50; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-mint { background-color:#009688; color:#fff !important; }
.label-btn .label-chk:checked+.btn-outline-skyblue { background-color:#03a9f4; color:#fff !important; }

.label-btn .label-chk:checked+.btn-line-basic { background-color:#7f99e2; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-red { background-color:#F44336; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-danger { background-color:#f36767; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-warning { background-color:#ffc107; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-orange { background-color:#ff9800; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-purple { background-color:#673ab7; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-info { background-color:#00bcd4; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-primary { background-color:#3f51b5; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-success { background-color:#4caf50; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-mint { background-color:#009688; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-nuk { background-color:#1b8954; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-dark { background-color:#444; color:#fff !important; }
.label-btn .label-chk:checked+.btn-line-skyblue { background-color:#03a9f4; color:#fff !important; }


.label-btn { cursor:pointer; font-size: 12px; font-weight:500; }
.label-block { display:block; width:100%; }

.btn {  }
.btn-lg { height:60px; }
.btn-block { display:block; width:100%; }
.btn-rounded { border-radius:10px; }


.btn .blt { position:absolute; right:-10px; top:-10px; width:20px; line-height:20px; text-algin:center; background-color:#f36767; color:#fff; border-radius:50%; z-index:10; font-size:12px; }



.text-orange { color:#ff771d !important; }
.text-red { color:#e80d0d !important; }
.text-skyblue { color:#20c0dd !important; }
.text-blue { color:#3266db !important; }


.font-10 { font-size:10px; }
.font-11 { font-size:11px; }
.font-12 { font-size:12px; }
.font-13 { font-size:13px; }
.font-14 { font-size:14px; }
.font-15 { font-size:15px; }
.font-16 { font-size:16px; }
.font-17 { font-size:17px; }
.font-18 { font-size:18px; }
.font-19 { font-size:19px; }
.font-20 { font-size:20px; }
.font-25 { font-size:25px; }
.font-30 { font-size:30px; }
.font-40 { font-size:40px; }
.font-50 { font-size:50px; }




.pb-0 { padding-bottom:0; }
.pb-5 { padding-bottom:5px; }
.pb-10 { padding-bottom:10px; }
.pb-15 { padding-bottom:15px; }
.pb-20 { padding-bottom:20px; }
.pb-25 { padding-bottom:25px; }
.pb-30 { padding-bottom:30px; }
.pb-40 { padding-bottom:40px; }
.pb-50 { padding-bottom:50px; }
.pb-60 { padding-bottom:60px; }
.pb-70 { padding-bottom:70px; }
.pb-80 { padding-bottom:80px; }
.pb-90 { padding-bottom:90px; }
.pb-100 { padding-bottom:100px; }


.pl-0 { padding-left:0; }
.pl-5 { padding-left:5px; }
.pl-10 { padding-left:10px; }
.pl-15 { padding-left:15px; }
.pl-20 { padding-left:20px; }
.pl-25 { padding-left:25px; }
.pl-30 { padding-left:30px; }
.pl-40 { padding-left:40px; }
.pl-50 { padding-left:50px; }
.pl-60 { padding-left:60px; }
.pl-70 { padding-left:70px; }
.pl-80 { padding-left:80px; }
.pl-90 { padding-left:90px; }
.pl-100 { padding-left:100px; }

.pr-0 { padding-right:0; }
.pr-5 { padding-right:5px; }
.pr-10 { padding-right:10px; }
.pr-15 { padding-right:15px; }
.pr-20 { padding-right:20px; }
.pr-25 { padding-right:25px; }
.pr-30 { padding-right:30px; }
.pr-40 { padding-right:40px; }
.pr-50 { padding-right:50px; }
.pr-60 { padding-right:60px; }
.pr-70 { padding-right:70px; }
.pr-80 { padding-right:80px; }
.pr-90 { padding-right:90px; }
.pr-100 { padding-right:100px; }

.pt-0 { padding-top:0; }
.pt-5 { padding-top:5px; }
.pt-10 { padding-top:10px; }
.pt-15 { padding-top:15px; }
.pt-20 { padding-top:20px; }
.pt-25 { padding-top:25px; }
.pt-30 { padding-top:30px; }
.pt-40 { padding-top:40px; }
.pt-50 { padding-top:50px; }
.pt-60 { padding-top:60px; }
.pt-70 { padding-top:70px; }
.pt-80 { padding-top:80px; }
.pt-90 { padding-top:90px; }
.pt-100 { padding-top:100px; }

.mb-0 { margin-bottom:0; }
.mb-5 { margin-bottom:5px; }
.mb-10 { margin-bottom:10px; }
.mb-15 { margin-bottom:15px; }
.mb-20 { margin-bottom:20px; }
.mb-25 { margin-bottom:25px; }
.mb-30 { margin-bottom:30px; }
.mb-40 { margin-bottom:40px; }
.mb-50 { margin-bottom:50px; }
.mb-60 { margin-bottom:60px; }
.mb-70 { margin-bottom:70px; }
.mb-80 { margin-bottom:80px; }
.mb-90 { margin-bottom:90px; }
.mb-100 { margin-bottom:100px; }


.ml-0 { margin-left:0; }
.ml-5 { margin-left:5px; }
.ml-10 { margin-left:10px; }
.ml-15 { margin-left:15px; }
.ml-20 { margin-left:20px; }
.ml-25 { margin-left:25px; }
.ml-30 { margin-left:30px; }
.ml-40 { margin-left:40px; }
.ml-50 { margin-left:50px; }
.ml-60 { margin-left:60px; }
.ml-70 { margin-left:70px; }
.ml-80 { margin-left:80px; }
.ml-90 { margin-left:90px; }
.ml-100 { margin-left:100px; }

.mr-0 { margin-right:0; }
.mr-5 { margin-right:5px; }
.mr-10 { margin-right:10px; }
.mr-15 { margin-right:15px; }
.mr-20 { margin-right:20px; }
.mr-25 { margin-right:25px; }
.mr-30 { margin-right:30px; }
.mr-40 { margin-right:40px; }
.mr-50 { margin-right:50px; }
.mr-60 { margin-right:60px; }
.mr-70 { margin-right:70px; }
.mr-80 { margin-right:80px; }
.mr-90 { margin-right:90px; }
.mr-100 { margin-right:100px; }

.mt-0 { margin-top:0; }
.mt-5 { margin-top:5px; }
.mt-10 { margin-top:10px; }
.mt-15 { margin-top:15px; }
.mt-20 { margin-top:20px; }
.mt-25 { margin-top:25px; }
.mt-30 { margin-top:30px; }
.mt-40 { margin-top:40px; }
.mt-50 { margin-top:50px; }
.mt-60 { margin-top:60px; }
.mt-70 { margin-top:70px; }
.mt-80 { margin-top:80px; }
.mt-90 { margin-top:90px; }
.mt-100 { margin-top:100px; }



.arrow-slim:after {
    content: '';
    width: 16px; /* 사이즈 */
    height: 16px; /* 사이즈 */
    border-top: 2px solid #aaa; /* 선 두께 */
    border-right: 2px solid #aaa; /* 선 두께 */
    display: inline-block;
    transform: rotate(45deg); /* 각도 */
    position: absolute;
    top: 0; /* 기본 0px 값으로 해주세요 */
    left: 0; /* 기본 0px 값으로 해주세요 */
}

.sound_only { display:none; }




/* BORDER-EFFECT */
.border-effect::after {
  position: absolute;
  top: 0;
  left: 0;
  height: 50px;
  width: 50px;
  content: '';
  background: yellow;
  animation: bordereffect 4000ms infinite;
}

@keyframes bordereffect {
  0% {
    left: 0;
    top: 0;
  }
  
  25% {
    left: 0;
    top: calc( 100% - 2px);
  }
  
  50% {
    top: calc( 100% - 2px);
    left: calc( 100% - 2px);
  }
  
  75% {
    top: 0px;
    left: calc( 100% - 2px);
  }
  
 100% {   
    top 0;
    left: 0;
  }
}



.spinner {  -webkit-animation:spin 1000ms infinite linear; -moz-animation:spin 1000ms infinite linear; -ms-animation:spin 1000ms infinite linear; animation:spin 1000ms infinite linear; }

@-webkit-keyframes spin { 100%{ -webkit-transform: rotate(360deg); } } @-moz-keyframes spin { 100%{ -moz-transform: rotate(360deg); } } @-ms-keyframes spin { 100%{ -ms-transform: rotate(360deg); } } @keyframes spin { 100%{ transform: rotate(360deg); } }