@charset "UTF-8";

/********* common_layout *********/
html, body {height:100%;}
body {line-height: 1.5; color: #333333; font-family: 'Pretendard', 'sans-serif'; font-size: 16px; min-width: 280px; transition: 0.3s ease-in-out;}
.hide {position: absolute; left: -9999px; overflow: hidden; width: 1px; height: 1px; line-height: 1px; font-size: 1px;}
.wrapper {position: relative; z-index: 1; min-height: 100%;}
#real_contents {width: 100%;}
.container {position: relative; max-width: 1400px; margin: 0 auto;}

/* skip navi */
.skip_navi {position:absolute; z-index:999999; width:100%; left:0; top:0; text-align:center;}
.skip_navi a {display:block; position:absolute; left:0; top:-9999px; z-index:1; width:100%; height:40px; line-height:40px; background-color: #333; color:#fff; font-size:20px; font-weight:700;}
.skip_navi a:hover, .skip_navi a:focus {top:0;}

.tab_cont {display: none;}
.tab_cont.on {display: block;}

/* select 기본 화살표 없애기 */
select {
    border-radius:0; /* 아이폰 사파리 보더 없애기 */
    -webkit-appearance:none; /* 화살표 없애기 for chrome*/
    -moz-appearance:none; /* 화살표 없애기 for firefox*/
    appearance:none /* 화살표 없애기 공통*/
}

select::-ms-expand{
    display:none /* 화살표 없애기 for IE10, 11*/
}

:root {
	--com-main-color: #0079df;
	--com-sub-color: #001f4e;
	--com-color-red: #ed4040;
	--com-color-blue: #3c79d5;
	--com-color-sky: #36b8d8;
	--com-color-navy: #21409a;
	--com-color-green: #48a644;
	--com-color-gray: #848690;
	--com-color-yellow: #ef9e01;
	--com-bor-top-color: #041f3a;
	--com-title-img: url('/images/home/kor/user/common/com_title_img.png');
}


/* ========== 메인 레이어 팝업 ========== */
.pop_layer {position: fixed; z-index: 9999; top: 0; left: 0;}
.pop_layer .pop_box {width: 100%; height: 100%; background-color: #ffffff;}
.pop_layer .pop_box img {border: none;}
.pop_layer .pop_box p {font-weight: 400; font-size: 18px; line-height: 27px; color: #333333;}
.pop_layer .pop_btn_area {position: relative; overflow: hidden; padding: 8px 10px; background-color: #aaaaaa;}
.pop_layer .pop_btn_area .chk_each {vertical-align: middle;}
.pop_layer .pop_btn_area .chk_each label {display: inline-block; position: relative; font-family: 'CoreDream'; font-weight: 400; font-size: 14px; line-height: 24px; color: #ffffff; z-index: 1; padding-left: 20px; cursor:pointer; vertical-align: middle;}
.pop_layer .pop_btn_area .chk_each .vchkbox {display: block; position: absolute; left: 0; top: 50%; z-index: 1; width: 15px; height: 15px; margin: -7px 0 0; border: 1px solid #cacaca; background-color: #fff;}
.pop_layer .pop_btn_area .chk_each .vchkbox > i {display: none; color: #0562a9; margin-top: 1px; margin-left: 1px; font-size: 12px; font-weight: 700; text-align: center;}
.pop_layer .pop_btn_area .close {position: absolute; top: 50%; right: 8px; margin: -11px 0 0;}
.pop_layer .pop_btn_area .chk_each input:checked + label .vchkbox > i {display: block;}
.pop_layer .pop_btn_area .chk_each input:focus + label .vchkbox {outline:1px dotted #000; outline:-webkit-focus-ring-color auto 5px;}
/* ========== 메인 레이어 팝업 ========== */

/* ================== 로그인 ================== */
.login_cont_arae {}
.login_cont_arae .inner_box {width: 100%; max-width: 440px; background-color: #ffffff; margin: 0 auto; text-align: center;}
.login_cont_arae .inner_box .title_area {margin: 0 0 30px 0;}
.login_cont_arae .inner_box .title_area .title {font-weight: 700; font-size: 34px; line-height: 44px; color: #212121;}
.login_cont_arae .inner_box .title_area .title .ft_c {color: var(--com-main-color);}
.login_cont_arae .inner_box .login_input_list_area {}
.login_cont_arae .inner_box .login_input_list_area > .list {}
.login_cont_arae .inner_box .login_input_list_area > .list > li {}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box {}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .input_box {margin: 0 0 15px;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .input_box .inp_txt {height: 55px; border: 1px solid #eeeeee; padding: 0 10px 0 53px; background-color: #ffffff; background-position: left 23px center; background-repeat: no-repeat; font-weight: 400; font-size: 16px; line-height: 55px; color: #333333; border-radius: 15px;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .input_box .inp_txt::placeholder {color: #797979;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .input_box .inp_txt.id {margin: 0 0 10px; background-image: url('/images/home/kor/user/common/id_icon.png');}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .input_box .inp_txt.pas {background-image: url('/images/home/kor/user/common/pas_icon.png');}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .cont_btn_list_area { margin: 0;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .cont_btn_list_area .list li { display: block !important; width: 100% !important;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .cont_btn_list_area .list li .btn { min-width: inherit; padding: 0 10px;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .cont_btn_list_area .list li .btn .text { font-size: 18px; line-height: 58px;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .cont_btn_list_area .list li .btn.before .text { font-size: 16px;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .login_etc_area { margin: 50px 0 0 0;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .login_etc_area > .list { display: flex; justify-content: space-between; align-items: stretch;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .login_etc_area > .list > li { flex: 1; margin: 0 10px 0 0;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .login_etc_area > .list > li:last-child { margin: 0;}
.login_cont_arae .inner_box .login_input_list_area > .list > li .box .login_etc_area > .list > li > .txt { margin: 0 0 10px 0; font-weight: 400; font-size: 15px; line-height: 24px; color: #797979;}
/* ================== 로그인 ================== */

/* ================== 아이디/비밀번호 찾기 ================== */
.id_pass_find_area {}
.id_pass_find_area > .list {}
.id_pass_find_area > .list > li {}
.id_pass_find_area > .list > li .box {border: 1px solid #e1e1e1; padding: 60px 15px; border-radius: 20px;}
.id_pass_find_area > .list > li .box .inner_box {width: 100%; max-width: 700px; margin: 0 auto; text-align: center;}
.id_pass_find_area > .list > li .box .inner_box > .title_area {margin: 0 0 10px 0; padding: 185px 0 0; background-position: top center; background-repeat: no-repeat;}
.id_pass_find_area > .list > li .box .inner_box > .title_area.id {background-image: url('/images/home/kor/user/common/find_id_icon.png');}
.id_pass_find_area > .list > li .box .inner_box > .title_area.pass {background-image: url('/images/home/kor/user/common/find_pass_icon.png');}
.id_pass_find_area > .list > li .box .inner_box > .title_area .title {font-weight: 700; font-size: 24px; line-height: 36px; color: #191919;}
.id_pass_find_area > .list > li .box .inner_box > .text_area {}
.id_pass_find_area > .list > li .box .inner_box > .text_area.mt { margin: 25px 0 0 0;}
.id_pass_find_area > .list > li .box .inner_box > .text_area .text {font-weight: 500; font-size: 16px; line-height: 24px; color: #191919;}
.id_pass_find_area > .list > li .box .inner_box > .text {font-weight: 400; font-size: 16px; line-height: 24px; color: #212121;}
.id_pass_find_area > .list > li .box .inner_box > .text.id_txt {margin: 25px 0 0 0; font-weight: 700; color: var(--com-color-navy);}
.id_pass_find_area > .list > li .box .inner_box .cont_btn_list_area {margin: 30px 0 0 0;}
.id_pass_find_area > .list > li .box .inner_box .com_input_form_area {margin: 25px 0 0 0;}
.id_pass_find_area > .list > li .box .inner_box .com_input_cont .input_table_cont .table_inner_box .table_area tbody tr th,
.id_pass_find_area > .list > li .box .inner_box .com_input_cont .input_table_cont .table_inner_box .table_area tbody tr td {text-align: left;}
.id_pass_find_area > .list > li > .text_area {margin: 55px 0 0; text-align: center;}
.id_pass_find_area > .list > li > .text_area > .text {margin: 0 0 25px; font-weight: 400; font-size: 16px; line-height: 24px; color: #212121;}
/* ================== 아이디/비밀번호 찾기 ================== */

/* ================== 회원가입 ================== */
/* 공통 step */
.com_step_area { margin: 0 0 75px 0; border: 1px solid #dadada;}
.com_step_area > .list { display: flex; justify-content: space-between; align-items: stretch;}
.com_step_area > .list > li { width: 100%; border-left: 1px solid #dadada;}
.com_step_area > .list > li:first-child { border-left: none;}
.com_step_area > .list > li > .box { padding: 0 10px; text-align: center;}
.com_step_area > .list > li > .box .inner { display: flex; justify-content: center; align-items: center; min-height: 75px; height: 100%;}
.com_step_area > .list > li > .box .inner::before { content: ''; display: inline-block; margin: 0 15px 0 0; background-position: center; background-size: 100%; background-repeat: no-repeat;}
.com_step_area > .list > li > .box .inner.icon01::before { width: 30px; height: 32px; background-image: url('/images/home/kor/user/common/com_step_icon01.png');}
.com_step_area > .list > li > .box .inner.icon02::before { width: 38px; height: 35px; background-image: url('/images/home/kor/user/common/com_step_icon02.png');}
.com_step_area > .list > li > .box .inner.icon03::before { width: 32px; height: 32px; background-image: url('/images/home/kor/user/common/com_step_icon03.png');}
.com_step_area > .list > li > .box .inner.icon04::before { width: 38px; height: 32px; background-image: url('/images/home/kor/user/common/com_step_icon04.png');}
.com_step_area > .list > li > .box .inner.icon05::before { width: 31px; height: 35px; background-image: url('/images/home/kor/user/common/com_step_icon05.png');}
.com_step_area > .list > li > .box .inner .txt { font-weight: 500; font-size: 17px; line-height: 26px; color: #959595;}
.com_step_area > .list > li.on > .box .inner.icon01::before { background-image: url('/images/home/kor/user/common/com_step_icon01_on.png');}
.com_step_area > .list > li.on > .box .inner.icon02::before { background-image: url('/images/home/kor/user/common/com_step_icon02_on.png');}
.com_step_area > .list > li.on > .box .inner.icon03::before { background-image: url('/images/home/kor/user/common/com_step_icon03_on.png');}
.com_step_area > .list > li.on > .box .inner.icon04::before { background-image: url('/images/home/kor/user/common/com_step_icon04_on.png');}
.com_step_area > .list > li.on > .box .inner.icon05::before { background-image: url('/images/home/kor/user/common/com_step_icon05_on.png');}
.com_step_area > .list > li.on > .box .inner .txt { font-weight: 700; color: #494949;}

/* 회원 유형 */
.member_step_01_area {}
.member_step_01_area .step_01_cont_list_area {}
.member_step_01_area .step_01_cont_list_area .list {font-size: 0;}
.member_step_01_area .step_01_cont_list_area .list li {display: inline-block; width: calc(50% - 30px); margin: 0 60px 0 0;}
.member_step_01_area .step_01_cont_list_area .list li:last-child {margin: 0;}
.member_step_01_area .step_01_cont_list_area .list li .inner_box {position: relative; display: block; width: 100%; border: 4px solid #f7f7f7; padding: 48px 15px 130px; background-color: #f7f7f7; text-align: center; border-radius: 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;}
.member_step_01_area .step_01_cont_list_area .list li .inner_box::before { content: ''; position: absolute; bottom: 55px; left: 50%; transform: translateX(-50%); width: 48px; height: 48px; border: 1px solid #767676; background-color: transparent; background-image: url('/images/home/kor/user/common/chk_g_icon.png'); background-position: center; background-repeat: no-repeat; border-radius: 50%; transition: all 0.3s;}
.member_step_01_area .step_01_cont_list_area .list li .inner_box .tit {margin: 0 0 17px; padding: 0 0 168px; background-position: bottom center; background-repeat: no-repeat; font-weight: 700; font-size: 36px; line-height: 48px; color: #191919;}
.member_step_01_area .step_01_cont_list_area .list li .inner_box.icon01 .tit {background-image: url('/images/home/kor/user/common/step01_icon01.png');}
.member_step_01_area .step_01_cont_list_area .list li .inner_box.icon02 .tit {background-image: url('/images/home/kor/user/common/step01_icon02.png');}
.member_step_01_area .step_01_cont_list_area .list li .inner_box .text {font-weight: 500; font-size: 18px; line-height: 27px; color: #191919;}
.member_step_01_area .step_01_cont_list_area .list li .inner_box:hover,
.member_step_01_area .step_01_cont_list_area .list li .inner_box:focus {border: 4px solid var(--com-main-color); background-color: #ffffff; box-shadow: 0 0 30px rgba(137, 137, 137, 0.1);}
.member_step_01_area .step_01_cont_list_area .list li .inner_box:hover .tit,
.member_step_01_area .step_01_cont_list_area .list li .inner_box:focus .tit { color: var(--com-main-color);}
.member_step_01_area .step_01_cont_list_area .list li .inner_box:hover.icon01 .tit,
.member_step_01_area .step_01_cont_list_area .list li .inner_box:focus.icon01 .tit {background-image: url('/images/home/kor/user/common/step01_icon01_on.png');}
.member_step_01_area .step_01_cont_list_area .list li .inner_box:hover.icon02 .tit,
.member_step_01_area .step_01_cont_list_area .list li .inner_box:focus.icon02 .tit {background-image: url('/images/home/kor/user/common/step01_icon02_on.png');}
.member_step_01_area .step_01_cont_list_area .list li .inner_box:hover::before,
.member_step_01_area .step_01_cont_list_area .list li .inner_box:focus::before { border: 1px solid var(--com-main-color); background-color: var(--com-main-color); background-image: url('/images/home/kor/user/common/chk_f_icon.png');}

/* 이용동의 */
.app_cont_area {}
.app_cont_area > .list {}
.app_cont_area > .list > li { margin: 0 0 40px;}
.app_cont_area > .list > li:last-child { margin: 0;}
.app_cont_area > .list > li > .com_title_area {}
.app_cont_area > .list > li > .com_title_area .title {}
.app_cont_area > .list > li > .com_title_area .ft_c { display: inline-block; font-size: 18px; color: var(--com-color-red); vertical-align: top;}
.app_cont_area > .list > li > .app_cont_list_area {}
.app_cont_area > .list > li > .app_cont_list_area > .list {}
.app_cont_area > .list > li > .app_cont_list_area > .list > li {}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box { overflow: hidden; border: 1px solid #f5f5f5; border-radius: 10px;}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box .inner_cont {height: 240px; padding: 25px 10px 25px 25px;}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box .consent_area {display: flex; padding: 17px 25px; justify-content: space-between; align-items: center; background-color: #f5f5f5;}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box .consent_area .title {flex: 1; font-weight: 500; font-size: 18px; line-height: 28px; color: #424242;}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box .consent_area .radio_list_area {}
.app_cont_area > .list > li > .app_cont_list_area > .list > li .box .consent_area .radio_list_area .radio_area label .text { font-size: 18px;}

.agreement_area { margin: 40px 0 0 0; border: 1px solid #eeeeee; padding: 17px 25px; border-radius: 10px;}
.agreement_area .inner_box { display: flex; justify-content: space-between; align-items: center;}
.agreement_area .inner_box .title { flex: 1; font-weight: 500; font-size: 18px; line-height: 28px; color: #424242;}
.agreement_area .inner_box .radio_list_area {}
.agreement_area .inner_box .radio_list_area .radio_area label .text { font-size: 18px;}
/* ================== 회원가입 ================== */

/* 레이어 팝업 */
.info_com_popup_cont {display: none; position:fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 99999;}
.info_com_popup_cont .inst_box {display: none; overflow: hidden; position: fixed; top: 50%; left: 50%; width: 100%; max-width: 670px; padding: 0 15px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1;}
.info_com_popup_cont .inst_box .inner_area {position:relative;}
.info_com_popup_cont .inst_box .inner_area > .title_area {padding: 10px 45px 10px 25px; background-color: var(--com-color-navy); border-radius: 5px 5px 0 0;}
.info_com_popup_cont .inst_box .inner_area > .title_area > .title {font-weight: 700; font-size: 24px; line-height: 36px; color: #fffefe;}
.info_com_popup_cont .inst_box .inner_area > .pop_close {position:absolute; top: 19px; right: 25px; width: 18px; height: 18px; background-image: url('/images/home/kor/user/common/pop_close_icon.png'); background-size: 100%; background-repeat: no-repeat;}
.info_com_popup_cont .inst_box .inner_area .inst_cont {}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area {background-color: #ffffff; padding: 40px 25px; border-radius: 0 0 5px 5px;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area.tc { text-align: center;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area.scroll {overflow-y: scroll; height: 500px;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box {}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box.icon { padding: 185px 0 0 0; background-image: url('/images/home/kor/user/common/com_popup_img01.png'); background-position: top center; background-repeat: no-repeat;}
.info_com_popup_cont .inst_box.pop01 .inner_area .inst_cont .com_input_form_area > .text_box.icon { background-image: url('/images/home/kor/user/common/com_popup_phone_img.png');}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box .title_area {}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box .title_area .title { font-weight: 700; font-size: 24px; line-height: 36px; color: #212121;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box .text_area { margin: 15px 0 0 0;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area > .text_box .text_area .text { font-weight: 500; font-size: 18px; line-height: 28px; color: #767676;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area .cont_btn_list_area { margin: 30px 0 0 0;}
.info_com_popup_cont .inst_box .inner_area .inst_cont .com_input_form_area .input_form_list_box { margin: 25px 0 0 0; text-align: left;}