/*
+----------------------------------------------------------------------+
| Copyright (c) 2010-2018 STUDYMAX. co. Ltd
+----------------------------------------------------------------------+
| 작업일 : 2018-10-15
| 파일설명 : 회원정보 - 아이디/비밀번호 찾기 css
+----------------------------------------------------------------------+
| 작업자 : 우현진 
+----------------------------------------------------------------------+
| 수정이력 
| 20221121 아이디, 비밀번호 찾기 페이지 개선 by Karimi Elnaz    
+----------------------------------------------------------------------+
*/
@charset "euc-kr";

/* bg Color */
.bgColor_ffffff {background-color:#fff;}
.bgColor_f8f8f8 {background-color:#f8f8f8;}
.fontColorOrange{color:#ed1c24;}
.fontColorGray{color:#7f7f7f;}

/* 개선 페이지 레이아웃 공통 */
.rnbWrap {top:411px; margin-left: 580px;}

/* 우측 메뉴 배경색(추후에 전체 페이지 적용시 삭제 예정) */
.rnbList {background-color:#fff;}

/* 아이디/비밀번호 찾기 페이지 */
.tabsSwitch{display: flex; justify-content: center; margin:51px auto 0;}
.tabsSwitch .tablinks{
	width: 100%;
    height: 67px;
    box-sizing: border-box;
    font-family: 'NotoSansKR-Medium','Malgun Gothic', 'dotum', sans-serif;
    font-size: 22px;
    background: #f1f1f1;
    border: 1px solid #e1e1e9;
    border-bottom: 1px solid #999;
    color: #999;
    cursor: pointer;
    text-align: center;
}
.tabsSwitch .tablinks:hover {background-color: #ddd;}
.tabsSwitch .tablinks.active{background-color: white; border:1px solid #999; border-bottom-color:#fff; color:#333;}

.contentWrap {width:1100px; margin:0 auto; letter-spacing: -1px;}

/* Form Padding 세팅 */
.contTableSection td.pdLeft {padding-left:128px;}
.contSectionArea {padding-left: 203px; box-sizing:border-box; color: #7f7f7f;}

.contTableSection {margin-right:100px;}
.contTableSection{border-collapse: collapse; border-spacing: 0;}
.contTableSection {width:100%;text-align: center;}
.contTableSection th, .contTableSection td {height:34px;padding-top:12px;padding-bottom:12px;text-align:left;}
.contTableSection th {width:128px;color:#545454;font:normal 16px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif;letter-spacing:-0.6px;}
.contTableSection td {position:relative; width: calc((100% - 0.1px) - 128px);;text-align:left;} 
.contTableSection td .inputCmmn {width: 394px; height: 48px; border-radius: 4px; padding: 0 20px; border: 1px solid #c2c2c2; font: normal 16px 'NotoSansKR-Light', 'Malgun Gothic', 'dotum', sans-serif; color: #545454;}
.contTableSection td .inputCmmn::placeholder {color:#999; font-size:14px !important;}
.contTableSection .exMark {display:inline; position:absolute; top:25px; margin-left: 17px;}
.contTableSection .exMark img {margin-top:2px;}
.cautionTextWrap{display:inline-flex;align-items:center;}
.contTableSection .cautionText {font:normal 14px 'NotoSansKR-DemiLight', 'Malgun Gothic', 'dotum', sans-serif; letter-spacing: -0.6px;}
.authInputBox {position:relative;}
#countdownTimer {position:absolute; right: 10px; top: 0px;}

.contSectionTitle {text-align: center;}
.contSection .contBTitle {font:normal 29px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif;text-align:center; letter-spacing:-0.6px; padding:60px 0 0;}
.contSection .contTitle {font:normal 17px 'NotoSansKR-DemiLight', 'Malgun Gothic', 'dotum', sans-serif; color:#818181;text-align:center; letter-spacing:-0.6px; padding-bottom: 50px;}

.contTableSection .authBtn {box-sizing:border-box;height:48px; margin-left:17px; padding:0 20px; border:1px solid #c2c2c2; background:#eee; color:#7d7d7d; font:normal 16px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif; border-radius:4px;}
.contTableSection .authBtn.on {cursor:pointer; background:#333; color:#fff; border:1px solid #333;}
.contTableSection .authBtn:focus {border:0;}

.submitBtn {display: block; text-align: center; margin: 40px 0 80px;}
.submitBtn button { width: 484px; height:66px; font:normal 20px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif; cursor:pointer; background:#ff1717; color:#fff; border-radius:4px;}
.submitBtn button.off{background:#999;}

/* 아이디/비밀번호 찾기 결과 페이지 CSS */
.contSectionWrap {margin:80px;}
.idList {width:500px; margin:40px auto 90px; border:1px solid #ddd; border-radius:4px;}
.idInfoBox {padding:20px; box-sizing:border-box; border-bottom:1px solid #ddd;}
.idInfoBox:after {content:''; display:table; clear:both;}
.idInfoBox:last-child {border-bottom:0;}
.userId {float:left; font:normal 18px 'NotoSansKR-DemiLight', 'Malgun Gothic', 'dotum', sans-serif; letter-spacing:-0.6px;}
.dateStatus {float:right; font:normal 16px 'NotoSansKR-DemiLight', 'Malgun Gothic', 'dotum', sans-serif; color:#7f7f7f; letter-spacing:-0.6px;}
.contBTitle_ID {font:normal 29px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif;text-align:center; letter-spacing:-0.6px;}
.contTitle_ID {font:normal 17px 'NotoSansKR-DemiLight', 'Malgun Gothic', 'dotum', sans-serif; color:#818181;text-align:center; letter-spacing:-0.6px;}
.loginBtnBox {text-align:center;}
.loginBtn {width: 484px; height:66px; font:normal 20px 'NotoSansKR-Medium', 'Malgun Gothic', 'dotum', sans-serif; cursor:pointer; background:#ff1717; color:#fff; border-radius:4px;}

.contText {font-size:22px; font-family: 'NotoSansKR-Medium'; margin:40px 0 90px; text-align:center;}
.contText .orange {font-size: 22px; color:orange; font-family: 'NotoSansKR-Medium'; vertical-align: top;}