body { background: #f7f9fa !important; }


.mContainer { overflow-y: auto; }

#member-wrap .login-wrap { max-width: 94%; }
#member-wrap .lLogo { width: 19rem; }
#member-wrap .lTitle { color: #3d60ce; }
#member-wrap .c-check i { background: #3d60ce; }
#member-wrap .aniBtn, .basicBtn { background: #3d60ce; border-color: #3d60ce; }
#member-wrap .orLine span { background: #f7f9fa; }
#member-wrap .loginInput input { background-color: #fff; border-radius: 0.5rem; border: 1px solid #d1d1d1; }


.joinLogo { width: 19rem; margin: auto; padding: 3rem 1rem 1rem; }
.joinContainer-wrap { padding: 1.5rem; color: #4d4d4d; }
@media (min-width: 580px){ .joinLogo { padding: 6rem 0.5rem 4rem; } .joinContainer-wrap { padding: 0rem 2rem 5rem; } }
.joinContainer > .inner {  max-width: 65rem; margin: auto; border: 1px solid #e7e8ef; border-radius: 0.5rem; box-shadow: 0px 3px 29px 0px rgba(0, 0, 0, 0.03); background-color: #fff; }

.joinContainer > .inner .insertLine { position: relative; padding: 5rem 4rem 4rem 2rem; }
.joinContainer > .inner .insertLine:before { content: ''; position: absolute; left: 4.5rem; top:0; width: 1px; height: 100%; background-color: #e7e8ef; z-index: 0; }

.joinContainer > .inner .joinTitle { margin-bottom: 4rem; position: relative; padding-left: 7rem; } 
.joinContainer > .inner .joinTitle h2 { font-size: 0; line-height: inherit; }
.joinContainer > .inner .joinTitle strong { font-size: 2.4rem; font-weight: 600; word-spacing: -0.1rem; letter-spacing: -0.05rem; }
.joinContainer > .inner .joinTitle span { font-size: 1.6rem; font-weight: 500; padding-left: 0.8rem; color: #979fa6; }
.joinContainer > .inner .joinTitle i { font-size: 2.2rem; position: absolute; left: 0; top: 50%; transform: translateY(-50%); border: 1px solid #ccc; line-height: 5rem; height: 5.2rem; width: 5.2rem; border-radius: 50%; background-color: #fff; }
.joinContainer > .inner .joinTitle p { font-size: 1.4rem; line-height: 130%; color: #9a9da6; word-break: keep-all; padding-top: 0.5rem;  }

.joinContainer > .inner dl + dl { margin-top: 3rem; }
.joinContainer > .inner dl > dt { position: relative; padding-left: 7rem; padding-bottom: 0.5rem; }
.joinContainer > .inner dl > dt:before { content: ''; position: absolute; left: 2.1rem; top: 45%; transform: translateY(-50%); width: 1rem; height: 1rem; background-color: #d6dadc; border-radius: 50%; }
.joinContainer > .inner dl > dt strong { font-weight: 500; font-size: 1.7rem; }
.joinContainer > .inner dl > dt span { padding-left: 0.5rem; font-weight: 400; font-size: 1.4rem; color: #979fa6; }

.joinContainer > .inner dl > dd { padding-left: 7rem; padding-top: 0.5rem;}
.joinContainer > .inner dl > dd .insertText { font-weight: 400; color: #5066aa; }
.joinContainer > .inner dl > dd > input { width: 100%; background-color: #fff; border: 1px solid #dcdcdc; font-size: 1.5rem; border-radius: 0.3rem; font-weight: 300; line-height: 150%; }
.joinContainer > .inner dl > dd > .warning { color: #f39800; font-size: 1.3rem; padding: 0.7rem 0.3rem 0; display: block; font-weight: 300; }
.joinContainer > .inner dl > dd + dd { margin-top: 0.5rem; }

.joinContainer > .inner .btnGroup { padding: 3rem 4rem; border-top: 1px solid #e7e8ef; background-color: #f7f9fa; }
.joinContainer > .inner .btnGroup .lineBtn { background-color: #fff; }

.agreeContainer { border-top: 1px solid #e7e8ef; padding: 2rem 0; }

.agreeContainer .checkBtn-line { padding: 0.5rem 4rem; font-size: 1.5rem; border-top: 0; }
.agreeContainer .checkBtn-line .c-check { padding: 0; position: static; display: inline-block; }
.agreeContainer .checkBtn-line .c-check i { top: 50%; }
.agreeContainer .checkBtn-first { border-bottom: 1px dashed #e7e8ef; padding: 1rem 4rem 1.5rem; margin-bottom: 0.5rem; }
.agreeContainer .checkBtn-line .checkBtn { position: relative; padding: 0; }
.agreeContainer .checkBtn-line .moreBtn { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.agreeContainer .checkBtn-line .moreBtn * { display: inline-block; vertical-align: middle; }
.agreeContainer .checkBtn-line .moreBtn span { font-weight: 500; color: #888; font-size: 1.3rem; line-height: 1.8rem; }
.agreeContainer .checkBtn-line .moreBtn i { font-size: 1.7rem; line-height: 1.8rem; color: #ccc; }
.agreeContainer .checkBtn-line .moreBtn:hover i { color: #3d60ce; }



.joinContainer > .inner dl > dd.domain-insert { font-size: 0; }
.joinContainer > .inner dl > dd.domain-insert input,
.joinContainer > .inner dl > dd.domain-insert strong { display: inline-block; vertical-align: middle; }
.joinContainer > .inner dl > dd.domain-insert input { width: calc(100% - 9.5rem); }
.joinContainer > .inner dl > dd.domain-insert strong { font-weight: 500; font-size: 1.7rem; color: #3d60ce; width: 9.5rem; padding-left: 0.5rem; }

.joinContainer > .inner dl > dd.cellPhone-insert { font-size: 0; }
.joinContainer > .inner dl > dd.cellPhone-insert * { display: inline-block; vertical-align: middle; }
.joinContainer > .inner dl > dd.cellPhone-insert span { font-size: 1.5rem; width: 2rem; text-align: center; }
.joinContainer > .inner dl > dd.cellPhone-insert .customSelect { width : calc(33.333% - 4rem); max-width: 9rem; font-size: 1.4rem; border: 1px solid #dcdcdc; }
.joinContainer > .inner dl > dd.cellPhone-insert .customSelect label,
.joinContainer > .inner dl > dd.cellPhone-insert .customSelect select { padding: 0.8rem 1rem; }
.joinContainer > .inner dl > dd.cellPhone-insert input { width: 33.333%; max-width: 10rem; }

.clause-wrap { max-width: 80rem; margin: auto; background-color: #fff; border-radius: 0.5rem; position: relative; }
.clause-wrap > .inner { padding: 4rem; }
.clause-wrap > .inner h2 { font-size: 2.3rem; font-weight: 500; padding: 0rem 0.5rem 2rem; border-bottom: 0.3rem double #ccc; }
.clause-wrap > .inner .clauseContainer { padding-top: 2rem; font-size: 1.4rem; }





@media (min-width: 800px){ 
	.joinContainer > .inner .insertLine { padding: 5rem 6rem 4rem 4rem; }
	.joinContainer > .inner .insertLine:before { left: 6.5rem; }
	
	.joinContainer > .inner dl > dt strong { font-size: 1.6rem; }
	.joinContainer > .inner dl > dt span { font-size: 1.3rem; }
	.joinContainer > .inner dl > dd > input { font-size: 1.4rem; padding: 0.8rem 1rem; }
	
	.joinContainer > .inner .btnGroup { padding: 3rem 6rem; }
	
	.agreeContainer .checkBtn-line { padding: 0.5rem 6rem; font-size: 1.4rem; }
	.agreeContainer .checkBtn-first { padding: 1rem 6rem 1.5rem; }
}
dd label.error {
    color: #ec561b;
    font-weight: normal;
    font-size: 1.2rem;
    padding-top: 5px;
    display: block;
}
dd div#errNm2{display: block;}