@charset "UTF-8";
/****************************************/
/*  Name : byWIND
/*  PART : common.css
/*  Version : 2.0
/*  Author : 이소망
/*  Modify : 
/****************************************/

/* 필수 (*) 아이콘 */
.i {margin-left: 5px; color: #f8554e; font-weight: 600;}

/* flexbox */
.flexbox {padding: 0 1rem !important;}
.flexbox .tit {align-self: stretch; padding: 0 10px 0 15px; min-width: 165px; text-align: left; vertical-align: top; background: #f7f7f7; line-height: 70px;}
.flexbox .tit + .register-write {margin-left: 13px;}
.flexbox .wrap {display: flex; align-items: center; width: 100%; border-bottom: 1px solid #efeff1;}
.flexbox.last .wrap {border-bottom: none;}
.view-form .flexbox .wrap {width: calc(100% + 1rem);}

/* flexWrap */
.flexWrap {display: flex; align-items: center;flex-wrap: nowrap;}
.flexWrap + .flexWrap {margin-top: 10px;}
.flexWrap.both {justify-content: space-between; align-items: center;} /*양쪽정렬*/
.flexWrap.both-end {justify-content: space-between; align-items: flex-end;} /*양쪽정렬 + 아래쪽기준정렬*/
.flexWrap.right {justify-content: flex-end;} /*오른쪽 정렬*/
.flexWrap.vertical {flex-direction: column;} /*수직정렬*/
.flexWrap.reverse {flex-direction: column-reverse;} /*수직반대정렬*/
.flexWrap:not(.both, .both-end) button {margin-left: 7px;}
.flexWrap [class*="heading"] {margin-bottom: 0; padding-bottom: 0;}
.flexWrap [class*="heading"] + .checkbox-radio-group {margin-left: 14px;}
.flexWrap [class*="heading"] + .badge-custom {margin-left: 5px;}
.flexWrap .fixed-search-form {margin-bottom: 0;}
.flexWrap .fixed-search-form button {margin-left: 0;}

/* 테이블에 여러개 리스트가 들어가는 경우 */
.table-inner-lst {padding: 0 0 0 1.2rem !important;}
.table-inner-lst ul li {display: flex; align-items: center; float: left; min-height: 41px; line-height: 41px; }
.table-inner-lst ul li.height70 {min-height: 70px; line-height: 70px;}
.table-inner-lst ul li span {display: inline-block;}
.table-inner-lst ul li .tit {background: #f7f7f7; padding: 0 1.2rem; }
.table-inner-lst ul li .sub {width: auto; vertical-align: middle; margin: 0 .9rem;}

/* padding */
.pdvertical10 {padding: 10px 0 !important;}
.pdvertical20 {padding: 20px 0 !important;}
.pd0 {padding: 0 !important;}
.pdt0 {padding-top: 0 !important;}
.pdt10 {padding-top: 10px !important;}
.pdt20 {padding-top: 20px !important;}
.pdt30 {padding-top: 30px !important;}
.pdt35 {padding-top: 35px !important;}
.pdt40 {padding-top: 40px !important;}
.pdt50 {padding-top: 50px !important;}
.pdb0 {padding-bottom: 0 !important;}
.pdb10 {padding-bottom: 10px !important;}
.pdb20 {padding-bottom: 20px !important;}
.pdb30 {padding-bottom: 30px !important;}
.pdb35 {padding-bottom: 35px !important;}
.pdb40 {padding-bottom: 40px !important;}
.pdb50 {padding-bottom: 50px !important;}
.pdl0 {padding-left: 0 !important;}
.pdl10 {padding-left: 10px !important;}
.pdl20 {padding-left: 20px !important;}
.pdl30 {padding-left: 30px !important;}
.pdl40 {padding-left: 40px !important;}
.pdl50 {padding-left: 50px !important;}
.pdr0 {padding-right: 0 !important;}
.pdr10 {padding-right: 10px !important;}
.pdr20 {padding-right: 20px !important;}
.pdr30 {padding-right: 30px !important;}
.pdr40 {padding-right: 40px !important;}
.pdr50 {padding-right: 50px !important;}

/* margin */
.mgvertical5 {margin: 5px 0 !important;}
.mgvertical10 {margin: 10px 0 !important;}
.mgvertical20 {margin: 20px 0 !important;}
.mg0 {margin: 0 !important;}
.mgt0 {margin-top: 0 !important;}
.mgt10 {margin-top: 10px !important;}
.mgt20 {margin-top: 20px !important;}
.mgt30 {margin-top: 30px !important;}
.mgt35 {margin-top: 35px !important;}
.mgt40 {margin-top: 40px !important;}
.mgt50 {margin-top: 50px !important;}
.mgt55 {margin-top: 55px !important;}
.mgt60 {margin-top: 60px !important;}
.mgt70 {margin-top: 70px !important;}
.mgt80 {margin-top: 80px !important;}
.mgt90 {margin-top: 90px !important;}
.mgt100 {margin-top: 100px !important;}
.mgb0 {margin-bottom: 0 !important;}
.mgb5 {margin-bottom: 5px !important;}
.mgb10 {margin-bottom: 10px !important;}
.mgb20 {margin-bottom: 20px !important;}
.mgb30 {margin-bottom: 30px !important;}
.mgb35 {margin-bottom: 35px !important;}
.mgb40 {margin-bottom: 40px !important;}
.mgb50 {margin-bottom: 50px !important;}
.mgb60 {margin-bottom: 60px !important;}
.mgb70 {margin-bottom: 70px !important;}
.mgb80 {margin-bottom: 80px !important;}
.mgb90 {margin-bottom: 90px !important;}
.mgb100 {margin-bottom: 100px !important;}
.mgl0 {margin-left: 0 !important;}
.mgl5 {margin-left: 5px !important;}
.mgl10 {margin-left: 10px !important;}
.mgl20 {margin-left: 20px !important;}
.mgl30 {margin-left: 30px !important;}
.mgl40 {margin-left: 40px !important;}
.mgl50 {margin-left: 50px !important;}
.mgr0 {margin-right: 0 !important;}
.mgr10 {margin-right: 10px !important;}
.mgr20 {margin-right: 20px !important;}
.mgr30 {margin-right: 30px !important;}
.mgr40 {margin-right: 40px !important;}
.mgr50 {margin-right: 50px !important;}

/* 텍스트 정렬 및 위치 */
.clearfix:after {content: "";display: block;clear: both;}
.txt-left {text-align: left !important;}
.txt-center {text-align: center !important;}
.txt-right {text-align: right !important;}
.txt-justify {text-align: justify !important;}
.v-top {vertical-align: top !important;}
.v-mid {vertical-align: middle !important;}
.v-bot {vertical-align: bottom !important;}
.f-left {float: left !important;}
.f-right {float: right !important;}

/* 퍼센트(%) */
.w5p {width: 5% !important;}
.w10p {width: 10% !important;}
.w15p {width: 15% !important;}
.w20p {width: 20% !important;}
.w25p {width: 25% !important;}
.w30p {width: 30% !important;}
.w35p {width: 35% !important;}
.w40p {width: 40% !important;}
.w45p {width: 45% !important;}
.w50p {width: 50% !important;}
.w55p {width: 55% !important;}
.w60p {width: 60% !important;}
.w65p {width: 65% !important;}
.w70p {width: 70% !important;}
.w75p {width: 75% !important;}
.w80p {width: 80% !important;}
.w85p {width: 85% !important;}
.w90p {width: 90% !important;}
.w95p {width: 95% !important;}
.w100p {width: 100% !important;}

/* 높이(px) */
.h0 {height: 0 !important;}
.h10 {height: 10px !important;}
.h20 {height: 20px !important;}
.h30 {height: 30px !important;}
.h40 {height: 40px !important;}
.h50 {height: 50px !important;}

/* font */
.size20 {font-size: 20px !important; display: inline-block; vertical-align: middle;}
.size25 {font-size: 25px; display: inline-block; vertical-align: middle;}

.no-txt {padding: 40px 0 40px; color: #c8c8ca;} /*등록한 항목이 없습니다 text*/

.red {color: #be3f3b !important; font-weight: 800;} 
.red2 {color: #f8554e !important; font-weight: 800;}
.black {color: #222 !important;}
.blue {color: #475df1 !important; font-weight: 600;}
.orange {color: #e99f00 !important; font-weight: 800;}

.f-bolder {font-weight: 900 !important;} 
.f-bold {font-weight: 700 !important;}
.f-normal {font-weight: 500 !important;}
.f-lighter {font-weight: 300 !important;}

.blue-tit {color: #475df1 !important; font-weight: 900 !important;}

/* 테이블 선 삭제 */
.br-none {border-right: none !important;} /*오른쪽 선 삭제*/
.bl-none {border-left: none !important;} /*왼쪽 선 삭제*/
.bt-none {border-top: none !important;} /*상단 선 삭제*/
.bm-none {border-bottom: none !important;} /*하단 선 삭제*/

/* display 속성 */
.block {display: block !important;}

/* 라인 */
.line {width: 100%; height: 1px; background: #eaeaf2;} 
.line-vertical {display: inline-block; width: 1px; min-height: 46px; height: 100%; background: #eaeaf2; margin: 0 11px 0 23px;}
.line-vertical2 {display: inline-block; vertical-align: middle; width: 1px; height: 11px; background: #eaeaf2; margin: 0 8px;}
.line-horizontal {display: block; height: 1px; background: #efeff1; margin: 35px 0;}

/* 알람텍스트 */
.tb-alarm-txt .alarm-name {color: #333; font-weight: 700;}

/* 리스트 스타일 */
.list-custom1::before {content: ""; display: inline-block; vertical-align: middle; width: 4px; height: 4px; background: #b3b3b3; margin-right: 3px;}
.list-custom2::before {content: "-"; color: #777;}

/*************************************
    폰트 스타일
*************************************/
.en {font : 700 36px/1 var(--poppins), sans-serif !important;} /*영문타이틀만 따로 추가*/
.poppins {font-family: var(--poppins), sans-serif !important;} 
.nanum {font-family: var(--nanumsquare), sans-serif !important;} 
.gothic {font-family: var(--gothic), sans-serif !important;} 
.lineawesome {font-family: var(--lineawesome); font-weight: bold;} /*라인어썸 폰트패밀리 네임*/

/*************************************
    스크롤바 커스텀
*************************************/

/* 기본 스크롤바
--------------------------------------------- */
/*스크롤바*/
::-webkit-scrollbar {width: 0.9rem; padding: 0 0.5rem;background: transparent;}
/*스크롤바 막대*/
::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.2);border-radius: 4rem;
background-clip: padding-box; border: 0.3rem solid transparent;} 
/*스크롤바 막대 hover */
::-webkit-scrollbar-thumb:hover {background-color: rgba(0, 0, 0, 0.3);}
/*스크롤바 뒷 배경 */
::-webkit-scrollbar-track {background: transparent;border-radius: 0;} 

/* 레이어팝업 스크롤바
--------------------------------------------- */
/*스크롤바*/
.popup-cont-inner::-webkit-scrollbar {width: 1rem; padding: 0 0.5rem;background: transparent;}
/*스크롤바 막대*/
.popup-cont-inner::-webkit-scrollbar-thumb { background-color: #dadada;border-radius: 4rem;
background-clip: padding-box; border: 0.4rem solid transparent;} 
/*스크롤바 막대 hover */
.popup-cont-inner::-webkit-scrollbar-thumb:hover {background-color: rgba(0, 0, 0, 0.3);}
/*스크롤바 뒷 배경 */
.popup-cont-inner::-webkit-scrollbar-track {background-color: transparent; border-radius: 0;} 


/* 코드 관리 스크롤바
--------------------------------------------- */
/*스크롤바*/
.code-scroll-wrap::-webkit-scrollbar {width: 5px;}
/*스크롤바 막대*/
.code-scroll-wrap::-webkit-scrollbar-thumb {border-radius: 4rem; border: 0.4rem solid #475df1;}  
/*스크롤바 뒷 배경 */
.code-scroll-wrap::-webkit-scrollbar-track {background-color: #dadada;border-radius: 4rem;}