/* 공통 */
span.blue {color:#0036ce;}
span.red {color:red;}
p.square {position:relative; font-size:14px; line-height:24px; padding:0 0 0 12px; color:#808080;}
p.square:after {content:''; display:block; position:absolute; top:10px; left:0; width:4px; height:4px; background:#000;}
div[data-role="button"] button.etc_button {background:#ebebeb;}

/* 타이틀 */
div.page_title_wrap h3.page_title.login {text-align:center;}
div.page_title_wrap h3.page_title span {font-size:30px;}

/* 회원가입 박스 */
div.box_join {width:780px; margin:0 auto;}
div.box_join > h4 {margin-bottom:30px; font-size:22px; line-height:24px; text-align:center;}
div[data-role=join] {padding:50px 80px; box-sizing:border-box; background:#e3f0fc;}
div[data-role=join] p.help {margin-top:20px; font-size:16px; line-height:24px; color:#333;}

/* 인증박스 */
div.box_self {}
div.box_self p.title_info {margin-bottom:40px; font-size:18px; color:#808080; line-height:1.4; word-break:keep-all;}
div.box_self div[data-role="button"] button {width:120px;}
div.box_self div[data-role="button"] button.btn_submit {margin-left:2px;}

/* 안내 사항 */
div.info {margin-top:30px;}
div.info > strong {display:inline-block; width:100%; margin-bottom:10px; font-size:15px;}
div.info > strong > i {display:inline-block; width:18px; height:21px; background:url(../images/info_ico.png) no-repeat top center; vertical-align:middle;}

/* 가입회원구분선택 */
div.division {display:inline-block; width:48%; vertical-align:middle; box-sizing:border-box;}
div.division.first {margin-right:20px;}
div.division > a {display:inline-block; width:100%; padding:200px 40px 55px; border-radius:4px; background:#fff url(../images/join_ico_kidz01.png) no-repeat top 60px center; box-sizing:border-box;}
div.division.first > a {background:#fff url(../images/join_ico_normal01.png) no-repeat top 60px center;}
div.division > a > p {font-size:14px; line-height:24px; text-align:center; color:#808080;}
div.division > a > p.blue {margin-bottom:10px; font-size:22px; color:#0036ce;}
div.division > a > p.blue > i {vertical-align:revert;}

/* 회원가입 상단 */
div.box_select {margin-bottom:40px; text-align:center;}
div.box_select > span {position:relative; display:inline-block; padding-right:110px; font-size:18px; line-height:24px; color:#808080;}
div.box_select > span:after {content:''; display:inline-block; width:70px; height:1px; position:absolute; top:15px; right:18px; border-top:2px dotted #ddd;}
div.box_select > span.last {padding-right:0;}
div.box_select > span.last:after {display:none;}
div.box_select > span > i {display:inline-block; margin-right:10px; font-size:30px; vertical-align:sub;}
div.box_select > span.selected {color:#0036ce;}
div.box_select > span.selected > i {color:#0036ce;}
div.box_select > span.selected > .step_title {position:relative; display:inline-block; vertical-align:2px;}
div.box_select > span.selected > .step_title:before {content:''; position:absolute; left:0; bottom:-4px; width:100%; height:3px; background:#0036ce;}

/* 본인인증 */
div.self {display:inline-block; width:31.7%; margin-right:20px; vertical-align:middle;}
div.self.last {margin-right:0;}
div.self > a {display:inline-block; width:100%; padding:200px 40px 55px; border-radius:4px; box-sizing:border-box;}
div.self > a.cellphone {background:#fff url(../images/self_ico_cellphone.png) no-repeat top 60px center;}
div.self > a.company {background:#fff url(../images/self_ico_company.png) no-repeat top 60px center;}
div.self > a.kakaopay {background:#fff url(../images/self_ico_kakaopay.png) no-repeat top 60px center;}
div.self > a > p {font-size:14px; line-height:24px; text-align:center; color:#808080;}
div.self > a > p.blue {margin-bottom:10px; font-size:22px; color:#0036ce;}
div.self > a > p.blue > i {vertical-align:revert;}
div.self > a > p.text {height:72px;}

/* 학부모인증 */
div[data-role=join].parent {padding:50px 260px;}
div.parent {box-sizing:border-box;}
div.parent > a {display:inline-block; width:100%; padding:200px 40px 55px; border-radius:4px; background:#fff url(../images/parent_ico_agree.png) no-repeat top 60px center; box-sizing:border-box;}
div.parent > a > p {font-size:14px; line-height:24px; text-align:center; color:#808080;}
div.parent > a > p.blue {margin-bottom:10px; font-size:22px; color:#0036ce;}
div.parent > a > p.blue > i {vertical-align:revert;}

/* 약관동의 */
div.agree > div.all_agree > label {font-size:22px; line-height:26px;}
div.agree > ul {margin-top:20px; border-top:1px solid #000;}
div.agree > ul > li {padding:15px 20px; border-bottom:1px solid #e0e0e0; background:#fff; box-sizing:border-box;}
div.agree > ul > li > div {display:inline-block; width:calc(100% - 100px);}
div.agree > ul > li > div > label {font-size:16px; line-height:26px;}
div.agree > ul > li > a {display:inline-block; padding:8px 15px; border:1px solid #e0e0e0; border-radius:2px; box-sizing:border-box;}

/* 회원정보입력 */
div.info > h4 {margin-bottom:20px; font-size:22px; line-height:26px;}
div.info > form > ul {background:#fff;}
div.info > form.basic > ul {margin-bottom:40px;}
div[data-role=inputset].inline > div[data-role=input][data-name=email] {width:150px; margin-right:4px;}
div[data-role=join] div.button > button {padding:13px 15px; border-radius:3px; box-sizing:border-box; background:#0036ce; color:#fff;}
div[data-role=join] div.button > button.reset {margin-left:5px;}
ul[data-role=form] > li > div div.button {display:inline-block;}
ul[data-role=form] > li > label + div p.help {margin-top:5px; padding-left:10px; font-size:12px; line-height:20px; color:#808080;}
ul[data-role=form] > li > label + div p.help span.blue {font-weight:bold;}
ul[data-role=form] > li > div:last-child {padding-right:10px;}
ul[data-role=form] > li > div > div[data-role=input].id {width:300px; margin-right:4px;}
ul[data-role=form] > li > div div.button > button.bg_gray {background:#ebebeb; color:#16171a;}
ul[data-role=form] > li > div div.button > button.bg_gray.complete {cursor:default;}
ul[data-role=form] > li > div p.help + div.button {margin-top:5px;}
div[data-role=join] div[data-role=input][data-type=radio] > label > button.radio {position:relative; display:inline-block; width:24px; height:24px; margin:-3px 8px -3px -32px; box-sizing:border-box; border:8px solid #d1d1d1; float:left; background:#fff; border-radius:50%; cursor:pointer; vertical-align:middle;}
div[data-role=join] div[data-role=input][data-type=radio] > label > button.radio.on {border-color:#0036ce;}
div[data-role=join] div[data-role=input][data-type=radio] > label span.boxlabel {display:inline-block; position:relative;}
div[data-role=join] div[data-role=input][data-type=radio] > label span.boxlabel:after {content:''; display:none; position:absolute; left:0; bottom:-4px; width:100%; height:2px; background:#0036ce;}
div[data-role=join] div[data-role=input][data-type=radio] > label > button.radio.on + span.boxlabel:after {display:block;}

/* 회원가입완료 */
div[data-role=join].sucess {padding-top:180px; background-image:url(../images/sucess_ico.png); background-repeat:no-repeat; background-position:top 80px center;}
div.sucess {padding:40px 0 30px; box-sizing:border-box;}
div.sucess > h4 {font-size:28px; line-height:30px; text-align:center;}
div.sucess > p {margin:30px 0 40px; font-size:16px; line-height:26px; color:#666; text-align:center;}
div.sucess > div.button {text-align:center;}
div.sucess > div.button a {display:inline-block; padding:0 30px; height:50px; line-height:50px; text-align:center; border-radius:3px; font-size:16px; box-sizing:border-box; background:#0036ce; color:#fff;}

/* 팝업 */
div.box_popup.join div.popup > div.popup_inner > div[data-role="button"] {height:auto; padding-top:25px; border-bottom:none;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > h4 {font-size:18px; font-weight:bold;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > strong {display:inline-block; width:100%; margin:30px 0 15px; font-size:15px; font-weight:bold; color:#0036ce;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > p.sub_tit {line-height:22px;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > p.margin_t {margin-top:30px;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > p.text {line-height:22px; color:#666; word-break:keep-all;}
div.box_popup.join div.popup > div.popup_inner > div[data-role="button"] > button {width:120px; height:48px; line-height:48px;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt .underline {text-decoration:underline; font-weight: 700; font-size: 18px; color: #666; line-height: 1.4!important;}
div.box_popup.join div.popup > div.popup_inner > div > div.box_txt span.text {line-height:22px; color:#666; word-break:keep-all; margin-left: 0;}
/*div.box_popup.join div.popup > div.popup_inner > div > div.box_txt > span.underline {text-decoration:underline; font-weight: 700; font-size: 18px;}*/

div.context {padding-bottom: 60px;}
main.login_agree div.context {padding-bottom:30px;}
main.login_agree div.box_self div[data-role="button"] button {width:200px;}

main.join_step2 div[data-role=input][data-type=input] .join_name {max-width: 250px;}
main.join_step2 div[data-role=input][data-type=input] .join_birth_year {max-width: 60px;}
main.join_step2 .birth_year_wrap {display: flex; align-items: center; gap: 4px;}
main.join_step2 div[data-role=input][data-type=input] .join_email1 {max-width: 150px;}
main.join_step2 div[data-role=input][data-type=input] .join_email2 {max-width: 150px;}
main.join_step2 div[data-role=inputset].inline > div[data-role=input][data-name=email] {max-width: 130px;}
main.join_step2 div[data-role=input][data-type=input] .join_password {max-width: 160px;}
main.join_step2 div[data-role=input][data-type=input] .join_password_check {max-width: 160px;}
main.join_step2 div[data-role=input][data-type=input].join_username {max-width: 250px;}
main.join_step2 div[data-role=input].join_country {max-width: 250px;}
main.join_step2 div[data-role=input].join_city {max-width: 250px;}
main.join_step2 div[data-role=input].join_education {max-width: 250px;}
main.join_step2 div.context {padding-bottom:60px;}
main.join_step2 div.info div[data-type='input'] {display: flex; align-content: center; flex-wrap: wrap; row-gap: 10px; position:relative;}
main.join_step2 div.info div[data-type='input'] > label {position:absolute; width:0px; height:0px; overflow:hidden;}
main.join_step2 div.info .opt-info, main.join_step2 select.select-origin {display:none;}
main.join_step2 ul li div {background:#fff;}
main.join_step2 li.custom-select-option:hover {background:#66afe9; color:#fff;}
main.join_step2 div[data-role=input][data-type=radio] > label > button.radio {border:8px solid #d1d1d1;}
main.join_step2 div[data-role=input][data-type=radio] > label > button.radio.on {border-color:#0036ce;}
main.join_step2 div[data-name=country] ul.custom-select-list {max-height:200px; overflow-y:auto;}

main.join_step1 div.context {padding-bottom:30px;}
main.join_step1 div.box_popup div.popup > div.popup_inner > div > div.box_txt > p.text.bold {font-weight:bold;}
main.join_step1 div.box_popup div.popup > div.popup_inner > div > div.box_txt > p.text.bold > b {font-weight:bold;}
main.join_step1 div.box_popup div.popup > div.popup_inner > div > div.box_txt > p.text.big {font-size:18px; line-height:1.5;}
main.join_step1 div.agree span.red {color:red;}
main.join_step1 div.breadcrumb a.tabindex:focus-visible {box-sizing:border-box; border:3px dashed red !important; padding:0 3px; outline:none; line-height:initial;}
main.join_step1 .tabindex:focus-visible {border-color:#FA8585; box-shadow:0 0 10px red; outline:none;}

main.join_step3 div.context {padding-bottom:60px;}
main.join_step3 span.korname, span.email {font-weight:500;}
@media screen and (max-width:1199px) {
	/* 본인인증 */
	div.self {width:100%; margin-bottom:20px;}
	div.self.last {margin-bottom:0;}
	div.self > a > p.text {height:auto;}

	/* 학부모인증 */
	div[data-role=join].parent {padding:50px 80px;}
}

@media (min-width:992px) and (max-width:1020px) {
	div[data-role=inputset].inline > div[data-role=input].email2 {margin-top:10px;}
	div[data-role=inputset].inline > div[data-role=input].email2 + div {margin-top:10px;}
}

@media screen and (max-width:1019px) {
	div.box_select {text-align:left;}
	div.box_select > span:after {display:none;}
	div.box_select > span {width:100%; padding-right:0; margin-bottom:10px; text-align:left;}
	div.box_select > span.last {margin-bottom:0;}

	ul[data-role=form] > li > div > div[data-role=input].id {width:100%; margin-right:0;}
	ul[data-role=form] > li > div > div[data-role=input].id + div.button.check {margin-top:10px;}
}

@media screen and (max-width:991px) {
	div[data-role=inputset].inline > div[data-role=input].email2 {margin-right:0 ;}
	/* 회원정보입력 */
	div.info > ul {background:#fff; padding:20px; box-sizing:border-box;}
}

@media screen and (max-width:768px) {

}

@media screen and (max-width:678px) {
	/* 회원가입 박스 */
	div.box_join {width:100%; margin:0;}

	div[data-role=join] {padding:50px 20px}

	/* 가입회원구분선택 */
	div.division {width:100%;}
	div.division.first {margin-right:0; margin-bottom:20px;}

	/* 학부모인증 */
	div[data-role=join].parent {padding:30px;}
	div.parent > a > p.blue {line-height:30px;}
}

@media only screen and (max-width:599px) {
	/* 폼 테이블 */
	ul[data-role=form] > li {display:block;}
	ul[data-role=form] > li > label {display:block; width:100% !important; height:auto; padding:10px 0px 0px 0px; background:transparent; line-height:1.6;}
	ul[data-role=form] > li > label:after {content:" :";}
	ul[data-role=form] > li > div {display:block; padding:5px 0px; min-height:auto; line-height:1;}
	ul[data-role=form] > li > label + div {padding-left:0px;}
	ul[data-role=form] > li > div + label {display:block; border-left:0px; border-top:1px solid #e3e4e5;}
}

@media screen and (max-width:567px) {
	main.login_agree div.box_self div[data-role="button"] button {width: 100%;}
	div.box_self div[data-role="button"] button.btn_submit {margin: initial;}
}

@media screen and (max-width:490px) {
	/* 약관동의 */
	div.agree > ul > li > div {width:100%; margin-bottom:10px;}
}

@media screen and (max-width:321px) {
	div.agree > div.all_agree > label {font-size:18px;}
}
@media screen and (min-width:280px) and (max-width:319px){
	div.box_self div[data-role="button"] button {width:120px;}
}

div.box_popup div.popup > div.popup_inner > div {max-height: 65vh;}