@import url(/../css/reset.css);

@font-face {
    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: 'NPSfontBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2310@1.0/NPSfontBold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');


.blue{
	color: #5158DD;
}
.red{
	color: #BE1E1E;
}
.skyBlue{
	color: #2EB1E2;
}
.brace{
	font-family: 'SUIT-Regular', Pretendard,'Noto Sans KR', sans-serif !important;
}
.triangle{
	font-family: 'NPSfontBold', Pretendard,'Noto Sans KR', sans-serif !important;
	font-size: .9em;
}
span.bar{
	font-size: .85em;
	display: inline-block;
	margin: 0 10px;
	line-height: 1;
	position: relative;
	top: -2px;
	color: #D7DCE5;
}

header,
footer{
	font-family: Pretendard,'Noto Sans KR', sans-serif;
	letter-spacing: 0;
}
#container{
	padding: 40px 0 120px;
}
#container.back,
.colorBack{
	background-color: #F4F6FA;
}
.header_wrap,
.nav_wrap,
.footer_wrap,
.contWidth{
	width: 1240px;
	margin: 0 auto;
}
.contWidth.flex{
	display: flex;
	justify-content: space-between;
}
.contWidth.flex.reverse{
	flex-direction: row-reverse;
}

.flexContainer{
	display: flex;
    width: 1343px;
    margin: 0 auto;
    position: relative;
    left: 50px;
}
.flexContainer.recruitWrap {
	left: 45px;
}
.backContainer{
	background-color: #F8FAFF;
}

/*HEADER*/
.headerWrap{
	background-color: #fff;
}
.header_wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 40px;
}
.headerSearch{
	display: flex;
}
.headerSearch h1{
	line-height: 1.5em;
	margin-right: 18px;
}
.headerSearch h1 img{
	width: 160px;
}

.searchBar_wrap{
	width: 520px;
	height: 48px;
    border:2px solid transparent;
    border-radius:14px;
    background-image:linear-gradient(#fff, #fff),linear-gradient(90deg, #5158DD 0%, #5158DD 16%, #2EB1E2 100%);
    background-origin: border-box;
    background-clip: content-box, border-box;
	margin-left: 15px;

	display: flex;
	align-items: center;
}
.searchIcon{
	margin-left: 17px;
}
.searchInput{
	width: 85%;
	margin: 0 10px;
	margin-top: 3px;
	font-size: 17px;
	position: relative;
	top: -2px;
	font-family: Pretendard,'Noto Sans KR', sans-serif;
	letter-spacing: 0;
}
.searchInput::placeholder{
	font-size: 1em;
}

.quickMenu_wrap{
	display: flex;
	align-items: center;
}
.quickMenu_list{
	display: flex;
	text-align: right;
	font-size: 15px;
}
.quickMenu_list.login li{
	/* height: 12px; */
	line-height: 12px;
	display: flex;
	align-items: center;
	position: relative;
	gap: 5px;
}
.quickMenu_list.login li > a{
	display: flex;
	align-items: center;
	gap: 5px;
}
.dave{
	transition: .3s;
}
.dave.active{
	transform: rotate(180deg);
}
.quickMenu_list.login > li{
	padding-left: 20px;
	/* margin-left: 17px; */
	/* border-left: 1px solid #C5C5C5; */
}
[id^="myPageModal"] li{
	padding: 0;
}
.quickMenu_list.regi{
	margin-left: 20px;
	font-weight: bold;
}
.quickMenu_list.regi li:first-child{
	color: #324663;
	margin-right: 20px;
}
.quickMenu_list.regi span{
	font-size: 24px;
	font-weight: 500;
	line-height: 0;
	position: relative;
	top: 1px;
}

.navWrap{
	padding: 30px 0 20px;
	border-bottom: 1px solid #324663;
}
.nav_wrap,
.menu_wrap,
.menu_list{
	display: flex;
	align-items: center;
	gap: 20px;
}
.nav_wrap{
	justify-content: space-between;
	font-size: 17px;
}

.menu_list li{
	position: relative;
	transition: .2s;
}
.menu_list li:hover{
	color: #5158DD;
}
.menu_list li a{
	padding: 5px 10px;
}
.menu_list li:first-child{
	/* margin-left: 55px; */
}
.menu_list li.on{  
	color: #5158DD;
	font-weight: bold;
}
.menu_list .proMatch{
	font-family: 'GmarketSans', sans-serif;
	font-weight: bold;
	color: #5158DD;
	font-size: 16px;
}
.menu_list .proMatch span{
	display: block;
}
.menu_list .proMatch .sub{
	animation: balloon 4s step-end infinite;
	-webkit-animation: balloon 4s step-end infinite;
	position: absolute;
	top: -20px;
}
.menu_list .proMatch .sub img{
	width: 80px;
}
  /* 추가 */
     /* Modal container */
    #myPageLink {
      position: relative;
    }
    [id^="myPageModal"].modal{
      display: none; 
      position: absolute;
      transform: translateX(-55px);
      z-index: 15;
      top: 30px;
      width: 185px;
      text-align: left;
      border: 1px solid #C5C5C5;
      border-radius: 10px;
      overflow: hidden;
      box-sizing: border-box;
      background: #fff;
      box-shadow: 2px 6px 16px 0 rgba(17, 42, 128, 0.08);
    }
    [id^="myPageModal"] .modal-content{
      background-color: #fefefe;
      padding: 10px;
      position: relative;
    }
    [id^="myPageModal"] .close{
      color: #8491a7;
      position: absolute;
      right: 3px;
      top: 3px;
      font-size: 16px;
      font-weight: bold;
      /* transition: .2s; */
    }
    [id^="myPageModal"] .close:hover,
    [id^="myPageModal"] .close:focus {
      color: #3d3f42;
      text-decoration: none;
      cursor: pointer;
      transform: scale(1.1);
    }
    [id^="myPageModal"] .flex{
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      justify-content: center;
      margin-bottom: 10px;
    }
    [id^="myPageModal"] .Proposal, [id^="myPageModal"] .Support{
      padding: 8px;
      border-radius: 8px;
      font-weight: bold;
      text-align: center;
      transition: .2s;
      cursor: pointer;
    }
    [id^="myPageModal"] .Proposal:hover, [id^="myPageModal"] .Support:hover{
      background-color: #f1f6ff;
    }
    [id^="myPageModal"] .Proposal > div, [id^="myPageModal"] .Support > div{
      padding: 7px 0;
      font-size: 12px;
      color: #8491a7;
    }
    [id^="myPageModal"] .Proposal > div.count, [id^="myPageModal"] .Support > div.count{
      font-size: 18px;
      color: #3d3f42;
    }
    [id^="myPageModal"] .mypage_list{
      border-top: 1px solid #eee;
      text-align: center;
      padding-top: 15px;
      margin-bottom: 5px;
    }
    [id^="myPageModal"] li{
      border: none;
      padding: 0;
      margin: 0;
      height: auto;
    }
    [id^="myPageModal"] li a{
      display: block;
      color: #3d3f42;
      padding: 12px 10px;
      font-size: 13.5px;
      transition: .2s;
      border-radius: 4px;
      overflow: hidden;
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
    }
    [id^="myPageModal"] li a:hover{
      background-color: #f1f6ff;
    }
  /* 추가 */

@keyframes balloon{
	15%{
		transform: translateY(-2px);
	}
	20%{
		transform: translateY(0);
	}
	25%{
		transform: translateY(-2px);
	}
	30%{
		transform: translateY(0);
	}
}

/*nav fixed*/
.fixedLogo{
	width: 26px;
	overflow: hidden;
	position: relative;
	top: 3px;
	margin-right: 12px;
	display: none;
}
.fixedLogin{
	/* height: 18px; */
	margin-left: auto;
	/*
	2025-01-20 메인 채용등록 추가하면서 스크롤시 메뉴가 2줄이됨,
	마진값 주석처리했음 by ksy1106
	margin-right: 40px;
	*/
	display: none;
}
.navWrap.fixed{
	position: fixed;
	z-index: 20;
	background-color: #fff;
	box-shadow: 3px 3px 10px #00000029;
	width: 100%;
	top: 0;
	padding: 30px 0 20px;
	border-bottom: 0;
	animation: fadeIn 0.5s forwards;
	opacity: 1;
}
@keyframes fadeIn{
	0%{opacity: 0;}
	50%{opacity: 1;}
}
.navWrap.fixed .fixedLogo,
.navWrap.fixed .fixedLogin{
	display: block;
}
.navWrap.fixed .allMenuDiv .allMenu{
	padding-right: 20px;
}
.navWrap.fixed .allMenuDiv .option_list{
	top: 26px;
}
.navWrap.fixed .menu_list li{
	margin: 0;
}
.navWrap.fixed .service_wrap{
	/* top: 4px; */
}

/*Footer*/
.footerTop_wrap{
	background-color: #F3F3F3;
	border-top: 1px solid #C5C5C5;
}
.footerTop_list{
	color: #818181;
	display: flex;
	justify-content: space-between;
	padding: 20px 0;
}
.footerTop_list li{
	transition: .3s;
}
.footerTop_list li:hover{
	color: #3d3d3d;
	font-weight: 500;
}
.footer_wrap{
	padding: 35px 0;
	display: flex;
	align-items: center;
	font-size: 14px;
}
.footer_wrap .logo img{
	width: 70%;
}
.footer_wrap .txt{
	line-height: 1.75em;
	color: #818181;
	border-right: 1px solid #EBEBEB;
	padding-right: 50px;
	margin-right: 50px;
	margin-left:30px;
}
.footer_wrap .txt p{
  line-height: 1.15em;
}
.footer_wrap .txt ul{
	display: flex;
}
.footer_wrap .txt li{
	height: 15px;
	line-height: 15px;
}
.footer_wrap .txt li:first-child{
	border-right: 1px solid #818181;
	padding-right: 10px;
	margin-right: 10px;
}

.contact_wrap .contact{
	color: #324663;
}
.contact_wrap .contact .link{
	position: relative;
}
.contact_wrap .contact .link a:after{
	content:'';
	display: inline-block;
	width: 8px;
	height: 8px;
	border-right: 1px solid #324663;
	border-bottom: 1px solid #324663;
	transform: rotate(-45deg);
	position: relative;
	top: -1px;
	left: 2px;
}
.contact_wrap .contact .tel{
	font-size: 28px;
	font-weight: bold;
}
.contact_wrap .sub{
	font-size: 13px;
	color: #C5C5C5;
	margin: 7px 0 12px;
	line-height: 1.55em;
}

/*-----------------------------------------------------------------------------*/
/*side floating*/
.floatingWrap{
	/* position: relative;
	top: 0;
	left: 0;
	transform: none;
	height: 0; */
	position: sticky;
	top: 100px;
	z-index: 1;
	width: 100%;
	/* width: 1240px; */
}
/* .floatingWrap.fixed{
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
} */
.floatingWrap.contWidth{
	width: 1240px;
}
.floating_wrap{
	position: absolute;
	top: -20px;
	right: -65px;
}

/*scrap*/
.scrap.on .back,
.scrap.on .path{
	fill:#fee92e
}

/*button style*/
.button_wrap div{
	border-radius: 5px;
	text-align: center;
	padding: 14px 0;
	cursor: pointer;
	color: #fff;
	transition: .15s;
}
.layerPopBtn.matchPop.blueBtn {
	padding: 8px 12px;
	margin-top: 5px;
}
.button_wrap .borderBtn{
	color: #324663;
	border: 1px solid #bcc2cb;
	background-color: #fff;
	transition: .2s;
}
.button_wrap .borderBtn:hover{
	background-color: #F6F6FF;
}
.button_wrap .borderBtn.blue{
	border-color: #5158DD;
	color: #5158DD;
}
.button_wrap .borderBtn.red{
	border-color: #BE1E1E;
	color: #BE1E1E;
}
.button_wrap .borderBtn.gray{
	border-color: #D7DCE5 ;
	color: #75787D;
}
.button_wrap .borderBtn.gray.back{
	background-color: #F6F6F6;
}
.button_wrap .borderBtn.darkGray{
	border-color: #8F959E ;
	color: #8F959E;
}

.button_wrap .darkBlueBtn{
	background-color: #324663;
}
.button_wrap .blueBtn{
	background-color: #5158DD;
}
.button_wrap .grayBlueBtn{
	background-color: #5D6F8A;
}
.button_wrap .grayBtn{
	background-color: #D7DCE5;
}
.button_wrap .darkGrayBtn{
	background-color: #8F959E;
	transition: .2s;
}
.button_wrap .darkGrayBtn:hover{
	background-color: #777d88;
}

.button_wrap.flex{
	display: flex;
}
.button_wrap.flex.center{
	justify-content: center;
}
.button_wrap.flex.right{
	justify-content: flex-end;
}

.button_wrap.flex div:not(:first-child){
	margin-left: 10px;
}

.button_wrap .borderBtn:not(.gray):hover{
	background-color: #F8FAFF;
}
.button_wrap .borderBtn.blue:hover{
	background-color: #EFF3FF;
}
.button_wrap .borderBtn.red:hover{
	background-color: #FFF8F8;
}
.button_wrap .darkBlueBtn:hover{
	background-color: #1C3253;
}
.button_wrap .grayBlueBtn:hover{
	background-color: #5D6F8A;
}
.button_wrap .blueBtn:hover,
.applyBtn_wrap .applyBtn:hover{
	background-color: #2830CB;
}

.sortSelect .selectInputDiv::after{
	top: 9px;
	right: 13px;
	width: 7px;
	height: 7px;
}
.sortSelect .selectInput{
	height: 30px;
	font-size: 13px;
	padding-right: 30px;
	cursor: pointer;
}
#creerYear{
  width: 168px;
}

/*hover pop*/
.hoverPopPos{
	position: relative;
}
.hoverPopBox{
	background-color: #fff;
	border: 1px solid #D7DCE5;
	border-radius: 5px;
	padding: 10px;
	font-size: 12px;
	color: #526074;
	position: absolute;
	top: 35px;
	left: 0;
	width: 300px;
	font-weight: normal;
	word-break: keep-all;
	display: none;
	box-shadow: 3px 3px 3px rgba(0,0,0,.29);
}
.hoverPopBtn:hover + .hoverPopBox{
	display: block;
}

/*goTop*/
.floating_list li,
.goTop{
	width: 47px;
	height: 47px;
	border-radius: 50%;
	margin: 10px 0;
	position: relative;
}
.floating_list li.top,
.goTop{
	background-color: #fff;
	border: 1px solid #324663;
	color: #324663;
	font-size: 14px;
	padding-top: 10px;
	font-weight: 500;
}
.floating_list li.top:before,
.goTop:before{
	content:'';
	display: inline-block;
	width: 6px;
	height: 6px;
	border-top: 2px solid #324663;
	border-left: 2px solid #324663;
	position: absolute;
	top: 12px;
	left: 50%;
	transform: translateX(-50%) rotate(45deg);
}
.floating_list li a,
.goTop a{
	display: block;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
}

/*option list*/
.arrow{
	display: inline-block;
	width: 10px;
	height: 10px;
	border-right: 1px solid #324663;
	border-bottom: 1px solid #324663;
	transform: rotate(45deg);
	margin-left: 12px;
	position: relative;
	top: -4px;
	z-index: 1;
	transition: .3s;
}
.select_wrap{
	position: relative;
}
.selectDiv{
	position: absolute;
	top: 0;
	left: 0;
	padding: 5px 12px;
	border: 1px solid #324663;
	border-radius: 100px;
	color: #324663;
	transition: .3s;
	z-index: 9;
}
.option_list{
	display: none;
}
.option_list li{
	margin: 12px 0;
}
.option_list li:last-child{
	margin-bottom: 0;
}
.option_list li:hover{
	color: #5158DD;
}
.option_list .proMatch{
	color: #5158DD;
	font-weight: bold;
}

.selectDiv.on{
	border-color: #C5C5C5 !important;
	background: none !important;
	background-color: #fff !important;
	border-radius: 10px;
	transition: .3s;
	padding: 12px;
	color: #324663 !important;
}
.selectDiv.on .select{
	color: #C5C5C5;
	text-align: left;
}
.selectDiv.on .arrow{
	border-color: #C5C5C5 !important;
}

/*all menu*/
.allMenu_wrap{
	position: relative;
	z-index: 9;
}
.allMenu{
	color: #324663;
	display: flex;
	position: relative;
	padding-right: 55px;
	cursor: pointer;
}
.allMenu:after{
	content:'';
	display: inline-block;
	width: 0;
	height: 14px;
	border-left: 1px solid #C5C5C5;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}
.allMenu .menuIcon{
	display: inline-block;
	width: 22px;
	height: 16px;
	border-top: 2px solid #324663;
	border-bottom: 2px solid #324663;
	position: relative;
	top: 2px;
	margin-right: 7px;
}
.allMenu .menuIcon::before{
	content:'';
	display: block;
	width: 100%;
	height: 0;
	border-top: 2px solid #324663;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.allMenu:hover{
	color: #5158DD;
}
.allMenu:hover .menuIcon,
.allMenu:hover .menuIcon:before{
	border-color: #5158DD;
}

.allMenuDiv .option_list{
	border:1px solid #C5C5C5;
  padding: 13px 17px;
	color: #324663;
	position: absolute;
	top: 30px;
	left: 0;
	border-radius: 10px;
	background-color: #fff;
	width: 135px;
	font-size: 15px;
	z-index: 20;
}
.allMenuDiv .option_list li:first-child{
	margin-top: 0;
}

/*service btn*/
.service_wrap{
	width: 125px;
	height: 30px;
	cursor: pointer;
}
.service_wrap .selectDiv{
	width: 100%;
	font-size: 15px;
	height: 100%;

	border-color: #5D6F8A;
	color: #5D6F8A;

	/* border-color: transparent;
	background: transparent linear-gradient(90deg, #5158DD 0%, #2DB2E3 100%) 0% 0% no-repeat padding-box;
	color: #fff; */
}
.service_wrap .select{
	text-align: center;
}
.service_wrap .arrow{
	border-color: #5D6F8A;
	margin-left: 15px;
}
.service_wrap .arrow.active{
	/* transform: rotate(-225deg); */
}
.service_wrap:hover .selectDiv{
	background-color: #F8FAFF;
	border-color: #324663;
	color: #324663;
}
.service_wrap:hover .selectDiv .arrow{
	border-color: #324663;
}

.service_wrap .selectDiv.on{
	height: auto;
}

/*fix banner*/
.fixBanner{
	height: 237px;
	border-radius: 14px;
	overflow: hidden;
}
.fixBanner img{
	width: 100%;
}

/*side Banner*/
.sideDiv{
	margin-left: 15px;
}
.sideBannerDiv{
	width: 88px;
	border-radius: 7px;
	overflow: hidden;
}
.sideBannerDiv.short{
	height: 147px;
}
.sideBannerDiv.long{
	height: 333px;
}
.sideBannerDiv img{
	width: 100%;
}

.sideBannerDiv + .floatingWrap{
	margin-top: 70px;
}
.sideBannerDiv + .floatingWrap .floating_wrap{
	right: 40px;
}
.recruitWrap .sideDiv{
	margin-left: 5px;
	padding-top: 70px;
  letter-spacing: 2px;
}

/*input style*/
.txtInput,
.selectInput,
.txtareaInput{
	border: 1px solid #D7DCE5;
	background-color: #fff;
	border-radius: 5px;
	height: 46px;
	width: 100%;
	padding: 0 10px;
  transition: .2s;
}
.txtInput.trick{
  width: 76%;
}
.txtInput.short,
.selectInput.short{
	width: 162px;
}
.txtInput.center{
	text-align: center;
}
.txtInput:hover{
	background-color: #F8FAFF;
	border-color: #5D6F8A;
}
.txtInput.gray{
	background-color: #F9F9F9;
}
.txtareaInput{
	height: 160px;
	padding: 10px;
}
.txtInput#ReceptionDate{
	width: 38.4%;
}
.sortSelect.d-flex{
	display: flex;
	justify-content: space-between;
	align-items: end;
	gap: 12px;
}
.selectInputDiv{
	background-color: #fff;
	position: relative;
}
.selectInput{
	background-color: transparent;
	position: relative;
	z-index: 1;
}
.selectInputDiv:after{
	content:'';
	display: inline-block;
	width: 10px;
	height: 10px;
	border-right: 2px solid #CECECE;
	border-bottom: 2px solid #CECECE;
	transform: rotate(45deg);
	position: absolute;
	top: 13px;
	right: 17px;
}
.chkDiv{
	position: relative;
}
.chkDiv.chk{
	left: 10px;
}
.chkDiv.marginL{
	margin-left: 20px;
	white-space: nowrap;
}
.chkDiv input[type="checkbox"],
.chkDiv input[type="radio"]{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	border: none;
	width: 0;
	height: 0;
}
.chkDiv input + label{
	padding-left: 25px;
	position: relative;
	cursor: pointer;
}
.chkDiv.radio input + label{
	padding-left: 30px;
}
.chkDiv input:checked + label{
	color: #5158DD;
	font-weight: bold;
	cursor: pointer;
}
.searchCont_list .chkDiv input + label{
  color: #373F57;
}

.chkDiv input + label:before,
.chkDiv input + label:after{
	content:'';
	display: inline-block;
	position: absolute;
	top: 1px;
	left: 0;
}
.chkDiv input + label:before{
	border: 1px solid #D7DCE5;
	background-color: #fff;
}

.chkDiv.chk input + label:before{
	width: 17px;
	height: 17px;
	border-radius: 3px;
}
.chkDiv.chk input:checked + label:before{
	background-color: #5158DD;
	border-color: #5158DD;
}
.chkDiv.chk input:checked + label:after{
	width: 12px;
	height: 10px;
	background: url(/images/whiteChk.svg) no-repeat;
	top: 6px;
	left: 3px;
}

.chkDiv.radio input + label:before{
	width: 21px;
	height: 21px;
	border-radius: 50%;
	top: 0;
}
.chkDiv.radio input:checked + label:before{
	border-color: #5158DD;
}
.chkDiv.radio input:checked + label:after{
	width: 11px;
	height: 11px;
	background-color: #5158DD;
	border-radius: 50%;
	top: 6px;
	left: 6px;
}

.chkDiv.chk.small input + label{
	padding: 0 22px;
	white-space: nowrap;
	cursor: pointer;
	transition: .2s;
}
.chkDiv.chk.small input + label:hover span{
	color: #444c9a;
}
.chkDiv.chk.small input + label:before{
	top: 2px;
	width: 14px;
	height: 14px;
}
.chkDiv.chk.small input:checked + label:after {
	top: 5px;
    left: 2px;
}

.chkDiv.radio.small input + label{
	padding-left: 22px;
}
.chkDiv.radio.small input + label:before{
	width: 16px;
	height: 16px;
}
.chkDiv.radio.small input:checked + label:after{
	width: 10px;
	height: 10px;
	top: 4px;
	left: 4px;
}

.chkDiv.chk.gray{
	font-size: 14px;
}
.chkDiv.chk.gray input:checked + label{
	color: #526074;
}
.chkDiv.chk.gray input:checked + label:before{
	background-color: #8F959E;
	border-color: #8F959E;
}

.radio_list{
	display: flex;
	align-items: center;
}
.radio_list li{
	width: 20%;
}

/*scroll style*/
.scrollStyle{
	overflow-y: auto;
}
.scrollStyle::-webkit-scrollbar {
	width: 10px;
}
.scrollStyle::-webkit-scrollbar-thumb {
	background-color: #D7DCE5;
}
.scrollStyle::-webkit-scrollbar-track {
	background-color: #F6F6F6;
}

/*POP*/
.layerPopup{
	display: none;
}
.popWrap{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99;
	background-color: rgba(0,0,0,.4);
}
.pop_wrap{
	position: relative;
	background-color: #fff;
	padding: 50px;
	width: 700px;
	border-radius: 30px;
	box-shadow: 5px 5px 10px rgba(0,0,0,.29);
}
.pop_wrap.wd800{width: 800px;}
.pop_wrap > .tit{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
}
.pop_wrap > .tit .sub{
	font-weight: normal;
	font-size: .9em;
}
.pop_wrap .subCont{
	font-size: 13.5px;
	color: #8F959E;
	margin-top: 12px;
	padding-bottom: 15px;
}

.pop_wrap .popX{
	display: inline-block;
	width: 18px;
	height: 18px;
	position: absolute;
	top: 30px;
	right: 30px;
	cursor: pointer;
}
.pop_wrap .popX:before,
.pop_wrap .popX:after{
	content:'';
	display: inline-block;
	width: 25px;
	height: 0;
	border-top: 1px solid #C5C5C5;
	position: absolute;
	top: 9px;
	right: -3px;
}
.pop_wrap .popX:before{
	transform: rotate(45deg);
}
.pop_wrap .popX:after{
	transform: rotate(-45deg);
}

.layerPopup.area .pop_wrap,
.layerPopup.depth .pop_wrap{
	padding: 35px 30px;
}

.layerPopup.simple .pop_wrap{
	border-radius: 30px;
}
.layerPopup.simple .pop_wrap.itis{
	padding: 0;
	text-align: center;
}
.layerPopup.simple .pop_wrap > .tit{
	font-weight: normal;
	font-size: 24px;
	padding: 20px 0;
	border-bottom: 1px solid #D7DCE5;
}
.layerPopup.simple .pop_wrap > .tit span{
	display: block;
}
.layerPopup.simple .pop_wrap > .tit .company{
	font-size: 14px;
	color: #8F959E;
	margin-bottom: 5px;
}

.layerPopup.simple .offer_wrap{
	padding-left: 35px;
}
.layerPopup.simple .offer_wrap > .tit{
	font-size: 14px;
	padding: 5px 0 7px;
	background: white;
	text-align: center;
	padding-right: 35px;
}
.layerPopup.simple .offer_list{
	display: block;
	max-height: 410px;
}
.layerPopup.simple .offer_list li{
	width:520px;
	border-radius: 18px;
	border: 1px solid #D7DCE5;
	padding: 23px 28px;
	font-size: 14px;
	margin: 20px auto;
	position: relative;
	color: #526074;
}
.layerPopup.simple .offer_list li .date{
	text-align: left;
}
.layerPopup.simple .offer_list li .tit{
	font-weight: bold;
	font-size: 16px;
	margin: 2px 0 8px;
	color: #373F57;
	text-align: left;
}
.layerPopup.simple .offer_list li .modi_wrap{
	display: flex;
	justify-content: space-between;
}
.layerPopup.simple .offer_list li .modi{
	display: inline-block;
	margin-right: 24px;
}

.layerPopup.simple .listRadio{
	position: absolute;
	top: 15px;
	right: 22px;
}
.layerPopup.simple .listRadio input{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	width: 0;
	height: 0;
	appearance: none;
}
.layerPopup.simple .listRadio input + label:before{
	content:'';
	display: inline-block;
	width: 26px;
	height: 26px;
	border: 1px solid #D7DCE5;
	border-radius: 50%;
}
.layerPopup.simple .listRadio input:checked + label:before{
	border-color: #06DFF2;
	background-color: #06DFF2;
}
.layerPopup.simple .listRadio input:checked + label:after{
	content:'';
	display: inline-block;
	width: 27px;
	height: 17px;
	background: url(/images/blueChk.svg) no-repeat;
	position: absolute;
	top: 3px;
	left: 4px;
}

.layerPopup.simple .button_wrap {
	width: 390px;
	margin: 30px auto;
}
.layerPopup.simple .button_wrap .blueBtn{
	font-size: 20px;
}

.layerPopup.alert .pop_wrap{
	width: 340px;
	text-align: center;
	padding: 50px 20px 30px;
	word-break: keep-all;
}
.layerPopup.alert .pop_wrap .grayTxt{
	color: #8F959E;
	font-size: 12px;
	margin-top: 5px;
}
.layerPopup.alert .pop_wrap .button_wrap{
	margin-top: 15px;
}
.layerPopup.alert .pop_wrap .button_wrap > div{
	width: 100px;
}
.layerPopup.alert .pop_wrap .popX{
	top: 20px;
	right: 20px;
}

/*depth style*/
.depthWrap{
	border: 1px solid #D7DCE5;
	font-size: 14px;
}
.depth_wrap{
	display: flex;
	height: 227px;
}
.depth_wrap > div{
	height: 100%;
	padding: 8px 10px;
}
.depth_wrap > div.depthDiv01{
	padding: 5px 15px;
	width: 30%;
	border-right: 1px solid #D7DCE5;
}
.depthDiv02{
	width: 70%;
}

.depth_list li{
	margin: 3px;
}
.depthDiv01 .depth_list li{
	margin: 12px 5px;
}

.depthDiv02 .depth_list{
	display: flex;
	flex-wrap: wrap;
}
.depthDiv02 .depth_list li{
	width: 31%;
	padding: 5px 10px;
	border-radius: 100px;
	text-align: center;
	border: 1px solid #fff;
	cursor: pointer;
}
.depthDiv02 .depth_list li.on{
	background-color: #F6F6FF;
	border: 1px solid #B2C7FF;
	font-weight: bold;
}

.depthResultDiv{
	background-color: #F9F9F9;
	padding: 13px;
	font-size: 13px;
	border-top: 1px solid #D7DCE5;
}
.depthResultDiv .none{
	color: #C5C5C5;
	padding: 0 5px;
}

.depthResult_list{
	display: flex;
	flex-wrap: wrap;
}
.depthResult_list li{
	color: #5158DD;
	position: relative;
	margin: 5px 10px;
}
.depthResult_list li .del,
.reco_list li .del{
	display: inline-block;
	width: 15px;
	height: 15px;
	cursor: pointer;
	position: relative;
	/* right: -3px; */
}
.depthResult_list li .del:before,
.depthResult_list li .del:after,
.reco_list li .del:before,
.reco_list li .del:after{
	content:'';
	display: inline-block;
	width: 13px;
	height: 0;
	border-top: 1px solid #CECECE;
	position: absolute;
	top: 9px;
	right: 0;
	transform: rotate(45deg);
}
.depthResult_list li .del:after,
.reco_list li .del:after{
	transform: rotate(-45deg);
}
.reco_list li .del:before,
.reco_list li .del:after{
	border-color: #526074;
}

.refresh_wrap{
	text-align: right;
	font-size: 15px;
	color: #8F959E;
	margin-top: 10px;
}
.refresh{
	cursor: pointer;
}
.refresh img{
	position: relative;
	top: -2px;
	left: -1px;
}

/*LOGIN*/
body[data-page="Login"] #container{
	padding: 120px 0 200px;
}
body[data-page="Login"],
body[data-page="Login"] #container *{
	font-family: Pretendard,'Noto Sans KR', sans-serif;
	letter-spacing: 0;
}
.login_wrap{
	width: 394px;
	margin: 0 auto;
	font-size: 18px;
}
.login_wrap .logo{
	text-align: center;
	margin-bottom: 18px;
}
.login_wrap .logo img{
	width: 210px;
}
.login_wrap .txtInput{
	margin: 13px 0;
	height: 55px;
}

.login_wrap .chkDiv.chk{
	margin-top: 5px;
}
.login_wrap .chkDiv.chk input:checked + label{
	color: #373F57;
	font-weight: normal;
}
.login_wrap .button_wrap .submit{
	margin: 18px 0;
	height: 55px;
	font-size: 20px;
}

.join_list{
	display: flex;
	margin: 20px 0 38px;
	font-size: 16px;
}
.join_list li{
	color: #8F959E;
	height: 15px;
	line-height: 15px;
	cursor: pointer;
}
.join_list li.join{
	font-weight: 500;
	border-right: 1px solid #D7DCE5;
	color: #373F57;
	padding-right: 18px;
	margin-right: 18px;
}
.loginBanner{
	width: 394px;
	height: 85px;
	overflow: hidden;
	display: flex;
	justify-content: center;
}
.loginBanner img{
	height: 100%;
}

.layerPopup.login .pop_wrap{
	width: 520px;
	padding: 60px;
}
.layerPopup.login .tit{
	font-size: 26px;
	font-weight: normal;
	text-align: center;
	margin-bottom: 37px;
}
.layerPopup.login .join_list{
	margin-bottom: 0;
}

.layerPopup.join .logo_list{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 26px;
}
.layerPopup.join .logo_list li span{
	color: #D7DCE5;
    font-size: 22px;
    line-height: 0;
    display: inline-block;
    padding: 0 10px;
    font-weight: 100;
    position: relative;
    top: 2px;
	font-family: Pretendard,'Noto Sans KR', sans-serif;
	letter-spacing: 0;
}
.layerPopup.join .txt_wrap{
	text-align: center;
}
.layerPopup.join .txt_wrap span{
	display: block;
	margin-top: 10px;
}
.layerPopup.join .button_wrap{
	margin-top: 25px;
}
.layerPopup.join .button_wrap div{
	width: 136px;
}

.layerPopup.findID{
	text-align: center;
}
.layerPopup.findID .count_wrap{
	margin-top: 7px;
}
.layerPopup.findID .count{
	display: inline-block;
	border: 2px solid #D7DCE5;
	border-radius: 50%;
	font-size: 17px;
	font-weight: bold;
	width: 33px;
	height: 33px;
	line-height: 28px;
}

/*fin page*/
.finPage_wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 50px;
}
.finPage_wrap .img{
	margin-bottom: 10px;
}
.finPage_wrap .txt_wrap{
	width: 100%;
	text-align: center;
	font-size: 18px;
}
.finPage_wrap .txt_wrap .tit{
	font-weight: bold;
}
.finPage_wrap .txt_wrap .sub{
	margin: 7px 0 20px;
}
.finPage_wrap .txt_wrap .link a{
	display: inline-block;
	width: auto;
	color: #8F959E;
	border-bottom: 1px solid #8F959E;
}
.finPage_wrap .txt_wrap .link a:hover{
	color: #526074;
	border-color: #526074;
}
.finPage_wrap .button_wrap{
	margin: 35px auto 0;
}
.finPage_wrap .button_wrap div{
	width: 200px;
}

/*resume list*/
.resumeBox_list > li{
	background-color: #fff;
	border: 1px solid #D7DCE5;
	border-radius: 20px;
	padding: 25px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 14px;
	margin: 13px 0;
}
.resumeBox_list > li:first-child{
	margin-top: 0;
}
.resumeBox_list > li .img{
	width: 60px;
	height: 60px;
	border-radius: 50%;
	overflow: hidden;
}
.resumeBox_list > li .img img{
	width: 100%;
}
.resumeBox_list > li .info,
.resumeBox_list > li .txt .tit{
	font-size: 16px;
}
.resumeBox_list > li .info{
	width: 15%;
}
.resumeBox_list > li .info div{
	margin: 5px 0;
}
.resumeBox_list > li .txt{
	width: 50%;
	word-break: keep-all;
}
.resumeBox_list > li .txt div{
	margin: 7px 0;
}
.resumeBox_list > li .txt .tit{
	font-weight: bold;
}
.resumeBox_list > li .btn{
	width: 16%;
	text-align: center;
	color: #8F959E;
}
.resumeBox_list > li .btn .button_wrap div{
	padding: 10px 0;
	margin-bottom: 10px;
}

.resumeBox_list .keyword_list{
	display: flex;
	flex-wrap: wrap;
	position: relative;
	left: -3px;
}
.resumeBox_list .keyword_list li{
	margin: 3px;
	background-color: #D7DCE5;
	border-radius: 8px;
	padding: 5px 7px;
}

.txtCount{
	font-size: 13px;
	color: #CECECE;
	position: absolute;
	bottom: 20px;
	right: 15px;
}
#ui-datepicker-div{
	background-color: white;
	border: 1px solid black;
	/* width: 272px; */
}
.ui-datepicker table{
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
/* 
.ui-datepicker-prev.ui-corner-all,
.ui-datepicker-next.ui-corner-all{
	width: 50%;
	margin-bottom: 10px;
}
.ui-datepicker-next.ui-corner-all{
	text-align: right;
}
.ui-datepicker-title{
	display: flex;
	justify-content: space-between;
	align-items: center;
} */
#List_left_2{
	height: 245px !important;
}

.selectInputDiv.money.resizeing{
	width: 265px;
}