@charset "utf-8";

	/* wrap-lading 관련 css */
	/* 로딩중 loading */
	
	/*화면 전체를 어둡게 합니다.*/
	.wrap-loading{ position: fixed; left:0; right:0; top:0; bottom:0; z-index:2147483645; background: rgba(0,0,0,0); /*not in ie */ filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#20000000', endColorstr='#20000000');    /* ie */  }
	.mainWrap-loading{ position: fixed; left:0; right:0; top:0; bottom:0; z-index:2147483646; background:url(../images/popup/popup_bg.png);  }
	.subWrap-loading{ position: fixed; left:373px; right:44px; top:187px; bottom:64px; z-index:2147483646; background-repeat: no-repeat; background-image:url(../images/popup/popup_bg2.png);  }
	
	/*로딩 이미지*/
	.wrap-loading div{ position: fixed; top:50%; left:50%; z-index:2147483647; margin-left: -21px; margin-top: -21px; }
	
	/*감추기*/
	.display-none{ display:none; }


	/*  datepicker 관련 셋팅   */
	.ui-datepicker-trigger { display: none; }
	input[type="text"], input[type="checkbox"], input[type="radio"] { font-family: "Noto Sans KR"; background: none; outline: none; border: none; }
/* 	input.date_input2 { background: #fff url(../../images/icon/date_input2.png) no-repeat; background-position: 90% 50%; background-size: 16px; } */
	
/* 	.ui-widget.ui-widget-content { border: 1px solid #859AAC; }  달력 외곽선  */
/* 	.ui-widget-header { background: #fff; border: none; color: #333333; font-weight: bold; }  달력 타이틀 날짜 */
/* 	.ui-widget-header .ui-icon { background: none; } 이전,다음 화살표 */
/* 	.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { top: 1px; } */
/* 	.ui-widget-header a[data-handler="prev"] .ui-icon { background-image: url(../../images/web/icon/arrow_l04.svg); background-size: 16px; } */
/* 	.ui-widget-header a[data-handler="next"] .ui-icon { background-image: url(../../images/web/icon/arrow_r04.svg); background-size: 16px; } */
/* 	.ui-datepicker .ui-datepicker-title select { border: none; text-align: center; } */
/* 	.ui-datepicker th { font-weight: 500; color: #4A5E76; } */
/* 	.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { background: none; border: none; text-align: center; color: #222; } */
/* 	.ui-datepicker-calendar > tbody td.ui-datepicker-week-end:last-child a { color: #4148FF; } */
/* 	.ui-datepicker-calendar > tbody td.ui-datepicker-week-end:first-child a { color: #FF2E60; } */
	
	input[type="text"].date_input { border: 1px solid #B3BFD1; height: 20px; background: #fff url(../../images/web/input/calendarIcon.svg) no-repeat; background-position: 4px 50%; background-size: 12px; padding-left: 20px; }
	input[type="text"].date_input.nbd { border: none; }
	input[type="text"].date_input.dis { background: #EFF5F8 url(../../images/web/input/calendarIcon.svg) no-repeat; background-position: 4px 50%; background-size: 12px; }
	
	.dateType { display: flex; align-items: center; justify-content: space-between; }
	.dateType span { margin: 0 5px; }
	.ui-datepicker-trigger { display: none; }
/*     input[type="text"].nbd { border: none; } */
/*     input[type="text"].nbd:hover { border: none; } */
/*     input[type="text"].nbd:focus { border: none; }	 */
	
	
	/*  인풋 관련 셋팅   */
	input[type="text"] { width: 100%; height: 20px; border: 1px solid #B3BFD1; padding: 0 4px; border-radius: 4px; }
	input[type="text"]:hover { border: 1px solid #389cfc; }
	input[type="text"]:focus { border: 1px solid #389cfc; }
	
	input[type="password"] { width: 100%; height: 20px; border: 1px solid #B3BFD1; padding: 0 4px; border-radius: 4px; }
	input[type="password"]:hover { border: 1px solid #389cfc; }
	input[type="password"]:focus { border: 1px solid #389cfc; }
	
	input.nbd { border: none!important; }
	input.nbd:hover { border: none!important; }
	input.nbd:focus { border: none!important; }
	
	input[type="text"].nbd { border: 1px solid transparent; }
	input[type="text"].nbd:hover { border: 1px solid transparent; }
	input[type="text"].nbd:focus { border: 1px solid transparent; }
	
	input[type="text"].bd { border: 1px solid #B3BFD1!important; }
	input[type="text"].bd:hover { border: 1px solid #389cfc!important; }
	input[type="text"].bd:focus { border: 1px solid #389cfc!important; }
	
	input[type="number"] { border: 1px solid #B3BFD1; padding: 0 4px; border-radius: 4px; }
	input[type="number"]:hover { border: 1px solid #389cfc; }
	input[type="number"]:focus { border: 1px solid #389cfc; }
	
	input[type="button"] { cursor: pointer; }
	
	/* select */
    .select { height: 20px; width: 120px; padding-left: 4px; border: 1px solid #B3BFD1; border-radius: 4px; background: #fff; }
    
    /*select_mark*/
    .select_label { padding-left: 15px; background-image: url(../../images/web/input/select_bg_off.png); background-repeat: no-repeat; background-position: left center; margin-right: 15px; line-height: 20px; }
    .select_label:last-child { margin-right: 0; }
    input[type="radio"]:checked + .select_label { background-image: url(../../images/web/input/select_bg_on.png); color: #487ACC; }

    .select_label02 { padding-left: 20px; background-image: url(../../images/web/input/select_bg_off02.svg); background-repeat: no-repeat; background-position: left center; margin-right: 15px; line-height: 20px; }
    .select_label02:last-child { margin-right: 0; }
    input[type="radio"]:checked + .select_label02 { background-image: url(../../images/web/input/select_bg_on02.svg); font-weight: bold; color: #4A5E76; }
    input[type="radio"]:checked + .check_label { background-image: url(../../images/web/input/check_on.svg); color: #487ACC; }

	select.selectInput { background: #fff; width: 120px; height: 20px; padding-left: 4px; border: 1px solid #B3BFD1; border-radius: 4px; } /* 캐시맵 기본값 */


    /*check_mark*/
    .check_label { padding-left: 15px; background-image: url(../../images/web/input/check_off.svg); background-repeat: no-repeat;  background-position: left center; margin-right: 15px; line-height: 20px; color: #aaa; }
    .check_label.dis { background-image: url(../../images/web/input/check_dis.svg)!important; }
    .txc .check_label { margin-right: 0; }
    .check_label:last-child { margin-right: 0; }
    input[type="checkbox"]:checked + .check_label { background-image: url(../../images/web/input/check_on.svg); color: #487ACC; }

    .check_label02 { padding-left: 20px; background-image: url(../../images/web/input/check_off02.svg); background-repeat: no-repeat;  background-position: left center; margin-right: 15px; line-height: 20px; color: #aaa; }
    .check_label02.dis { background-image: url(../../images/web/input/check_dis.svg)!important; }
    .txc .check_label02 { margin-right: 0; }
    .check_label02:last-child { margin-right: 0; }
    input[type="checkbox"]:checked + .check_label02 { background-image: url(../../images/web/input/check_on02.svg); font-weight: bold; color: #4A5E76; }

/* 	.check_label01, .check_label02 { background: #fff url(../../images/web/input/check_off02.svg) no-repeat left center; background-size: 14px; padding-left: 18px; font-size: 14px; font-weight: 500; color: #4A5E76; line-height: 14px; } */
	.check_label01, .check_label02 { background: url(../../images/web/input/check_off02.svg) no-repeat left center; background-size: 14px; padding-left: 18px; font-size: 14px; font-weight: 500; color: #4A5E76; line-height: 14px; }
	.check_label01.dis, .check_label01.dis { background-image: url(../../images/web/input/check_dis.svg)!important; }
	input[type="checkbox"]:checked + .check_label01 { background-image: url(../../images/web/input/check_on01.svg); font-weight: bold; }
	input[type="checkbox"]:checked + .check_label02 { background-image: url(../../images/web/input/check_on02.svg); font-weight: bold; }


    /*radio_mark*/
/*     .radio_label { min-width: 50px; padding: 0 10px; line-height: 23px; border: 1px solid #B3BFD1; border-radius: 4px; text-align: center; margin-right: 6px; } */
/*     input:checked + .radio_label { background: #487ACC; border: 1px solid #487ACC; color: #fff; } */
/* 	.radio_label { background: url(../../images/web/input/radio_off.svg) no-repeat left center; background-size: 14px; padding-left: 20px; font-size: 14px; font-weight: 500; color: #4A5E76; line-height: 14px; } */
/* 	.check_label.dis { background-image: url(../../images/web/input/radio_dis.svg); } */
/* 	input[type="radio"]:checked + .radio_label { background-image: url(../../images/web/input/radio_on.svg); font-weight: bold; } */
	.radio_label { min-width: 50px; padding: 0 10px; line-height: 23px; border: 1px solid #B3BFD1; border-radius: 4px; text-align: center; margin-right: 6px; }
	input:checked + .radio_label { background: #487ACC; border: 1px solid #487ACC; color: #fff; }
	
	
	/*scroll_bar*/
    body *::-webkit-scrollbar { width: 8px; height: 8px; }
    body *::-webkit-scrollbar-thumb { background-color: #759BD8; border-radius: 4px; }
    body *::-webkit-scrollbar-track { background-color: transparent; }
    

    /*IOS 스크롤 영역 문제*/
    .h_50 { height: calc(100% - 50px)!important; }
    .scroll_ { height: calc(100%)!important; overflow-y: auto; }
    .scroll_50 { height: calc(100% - 50px)!important; overflow-y: auto; }
        
    .maxHeight { height: 100vh; max-height: -webkit-fill-available; max-height: fill-available; }

/************************************
    Common class
*************************************/

	/*  display  */
	.hide { display: none; }
	.disNone { display: none!important; }
	.hidden { visibility: hidden; }
	.cup { cursor: pointer; }
	.wka { word-break: keep-all; }
	
	/*  layout  */
	/* margin */
	.mg_0 { margin: 0; }
	.mg_5 { margin: 5px; } .mg_t5 { margin-top: 5px; } .mg_r5 { margin-right: 5px; } .mg_b5 { margin-bottom: 5px; } .mg_l5 { margin-left: 5px; }
	.mg_10 { margin: 10px; } .mg_t10 { margin-top: 10px; } .mg_r10 { margin-right: 10px; } .mg_b10 { margin-bottom: 10px; } .mg_l10 { margin-left: 10px; }
	.mg_15 { margin: 15px; } .mg_t15 { margin-top: 15px; } .mg_r15 { margin-right: 15px; } .mg_b15 { margin-bottom: 15px; } .mg_l15 { margin-left: 15px; }
	.mg_20 { margin: 20px; } .mg_t20 { margin-top: 20px; } .mg_r20 { margin-right: 20px; } .mg_b20 { margin-bottom: 20px; } .mg_l20 { margin-left: 20px; }
	.mg_30 { margin: 30px; } .mg_t30 { margin-top: 30px; } .mg_r30 { margin-right: 30px; } .mg_b30 { margin-bottom: 30px; } .mg_l30 { margin-left: 30px; }
	.mg_auto { margin: 0 auto; } .mg_l_auto { margin-left: auto; } .mg_r_auto { margin-right: auto; }
	
	/* padding */
	.pd_0 { padding: 0; }
	.pd_5 { padding: 5px; } .pd_t5 { padding-top: 5px; } .pd_r5 { padding-right: 5px; } .pd_b5 { padding-bottom: 5px; } .pd_l5 { padding-left: 5px; }
	.pd_10 { padding: 10px; } .pd_t10 { padding-top: 10px; } .pd_r10 { padding-right: 10px; } .pd_b10 { padding-bottom: 10px; } .pd_l10 { padding-left: 10px; }
	.pd_15 { padding: 15px; } .pd_t15 { padding-top: 15px; } .pd_r15 { padding-right: 15px; } .pd_b15 { padding-bottom: 15px; } .pd_l15 { padding-left: 15px; }
	.pd_20 { padding: 20px; } .pd_t20 { padding-top: 20px; } .pd_r20 { padding-right: 20px; } .pd_b20 { padding-bottom: 20px; } .pd_l20 { padding-left: 20px; }
	.pd_30 { padding: 30px; } .pd_t30 { padding-top: 30px; } .pd_r30 { padding-right: 30px; } .pd_b30 { padding-bottom: 30px; } .pd_l30 { padding-left: 30px; }
	
	/*width*/
	.width_5 { width: 5%; } .width_10 { width: 10%; } .width_15 { width: 15%; } .width_20 { width: 20%; } .width_25 { width: 25%; }
	.width_30 { width: 30%; } .width_35 { width: 35%; } .width_40 { width: 40%; } .width_45 { width: 45%; } .width_50 { width: 50%; } 
	.width_55 { width: 55%; } .width_60 { width: 60%; } .width_65 { width: 65%; } .width_70 { width: 70%; } .width_75 { width: 75%; } 
	.width_80 { width: 80%; } .width_85 { width: 85%; } .width_90 { width: 90%; } .width_95 { width: 95%; } .width_100 { width: 100%; } 
	.width_fit { width: fit-content; } .width_init { width: initial; } /* initW */
	
	/* flex */
	.flex { display: flex; }
	.flex_ali_cen { display: flex; align-items: center; } /* fl-jc */
	.flex_jus_bet { display: flex; justify-content: space-between; } /* fl-jb */
	
	.flex_around { display: flex; justify-content: space-around; align-items: center; } /* fl-a */ 
	.flex_between { display: flex; justify-content: space-between; align-items: center; } /* fl-b */
	.flex_start { display: flex; justify-content: flex-start; align-items: center; } /* fl-s */
	.flex_end { display: flex; justify-content: flex-end; align-items: center; }
	.flex_center { display: flex; justify-content: center; align-items: center; } /* fl-cc */
	
	.flex_wrap { flex-wrap: wrap; } /* fl-wp */
	.flex_shink0 { flex-shrink: 0; } /* w_fix */
	
	.grid_wrap { display: flex; gap: 20px; }
/* 	#wrapper { min-width: 1856px; } */
	#wrapper { min-width: 1920px; width: 100vw; height: 100vh; overflow: hidden; }
	
	/*  font & text  */
	.txc { text-align: center; }
	.txr { text-align: right; }
	.txl { text-align: left; }
	
	.medium { font-weight: 500; }
	.bold { font-weight: 700; }
	.bolder { font-weight: 900; }
	.normal { font-weight: normal; }
	
	
	/*  text color  */
	/* 지정 컬러 */
	.txt_blue01 { color: #3760FF!important; } /* main color */
	.txt_blue02 { color: #205FFF!important; } /* main color */
	.txt_blue03 { color: #3347FF!important; } /* main color */
	.txt_blue04 { color: #354BFF!important; } /* main color */
	
	.txt_grey01 { color: #666!important; }
	.txt_grey02 { color: #AAA!important; }
	.txt_grey03 { color: #DDD!important; }
	
	.txt_red01 { color: #FF2E60!important; }
	.txt_red02 { color: #DA4B42!important; }
	.txt_red03 { color: #FF2C2F!important; }
	.txt_green01 { color: #00AE5B!important; }
	
	
	/*  BG color  */
	/* 지정 컬러 */
	.bg_blue01 { background: #3760FF!important; } /* main color */
	.bg_blue02 { background: #E2ECF5 !important; } 
	
	.bg_black01 { background: #1F1F1F!important; }
	.bg_grey01 { background: #68798D!important; }
	.bg_grey02 { background: #DDD!important; }
	.bg_white01 { background: #FFFFFF!important; }
	
	.bg_green01 { background: #00AD70!important; }
	.bg_red01 { background: #F06060!important; }