/************************************************
//	FileName	:	reset.css
//	Create Date	:	2022.07.20
//	Create By	:	사공수기
//	Modify Date	:
//	Modify Ver  :
//	Contentes   :
//		페이지 전체 영역(공통) CSS
//
//	Copyright (c)
//************************************************/

/*-------------
 초기 글꼴 설정
---------------*/
/*@font-face {
    /*font-family: 'IBMPlexSansKR-Medium';
    src: url('../../common/fonts/IBMPlexSansKR-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-family: 'SUIT-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}*/

@font-face {
    font-family: 'Pretendard-Regular';
    /*src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');*/
	src: url('/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

/*--------------
 초기 flex 설정
---------------*/
html, body {
    padding: 0;
    margin: 0;
    width: 100%;
    height:100%;
    margin:0;
    padding: 0;
    display: flex;
    font-family: "Pretendard-Regular";
    font-size: 12px;
}

input, button, select, option {
    font-family: "Pretendard-Regular";
}

/*====================
 본문 기본 CSS 설정
====================*/

/*-------------------------------------------------
 본문 영역 flex 설정(해더 + 왼쪽메뉴 + 콘텐츠)
--------------------------------------------------*/

/* 왼쪽메뉴 */
#left_menu {
	display: inline-block;
	width: 200px;
	min-width: 200px;
    height:100%;
	background-color: #fafbfc;
    border-right: 1px solid #e8e8e8;
    overflow: hidden;
}

/* 왼쪽메뉴 투명 스크롤바 커스텀 */
#left_menu:hover {
	overflow: overlay;
    z-index: 9999;

}

#left_menu::-webkit-scrollbar {
	width: 5px;
}

#left_menu::-webkit-scrollbar-thumb {
    border-radius: 5px;
	background-color: hsla(0, 0%, 42%, 0.49);
}

/* 헤더 & 컨텐츠 감쌈 영역 */
#flex_wrap1 {
    flex-grow: 1;
    display: flex;
	flex-direction: column;
    overflow: hidden;
}

/* 헤더 */
#header {
    display: flex;
    align-items: center;
    height: 70px;
	line-height: 70px;
    background: #ffffff;
    border-bottom: 1px solid #e8e8e8;
    box-sizing: border-box;
}

/* 컨텐츠 제목 & 컨텐츠 감쌈 영역 */
#content_wrap {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: overlay;
	z-index: 1;
}

#content_wrap::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

#content_wrap::-webkit-scrollbar-thumb {
    border-radius: 5px;
	background-color: hsla(0, 0%, 42%, 0.49);
}

/*------------
버튼 css
-------------*/

.ir_btn_srch {
    display: inline-block;
    line-height: 1em;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
	width: 90px;
    background: #3e3d55;
	margin-left: 10px;
    padding: 3px;
}

.ir_btn_srch::after {
	content: "";
	font-family: "Font Awesome 5 Free";
	font-weight:  900;
	transition: all 0.3s;
	opacity:0;
	transform: translateX(9px);
	font-size:10px;
}

.ir_btn_srch:hover::after {
	content: "\f002";
	font-family: "Font Awesome 5 Free";
	font-weight:  900;
	transition: all 0.3s;
	opacity:1;
	transform: translateX(5px);
    display: inline-block;

}

.ir_btn_excel {
    display: inline-block;
    line-height: 1em;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
	width: 80px;
    background: #3c9564;
    padding: 3px;
}

.ir_btn_excel::after {
	content: "";
	font-family: "Font Awesome 5 Free";
	font-weight:  900;
	transition: all 0.3s;
	opacity:0;
	transform: translateX(9px);
	font-size:12px;
}

.ir_btn_excel:hover::after {
	content: "\f019";
	font-family: "Font Awesome 5 Free";
	font-weight:  900;
	transition: all 0.3s;
	opacity:1;
	transform: translateX(7px);
    display: inline-block;

}

.ir_btn {
    font-size: 12px;
	border: 0px;
    padding: 10px 15px;
    line-height: 1em;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
    font-family: 'IBMPlexSansKR-Medium' !important;
}

.ir_blue_btn {
    /* color: #fff;
    background-color: #6fb9d4; */
    color: #000;
    background-color: #ccc;
}

.ir_red_btn {
    /* color: #fff;
    background: linear-gradient(195deg, rgb(200, 110, 135), rgb(178, 82, 108)); */
    color: #000;
    background-color: #ccc;
}

.ir_red_btn:hover {
    /* outline: 0;
    background: linear-gradient(195deg, rgb(170 88 110), rgb(145 62 85));
    transition: all .2s linear; */
    outline: 0;
    background-color: #b8b8b8;
    transition: all .2s linear;
}

.ir_green_btn {
    /* color: #fff;
    background: linear-gradient(195deg, rgb(129, 178, 132), rgb(102, 150, 106));
    font-weight: 600; */
    color: #000;
    background-color: #ccc;
}

.ir_green_btn:hover {
    /* outline: 0;
    background: linear-gradient(195deg, rgb(110 152 113), rgb(85 125 89));
    transition: all .2s linear; */
    outline: 0;
    background-color: #b8b8b8;
    transition: all .2s linear;
}

.ir_yellow_btn {
    /* background-color: #e6a64d; */
    color: #000;
    background-color: #ccc;
}

.ir_yellow_btn:hover {
    /* background-color: #cf9038;
    transition: all .2s linear; */
    outline: 0;
    background-color: #b8b8b8;
    transition: all .2s linear;
}

.ir_gray_btn {
    color: #000;
    background-color: #ccc;
}

.ir_gray_btn:hover {
    outline: 0;
    background-color: #b8b8b8;
    transition: all .2s linear;
}

.ir_navy_btn {
    /* color: #fff;
    background: linear-gradient(195deg, rgb(110, 150, 200), rgb(72, 110, 170)); */
    color: #000;
    background-color: #ccc;
}

.ir_navy_btn:hover {
    /* outline: 0;
    background: linear-gradient(195deg, rgb(92 128 175), rgb(58 92 145));
    transition: all .2s linear; */
    outline: 0;
    background-color: #b8b8b8;
    transition: all .2s linear;
}

.ir_btn_disabled {
    background: linear-gradient(195deg, rgb(135 135 135), rgb(187 187 187));
    color: #6c6c6c;
}

.ir_btn_disabled:hover {
    background: linear-gradient(195deg, rgb(135 135 135), rgb(187 187 187));
    color: #6c6c6c;
}

/*초기화 버튼*/
.ir_rightgray_btn {
	background-color: #ccc;
    color: #222;
}

/*------------
그리드 css
-------------*/
.non_edit_cell {
	background-color: rgb(239, 239, 239);
}

.text_bold_cell {
	font-weight: bold;
}

/*-------------------------
 컴포넌트 기본 css
---------------------------*/
.component {
	background-color: #fff;
	padding: 10px;
	border-radius: 10px;
    box-shadow: 3px 4px 3px 0px #cbcbcb;
}

/*----------------------
 미디어 쿼리
-----------------------*/
@media screen and (max-width: 700px) {

    #left_menu {
        display: none;
    }

    #left_menu_btn {
        display: inline-block !important;
    }

    #header_user_info {
        display: none;
    }
}