@charset "utf-8";

/* 로그인 */
.login_wrap {padding: 40px 0}
.login_wrap .noti {margin-bottom: 16px}
.login_wrap .noti li {font-size: 13px; padding-left: 18px; background: url(../../images/member/log_noti_blt.gif) 0 1px no-repeat; line-height: 1.3; margin-top: 4px}
.login_wrap .noti li:first-child {margin-top: 0}
.login_wrap .noti .bld {font-weight: 400}
.login_area {width: 100%; max-width: 701px; margin: 0 auto 40px auto; box-sizing: border-box}
.login_area .form_row {margin-bottom: 10px}
.login_area .jqTransformSelectWrmemberer {border: 1px solid #cfdaf4; height: 47px; background: url(../../images/member/select_arrow01.png) 100% 50% no-repeat;border-radius: 4px}
.login_area .jqTransformSelectWrapper a.jqTransformSelectOpen {height: 47px}
.login_area .jqTransformSelectWrapper div span {padding: 7px 18px; font-size: 16px}
.login_area .jqTransformSelectWrapper .container {margin-top: 45px}
.login_area .input_box {border: 1px solid #c7c7c7; position: relative; line-height: 45px; font-size: 16px; border-radius: 4px}
.login_area .input_box .input_tit {position: absolute; left: 18px; top: 0; font-weight: 100; color: #555; background: transparent}
.login_area .input_box .init_input {border: 0; padding: 0 18px; height: 45px; width: 100%; font-size: 16px; background: transparent; box-sizing: border-box}
.login_area .btn_box {background: #397ef4; border-radius: 4px; transition: all .4s}
.login_area .btn_box:hover {background: #0f4d8c}
.login_area .btn_box .btn_log {background: none; color: #397ef4; font-size: 16px; text-align: center; width: 100%; line-height: 45px; color: #fff}
.login_area button.crpf {position:absolute; top:50%; right:10px; width:30px; height:30px; line-height:30px; margin-top:-15px; background:url(../../images/member/btn_login_srch.png) no-repeat 50% 50%; font-size:0}
.login_area .input_box.userId .init_input {padding:0 50px 0 15px}
.login_wrap .noti .bld span {color:#397ef4}
.add_area {overflow:hidden; width: 100%; max-width: 550px; margin: 0 auto 40px auto}
.add_item {position: relative}
.add_item:after {content:""; display: block; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, .5); width: 100%; height: 100%; z-index: 5}
.add_item img {width: 100%; height:100%}
.add_item .add_text {width: 100%; color: #fff; text-align: center; position: absolute; left: 0; top: 50%; z-index: 10; transform: translateY(-50%)}
.add_item .add_text .add_tit {font-size: 24px; padding: 0 0 20px 0; font-weight:500}
.add_item .add_text .add_sub {font-size: 15px; line-height: 150%; padding: 0 50px 30px 50px}
.add_item .add_text .add_btn a {display: block; color: #fff; padding: 7px 0 8px 0; border: 1px solid #fff; width: 160px; margin: 0 auto;border-radius: 4px}
.add_item .add_text .add_btn a:hover {background:rgba(255,255,255,0.8); transition:.3s; color:#1a1a1a; font-weight:500}
.add_area .slick-dots {display:block; position:absolute; right:15px; bottom:10px}
.add_area .slick-dots li button {font-size:0; text-indent:-9999999px; line-height:0}
.add_area .slick-dots li {float:left; margin-left:5px; display:block; border:3px solid rgba(255,255,255,0.5); width:8px; height:8px; border-radius:50%}
.add_area .slick-dots li.slick-active {background:#fff}
/*로그인상단 안내문구*/
.login_top{margin-bottom:20px; border-top:2px solid #ffb643}
.login_top .login_tit{width:203px;/*  height:85px; */ padding:33px 0; border-radius:0 0 50px 5px; background:#ffb643; font-size:17px; font-weight:600; text-align:center; color:#fff; line-height:140%; box-sizing:border-box}
.login_top .login_tit span{display:inline-block; padding-left:38px; background:url(../../images/member/log_titico.gif) no-repeat left center}
.login_top ol{margin:-101px 0 0 216px}
.login_top ol li{position: relative; margin-bottom:5px; line-height:160%; font-size:15px}
.login_top ol li span.num{position: absolute; left:0; top:0; display:block; width:23px; height:23px; line-height:23px; border-radius:50%; background:#515151; text-align:center; color:#fff; font-size:13px; font-weight:600}
.login_top ol li:last-child span.num{background:#ff451a}
.login_top ol li p{margin-left:30px}

/** 정보변경관련 **/
/* 인풋관련 선언 */
.cz_myinfo input[type="checkbox"]{margin: -4px 3px 0 0}
.cz_myinfo input.lst_check[type="checkbox"]{margin: 0}
.cz_myinfo input[type="radio"]{margin: -4px 5px 0 0; border-color:#fff}
.cz_myinfo input::placeholder, textarea::placeholder {color: #a6a6a6; font-weight: 400; font-size: 13px}
.cz_myinfo .input_base{width:130px; height: 35px; padding: 5px; border:1px solid #dedede; box-sizing: border-box}
.cz_myinfo input.input_long{width: 100%}
.cz_myinfo input.input_short{width: 60px}

/* 작성 타입 공통 */
.cz_myinfo .myinfo_top{margin: 0 5px 25px; text-align: center; font-size: 16px; line-height: 150%}
.cz_myinfo .myinfo_item{position: relative; overflow: hidden; margin-bottom: 7px; border:1px solid #e4e4e4; background: #424853}
.cz_myinfo .myinfo_item .myinfotit label, .cz_myinfo .myinfo_item .myinfotit span{position: absolute; top:50%; left:0; width: 160px; margin-top: -10px; color:#fff; text-align: center; font-size: 14px; font-weight:500}
.cz_myinfo .myinfo_item .myinfotb{position: relative; margin-left: 160px; padding: 8px; background: #fff}
.cz_myinfo .myinfo_item .myinfo_lst > div.myinfolst_item{padding-bottom: 10px; margin-bottom: 10px;  border-bottom: 1px solid #e0e0e0}
.cz_myinfo .myinfo_item .myinfo_lst > div.myinfolst_item:last-child{padding-bottom: 0; margin-bottom: 0; border-bottom: none}
.cz_myinfo .myinfo_item .myinfo_tit{display: inline-block; height: 38px; line-height: 38px; padding-left: 15px; background:url(../../images/member/blt_solu.png) no-repeat left 13px #fff; font-size: 14px; font-weight: 600}
.cz_myinfo .myinfo_item .myinfo_input{margin: -38px 0 0 124px}
.cz_myinfo input.input_long{margin-top:0}
.cz_myinfo .input_btnbox .sch_srch{position: relative; margin-bottom: 8px}
.cz_myinfo .input_btnbox > div:last-child{margin-bottom: 0}
.cz_myinfo .input_btnbox .input_item{margin-right: 35px}
.cz_myinfo .input_btnbox .input_btn button.more_goal{display: none}
.cz_myinfo .input_btnbox > div:first-child .input_item{margin-right: 155px}
.cz_myinfo .input_btnbox > div:first-child .input_btn button.more_goal{display:inline-block}
.cz_myinfo .input_btn{position: absolute; top:0; right:0}
.cz_myinfo .input_btn button{margin-left: 5px}
.cz_myinfo p.inputtxt{padding: 5px 8px 5px 30px; margin-top: 7px; background: url(../../images/member/blt_info.png) no-repeat 5px 5px #f0f0f0; font-size: 13px; font-weight: 500; line-height: 140%}
.cz_myinfo .txt_item{padding: 10px; font-size: 15px}
.cz_myinfo .login_area .btn_box{text-align:center}
.cz_myinfo .login_area .btn_box button {display:inline-block; width:49.5%; border-radius: 4px;  font-size: 16px; text-align: center; height:40px; line-height:40px; color: #fff; transition: all .4s}
.cz_myinfo .login_area .btn_box button.btn_log {float:left; background: #397ef4}
.cz_myinfo .login_area .btn_box button.btn_cancel {float:right; background: #c1c1c1}
.cz_myinfo .login_area .btn_box button:hover {background: #0f4d8c}

/**목록 하단 버튼**/
.btmbtn_wrap{padding-top:20px; font-size: 0}
.btmbtn_wrap p.btn{float: left}
.btmbtn_wrap .btm_btn{padding:0 15px; height: 40px; line-height: 40px; font-size: 14px; font-weight: 500; color:#fff; box-sizing: border-box; transition: all .5s}
.btmbtn_wrap .btm_btn:hover{background: #ffa531}
.btmbtn_wrap .btm_btn span{display: block}
/*목록하단 가운데*/
.btmbtn_wrap .center_box{text-align: center}
.btmbtn_wrap .center_box p.btn{float: none; display: inline-block; margin: 0 5px}
.btmbtn_wrap .center_box p.btn button{width:164px; height: 39px; transition: all .5s}
.btmbtn_wrap .center_box p.btn button:hover{background: #ff9a2e}
.btmbtn_wrap .center_box p.btn button span{display: inline-block}
.btmbtn_wrap button.btn_confirm{background:#2a73cc}/*확인*/
.btmbtn_wrap button.btn_cancel{background:#616161}/*취소*/

/* 비밀번호 확인 */
.cz_myinfo input.id_box{background: #f4f4f4}
.cz_myinfo input.id_box::placeholder{color:#000}
.cz_myinfo .pw_top{padding-top:57px; margin-bottom: 27px; text-align: center; font-size: 15px; line-height: 150%; background:url(../../images/member/ico_pwtop.gif) no-repeat center top}
.cz_myinfo .uid input.init_input{border-radius: 3px; background: #f4f4f4}
.cz_myinfo .uid input.init_input::placeholder{color:#000}
.cz_myinfo .login_area .form_row.last{margin-bottom: 0}
.cz_myinfo.pw_check .uid input.init_input::placeholder{color:#000; font-weight: 500; font-size: 16px}
.cz_myinfo.pw_check .pw input.init_input::placeholder{font-size:16px}

/*정보변경*/
.info_change .info_sch{ margin-bottom: 20px; border-bottom: 2px solid #dedede; text-align: center}
.info_change dl dt{padding: 8px; background:#9ec542; font-weight: 500; font-size: 16px; color:#fff}
.info_change dl dt span{padding-left: 28px; background:url(../../images/member/info_change.gif) no-repeat left center}
.info_change dl dd{padding:15px 10px; font-size: 16px; font-weight: 600}
.info_change dl dd span{font-weight: 500; font-size: 13px; color:#525252}

/* MOBILE LAYOUT */
@media only screen and (max-width:980px) {
}

/* TABLET LAYOUT */
@media only screen and (min-width:981px) and (max-width:1302px) {
/* 로그인 */
.login_area {padding: 40px 70px; border: 1px solid #ddd}
}

/* PC LAYOUT */
@media only screen and (min-width:1303px) {
/* 로그인 */
.login_wrap {max-width: 1276px; margin: 0 auto; padding: 20px 0 0}
.login_area {height:375px; padding:28px 45px; border: 1px solid #ddd; float: left}
.add_area  {float: right}
.login_wrap .noti li {font-size:1.077em}
.add_area {height:374px}
.add_area .slick-dots {bottom:19px}

/* 비밀번호 확인 */
.pw_check .login_area{float: none; height: 360px; margin: 0 auto}
}


/* LOWSET FIX */
@media only screen and (max-width:1302px) {
/*로그인*/
.login_wrap{padding:20px 0}
.login_area{max-width:100%; padding:20px 10px 0; margin:0 0 20px; border:none; border-top:1px solid #dedede}
/* 비밀번호 확인 */
.pw_check .login_area{border-top:none}
.pw_check .pw_top{font-size: 14px}
}
@media only screen and (max-width:1115px) {
/*로그인*/
.login_area{padding:0 10px;border:none; border-top:none}
/*로그인상단 안내문구*/
.login_top{margin-bottom:0; border-bottom:2px solid #ffb643}
.login_top .login_tit{width:100%; height:auto; padding:5px 0; border-radius:0 0 20px 5px; font-size:16px}
.login_top .login_tit br{display:none}
.login_top .login_tit span{padding:6px 0 6px 38px}
.login_top ol{margin:10px}
.login_top ol li{font-size:14px}
}
/*로그인 관련 추가*/
#mainheader .btn_login{position: relative; height: 30px}
#mainheader .btn_login .logmu{display: none; position: absolute; top:30px; left:-47px; width: 120px; padding: 10px 0; background: #fff; border-radius: 2px 2px 7px 7px; text-align: center}
#mainheader .btn_login .logmu li{float: none; margin: 0}
#mainheader .btn_login .logmu li a{display: block; padding: 7px 5px; transition: all .6s}
#mainheader .btn_login .logmu li a:hover{font-weight: 400; background: #4b4d4d; color: #fff}
#mainheader .btn_login:hover .logmu{display: block}
/* MOBILE LAYOUT */
@media only screen and (max-width:980px) {
#mainheader .btn_login .logmu{left:-32px; width: 90px}
}


@media only screen and (max-width:860px) {
/* 작성 타입 공통 */
.cz_myinfo .myinfo_top{margin: 20px 5px 25px; font-size: 14px}
.cz_myinfo .txt_item{font-size: 14px; text-align: center}
.myinfo_form .myinfo_item .myinfotit label{display: block; position: relative; top:0; left:0; width:100%; padding:7px; margin-top:0}
.myinfo_form .myinfo_item .myinfotb{margin-left:0}
.myinfo_form .input_btnbox > div:first-child .input_item{margin-right: 100px}
/*검색버튼*/
.solu_form .input_btn .srch_btn{width: 95px}
/**목록 하단 버튼**/
.btmbtn_wrap .btm_btn{font-size: 14px}
/*목록하단 가운데*/
.btmbtn_wrap .center_box p.btn button{width:150px; height: 40px}

/*정보변경*/
.info_change dl dt{font-size: 15px}
.info_change dl dt span{padding-left: 28px}
.info_change dl dd{padding:10px; font-size: 15px}
.info_change dl dd span{display: block; margin-top:7px}
}

@media only screen and (max-width:485px) {
.login_area .btn_box button {display:block; width:100%; margin:0 0 5px}
}