@charset "utf-8";

/* font */
.fnt_roboto {font-family:'Roboto';}
.fnt_lato {font-family:'Lato';}

.fw300 {font-weight:300}
.fw400 {font-weight:400}
.fw500 {font-weight:500}
.fw700 {font-weight:700}
.fw900 {font-weight:900}

/* form */
.write_div {position:relative;border-bottom:solid 1px #eee;}
.write_div:after {display:block;visibility:hidden;clear:both;content:""}

.write_div_half {position:relative;float:left;width:49%;margin:0 2% 0 0;padding:12px 20px 12px 16%;line-height:40px;}
.write_div_half_last {position:relative;float:left;width:49%;margin:0;padding:12px 20px 12px 16%;line-height:40px;}
.write_div_half:after,
.write_div_half_last:after {display:block;visibility:hidden;clear:both;content:""}

.write_div_half label,
.write_div_half_last label {display:block;position:absolute;left:0;top:0;padding:12px 20px;font-weight:400;line-height:40px;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}


.frm_input {display:block;width:100%;height:40px;text-indent:6px;line-height:38px;background:#fff;border:solid 1px #ccc;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.half_input {width:50%;}
.third_input {width:30%;}

.frm_zipinput {width:86%;}
.frm_address {margin:10px 0 0 0;}

.frm_3x {float:left;width:32%;margin:0 2% 0 0;}
.frm_3x_last {float:left;width:32%;margin:0;}

.frm_select {display:block;width:100%;height:40px;text-indent:6px;line-height:38px;background:#fff;border:solid 1px #ccc;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

/* button */
.btn {display:inline-block;padding:0 12px;text-align:center;line-height:32px;border:none;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.btn i {font-size:16px;}

.btn_frmline {height:40px;color:#fff;font-size:12px;line-height:40px;background:#666;}

.btn_act {color:#fff;background:#666;}
.btn_act:hover {background:#444;}

.btn_normal {line-height:30px;background:#fff;border:solid 1px #ddd;}
.btn_normal:hover {color:#ff7700;background:#eee;}


.btn_confirm {margin:20px 0;text-align:center;}
.btn_confirm:after {display:block;visibility:hidden;clear:both;content:""}
.btn_confirm .btn_submit {width:160px;height:50px;color:#fff;font-size:14px;line-height:50px;background:#666;vertical-align:top;}
.btn_confirm .btn_submit:hover {color:#fff;background:#444;}
.btn_confirm .btn_cancel {width:160px;height:50px;color:#666;font-size:14px;line-height:50px;background:#fff;border:solid 1px #ddd;vertical-align:top;}
.btn_confirm .btn_cancel:hover {color:#ff7700;background:#f6f6f6;}


/* checkbox, radio */
.selec_chk {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden;opacity:0;outline:0;z-index:-1;}

.chk_box {position:relative;}
.chk_box input[type="checkbox"] + label {position:relative;padding-left:26px;vertical-align:baseline;cursor:pointer;}
.chk_box input[type="checkbox"] + label:hover{}
.chk_box input[type="checkbox"] + label span {display:block;position:absolute;left:0;top:0px;width:20px;height:20px;background:#fff;border:1px solid #ccc;}

.write_div .chk_box input[type="checkbox"] + label, 
.bo_vc_w .chk_box input[type="checkbox"] + label {padding-left:26px}
.write_div .chk_box input[type="checkbox"] + label span,
.bo_vc_w .chk_box input[type="checkbox"] + label span {display:block;position:absolute;left:0;top:0px;width:20px;height:20px;margin:0;background:#fff;border:1px solid #ccc;}

.chk_box input[type="checkbox"]:checked + label {color:#ff7700}
.chk_box input[type="checkbox"]:checked + label span {background:url(../img/chk.png) no-repeat 50% 50% #83b132;border:solid 1px #6e9923;}

.all_chk.chk_box input[type="checkbox"] + label span {}

.chk_box input[type="radio"] + label {position:relative;padding-left:26px;vertical-align:baseline;cursor:pointer;}
.chk_box input[type="radio"] + label:hover{}
.chk_box input[type="radio"] + label span {display:block;position:absolute;left:0;top:0px;width:20px;height:20px;background:#fff;border:1px solid #ccc;border-radius:50%;}

.write_div .chk_box input[type="radio"] + label, 
.bo_vc_w .chk_box input[type="radio"] + label {padding-left:26px}
.write_div .chk_box input[type="radio"] + label span,
.bo_vc_w .chk_box input[type="radio"] + label span {display:block;position:absolute;left:0;top:0px;width:20px;height:20px;margin:0;background:#fff;border:1px solid #ccc;}

.chk_box input[type="radio"]:checked + label {color:#ff7700}
.chk_box input[type="radio"]:checked + label span {background:url(../img/chk_radio.png) no-repeat 50% 50% #83b132;border:solid 1px #6e9923;}


/* 사이드뷰 */
.sv_wrap {position:relative;}
.sv_wrap .sv {z-index:1000;display:none;margin:0;font-size:12px;background:#fff;
-webkit-box-shadow:1px 1px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow:1px 1px 5px 0px rgba(0,0,0,0.2);
box-shadow:1px 1px 5px 0px rgba(0,0,0,0.2);
}
.sv_wrap .sv:before {content:"";position:absolute;top:-6px;left:15px;width:0;height:0;border-style:solid;border-width:0 6px 6px 6px;border-color:transparent transparent #fff transparent}
.sv_wrap .sv a {display:inline-block;width:100px;margin:0;color:#666 !important;font-size:11px;line-height:24px;text-align:center;font-weight:300;}
.sv_wrap .sv a:hover {color:#ff7700;background:#eee;}
.sv_member {color:#444;font-weight:400;}
.sv_on {display:block !important;position:absolute;top:23px;left:0px;width:auto;height:auto}
.sv_nojs .sv {display:block}


/* sns */
.kakaotalk {color:#3c1e20;}
.kakaotalk_bg {background-color:#fce000;}
.naver {color:#00c73c;}
.naver_bg {background-color:#00c73c;}
.google {color:#e84134;}
.google_bg {background-color:#e84134;}
.facebook {color:#3a589e;}
.facebook_bg {background-color:#3a589e;}
.twitter {color:#1da1f3;}
.twitter_bg {background-color:#1da1f3;}
.instagram {color:#f4555a;}
.instagram_bg {
background: #f5cf00;
background: -moz-linear-gradient(45deg,  #f5cf00 0%, #e90b22 51%, #803db0 100%, #803db0 100%);
background: -webkit-linear-gradient(45deg,  #f5cf00 0%,#e90b22 51%,#803db0 100%,#803db0 100%);
background: linear-gradient(45deg,  #f5cf00 0%,#e90b22 51%,#803db0 100%,#803db0 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5cf00', endColorstr='#803db0',GradientType=1 );
}
.telegram {color:#31ade0;}
.telegram_bg {background-color:#31ade0;}
.youtube {color:#ee1c1b}
.youtube_bg {background-color:#ee1c1b;}
.payco {color:#fa2829}
.payco_bg {background-color:#fa2829;}


/* status */
.txt_active {color:#117cce}
.txt_done {color:#f00001}
.txt_expired {color:#ccc}
.txt_rdy {color:#15aacf}


/* form */
.form_type {}
.form_type:after {display:block;visibility:hidden;clear:both;content:""}
.form_type ul {margin:0 0 36px 0;border-bottom:solid 1px #ddd;}
.form_type ul li {display:block;position:relative;margin:0 0 24px 0;padding:0 20px 0 20%;}
.form_type ul li:after {display:block;visibility:hidden;clear:both;content:""}
.form_type ul li .frm_info {display:block;margin:6px 0 0 0;color:#f63941;}
.form_type ul li label {display:block;position:absolute;left:0;top:0;padding:0 20px;font-weight:500;line-height:40px;}




/* ifrma response */
.embed-container {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;} 
.embed-container iframe, 
.embed-container object, 
.embed-container embed {position:absolute;top:0;left:0;width:100%;height:100%;}







/* 캡챠 자동등록(입력)방지 기본 -pc */
#captcha {display:inline-block;position:relative;}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha #captcha_img {height:40px;border:1px solid #999;padding:0;margin:0}
#captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;overflow:hidden;cursor:pointer;background:url('../img/captcha2.png') no-repeat;text-indent:-999px;}
#captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;overflow:hidden;cursor:pointer;background:url('../img/captcha2.png') no-repeat 0 -40px;text-indent:-999px;}
#captcha #captcha_key {margin:0 0 0 3px;padding:0 5px;width:90px;height:40px;text-align:center;border:1px solid #ccc;background:#fff;}
#captcha #captcha_info {display:block;margin:5px 0 0 0;color:#f00001;font-size:12px;line-height:18px;}
#captcha label {display:none;}
#captcha input,
#captcha button,
#captcha span,
#captcha img {vertical-align:top;}

/* 캡챠 자동등록(입력)방지 기본 - mobile */
/*#captcha.m_captcha audio {display:block;margin:0 0 5px;width:187px}
#captcha.m_captcha #captcha_img {width:160px;height:60px;border:1px solid #e9e9e9;margin-bottom:3px;margin-top:5px;display:block}
#captcha.m_captcha #captcha_reload {position:static;margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../img/captcha2.png') no-repeat 0 -40px;text-indent:-999px}
#captcha.m_captcha #captcha_reload span {display:none}
#captcha.m_captcha #captcha_key {margin:0;padding:0 5px;width:115px;height:29px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:29px;margin-left:3px}
#captcha.m_captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
#captcha.m_captcha #captcha_mp3 {width:31px;height:31px;background:url('../img/captcha2.png') no-repeat 0 0 ; vertical-align:top;overflow:hidden;cursor:pointer;text-indent:-9999px;border:none}*/


/* 페이징 커뮤니티 */
.pg_wrap {display:block;margin:0 0 20px 0;font-size:0;line-height:0;text-align:center;}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {}
.pg_page, .pg_current {display:inline-block;margin:0 0 -1px -1px;vertical-align:middle;font-size:11px;text-align:center;background:#fff;border:1px solid #ddd;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {width:30px;min-width:30px;height:30px;color:#666;font-size:11px;line-height:30px;padding:0 5px;text-decoration:none;}
.pg_page:hover {background-color:#eee}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../img/btn_first.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #ddd}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../img/btn_prev.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #ddd}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../img/btn_end.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #ddd}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../img/btn_next.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #ddd}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover {background-color:#eee}

.pg_current {display:inline-block;width:30px;min-width:30px;height:30px;padding:0 5px;color:#fff;font-size:11px;font-weight:normal;line-height:30px;background:#666;border:1px solid #ddd;}


/* 페이징 심플 */
/*.pg_wrap {clear:both;display:block;margin:20px 0;text-align:center;}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {text-align:center}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {width:30px;min-width:30px;height:30px;color:#666;font-family:'Roboto';font-size:12px;font-weight:400;line-height:30px;text-decoration:none;}
.pg_page:hover {color:#ff7700;}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../img/btn_first.gif') no-repeat 50% 50% #fff;padding:0;border:none}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../img/btn_prev.gif') no-repeat 50% 50% #fff;padding:0;border:none}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../img/btn_end.gif') no-repeat 50% 50% #fff;padding:0;border:none}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../img/btn_next.gif') no-repeat 50% 50% #fff;padding:0;border:none}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover {border:solid 1px #999;}

.pg_current {display:inline-block;width:30px;min-width:30px;height:30px;padding:0;color:#444;font-family:'Roboto';font-size:12px;font-weight:700;line-height:28px;background:#fff;border:1px solid #999;}*/


.clb {clear:both;}

/* 팝업레이어 */
#hd_pop {position:relative;margin:0 auto;height:0;z-index:9999;}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}

.hd_pops {position:absolute;background:#fff;}
.hd_pops img {max-width:100%;height:auto;}

.hd_pops_footer {display:block;position:relative;width:100%;background:#fff;border-left:solid 1px #ccc;border-top:solid 1px #ccc;}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {display:block;position:relative;float:left;height:40px;color:#666;font-size:12px;text-align:center;line-height:40px;background:#fff;border:none;border-right:solid 1px #ccc;border-bottom:solid 1px #ccc;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.hd_pops_footer button:hover {color:#ff7700;background:#eee;}
.hd_pops_footer .hd_pops_reject {width:80%;}
.hd_pops_footer .hd_pops_reject strong {font-weight:400;}
.hd_pops_footer .hd_pops_close {width:20%;}
.hd_pops_footer .hd_pops_close i {margin:0 2px 0 0;color:#999;font-size:12px;}


/* ckeditor 단축키 */
.cke_sc {display:none;margin:0 0 5px;text-align:right}
.btn_cke_sc {display:inline-block;padding:0 10px;height:23px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;line-height:1.9em;vertical-align:middle;cursor:pointer}
.cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f7f7f7;text-align:center}
.cke_sc_def dl {margin:0 0 5px;text-align:left;zoom:1}
.cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""}
.cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9}
.cke_sc_def dt {width:20%;font-weight:bold}
.cke_sc_def dd {width:30%}

/* ckeditor 태그 기본값 */
#bo_v_con ul {display:block;list-style-type:disc;margin-top:1em;margin-bottom:1em;margin-left:0;margin-right:0;padding-left:40px}
#bo_v_con ol {display:block;list-style-type:decimal;margin-top:1em;margin-bottom:1em;margin-left:0;margin-right:0;padding-left:40px}
#bo_v_con li {display:list-item}

/* cheditor 이슈 */
.cheditor-popup-window *, .cheditor-popup-window :after, .cheditor-popup-window :before {
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}

/* Mobile화면으로 */
#device_change {display:block;margin:0.3em;padding:0.5em 0;border:1px solid #eee;border-radius:2em;background:#fff;color:#000;font-size:2em;text-decoration:none;text-align:center}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;width:0;height:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

/* ie6 이미지 너비 지정 */
.img_fix {width:100%;height:auto}

/* 자료 없는 목록 */
.empty_table {padding:50px 0 !important;text-align:center}
.empty_list {padding:20px 0 !important;color:#999;text-align:center}

/* 필수입력 */
.required, textarea.required {background-image:url('../img/require.png') !important;background-repeat:no-repeat !important;background-position:right top !important}

/* 검색결과 색상 */
.sch_word {color:#fff;background:#5bc0de;}

/* 자바스크립트 alert 대안 */
#validation_check {margin:100px auto;width:500px}
#validation_check h1 {margin-bottom:20px;}
#validation_check p {margin-bottom:20px;padding:30px 20px;border:1px solid #eee;background:#fff}




@media screen and (max-width:1024px) {
.pg_wrap {margin:0 20px 20px 20px;}
}




@media screen and (max-width:768px) {
.write_div_half {float:none;width:100%;padding:12px 20px;border-bottom:solid 1px #eee;}
.write_div_half_last {float:none;width:100%;padding:12px 20px;}

.write_div_half label,
.write_div_half_last label {position:relative;margin:0 0 6px 0;padding:0;line-height:normal;}


.btn_confirm {padding:10px 20px;}
.btn_confirm .btn_submit {float:left;width:49.5%;margin:0 1% 0 0;}
.btn_confirm .btn_cancel {float:left;width:49.5%;}
}