﻿
/* 로그인  */

.login_top_txt{display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 50px;}
.login_top_txt ul{background: url("../images/board/member_symbol.png") left center no-repeat; padding-left: 120px; min-height: 90px; display: flex; flex-direction: column; justify-content: center;}
.login_top_txt ul li{font-size: 20px; line-height: 1.4em; word-break: keep-all;}
.login_top_txt ul li > span{display: block;}

.login_guide{ background: #fff;border: 1px solid #eee; box-shadow: 1px 5px 15px #ddd; width: 1100px; margin:0 auto; border-radius: 20px; display: flex; justify-content: center;}
.login_guide > div{flex: 1; padding: 50px 7%; text-align: center; max-width: 550px;}

.login_guide h5{text-align: center; margin-bottom: 40px !important;  background: none !important; padding-left: 0;}
.login_guide h5 > span{display: inline-block; position: relative; font-size: 30px; font-weight: 500;}
.login_guide h5 > span:after{position: absolute; display: block; content: ''; width: 100%; height: 3px; background: #000; bottom: 0;}

.login_guide .btn{ padding: 8px 20px; margin: 5px 2px 0 2px; border:1px solid #ddd; border-radius: 20px; display: inline-block;}
.login_guide .btn:hover, .login_guide .btn:focus{ background: #f3f3f3;border:1px solid #ccc;}

.login_box01 ul{ display: flex; justify-content:space-between;padding-top: 21px;}
.login_box01 ul li {width: 48%;}
.login_box01 ul li.sns_naver a{ background:#03c85a url("../images/board/icon_naver02.png") center 40px no-repeat;}
.login_box01 ul li.sns_kakao a{ background:#fecc00 url("../images/board/icon_kakao02.png") center 40px no-repeat;}
.login_box01 ul li a{ display: block;height: 130px;vertical-align: top;font-size: 14px; background-size:100px !important; color: #fff; border-radius: 10px; box-shadow: 1px 2px 10px #ddd;}
.login_box01 ul li a:hover,
.login_box01 ul li a:focus{transform:scale(1.02, 1.02);}
.login_box01 ul li a > strong{ display: inline-block; border-bottom: 1px solid #fff;margin-top: 70px;}

.login_box01 p{ padding: 30px 0 7px 0; word-break: keep-all;}


.login_box02{border-left: 1px solid #eee;}
.login_box03{}

.login_box02 ul li, .login_box03 ul li{ margin: 10px 0;}
.login_box02 ul li span, .login_box03 ul li span{ display: block; font-size: 15px; margin-bottom: 3px; text-align: left;}
.login_box02 ul li input, .login_box03 ul li input{ height: 40px; line-height: 40px; width: 100%; background: #e4e4f4;padding:0  5px; border: none;}
.login_box02 ul li input:focus, .login_box03 ul li input:focus{ background:#a5c5ff;}
.login_box02 ul li button, .login_box03 ul li button{ height: 55px; width: 100%; background: #1d2087; box-shadow: 1px 5px 10px #ddd; color: #fff; border: 1px solid #1d2087; font-size: 18px;}



@media all and (max-width :1280px) {
.login_guide{ width: 100%; }
.login_guide > div{padding: 50px 5%; width: 100%; }

}

@media all and (max-width :767px) {
	.login_top_txt ul{background-size: 80px; padding-left: 95px; min-height: 70px;}
	.login_top_txt ul li{font-size: 16px; }
	.login_top_txt ul li > span{display: inline;}

	.login_guide{ flex-direction: column; align-items: center;}

	.login_box02{border-left: none; border-top: 1px solid #eee;}

	.login_guide h5{margin-bottom: 20px !important; }
	.login_guide h5 > span{font-size: 24px; font-weight: 500;}

}

@media all and (max-width :480px) {
	.login_guide > div{padding: 30px;}
}




/* 회원가입 */
.join_box00{margin-bottom: 50px;}
.join_box01{border: 1px solid #c7c7c7; padding:20px; border-radius: 6px; box-shadow: 3px 3px 10px #eee; text-align: left; height: 210px; overflow-y: auto; overflow-x: hidden;}
#content .join_box01 > h6{padding-left: 0;}
.join_box01 > ul{ margin-bottom: 30px; margin-left: 10px;}
.join_box01 > ul li{ margin-bottom: 10px;}
.join_box01 > ul.cul02 > li{line-height: 1.6em; background: url("../images/board/icon01.gif") left 10px no-repeat; padding-left: 10px;}
.join_box01 > ul li > ul{ margin-left: 20px; margin-top: 10px;}
.join_box01 > ul li dl{margin-left: 20px;}
.join_box01 > ul li dl dt{margin-top: 10px; margin-bottom: 10px;}

.join_box02{margin: 10px 0; display: flex; justify-content: flex-end;}

.join_btn{ height: 40px; border-radius: 4px; padding: 0 20px; font-size: 15px; color: #fff; display: inline-block; background: #000;}

@media all and (max-width:767px) {
.join_box00{margin-bottom: 30px;}
.join_box01{ height: 120px;padding:10px; }

.join_box01 > ul{ margin-left: 0px;}
.join_box01 > ul li > ul{ margin-left: 0px; }
.join_box01 > ul li dl{margin-left: 0px;}

.join_box02{justify-content:flex-start}

.join_btn{ padding: 0 10px; }
}







/* 아이디비밀번호찾기 완료*/
.idpw_ok{ font-size: 18px;font-weight: 500; text-align: center; padding: 30px; background: #f6f6f6; margin: 20px; border-radius: 4px;}
.idpw_ok > strong{ font-size: 24px;}

@media all and (max-width :1280px) {
.join_ok{  background-size:250px; padding: 0 0 0 300px;width: 650px;height: 250px;}
.join_ok li{ font-size: 28px; margin-bottom: 0;letter-spacing: -0.06em;}
}

@media all and (max-width :767px) {
.join_ok{background: url("../images/inc/login_img05.png") center top no-repeat;  background-size:120px; padding: 120px 0 0 0;width: 100%;height:auto; text-align: center;align-items:baseline; margin-bottom: 20px;}
.join_ok li{font-size: 18px;}
.join_ok li span{ font-size: 15px;}


.idpw_ok{ font-size: 15px;}
.idpw_ok > strong{ font-size: 18px;}
}



/* 개인정보처리방침/이용약관*/
.member_guide{}
#content .member_guide h6{font-size: 26px; margin-bottom: 20px; padding-left: 0;}
.member_guide .txt01{ margin-bottom: 20px;}
.member_guide .txt02{ margin-bottom: 70px;}
.member_guide > ul{margin-left: 0px; margin-bottom: 70px;}
.member_guide > ul > li{margin-bottom: 10px;}

.member_guide ul{ margin-left: 15px;}
.member_guide ul li li{margin-bottom: 10px;}
.member_guide ul ul{margin-top: 10px;}
.member_guide dl{margin-left: 15px;}
.member_guide dl dt{margin-top: 20px;margin-bottom: 10px;}
.member_guide dl dd{color: #555;margin-bottom: 10px;}




@media all and (max-width :1024px) {
#content .member_guide h6{font-size: 22px;}
}

@media all and (max-width :767px) {
#content .member_guide h6{font-size: 20px;}
.member_guide .txt02{ margin-bottom: 40px;}
.member_guide > ul{margin-bottom: 40px;}

.member_guide ul{ margin-left:0px;}
.member_guide dl{margin-left: 0px;}

}







