@charset "utf-8";


/*회원공통*******************************************************************/
.member_guide{border:1px solid #ddd; border-radius:10px; padding:30px 3%;}
.member_guide *{box-sizing:border-box;}

.member_tit{ font-size:36px; text-align:center; letter-spacing:-0.05em; margin-bottom:20px;}

.member_box{ padding:0px 3%;}
.member_box li{ display:inline-block; margin-bottom:10px;}
.member_box li > span{ display:inline-block; padding:0 10px;}
.member_box button{}

@media all and (max-width :480px) {
.member_guide{padding:20px 5%;}
.member_tit strong{ font-size:30px;}
}


.guide01{height:150px; border:1px dotted #ccc; padding:20px; overflow:auto; margin-bottom:10px; font-size:14px; color:#666;}
.guide01 h5{ margin:15px 0 !important; background:none !important; padding-left:0 !important; color:#0033a6; font-family:'notokr-bold';}
.guide01 h6{ margin-bottom:5px !important; background:none !important; padding-left:0 !important; color:#0033a6; font-family:'notokr-bold';}
.agree_info{color:#fff; background:#68707d; padding: 7px 10px; border-radius: 5px;}

.meme_agree input[type=radio].basic_input, input[type=checkbox].basic_input { display: none; }
.meme_agree input[type=radio].basic_input + label, input[type=checkbox].basic_input + label { cursor: pointer; }
.meme_agree input[type=radio].basic_input + label span, input[type=checkbox].basic_input + label span { display: inline-block; border: 1px solid #d8d8d8; width: 20px; height: 20px; position: relative; box-sizing: border-box; vertical-align: middle; margin-top: -3px; margin-right: 5px; transition: all .3s; }
.meme_agree input[type=radio].basic_input + label span::after, input[type=checkbox].basic_input + label span::after { content: ''; }
.meme_agree input[type=radio].basic_input:checked + label span, input[type=checkbox].basic_input:checked + label span { border-color: #acacac; }
.meme_agree input[type=radio].basic_input:checked + label span::after, input[type=checkbox].basic_input:checked + label span::after { width: 8px; height: 5px; position: absolute; border: 3px solid #ff444b; border-top: 0; border-right: 0; transform: rotate(-45deg); left: 50%; margin-left: -5px; top: 50%; margin-top: -5px; transition: all .3s;}
.meme_agree input[type=radio].basic_input + label span { border-radius: 20px; }


/*로그인 *******************************************************************/
.login_guide{ width:350px; margin:60px auto 0 auto; background:#f5f5f5;}
.login_guide button{ border-radius:10px; color:#fff; padding:15px 0; margin:5px 0;width:100%; font-weight:600; font-size:18px;}
.login_guide .login_btn_naver{background:#2db400 url("../images/board/icon_naver01.png") 10% center no-repeat;}
.login_guide .login_btn_kakao{color:#3b1e1e;  background:#fae100 url("../images/board/icon_kakao01.png") 10% center no-repeat;}
.login_guide .login_btn_facebook{background:#3c5b9b url("../images/board/icon_facebook01.png") 10% center no-repeat;}

/*비회원 로그인 *******************************************************************/
.login_guide2{ width:350px; margin:60px auto 0 auto; background:#ffffff;}
.login_guide2 button{ border-radius:10px; color:#fff; padding:15px 0; margin:5px 0;width:100%; font-weight:600; font-size:18px;}


@media all and (max-width :480px) {
.login_guide{ width:80%; margin:0px auto;}
.login_guide button{font-size:17px;}

}





/* 회원가입 ************************************************************/
.join_guide{}

.join_btn_guide{margin-top:60px; text-align:center; font-size:0;}
.join_btn_guide button{ display:inline-block; margin:0 10px; width:180px; text-align:center; padding-top:70px; padding-bottom:25px; font-size:16px; font-weight:600; border-radius:10px;}
.join_btn_naver{ background:#2db400 url("../images/board/icon_naver02.png") center 30px no-repeat; color:#fff;}
.join_btn_kakao{background:#fae100 url("../images/board/icon_kakao02.png") center 30px no-repeat; color:#3b1e1e;}
.join_btn_facebook{background:#3c5b9b url("../images/board/icon_facebook02.png") center 30px no-repeat; color:#fff;}


.join_guide .join_ok{ text-align:center; margin-bottom:30px;}
.join_guide .join_ok strong{ font-size:30px; letter-spacing:-1px; display:block;}
.join_guide .join_ok p{ margin-top:20px;}

@media all and (max-width :767px) {
.join_btn_guide button{margin:0 1%; width:31%; background-size:auto 25px;font-size:15px; vertical-align:top; letter-spacing:-0.05em;}
}


@media all and (max-width :640px) {
.join_guide .join_ok strong{ font-size:20px;}
.join_guide .join_ok p{ font-size:14px; letter-spacing:-1px;}
}

@media all and (max-width :480px) {
.join_btn_guide button{ width:55%; margin-bottom:10px; background-size:auto 25px;font-size:15px;}
}