@charset "utf-8";

/* form */
input[type=text],
input[type=password],
input[type=file],
select,
textarea,
.numeric-input,
.file-upload {height:26px; line-height:24px; border-radius:3px; background-color:#fff; border:solid 1px #c7c7c7; font-size:12px; padding:0 10px; transition:all 0.3s;}
input:hover,
select:hover,
textarea:hover,
.numeric-input:hover,
.file-upload:hover,
input:focus,
select:focus,
textarea:focus,
.numeric-input:focus,
.file-upload:hover {border-color:#71a2e8 !important;}
select {cursor:pointer; padding-right:24px;}
input:read-only {background-color:#fff;}
iframe {border:0; overflow:auto;}
*::placeholder {color:#aaa;}
select {background-image:url('../../images/common/bg_arrow_down.png'); background-repeat:no-repeat; background-position: right 10px top 50%;}

textarea {width:100%; box-sizing: border-box; resize:none; min-height: 80px; padding:10px 12px; font-size:14px;}

.file-upload {position:relative; overflow: visible; padding:0; display:inline-block; width: 100%; vertical-align: middle;}
.file-upload > input {display:none;}
.file-upload > span {display: block; text-overflow: ellipsis; padding:0 10px; padding-right:84px; font-size: 14px; white-space: nowrap; overflow: hidden; height:100%;}
.file-upload > a.btn {position:absolute; width:84px; top:-1px; right:-1px; bottom:-1px;height:26px; line-height:24px; border-radius: 0 3px 3px 0;}

.file-upload.big,
.file-upload.big > a.btn {height:36px; line-height:34px;}

.numeric-input {position:relative; display:inline-block; vertical-align:middle; padding:0; overflow:hidden;}
.numeric-input input {width:100%; height:100%; text-align:left; border:solid 1px transparent; float:left; padding:0 18px 0 5px; text-align:right;}
.numeric-input input:hover, .numeric-input input:focus {border-color:transparent !important;}
.numeric-input .btn.up, .numeric-input .btn.down {display:block; width:15px; height:50%; border-top:solid 1px #e5e5e5; position:absolute; right:0; top:0; background-repeat:no-repeat; background-position:50% 50%; cursor:pointer; box-sizing:border-box; transition:all 0.3s; -webkit-transition:all 0.3s;}
.numeric-input .btn.up {background-image:url("../../images/common/btn_numeric_up.png"); border:0; border-left:solid 1px #d2ddf2; border-bottom:solid 1px #d2ddf2;}
.numeric-input .btn.down {background-image:url("../../images/common/btn_numeric_down.png"); border-top:none; bottom:0; top:auto; border-left:solid 1px #d2ddf2;}
.numeric-input .btn.up:hover, .numeric-input .btn.down:hover {background-color:#fcfcfc;}

.search-keyword {border:solid 1px #caccda; height:36px; line-height:34px; position:relative; overflow: visible;}
.search-keyword > input {height:34px; width:100%; box-sizing: border-box; line-height:34px; font-size:14px; border:none; padding-right:80px; background-color: transparent;}
.search-keyword > a.btn {position:absolute; width:80px; text-align: center; top:-1px; right:-1px; bottom:-1px; height:36px; border:none; line-height: 34px; background-color: #4255c7; border-radius:0; color:#fff;}
.search-keyword > a.btn:hover {border:none; background-color: #364bc5;}

.datepicker {width:90px !important;}

/* a.btn */
a.btn {font-size:13px; font-weight:500; padding:0 0.8em; border-radius:3px; height:28px; line-height:26px; border:solid 1px #c7c7c7; background-color: #fff; transition:all 0.2s; position: relative; overflow:hidden;}
a.btn::after {content:""; display:block; width:0; height:0; border-radius: 50%; background-color: rgba(255, 255, 255, 0.12); opacity: 0; transform: translate(-50%, -50%); transition: all 0.3s; position: absolute; top:50%; left:50%;}
a.btn:hover {border-color:#71a2e8;}
a.btn:hover::after {width:110%; padding-top:110%; opacity: 1;}
a.btn .fa {display:inline-block; margin-right:0.5em;}
a.btn.dark {border-color:transparent; background-color:#537aa2; color:#fff;}
a.btn.dark:hover {border-color:transparent; background-color:#6286ca;}
a.btn.small {height:22px; line-height:20px; background-color:#f1f5fb; border-color:#cfdbf0; font-size:11px; color:#7b94c0;}
a.btn.small:hover {border-color:#8caeea;}
a.btn.big {font-size:13px; height:36px; line-height:34px;}
a.btn.color01 {background-color:#71a2e8 !important; border-color:transparent; color:#fff;}
a.btn.color01:hover {background-color:#558fe2; }
a.btn.color02 {background-color:#6dc77a !important; border-color:transparent; color:#fff;}
a.btn.color02:hover {background-color:#4fb75e; }
a.btn.color03 {background-color:#4255c7 !important; border-color:transparent; color:#fff;}
a.btn.color03:hover {background-color:#364bc5; }
a.btn.color04 {border-color:#71a2e8 !important; color:#71a2e8;}
a.btn.color04:hover {background-color:#fbfdff; }
a.btn.color05 {background-color:#55cbe0 !important; border-color:transparent; color:#fff;}
a.btn.color05:hover {background-color:#32bdd6;}
a.btn.color06 {background-color:#a3a3a3 !important; border-color:transparent; color:#fff;}
a.btn.color06:hover {background-color:#999999; }
a.btn.color07 {background-color:#eb977a !important; border-color:transparent; color:#fff;}
a.btn.color07:hover {background-color:#e38565; }
a.btn.color08 {background-color:#eb7aa2 !important; border-color:transparent; color:#fff;}
a.btn.color08:hover {background-color:#e26390; }
a.btn.shadow {box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.2);}
a.btn > span.fa {vertical-align: baseline; text-align: center;}
a.download {text-decoration: underline;}

.btn-wrap {display:inline-block; overflow: visible;}
.btn-wrap > * {float:left; margin-right:0.5em;}
.btn-wrap > label.tit {display: inline-block; line-height: 24px;}
.btn-wrap > a.btn:last-child {margin-right:0;}
.btn-wrap.right > a {margin-left:0.5em; margin-right:0;}
.btn-wrap.center > a {margin-left:0.25em; margin-right:0.25em;}
.btn-wrap.top {position:absolute; top:0; right:0;}
.btn-wrap-table {display:table; table-layout: fixed; width:100%; text-align: center;}
.btn-wrap-table.bottom-fix {position:absolute; bottom:0; left:0;}
.btn-wrap-table > .btn-wrap {display:table-row;}
.btn-wrap-table > .btn-wrap > a.btn {display:table-cell; margin-right:0; float: none; border:none; border-radius:0; height:48px; line-height: 48px; font-size: 14px;}

/* 체크박스 */
p.checkbox,
p.radio {cursor:pointer; position:relative; z-index: 10;}

p.checkbox,
p.checkbox > *,
p.radio,
p.radio > * {display:inline-block; vertical-align:middle;}

p.checkbox > input,
p.radio > input {display:none;}

p.checkbox > span.ico,
p.radio > span.ico {width:18px; height:18px; border-radius:0px; border:solid 1px #b8bec7; background-color:#dce0e7; background-position:50% 50%; background-repeat:no-repeat; margin-right:6px; transition:all 0.2s; box-sizing: border-box;}
p.radio > span.ico {border-radius:50%;}
p.checkbox.checked > span.ico,
p.radio.checked > span.ico {background-color:#001060; border:solid 1px transparent;}
p.checkbox > span.ico {background-image:url("../../images/common/bg_checked.png");}
p.radio > span.ico {background-image:url("../../images/common/bg_radio.png");}
p.checkbox > label,
p.radio > label {font-size:12px; color:#767676; cursor: pointer;}

/* tab */
div.tab {position: relative; margin-bottom:16px;}
div.tab > ul {border-bottom:solid 1px #d3d3d3;}
div.tab > ul li {float:left; margin-right:-1px; position:relative;}
div.tab > ul li > a {display:block; text-align:center; min-width: 7em; font-size: 15px; font-weight: 600; height: 2.667em; line-height: 2.667em; color:#868686; padding:0 15px; transition: all .2s; border:solid 1px #d3d3d3; border-bottom:0;}
div.tab > ul li > a:hover {background-color:#fcfcfc;}
div.tab > ul li.active {z-index:1;}
div.tab > ul li.active > a {background-color:#fff; height:40px; line-height: 40px; color:#fff; margin-top:0; font-weight: 500; border-color:#59b026; background-color: #59b026; border-bottom-color:#fff;}
div.tab > .btn-wrap {position:absolute; top:0; right:0;}
div.tab > .btn-wrap > a.btn {height:36px; line-height: 34px; font-size:13px;}
.tab-contents {display:none;}
.tab-contents.active {display:block;}

p.para {line-height:1.2em;}

/* loading */
div.loading {display: none; width: 200px; height: 160px; background: #fff url('../../images/common/img_loading.gif') 50% -238px no-repeat; text-align: center; border-radius: 10px; padding: 118px 10px 30px 10px; position: fixed; top:50%; left:50%; z-index: 2500; margin:-80px 0 0 -100px; box-shadow: 0 10px 20px rgba(0, 0, 0, .12);}
div.loading > p {font-size: 13px; color:#767676; font-weight: 500;}
div.loading.active {display: inline-block;}

/* Dialog 관련 */
.dialog {display:none; border:solid 1px #000000; position:fixed; top:50%; left:50%; z-index:2600; background-color: #fff;}
.dialog.top {z-index: 2700;}
.dialog.middle {z-index: 2650;}
.dialog .dl-header {height:39px; line-height:39px; font-size:14px; font-weight:500; box-sizing:border-box; padding:0 10px; position:relative; background-color:#3d4159; cursor:move;}
.dialog .dl-header span.tit {color:#fff;}
.btn-close-dialog {display:block; width:24px; height:24px; border:solid 1px transparent; transition:all 0.2s; background:url("../../images/common/bg_btn_close.png") 50% 50% no-repeat; position:absolute; top:6px; right:10px; font-size:0px; line-height:0; text-indent:-9999px;}
.btn-close-dialog:hover {background-color:#282c40;}
.dialog .dl-container {background-color:#fff; font-size:13px; color:#555; overflow: auto;}
.dialog .dl-container p.message {width:100%; margin-top:74px; font-size:16px;}
.dialog .dl-contents {padding:14px; overflow-y:auto; position:relative;}
.dialog .dl-footer {background-color:#f2f3f6; border-top:solid 1px #f4f4f4; text-align:center; padding:10px 0;}
.dialog .dl-footer > a.btn-small {width:60px; background-color:#bbbec6; color:#fff; margin:0 auto; padding:0; height:30px; line-height:30px; font-size:12px; border-radius:0; transition:all 0.2s;}
.dialog .dl-footer > .btn-wrap-table {table-layout: auto;}
.dialog .dl-footer > a.btn-small:hover {background-color:#9397a0;}

/* mcustomscrollbar reset */
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:#000 !important; background-color:rgba(0, 0, 0, 0.2) !important; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)" !important;} /* 평상 시 */
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=10)" !important;} /* 드래그 시 */

/* modal */
.modal {width:100%; height:100%; min-height:2000px; position:fixed; top:0; left:0; opacity:0.6; z-index:2000; background:rgba(0, 0, 0, .78); display:none;}
.over-modal {z-index:5000;}

/* 에러 페이지 */
#wrap.error {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6478e8+0,6489e8+50,7db9e8+100 */
background: #6478e8; /* Old browsers */
background: -moz-linear-gradient(-45deg, #6478e8 0%, #6489e8 50%, #7db9e8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #6478e8 0%,#6489e8 50%,#7db9e8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #6478e8 0%,#6489e8 50%,#7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6478e8', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.error-box {width:600px; height:320px; background-color:#fff; box-shadow:0; border-radius: 10px; position: absolute; top:50%; left:50%; margin:-160px 0 0 -300px; text-align: center; padding-top:30px; transition:all 0.5s;}
.error-box:hover {box-shadow:20px 20px 40px rgba(0, 0, 0, 0.2);}
.error-box > p {font-size: 22px; color:#555; font-weight: 600; margin:0 0 16px 0;}
.error-box > span {display:block; margin:0 0 30px 0;}
.error-box > span.fa {font-size: 50px; margin:0 auto 10px auto; width:100px; height:100px; line-height: 100px; background-color:#f5a81c; color:#fff; border-radius: 50%;}

/* Owl Carousel Reset */
.owl-theme.owl-loaded {position: relative;}
.owl-stage-outer,
.owl-stage {width:100%; height:100%;}
.owl-item {float:left; width:100%; height:100%;}
.owl-item > div {width:100%; height:100%;}
.owl-theme .owl-dots .owl-dot {display: block; float:left;}

/* 스마트에디터 커스텀 */
.cheditor-container * {box-sizing:content-box; overflow:visible;}
