@charset "utf-8";
/* CSS Reset *************************************************************************************/
/* copyright(c) fdcompany.kr */


:root {
    --main-font: 'Pretendard', sans-serif;
    --main-letter_spacing: .7px;
}


html, body,
h1, h2, h3, h4, h5, h6,
p, span, div, a, table, button,
input, input::placeholder, textarea, select {font-family: var(--main-font); font-size:1em;}

html {overflow-y:scroll; margin:0 auto !important;}
body {margin:0; padding:0; font-size:0.75em; width:100%; overflow-x:hidden;}

html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0; padding:0; border:0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
ul, ol {list-style: none;}
ul, dl, dt, dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
label, input, button, select, img {vertical-align:middle; font-size:14px;font-weight: 400;}
img {image-rendering:-webkit-optimize-contrast; max-width:100%;}
table {table-layout: fixed; border-collapse: collapse;}
input, button {margin:0; padding:0;}
input[type="submit"], button {cursor:pointer; -webkit-appearance: none; -webkit-border-radius: 0; background-color:transparent; border:none;}
input[type="button"], input[type="submit"], button, a, label {cursor:pointer;}
input[type=text],input[type=password], textarea {-webkit-transition: all 0.30s ease-in-out;-moz-transition: all 0.30s ease-in-out;-ms-transition: all 0.30s ease-in-out;-o-transition: all 0.30s ease-in-out;outline: none;}
input[type=text]:focus,input[type=password]:focus,  textarea:focus,select:focus {-webkit-box-shadow:  0 0 5px #9ed4ff;-moz-box-shadow:  0 0 5px #9ed4ff;box-shadow: 0 0 5px #9ed4ff;border: 1px solid #558ab7 !important;}
textarea {resize:none;}
select {margin:0}
p {margin:0; padding:0; word-break:break-all;}
hr {display:block}
pre {overflow-x:scroll; font-size:1.1em; white-space:pre-wrap;}
pre::-webkit-scrollbar {display:none;}
a {text-decoration:none; color:inherit;}
b, strong {font-weight: bold;}
*, :after, :before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
/* *:not(u, i, hr) {margin: 0; padding: 0; font-family: var(--main-font); font-size: 15px; font-style: normal; font-weight: normal; vertical-align: middle; border: 0 solid transparent; outline: 0; box-sizing: border-box; background-repeat: no-repeat;} */
/* *:not(u, i, hr) {margin: 0; padding: 0; font-family: var(--main-font); vertical-align: middle; border: 0 solid transparent; outline: 0; box-sizing: border-box; background-repeat: no-repeat;} */
*:not(u, i, hr) {margin: 0; padding: 0; font-family: var(--main-font); border: 0 solid transparent; outline: 0; box-sizing: border-box; background-repeat: no-repeat;}
*::selection {background:#d8d8d8;}

/* 에디터 스타일 적용 (23.05.09 by.Hyemi) */
/* .note-editable p, .note-editable b, .note-editable span, .note-editable textarea, .note-editable i, .note-editable pre, .note-editable strong, .note-editable em, .note-editable ul, .note-editable li, .note-editable dt, .note-editable dd, .note-editable strike, .note-editable sub, .note-editable sup, .note-editable th, .note-editable td, .note-editable font {font-size:inherit; font-family:inherit;} */
/* 에디터 스타일 적용 - 섹션 (23.05.09 by.Hyemi) */
.design-type-editor pre p, .design-type-editor pre b, .design-type-editor pre span, .design-type-editor pre textarea, .design-type-editor pre i, .design-type-editor pre pre, .design-type-editor pre strong, .design-type-editor pre em, .design-type-editor pre ul, .design-type-editor pre li, .design-type-editor pre dt, .design-type-editor pre dd, .design-type-editor pre strike, .design-type-editor pre sub, .design-type-editor pre sup, .design-type-editor pre th, .design-type-editor pre td, .design-type-editor pre font {font-size:inherit; font-family:inherit;}
.design-type-editor pre b {font-weight:bold;}


/* Chrome, Safari용 스크롤 바 */
div::-webkit-scrollbar {width: 8px; height: 8px; border: 3px solid #fff; }
div::-webkit-scrollbar-track {background: #ddd; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px #eee}
div::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: #c8c8c8; -webkit-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: inset 0 0 4px #eee}
.table-frame::-webkit-scrollbar {display:none;}

/* 에디터 */
.note-editable ul li {list-style-type: disc; margin-left: 20px; padding: 0; }
.note-editable ol li {list-style: auto; margin-left: 20px;}
/* .note-editable *:not(u, i, hr) {font-size:inherit; font-family:inherit;} */
[data-detail_key="content"] ul li {list-style-type: disc; margin-left: 20px; padding: 0; }
[data-detail_key="content"] ol li {list-style: auto; margin-left: 20px;}

.placeholdersjs { color: #aaa !important; }
.draggable{height:auto !important;}

/* .clb{clear:both;}
.center{text-align:center;} */

/* CSS Reset *************************************************************************************/










/* 공통 스타일 클래스명 *************************************************************************************/
/* container */
.container {margin:80px auto 0; padding:0 0 100px; /* padding:60px 0 100px; max-width:1440px; min-width: 1200px;*/ min-height: 50vh;}
.my-container {display: flex; border-top:1px solid #c0c0c0; border-bottom:1px solid #c0c0c0; margin-top:10px;}

/* .pc {display:block;}
.mobile {display:none;} */
/* .pc {display:block !important;} */

.mobile {display:none !important;}

@media screen and (max-width:768px){
  .pc {display:none !important;}
}


.dis_blcok {display:block;}
.dis_none {display:none;}
.on {display:block;}
.off {display:none;}
.fit-hide {visibility: hidden; text-indent:-9999px;display: inline-block !important;position: absolute !important;top: 0;left: 0;margin: 0 !important;padding: 0 !important;font-size: 0 !important;line-height: 0;border: 0 !important;overflow: hidden !important; background: transparent !important;}

/* .wrap {max-width:1400px;} */
.mg-auto{margin:0 auto;}
.bg {background-position:center; background-repeat:no-repeat; background-size:cover;}
.position-fixed {position:fixed;}
.cursor-pointer {cursor:pointer;}
.cur-point {cursor: pointer;}

/* flex */
.flex {display:flex !important;}
.flex-row {display:flex; align-items:center; flex-direction: row !important;}
.flex-col {display:flex; align-items:center; flex-direction:column;}
.flex-start {display:flex; align-items: flex-start !important;}
.flex-end {display:flex; align-items: flex-end !important;}
.flex-between {display:flex; align-items:center; justify-content: space-between !important;}
.flex-around {display:flex; align-items:center; justify-content: space-around !important;}
.flex-center {display:flex; align-items:center; justify-content: center; width:100%; height:100%;}
.flex-column {display: flex; flex-direction: column;}
.align-start {align-items: flex-start !important;}
.align-end {align-items: flex-end !important;}

.i-flex {display:inline-flex;}
.i-flex-row {display:inline-flex; align-items:center; flex-direction: row !important;}
.i-flex-col {display:inline-flex; align-items:center; flex-direction:column;}
.i-flex-start {display:inline-flex; align-items: flex-start !important;}
.i-flex-end {display:inline-flex; align-items: flex-end !important;}
.i-flex-between {display:inline-flex; align-items:center; justify-content: space-between !important;}
.i-flex-center {display:inline-flex; align-items:center; justify-content: center; width:100%; height:100%;}
.i-flex-column {display: flex; flex-direction: column;}

/* 레이아웃 */
.flex-1 {flex:.1 !important;}
.flex-2 {flex:.2 !important;}
.flex-3 {flex:.3 !important;}
.flex-4 {flex:.4 !important;}
.flex-5 {flex:.5 !important;}
.flex-6 {flex:.6 !important;}
.flex-7 {flex:.7 !important;}
.flex-8 {flex:.8 !important;}
.flex-auto {flex:1 !important;}
.flex-x2 {flex:2 !important;}
.flex-x3 {flex:3 !important;}
.flex-x4 {flex:4 !important;}
.flex-x5 {flex:5 !important;}
.flex-x6 {flex:6 !important;}
.flex-x7 {flex:7 !important;}
.flex-x8 {flex:8 !important;}
.flex-x9 {flex:9 !important;}

/* 넓이 */
/* .w100 {width: 100px !important;} */
.w10 {width:10% !important;}
.w20 {width:20% !important;}
.w30 {width:30% !important;}
.w40 {width:40% !important;}
.w50 {width:50% !important;}
.w60 {width:60% !important;}
.w70 {width:70% !important;}
.w80 {width:80% !important;}
.w80 {width:80% !important;}
.w90 {width:90% !important;}
.w100 {width: 100% !important;}
.mw100 {max-width: 100% !important;}

.max-w800px {max-width: 800px;}

/* 캔버스 넓이 */
.w1500 {max-width:1500px; width: 100%; margin:0 auto;}
.w1440 {max-width:1440px; width: 100%; margin:0 auto;}
.w1200 {max-width:1200px; width: 100%; margin:0 auto;}

/* margin */
.m-auto {margin: 0 auto;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px;}
.mt15 {margin-top: 15px;}
.mt50 {margin-top: 50px;}
.mt60 {margin-top: 60px;}
.mt80 {margin-top: 80px;}
.mt10 {margin-top: 10px;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px;}
.mt25 {margin-top: 25px;}
.mb0 {margin-bottom: 0 !important;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px;}
.ml10 {margin-left: 10px;}
.ml20 {margin-left: 20px;}
.mr0 {margin-right: 0 !important;}
.mr5 {margin-right: 5px;}
.mr10 {margin-right: 10px;}
.mr20 {margin-right: 20px;}
.mr30 {margin-right: 30px !important;}

/* padding */
.p0 {padding: 0 !important;}
.pl0 {padding-left: 0 !important;}
.pl20 {padding-left: 20px !important;}
.pl15 {padding-left: 15px !important;}
.pr0 {padding-right: 0 !important;}
.pr15 {padding-right: 15px !important;}
.pr20 {padding-right: 20px !important;}
.pt40 {padding-top: 40px;}
.pb10 {padding-bottom: 10px;}
.pb20 {padding-bottom: 20px;}

/* 검색 된 데이터가 없을 때 */
.count-status {text-align:center;}
.count-status td {padding:30px 0; font-weight:600;}

/* 텍스트 처리 (다중처리 - white-space: initial; max-height: 10px; display: inline-block;)*/
.keepText {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;word-wrap: normal;}
.txt-stroke {-webkit-text-stroke-width:1px; -webkit-text-stroke-color:#fff; color:transparent;}
.multi-line2 {display:-webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-moz-line-clamp: 2;-moz-box-orient: vertical;-ms-line-clamp: 2;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
.multi-line3 {display:-webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;-moz-line-clamp: 3;-moz-box-orient: vertical;-ms-line-clamp: 3;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
.multi-line4 {display:-webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;-moz-line-clamp: 4;-moz-box-orient: vertical;-ms-line-clamp: 4;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
.ta-l {text-align: left !important;}
.ta-r {text-align: right !important;}
.ta-c {text-align: center;}

/* color */
.fc-000 {color: #000 !important;}
.fc-blue {color:#1159FE;}

/* border */
.bo-0 {border: 0 !important;}

/* 팝업 시 뒷배경 스크롤 막기 (23.04.02) */
.not-scroll {overflow: hidden; width: 100%; height: 100vh; touch-action: none;}


@media screen and (max-width:768px) {
  /* container */
  .container {padding:0 20px; margin:40px 0 100px; width:auto;}
  .my-container {border-bottom:0;}

  .pc {display:none !important;}
  .mobile {display:block !important;}

  .go-back {font-size:2.5rem; position: absolute; left:0; cursor:pointer;}


  /* margin */
  .m-m-auto {margin: 0 auto;}
  .m-mt0 {margin-top: 0px !important;}
  .m-mt5 {margin-top: 5px !important;}
  .m-mt10 {margin-top: 10px !important;}
  .m-mt15 {margin-top: 15px !important;}
  .m-mt20 {margin-top: 20px;}
  .m-mt40 {margin-top: 40px;}
  .m-mt80 {margin-top: 80px;}
  .m-mb0 {margin-bottom: 0 !important;}
  .m-mb5 {margin-bottom: 5px !important;}
  .m-mb10 {margin-bottom: 10px !important;}
  .m-mb15 {margin-bottom: 15px !important;}
  .m-mb20 {margin-bottom: 20px;}
  .m-mb50 {margin-bottom: 50px;}
  .m-mr0 {margin-right: 0px !important;}
  .m-mr5 {margin-right: 5px !important;}
  .m-mr10 {margin-right: 10px !important;}

  /* padding */
  .m-pt10 {padding-top: 10px !important;}
  .m-pt20 {padding-top: 20px !important;}
  .m-pb10 {padding-bottom: 10px !important;}
  .m-pr0 {padding-right: 0px !important;}
  .m-pr10 {padding-right: 10px !important;}
  .m-pl0 {padding-left: 0px !important;}
  .m-pl10 {padding-left: 10px !important;}


  /* 넓이 */
  .m-w-auto {width:auto !important;}
  .m-w10 {width:10% !important;}
  .m-w20 {width:20% !important;}
  .m-w25 {width:25% !important;}
  .m-w30 {width:30% !important;}
  .m-w40 {width:40% !important;}
  .m-w50 {width:50% !important;}
  .m-w60 {width:60% !important;}
  .m-w70 {width:70% !important;}
  .m-w80 {width:80% !important;}
  .m-w80 {width:80% !important;}
  .m-w90 {width:90% !important;}
  .m-w100 {width: 100% !important;}

  .m-max-w200px {max-width: 200px;}
  .m-max-w300px {max-width: 300px;}

  /* border */
  .m-border0 {border: 0 !important;}


  /* flex */
  .m-flex {display:flex; align-items:center !important;}
  .m-flex-start {display:flex; align-items: flex-start !important;}
  .m-flex-end {display:flex; align-items: flex-end;}
  .m-flex-col {display:flex; align-items:center; flex-direction:column !important;}
  .m-dis-inherit {display:inherit;}
  .m-dis-revert {display:revert !important;}
  .m-dir-row {flex-direction: row !important;}
  .m-dir-col {flex-direction: column !important;}
  .m-dir-colRever {flex-direction: column-reverse !important;}


  /* 텍스트 처리 (다중처리 - white-space: initial; max-height: 10px; display: inline-block;)*/
  .m-keepText {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;word-wrap: normal;}
  .m-txt-stroke {-webkit-text-stroke-width:1px; -webkit-text-stroke-color:#fff; color:transparent;}
  .m-multi-line2 {display:-webkit-box !important; -webkit-line-clamp: 2;-webkit-box-orient: vertical;-moz-line-clamp: 2;-moz-box-orient: vertical;-ms-line-clamp: 2;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
  .m-multi-line3 {display:-webkit-box !important; -webkit-line-clamp: 3;-webkit-box-orient: vertical;-moz-line-clamp: 3;-moz-box-orient: vertical;-ms-line-clamp: 3;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
  .m-multi-line4 {display:-webkit-box !important; -webkit-line-clamp: 4;-webkit-box-orient: vertical;-moz-line-clamp: 4;-moz-box-orient: vertical;-ms-line-clamp: 4;-ms-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;white-space: unset;}
  .m-ta-l {text-align: left !important;}
  .m-ta-r {text-align: right !important;}
  .m-ta-c {text-align: center !important;}


}
/* 공통 스타일 클래스명 끝 *************************************************************************************/










/* 레이아웃 *************************************************************************************/
.list-layout {font-size:0;}
/* 아이템 3개 나열 */
.list-layout3 .list-layout-item {display:inline-block; width:calc(100% / 3 - 10px); margin-right:15px;}
.list-layout3 .list-layout-item:nth-child(3n) {margin-right:0;}
.list-layout3 .list-layout-item:nth-child(3n)~.list-layout-item {margin-top:15px;}
/* 아이템 4개 나열 */
.list-layout4 .list-layout-item {display:inline-block; width:calc(100% / 4 - 10px); margin-right:13px;}
.list-layout4 .list-layout-item:nth-child(4n) {margin-right:0;}
.list-layout4 .list-layout-item:nth-child(4n)~.list-layout-item {margin-top:15px;}
/* 아이템 5개 나열 */
.list-layout5 {font-size: 0;}
.list-layout5 .list-layout-item {display:inline-block; width:calc(100% / 5 - 10px); margin-right:10px;}
.list-layout5 .list-layout-item:nth-child(5n) {margin-right:0;}
.list-layout5 .list-layout-item:nth-child(5n)~.list-layout-item {margin-top:15px;}

@media screen and (max-width:768px) {
/* 아이템 2개 나열 */
.list-layout2 .list-layout-item {display:inline-block; width:calc(100% / 2 - 5px); margin-right:10px !important;}
.list-layout2 .list-layout-item:nth-child(2n) {margin-right:0px !important;}
.list-layout2 .list-layout-item:nth-child(2n)~.list-layout-item {margin-top:15px;}
.m-list-layout2 .list-layout-item {display:inline-block; width:calc(100% / 2 - 5px); margin-right:10px !important;}
.m-list-layout2 .list-layout-item:nth-child(2n) {margin-right:0px !important;}
.m-list-layout2 .list-layout-item:nth-child(2n)~.list-layout-item {margin-top:15px;}
}
/* 레이아웃 끝 *************************************************************************************/







/* spinner *************************************************************************************/
.spinner{position:fixed;display:none;left:0;top:0;width:100%;height:100%;align-items:center;justify-content:center;background-color: rgba(0,0,0,0.85);z-index: 10000;}
.spinner.ajax{position:static;background-color:rgba(0, 0, 0, 0);margin:10px auto;display: none;justify-content: center;}
.spinner.active{display:flex;}
.spinner.all_cover{background-color: rgba(0,0,0,1.0)} /* 전체 배경 여부 (init 스피너 시 사용됩니다.)  - Chungwon / 2022.10.22 */
.spinner::after {content:''; display:block; border-radius:50%; border-top:2px solid #778fb0; border-right:2px solid #778fb0; width:60px; height:60px; animation:spinner 800ms ease-out infinite;}
@keyframes spinner {
    0% {transform:rotate(0deg);}
    100% {transform:rotate(360deg);}
}
/* spinner 끝 *************************************************************************************/











/* 로그인 관련 공통 input *************************************************************************************/
/*  */
.comm-input {display:flex; flex-direction:column; flex:.8;}
.comm-input .comm-input-wrap { margin-bottom:15px;}
.comm-input .comm-input-wrap:last-child {margin-bottom:0;}
.comm-input-text {margin-bottom:5px; font-weight:600; color:#5e5e5e;}
.comm-input input {display:inline-block; width:100%; border:1px solid #c0c0c0; border-radius:5px; padding:15px 10px; font-size:1rem;}
.comm-input input::placeholder {color:#c0c0c0;}
.comm-input select {width:100%; padding:15px 10px;}
.login-btn {display:block; width:100%; background-color:#080c34; color:#fff; font-weight:600; padding:15px 0; transition:all 0.25s; border:1px solid #080c34;}
.login-btn:hover {background-color:#fff; color:#343434; border:1px solid #e5e5e5;}
/* 로그인 관련 공통 input 끝 *************************************************************************************/
























/* 22.06.30 메인컬러속성 (by.hyemi) */
.mainc-txt {color:#0861C5;}
.mainc-bg {background-color:#0861C5;}
.basic-bg {background-color:#f8f8f8;}


/* 22.09.29 그리드 속성 (by.hyemi) */
.grid {font-size:0;}
.grid3 {}
.grid3 .grid-item {width:calc(100% / 3 - 4px); margin-right:6px;}
.grid3 .grid-item:nth-child(3n) {margin-right:0;}

/* active 추가 시 동작 */
/* 아이콘 180도 돌리기 (22.11.03) */
.ani-rotate {transition:.3s;}
.ani-rotate.active {transform:rotate(180deg);}

/* 내려쓰기 (22.11.08) */
.pc-br {display:block;}
.mo-br {display:none;}

@media screen and (max-width:768px) {
  .pc-br {display:none;}
  .mo-br {display:block;}
  }

/* 필수값 세팅 */
.essential-sign {color:#ff0000;}