@charset "utf-8";

/* 
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 100;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');}
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');}
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');}
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');}
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');}
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 900;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');}
*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, button,
cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section,
summary, time, mark, audio, video { 
	margin:0; padding:0; border:0; 
	font-size:3.2vw; 
	font-family: 'Noto Sans KR', sans-serif;
	vertical-align:baseline; 
	background:transparent;
	color:#282828;
	letter-spacing:-0.05em;
	font-weight:300;
}
fieldset, img, iframe{border:0 none;}
dl, ul, ol, li{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
th, td, input, select, textarea, button{vertical-align:middle; color:inherit; outline:0 none;}
button{border:0 none; background-color:transparent; cursor:pointer;}
address, caption, cite, code, dfn, em, th, var{font-style:normal; font-weight:normal;}
legend, caption{visibility:hidden; height:0; width:0; font-size:0;}
legend{*width:0;}
hr{display:none;}
a,a:hover,a:visited,a:active{color:inherit; text-decoration:none;}
table{border-collapse:collapse; border-spacing:0;}
strong{font-weight:500; font-size:inherit;}
img{width:100%;}

#joinWrap{background-color:#f8f8f8; text-align:center;}
#joinHeader{width:95%; margin:0 auto; padding:14.5% 0 6.2%;}
#joinHeader a{width:50%; margin:0 auto; display:block;}
#joinFooter{width:95%; margin:0 auto; padding:10.3% 0; color:#999; letter-spacing:0;}
#joinCnt{width:95%; margin:0 auto;}
.joinTitle{font-size:5.2vw; font-weight:500; margin-bottom:6.5%;}
.subTitle1{font-size:5.2vw; line-height:1.4em; margin-top:2.5%; text-align:center;}
.subTitle2{font-size:4vw; line-height:1.5em; text-align:center; border-bottom:1px solid #e1e1e1; padding-bottom:7.5%; margin-bottom:7.5%;}
.cntBox{background-color:#fff; text-align:left; padding:8% 5%; position:relative;}

/* 동의하기 */
.agreeAll{}
.agreeAll label{font-size:4vw; font-weight:500;}
.agreeAll p.agreeTxt{padding:2% 0 6%; border-bottom:1px solid #e1e1e1; color:#666; line-height:1.65em;}
.agreeTitle{color:#d23a58; font-weight:500; margin-top:6%;}
.agreeList{}
.agreeList li{margin-top:3.5%; position:relative;}
.agreeList li a{display:block; position:absolute; top:8%; right:1.3%; width:2.4vw; height:4vw; font-size:0; background: url('../images/arrow_list.png') no-repeat right center; background-size:100%;}
.agreePopup{display:none; position:absolute; background:#fff; width:90%; height:90%; padding:5%; overflow-y:auto; top:5%; left:5%; border:1px solid #111; z-index:1; box-sizing:border-box;}
.agreePopup h1{margin-bottom:3%; font-size:4vw; font-weight:500; position:relative;}
.agreePopup .txt{line-height:1.5em; color:#666;}
.txt ul li{position: relative; padding-left: 10px; margin-top: 3px;}
.txt ul li:before{content:''; position:absolute; top:14%; left:0; width: 5px; height: 5px; background: #d23a58; border-radius:50%;}
.mt20{margin-top: 20px;}
.mb10{margin-bottom: 10px; display: block;}
/* 인증하기 */
.certifyList{margin:7% 0;}
.certifyList li{position:relative; border:1px solid #e1e1e1; font-size:4vw; background: url('../images/arrow_list.png') no-repeat 95% center; background-size:2.8%;}
.certifyList li a{display:block; padding:8.4% 0 8.4% 26%;}
.certifyList li a:before{content:''; display:block; width:12vw; height:12vw; position:absolute; left:6%; top:20%; border-radius:50%;}
.certifyList li:hover{border-color:#d23a58; background: url('../images/arrow_list_on.png') no-repeat 95% center; background-size:2.8%;}
.certifyList li:hover a{color:#d23a58; font-weight:500;}
.certifyList li:last-child{margin-top:2.3%;}
.certifyList li.certifyCellphone a:before{background:#ccc url('../images/icon_certifyCellphone.png') no-repeat center center; background-size:100%;}
.certifyList li.certifyIpin a:before{background:#ccc url('../images/icon_certifyIpin.png') no-repeat center center; background-size:100%;}
.certifyList li.certifySearchid a:before{background:#ccc url('../images/icon_certifySearchid.png') no-repeat center center; background-size:100%;}
.certifyList li.certifyLogin a:before{background:#ccc url('../images/icon_certifyLogin.png') no-repeat center center; background-size:100%;}
.certifyList li:hover a:before{background-color:#d23a58;}

/* 가입완료 */
.saveTitle1{font-size:4vw; line-height:1.5em; text-align:center; margin-top:3.5%;}
.saveTitle2{font-size:4vw; line-height:1.5em; text-align:center; margin-top:12%; font-weight:500;}
.saveBnr{}
.saveBnr li{background:#f5f5f5; width:100%; height:24vw; margin:3.5% auto 0;}

/* 회원탈퇴 */
.withdrawBox{background:#f5f5f5; padding:5%; font-size:2.8vw; line-height:1.9em;}
.withdrawBox span{color:#d23a58; font-size:2.8vw;}
.withdrawAgree{margin-top:5%;}
.withdrawAgree label{font-size:3.2vw; font-weight:500;}
.withdrawPopup{display:none; position:absolute; background:#fff; width:90%; padding:5%; left:5%; border:1px solid #111; z-index:1; box-sizing:border-box; margin-top:-70%; text-align:center;}
.withdrawPopup h1{margin:1.3% 0 2.5%; font-size:5.2vw; font-weight:500; position:relative;}
.withdrawPopup .txt{line-height:1.5em; color:#666;}

.withdrawSave{text-align:center; background: url('../images/icon_saveWithdraw.png') no-repeat center 16%; background-size:23%;}
.withdrawSave h1{font-size:5.2vw; font-weight:500; padding-top:30%;}
.withdrawSave h2{font-size:4vw; padding:1.3% 0 7%;}

/* 휴면회원 */
.dormant{font-size:4vw; line-height:1.5em; text-align:center; padding:3% 0;}

/* 아이디/비밀번호 찾기 */
.searchList{margin-bottom:7%;}
.searchList:after{content:''; display:block; clear:both;}
.searchList li{float:left; text-align:center; margin-left:2%; background:#f5f5f5; border:1px solid #f5f5f5; width:23.5%; height:9.6vw; line-height:2.9em; box-sizing:border-box;}
.searchList li:first-child{margin-left:0;}
.searchList li a{display:block; color:#666;}
.searchList li.active{background:#fff; border:1px solid #282828;}
.searchList li.active a{color:#282828; font-weight:500;}
a.btnCertify{float:right; background:#fff; color:#d23a58; border:1px solid #d23a58; font-size:3.2vw; display:block; height:9.5vw; line-height:2.9em; text-align:center; width:35%;}

.pwPopup{display:none; position:absolute; background:#fff; width:90%; padding:5%; left:5%; border:1px solid #111; z-index:1; box-sizing:border-box; margin-top:-75%; text-align:center;}
.pwPopup h1{font-size:4vw; font-weight:500; position:relative;}
.pwPopup h2{font-size:4vw; position:relative; margin:1.3% 0;}
.pwPopup .txt{line-height:1.5em; color:#666;}
.pwPopup .txt p{margin:2.3% 0;}
.pwPopup a.popLogin{width:55%; background:#d23a58;}

/* 정보수정 */
.btnArea{text-align:center; margin-top:7%;}
.btnArea:after{content:''; display:block; clear:both;}
.btnArea a{display:block; width:48.7%; color:#fff; font-size:4vw; font-weight:500; padding:3.5% 0;}
.btnArea a.btnCancel{background:#b5b5b5; float:left;}
.btnArea a.btnSave{background:#d23a58; float:right;}
.btnArea a.btnMain{background:#282828; float:left;}
a.btnWithdraw{display:inline-block; margin-top:4.5%; text-decoration:underline;}
a.btnPw{display:inline-block; width:30%; color:#fff; font-size:2.8vw; font-weight:500; padding:1.5% 0; background:#d23a58; text-align:center;}

/* 정보입력 */
.memberInfo{}
.memberInfo dt{font-weight:500; margin-bottom:3.5%; position:relative;}
.memberInfo dd{margin-bottom:3.5%; position:relative;}
.memberInfo dd:last-child{margin-bottom:0;}
.memberInfo dd:after{content:''; display:block; clear:both;}
.memberInfo dt strong{display:inline-block; width:20%;}
.gradeBox{background:#f5f5f5; line-height:2em; text-align:center; padding:2.3% 0; margin-top:3.5%;}
.gradeBox:after{content:''; display:block; clear:both;}
.gradeBox li{float:left; width:50%; color:#666; position:relative;}
.gradeBox li:nth-child(2):before, .gradeBox li:last-child:before{content:'/'; display:inline-block; font-size:3.2vw; position:absolute; left:0;}
.gradeBox li span{display:inline-block; width:24%; color:#666; text-align:left;}
.iconQ{display:inline-block; background: url('../images/iconQ.png') no-repeat center center; font-size:0; width:4vw; height:4vw; position:absolute; margin-left:2%; top:12%; background-size:100%;}
.infoPopup{display:none; position:absolute; background:#fff; width:90%; padding:5%; left:5%; border:1px solid #111; z-index:1; box-sizing:border-box; margin-top:-30%;}
.infoPopup h1{margin-bottom:2.3%; font-size:4vw; font-weight:500; position:relative;}
.infoPopup .txt{line-height:1.5em; color:#666;}
.joinTable{width:100%; text-align:center; margin-top:5.5%;}
.joinTable thead tr th{background:#d5d5d5; padding:2%; color:#666;}
.joinTable thead tr td{background:#e1e1e1; padding:2%;}
.joinTable tbody tr th{background:#e8e8e8; padding:2%; color:#666;}
.joinTable tbody tr td{background:#f5f5f5; padding:2%;}
a.btnPost{float:left; background:#282828; color:#fff; font-size:3.2vw; display:block; height:10vw; line-height:2.9em; text-align:center; width:35%;}

/* 탭 */
.tabBoxwrap{background:#fff; padding:8% 5% 0; position:relative; z-index:1;}
.tabBoxwrap .tabBox{margin-bottom:-2.3%;}
.tabBox{margin-bottom:7%;}
.tabBox:after{content:''; display:block; clear:both;}
.tabBox li{float:left; width:50%; height:10vw; line-height:3em; text-align:center; box-sizing:border-box;}
.tabBox li a{color:#666; display:block; border:1px solid #e1e1e1; border-bottom-color:#d23a58;}
.tabBox li:first-child a{margin-right:-1px;}
.tabBox li a.tabOn{color:#d23a58; font-weight:500; border-color:#d23a58; position:relative; border-bottom:0;}

/* 공통 */
a.btnStyle1{background:#d23a58; border:1px solid #d23a58; color:#fff; font-size:4vw; font-weight:500; display:block; padding:3.5% 0; margin-top:7%;}
a.btnStyle2{background:none; border:1px solid #d23a58; color:#d23a58; font-size:4vw; font-weight:500; display:block; padding:3.5% 0; margin-top:7%;}
a.btnStyle3{background:#b5b5b5; border:1px solid #b5b5b5; color:#fff; font-size:4vw; font-weight:500; display:block; padding:3.5% 0; margin-top:7%;}

.btnClose{display:block; position:absolute; right:5%; width:4.8vw; height:4.8vw; font-size:0; background: url('../images/btn_close.png') no-repeat right center; z-index:2; background-size:100%;}
.popBtn{margin:5% 0 2.3%;}
.popBtn a{display:inline-block; width:25%; color:#fff; font-size:3.2vw; font-weight:500; padding:2.5% 0; margin:0 1.3%;}
.popBtn a.popCancel{background:#b5b5b5;}
.popBtn a.popOk{background:#d23a58;}
.inputtxt{border:1px solid #e1e1e1; height:10vw; padding:0 3.5%; font-size:3.2vw; width:100%; box-sizing:border-box;}
.inputscore{background:none; font-size:3.2vw; width:17%; text-align:center; border:0;}
.inputphone1{float:left; width:30%;}
.inputphone2{float:left; width:70%; margin-left:-1px;}
.inputemail{display:inline-block; width:31.3%;}
.inputetc{margin-top:2.3%;}
.inputjob{margin:-1px 0 2.3%;}
.inputaddress1{float:left; width:65%;}
.inputaddress2{margin:-1px 0;}
.inputright{text-align:right;}
.searchphone{float:left; width:62%;}
.selectyear1{float:left; width:30%;}
.selectyear2{float:left; width:30%; margin-left:-1px;}
.txtyear{float:left; padding:3% 0 0 3%;}
.txterror{display:block; color:#d23a58; font-size:2.8vw; margin-top:1.3%;}
.txtable{display:block; color:#0071c8; font-size:2.8vw; position:absolute; right:3.5%; top:0; margin-top:3%;}
.radioList label{margin-right:5%;}
.red{color:#d23a58;}
.blind{display:none;}

input[type="radio"] {
	width:3vw;
	height:3vw;
	margin:0 2.3% 0 0;
}
input[type="checkbox"] {
	/* 실제 체크박스는 화면에서 숨김 */
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0
}
input[type="checkbox"] + label {
	display: inline-block;
	position: relative;
	padding-left: 9%;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}
input[type="checkbox"] + label:before {
	/* 가짜 체크박스 */
	content: '';
	position: absolute;
	left: 0;
	top: 5%;
	height:5.2vw; 
	width:5.2vw; 
	background: url('../images/checkbox.png') no-repeat center center;
	background-size:100%;
}
input[type="checkbox"]:checked + label:before {
	/* 체크박스를 체크했을때 */
	background: url('../images/checkbox_on.png') no-repeat center center; 
	background-size:100%;
}
select {
	width: 100%;
	font-family: inherit;
	background: url('../images/arrow_select.png') no-repeat 95% center;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-size: 3.2vw;
	border: 1px solid #e1e1e1;
	padding: 0 3.5%; 
	height: 10vw; 
	box-sizing: border-box;
}
select::-ms-expand {
	display: none;
}

.opt{margin-left: 9%;}
.opt p{margin-bottom: 3.5%;}
.opt label{padding-top: 2px; margin-right: 5%;}