@charset "utf-8";
@import "/css/fonts.css";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav,
output, ruby, section, summary, time, mark, audio, video { margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline; }
body{ margin: 0; font:400 16px 'wantedSans', 'Malgun Gothic', '맑은 고딕', sans-serif; color:#666; line-height:1.4; font-weight: normal; -webkit-tap-highlight-color:transparent; color: #222; }
strong { font-weight: 600; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: '';content: none; }
table { border-collapse: collapse;border-spacing: 0; }
input, textarea, select{ padding: 0 20px; border: 1px solid #ccc; border-radius: 2px; box-sizing: border-box;font: 400 14px 'wantedSans', '맑은 고딕', sans-serif; color: #111; line-height: 50px; transition: 0.3s; }
textarea { padding: 10px 20px; line-height: 22px; }
input:hover, textarea:hover { border: 1px solid #333; transition: 0.3s; }
input:focus { border: 1px solid #666; outline: 0; color: #333; }
input::placeholder, textarea::placeholder, select::placeholder { color: #999; }
input[readonly], input[disabled] { background: #f2f2f2; }
input:disabled:hover { border: 1px solid #ccc; }
a{display:inline-block; color:#666; text-decoration:none;}
a:focus, a:active, a:hover { outline: 0; }
img { border: 0;vertical-align: middle; }

.pos_relative { position:relative; }
.pos_absolute { position:absolute; }
.float_left { float:left; }
.float_right { float:right; }
.clear::after { content:'';display:block;clear:both; }
.link { position:relative;color:#337ab7;cursor:pointer; }
.link.on, .link:hover { text-decoration:underline; }
.link.no_line:hover::after { height:0; }
.underline { position:relative; }
.underline::after { content:" ";position:absolute;left:0;top:20px;width:100%;height:1px;background-color:#666; }
.underline.color_cloudy::after { background-color:#ddd; }
.underline.color_gray::after { background-color:#aaa; }
.underline.color_blue::after { background-color:#2e6da4; }
.underline.color_red::after { background-color:#fa4b4b; }
.underline.color_green::after { background-color:#30b9a4; }
.underline.color_orange::after { background-color:#e34500; }
.underline.color_purple::after { background-color:#800080; }
.font15 { font-size:15px; }
.font16 { font-size:16px; }
.font18 { font-size:18px; }
.line20 { line-height:20px; }
.line25 { line-height:25px; }
.line30 { line-height:30px; }
.line40 { line-height:40px; }
.line70 { line-height:70px; }
.mg0 {margin:0;}
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt25 {margin-top:25px;}
.mt30 {margin-top:30px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml15 {margin-left:15px;}
.ml20 {margin-left:20px;}
.ml27 {margin-left:27px;}
.ml30 {margin-left:30px;}
.ml40 {margin-left:40px;}
.ml50 {margin-left:50px;}
.ml100 {margin-left:100px;}
.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr20 {margin-right:20px;}
.mr30 {margin-right:30px;}
.mr50 {margin-right:50px;}
.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.pd0 {padding:0;}
.p10 {padding:10px;}
.p20 {padding:20px;}
.p30 {padding:30px;}

.cursor_pointer { cursor:pointer; }
.cursor_auto { cursor:auto; }
.no_data { clear: both; padding: 80px 0; text-align: center; }
.font11 { font-size:11px; }
.font13 { font-size:13px; }
.font14 { font-size:14px; }
.font20 { font-size:20px; }
.bg_text { padding:0 5px 1px 5px;background-color:#888;color:#fff; }
.bg_text.cloudy { background-color:#ddd; }
.bg_text.gray { background-color:#aaa; }
.bg_text.skyblue {background-color:#31b0d5; }
.bg_text.blue { background-color:#2e6da4; }
.bg_text.red { background-color:#fa4b4b; }
.bg_text.green { background-color:#30b9a4; }
.bg_text.orange {background-color:#e34500; }
.bg_text.yellow {background-color:#fff4a2;color:#fa4b4b; }
.bg_text.circle {position:relative;top:-2px;padding:0;border-radius:17px;width:17px;height:17px;text-align:center;display:inline-block;font-size:11px;}
.bg_f9 { background-color:#f9f9f9; }
.highlight { padding:0 3px 1px 3px;margin:0 2px;background-color:#fff4a2;color:#000000; }
.hidden { display:none; }
.select_none {user-select:none;}
.bold { font-weight: 600; }
.align_left { text-align:left; }
.align_center { text-align:center; }
.align_right { text-align:right; }
.plus { margin: -6px 0 0; vertical-align: super; display: inline-block; }
.w30 { width:30px; }
.w40 { width:40px; }
.w50 { width:50px; }
.w70 { width:70px; }
.w80 { width:80px; }
.w100 { width:100px; }
.w120 { width:120px; }
.w130 { width:130px; }
.w140 { width:140px; }
.w150 { width:150px; }
.w180 { width:180px; }
.w200 { width:200px; }
.w250 { width:250px; }
.w300 { width:300px; }
.w350 { width:350px; }
.w400 { width:400px; }
.w450 { width:450px; }
.w500 { width:500px; }
.w30p { width:30%; }
.w33p { width:33%; }
.w34p { width:34%; }
.w40p { width:40%; }
.w50p { width:50%; }
.w60p { width:60%; }
.w70p { width:70%; }
.w90p { width:90%; }
.w95p { width:95%; }
.w100p { width:100%; }
.w_auto { width:auto; }
.ellipsis { text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden; }
.ellipsis2{ text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient: vertical;box-orient:vertical; }
/* 버튼 */
.btn { height: 50px; line-height: 50px; padding: 0 20px; border: 0; border-radius: 10px; font-size: 16px; color: #fff; text-align: center; box-sizing: border-box; cursor: pointer; display:inline-block; }
.btn.w_auto { width: auto; }
.btn.small { height: 38px; line-height: 38px; border-radius: 5px; padding: 0 10px !important; color: #fff !important; font-size: 14px !important; }
.btn.mini { width: auto; min-width: 55px; height: 30px; line-height: 30px; border-radius: 5px; padding: 0 10px !important; color: #fff !important; font-size: 14px !important; }
.btn:hover { transition: 0.3s; }
.btn.hidden { display: none; }
.btn.w80 { width: 80px; }
.btn.w200 { width: 200px; }
.btn.font11 { font-size: 11px !important; }
.btn.blue { border: 1px solid #3268DD; background: #3268DD; color: #fff !important; }
.btn.blue:hover { background: #2653b5; }
.btn.blue_white { border: 1px solid #3268DD; background: #fff; color: #3268DD !important; }
.btn.blue_white:hover { background: #3268DD; color: #fff !important; }
.btn.blue_white_img { border: 1px solid #3268DD; background: #fff; color: #3268DD !important; }
.btn.blue_white_img:hover { background: #ececec; }
.btn.blue_light { border: 1px solid #6CACF3; background: #6CACF3; color: #fff !important; }
.btn.blue_light:hover { background: #4a80b8; }
.btn.green { border: 1px solid #38A897; background: #38A897; color: #fff !important; }
.btn.green:hover { background: #298a7c; }
.btn.green_white { border: 1px solid #38A897; background: #fff; color: #38A897 !important; }
.btn.green_white:hover { background: #38A897; color: #fff !important; }
.btn.red { border: 1px solid #E4022D; background: #E4022D; color: #fff !important; }
.btn.red:hover { background: #b60024; }
.btn.red_pink { border: 1px solid #DE3176; background: #DE3176; color: #fff !important; }
.btn.red_pink:hover { background: #b1235c; }
.btn.gray { border: 1px solid #ddd; background: #ddd; color: #333 !important; }
.btn.gray:hover { background: #cfcfcf; }
.btn.dark_gray { border: 1px solid #4d4d4d; background: #4d4d4d; color: #fff !important; }
.btn.dark_gray:hover { background: #4d4d4d; }
.btn.dark_gray_white { border: 1px solid #4d4d4d; background: #fff; color: #4d4d4d !important; }
.btn.dark_gray_white:hover { background: #4d4d4d; color: #fff !important; }
.btn.gray_white { border: 1px solid #bbb; background: #fff; color: #777 !important; }
.btn.gray_white:hover { background: #ececec; }
.btn.blue_border { border: 1px solid #fff; background: transparent; color: #fff !important; }
.btn.blue_border:hover { background: #3268DD; color: #fff; }
.basic_button { padding: 10px; margin: 10px 0 0 0; background: #59dcc8; }
.btn.excel { width: auto; border: 1px solid #45A65A; background: #fff; color: #45A65A !important; }
.btn.excel > img { margin: -5px 0 0 0; }
.btn.excel:hover { background: #ecf4ed; }
.btn.round { border-radius: 5px; float: none; }
.btn.login { width: 100px; height: 36px; line-height: 36px; padding: 0; border: 1px solid #999; border-radius: 18px; background: #fff; color: #666; }
.btn.login:hover { border: 1px solid #f8428c; color: #f8428c; }
.btn.amount { height: 32px; line-height: 32px; border: 1px solid #ccc; background: #fff; color: #555; }
.btn.amount:hover { background: #f2f2f2; }
.btn.lightgray { border: 1px solid #b4b4b4; border-radius: 5px; background-color: #fff; color: #999 !important; }
.btn.lightgray:hover { border: 1px solid #ccc; background-color: #fff; color: #999; }
.btn.lightpink { position: relative; width: 325px; height: 64px; line-height: 64px; padding: 0; margin: 0; border-radius: 30px; background: #ff9ab4; text-align: center; box-shadow: 1px 4px 1px #f37394; }
.btn.lightpink:hover { background: #ff90ad; transition: .3s; }
.btn.lightorange { position: relative; width: 325px; height: 64px; line-height: 64px; padding: 0; margin: 0; border-radius: 30px; background: #f7af6a; text-align: center; box-shadow: 1px 4px 1px #e08126; }
.btn.lightorange:hover { background: #f4a455; transition: .3s; }
/* 컬러 */
.color_blue { color: #3268DD !important; }
.color_blue_light { color: #6CACF3 !important; }
.color_red { color: #DE3176 !important; }
.color_red_pink { color: #DE3176 !important; }
.color_black { color: #333 !important; }
.color_gray { color: #888 !important; }
.color_blue_gray { color: #F5F6FA !important; }
.color_light_gray { color: #888 !important; }
.color_green { color: #38A897 !important; }
.color_purple { color: #800080 !important; }
/* 라인 */
.line_gray { border: 1px solid #ddd; }
.line_top { border-top: 1px solid #ddd; }
.line_left { border-left: 1px solid #ddd; }
.line_right { border-right: 1px solid #ddd; }
.line_bottom { border-bottom: 1px solid #ddd; }
/* 배경 컬러 */
.bg_blue { background: #3268DD; }
.bg_blue_light { background: #6CACF3; }
.bg_red { background: #DE3176; }
.bg_red_pink { background: #DE3176; }
.bg_black { background: #333; }
.bg_gray { background: #888; }
.bg_blue_gray { background: #F5F6FA; }
.bg_light_gray { background: #F3F3F3; }

#loading { position: fixed; top: 50%; left: 50%; width: 100px; height: 100px; margin: -50px 0 0 -50px; z-index: 15; display: none; }
#alertMessage { position: fixed; top: 150px; left: 50%; min-width: 450px; padding: 15px ; transform: translateX(-50%); line-height: 20px; background: #333; opacity: 0.9; filter: alpha(opacity=90); border-radius: 5px; color: #fff; font-size: 13px; text-align: center; z-index: 18; display: none; }

/* confirm 레이어 */
#confirmLayer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 12; display: none; }
#confirmLayer > .blind { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.6; display: block; }
#confirmLayer > .inner { position: absolute; top: 50%; left: 50%; width: 560px; height: auto; transform: translateX(-50%) translateY(-50%); border-radius: 15px; background: #fff; overflow: hidden; z-index: 11; }
#confirmLayer > .inner > .title { height: 49px; padding: 0 20px; line-height: 49px; border-bottom: 1px solid #d2d2d2; color: #3268DD; }
#confirmLayer > .inner > .message { line-height: 30px; padding: 20px; text-align: center; font-size: 18px; }
#confirmLayer > .inner > .message .font13 { font-size: 13px; }
#confirmLayer > .inner > .button { padding: 0 0 25px 0; text-align: center; }
#confirmLayer > .inner > .button > * { width: 105px; height: 38px; line-height: 38px; background: #3268DD; border: 1px solid #3268DD; color: #fff; cursor: pointer; display: inline-block; }
#confirmLayer > .inner > .button > .cancel { background: #fff; border: 1px solid #3268DD; color: #555; }

/* 탭1 */
.tabs { margin: 0 auto; background-color: #fff; }
.tabs .tab_title { width: calc(100%/3); height: 50px; padding: 0; line-height: 50px; border-bottom: 1px solid #3268DD; border-radius: 0; box-sizing: border-box; background-color: #f8f8f8; font-size: 18px; text-align: center; color: #888; font-weight: 600; transition: all 0.2s ease; cursor: pointer; display: block; float: left; }
.tabs .tab_title:hover { color: #3268DD; }
.tabs .tab_title::before,
.tabs .tab_title::after,
.tabs input[name="tab_title"] { display: none;}
.tabs .tab_content { padding: 15px; font-size: 16px; color: #555; clear: both; overflow: hidden; }
.tabs input:checked + .tab_title { border: 1px solid #3268DD; border-radius: 10px 10px 0 0; border-bottom: 1px solid #fff; background-color: #fff; font-size: 18px; font-weight: 600; color: #3268DD; }

/* 탭2 */
.tab_container { width: 100%; }
.tab_container > .tab_input { display: none; }
.tab_container > .tab_wrapper { position: relative; align-items: flex-start; display: flex; }
.tab_container > .tab_wrapper::after { position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: #3268DD; content: ''; z-index: 1; }
.tab_container > .tab_wrapper > .tab_item { position: relative; padding: 15px 20px; background: #fff; font-size: 18px; color: #888; cursor: pointer; z-index: 2; }
#firstTab:checked ~ .tab_wrapper .tab_item[for="firstTab"],
#secondTab:checked ~ .tab_wrapper .tab_item[for="secondTab"] { border: 1px solid #3268DD; border-bottom: none; border-radius: 10px 10px 0 0; background: #fff; color: #3268DD; font-weight: 500; }
.tab_container > .tab_content { padding: 20px; }
.tab_container .content_panel { display: none; }
#firstTab:checked ~ .tab_content .first_content { display: block; }
#secondTab:checked ~ .tab_content .second_content { display: block; }

/* 진행(프로세스) 바 */
#container .progress_box { padding: 0 0 10px 0; overflow: hidden; }
#container .progress_box > p { line-height: 30px; padding: 0 0 0 10px; font-size: 16px; color: #888; float: left; }
#container .progress { width: 410px; height: 30px; line-height: 30px; border-radius: 30px; background: #F3F3F3; overflow: hidden; float: left; }
#container .progress.w100 { width: 100px ; }
#container .progress .bar { position: relative; width: 0; height: 30px; border-radius: 30px; background: #fff; }
#container .progress.small .bar { height: 15px; }
#container .progress.small { height: 15px; }
#container .progress .bar.blue { background: #3268DD; }
#container .progress .bar.green { background: #38A897; }
#container .progress .bar.gray { background: #ddd; }
#container .progress .bar > span { position: absolute; right: 0; padding: 0 10px 0 0; font-size: 14px; color: #fff; }
#container .progress .bar > span.out_side { right: -45px; color: #888; }

/* 분류 */
.refund_type { padding: 2px 8px; border: 1px solid #ddd; border-radius: 30px; background: transparent; text-align: center; font-size: 14px; color: #38A897; }
.refund_type.green { border: 1px solid #38A897; color: #38A897; }
.refund_type.deep_blue { border: 1px solid #478DC5; color: #478DC5; }
.refund_type.blue { border: 1px solid #3268DD; color: #3268DD; }
.refund_type.red_pink { border: 1px solid #DE3176; color: #DE3176; }
.refund_type.gray { border: 1px solid #bbb; color: #bbb; }
.refund_type.yellow { border: 1px solid #F2A14D; color: #F2A14D; }

/* 페이지네이션 */
.pagination { margin: 0 0 0 50%; padding: 30px 0 30px 0; transform: translateX(-50%); align-items: center; gap: 5px; justify-content: center; display: flex; }
.pagination > a { width: 25px; height: 25px; line-height: 25px; font-size: 14px; color: #888; font-family: "wantedSans"; text-decoration: none; align-items: center; justify-content: center; transition: all 0.2s ease; cursor: pointer; user-select: none; display: flex; }
.pagination > a:hover:not(.active):not(.disabled) { background-color: #E3E3E3; }
.pagination > a:hover { border-radius: 50%; }
.pagination > a.active { border-color: #3268DD; border-radius: 50%; background-color: #3268DD; color: #fff; }
.pagination > a.active:hover { border-color: #3268DD; border-radius: 50%; background-color: #3268DD; }
.pagination > a.disabled { border-color: #3268DD; background-color: #fff; color: #888; cursor: not-allowed; }
.pagination > a.arrow_l { margin: 0 10px 0 0; }
.pagination > a.arrow_r { margin: 0 0 0 10px; }

/* 공통 등록 팝업 레이어 */
.common_popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; display: none; }
.common_popup > .blind { position: absolute;top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.6; display: block; }
.common_popup > .inner { position: absolute;top: 50%; left: 50%; width: 500px; height: 70%; transform: translateX(-50%) translateY(-50%); border-radius: 15px; overflow: hidden; z-index: 11; }
.common_popup > .inner > .header { height: 50px; padding: 0 20px; line-height: 50px; border-bottom: 1px solid #d2d2d2; background: #3268DD; }
.common_popup > .inner > .header > .title { font-weight: 500; font-size: 20px; color:#fff; }
.common_popup > .inner > .header > .title > * { color: inherit; }
.common_popup > .inner > .header > .close { position: absolute; top: -3px; right: 20px; }
.common_popup > .inner > .header > .close:after { content: '\00d7'; font-size: 40px; color: #fff; cursor: pointer; }
.common_popup > .inner > .content { height: calc(100% - 90px); padding: 20px 30px; background: #fff; overflow-x: hidden; overflow-y: auto; }

/**선택박스**/
.select_wrap { position: relative; height: 38px; line-height: 38px; border: 1px solid #E4E4E4; border-radius: 5px; -webkit-appearance: none; -moz-appearance: none; appearance: none; display: inline-block; }
.select_wrap.hidden { display: none; }
.select_wrap::after { position: absolute; top: 21px; right: 10px; width: 15px; height: 10px; background: url("/images/common/icon_select_arrow.png") no-repeat; transition: transform 0.3s ease; transform: translateY(-50%); pointer-events: none; content: ''; }
.select_wrap > select { width: 100%; height: 38px; line-height: 38px; padding: 0 15px; border: 0; outline: 0; background: transparent; font-size: 14px; color: #aaa; font-weight: 500; font-family: inherit; -webkit-appearance: none; appearance: none; }
.select_wrap > select option { color: #333; }
.select_wrap > select:focus { outline: 1px solid #3268DD; border-radius: 5px; }
.select_wrap > select::-ms-expand { display: none; }
select:focus + .select_wrap::after,
.select_wrap:has(select:focus)::after {
    transform: translateY(-50%) rotate(180deg);
}

/* 체크박스 */
input[type="checkbox"] { display: none; }
input[type="checkbox"] + label { position: relative; padding-left: 25px; cursor: pointer; }
input[type="checkbox"] + label::before { position: absolute; top: 2px; left: 0; width: 16px; height: 16px; border-radius: 3px; border: 1px solid #ddd; background: #fff; font-size: 16px; line-height: 16px; color: #333; text-align: center; display: block; content: ''; }
input[type="checkbox"]:checked + label::before { border: 1px solid #3268DD; background: url("/images/common/icon_checkon.png") no-repeat #3268DD; background-position: center; font-size: 14px; color: #3268DD; font-weight: 400; content: ''; }
input[type="checkbox"]:disabled + label::before { position: absolute; width: 16px; height: 16px; border-radius: 3px; border: 1px solid #ddd; background: #ddd; font-size: 16px; line-height: 16px; color: #333; text-align: center; display: block; content: ''; }

/* 라디오박스1 */
input[type="radio"] { display: none; }
input[type="radio"]+label { position: relative; padding-left: 30px; display: inline-block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
input[type="radio"]:disabled+label:before { position: absolute; top: 0; left: 0; width: 18px; height: 18px; line-height: 20px; border: 1px solid #CFCFCF; border-radius: 100%; background: #ddd; text-align: center; content: ''; box-shadow: none; }
input[type="radio"]+label:before { position: absolute; top: 0; left: 0; width: 18px; height: 18px; line-height: 20px; border: 1px solid #CFCFCF; border-radius: 100%; background: #fff; text-align: center; content: ''; box-shadow: none; }
input[type="radio"]:checked+label:before { border-color: #3268DD; background: #fff; }
input[type="radio"]:checked+label:after { position: absolute; top: 1px; left: 1px; width: 18px; height: 18px; border-radius: 100%; background: url("/images/common/icon_radio_check.png") #3268DD no-repeat; content: ''; box-shadow: none; }

/* 라디오박스2 */
.radio_box_style { margin: 0 5px; float: left; }
.radio_box_style input[type="radio"] { display: none; }
.radio_box_style input[type="radio"]:checked+span { width: 100px; height: 38px; line-height: 38px; border: 1px solid #3268DD; background: #F5F6FA; color: #3268DD; }
.radio_box_style input[type="radio"]:disabled+span { width: 100px; height: 38px; line-height: 38px; border: 1px solid #ddd; background: #f8f8f8; color: #aaa; }
.radio_box_style span { min-width: 100px; height: 38px; line-height: 38px; border: 1px solid #ddd; border-radius: 5px; box-sizing: border-box; font-size: 16px; color: #aaa; align-items: center; justify-content: center; cursor: pointer; display: flex; }

/* 텍스트 박스 */
input[type=text] { height: 38px; line-height: 38px; padding: 0 15px; border: 1px solid #ddd; border-radius: 5px; background: #fff; color: #333; font-family: "Wanted Sans"; font-size: 14px; box-shadow: none; }
input[type=password] { height: 38px; line-height: 38px; padding: 0 15px; border: 1px solid #ddd; border-radius: 5px; background: #fff; color: #333; font-family: "Wanted Sans"; font-size: 14px; box-shadow: none; }
input[type=text]::placeholder { color: #aaa; }
input[type=text]:hover { border: 1px solid #3268DD; }
input[type=text]:focus { border: 1px solid #3268DD; box-shadow: none; }
input[type=password]::placeholder { color: #aaa; }
input[type=password]:hover { border: 1px solid #3268DD; }
input[type=password]:focus { border: 1px solid #3268DD; box-shadow: none; }
input[readonly] { height: 38px; line-height: 38px; padding: 0 15px; border: 1px solid #E4E4E4; border-radius: 5px; background: #F3F3F3; color: #888; }
input[readonly]:hover { border: 1px solid #ddd; }
input[readonly]:focus { border: 1px solid #ddd; box-shadow: none; }
input[disabled] { height: 38px; line-height: 38px; padding: 0 15px; border: 1px solid #ddd; border-radius: 5px; background: #F3F3F3; color: #888; box-shadow: none; }
input[disabled]:hover { border: 1px solid #ddd; }
input[disabled]:focus { border: 1px solid #ddd; box-shadow: none; }

/* 파일 찾기 */
.file_wrap { overflow: hidden; }
.file_wrap > input[type="file"] { display: none; }
.file_wrap > label { height: 38px; line-height: 38px; padding: 0 15px; margin: 0 0 0 5px; border-radius: 5px; border: 1px solid #3268DD; box-sizing: border-box; background: #fff; font-size: 14px; color: #3268DD; font-weight: 500; vertical-align: middle; cursor: pointer; display: inline-block; }
.file_wrap > label.ml0 { margin-left: 0; }
.file_wrap > label:hover { background: #3268DD; color: #fff; transition: 0.3s; }
.file_wrap > .file_name { min-width: 200px; height: 40px; border: 1px solid #ddd; font-size: 14px; color: #888; box-shadow: none; vertical-align: middle; display: inline-block; float: left; }
.file_wrap > .btn.upload { height: 40px; margin: 0 0 0 10px; line-height: 40px; border-radius: 5px; vertical-align: middle; }

/* 텍스트 영역 */
textarea { min-height: 200px; padding: 15px; border: 1px solid #E4E4E4; font-size: 16px; color: #555; font-family: "Wanted Sans"; box-shadow: none !important; transition: 0.3s; }
textarea::placeholder { color: #999; }
textarea:hover { border: 1px solid #6F65EF; }
textarea:focus { border: 1px solid #6F65EF !important; box-shadow: none !important; }
textarea:active { box-shadow: none; }

/* 아코디언 메뉴 */
.accordion_wrap > .que { position: relative; padding: 20px 0; border-bottom: 1px solid #ddd; font-size: 16px; color: #333; cursor: pointer; }
.accordion_wrap > .que > p { width: calc(100% - 100px); font-size: 16px; color: #333; text-overflow: ellipsis; cursor: pointer; white-space: nowrap; overflow: hidden; }
.accordion_wrap > .que > p > span { padding: 0 35px 0 0; color: #3268DD; }
.accordion_wrap > .que:first-child { border-top: 2px solid #333; }
.accordion_wrap > .anw { padding: 20px 30px 20px 90px; border-bottom: 1px solid #ddd; font-size: 16px; color: #888; overflow: hidden; display: none; }
.accordion_wrap > .que > .arrow-wrap { position: absolute; top: 50%; right: 10px; transform: translate(0, -50%); }
.accordion_wrap > .que .arrow-top { display: none; }
.accordion_wrap > .que .arrow-bottom { display: block; }
.accordion_wrap > .que.on .arrow-bottom { display: none; }
.accordion_wrap > .que.on .arrow-top { rotate: 180deg; display: block; }



/* 팝업 */
#popUp { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 10; display: none; }
#popUp > .pop_up { width: 600px; height: auto; margin: 100px 0 0 50%; border-radius: 20px; background: #fff; transform: translateX(-50%); }
#popUp > .pop_up > .pop_header { height: 50px; line-height: 50px; padding: 0 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; background: #3268DD; }
#popUp > .pop_up > .pop_header > p.title { font-size: 23px; color: #fff; font-weight: 400; float: left; }
#popUp > .pop_up > .pop_header > img { padding: 10px 0; cursor: pointer; float: right; }
#popUp > .pop_up > .pop_contents { height: 600px; padding: 30px 20px; overflow-y: scroll; }
#popUp > .pop_up > .pop_contents::-webkit-scrollbar-thumb { background: #3268DD; }
#popUp > .pop_up > .pop_contents::-webkit-scrollbar-button { display: none; }
#popUp > .pop_up > .pop_contents > p.little_title { font-size: 20px; font-weight: 500; color: #333; }
#popUp > .pop_up > .pop_contents > .contents { padding: 30px 0; font-weight: 400; }
#popUp > .pop_up > .bottom { width: 420px; padding: 15px 0 30px 0; margin: 0 0 0 50%; background: #fff; text-align: center; transform: translateX(-50%); overflow: hidden; }
#popUp > .pop_up > .bottom > button { float: left; }
#popUp > .pop_up > .bottom > button + button { float: right; }

/* 테이블 유형 - 리스트 형태 */
table.lists { width: 100%; border: 1px solid #ddd; border-top: 2px solid #3268DD; }
table.lists > thead > tr > th { padding: 10px 0; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background: #F5F6FA; font-size: 14px; color: #333; text-align: center; vertical-align: middle; }
table.lists > tbody > tr > td { padding: 15px 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; font-size: 14px; color: #888; text-align: center; vertical-align: middle; }
table.lists > tbody > tr > td.align_left { padding: 15px; text-align: left; }
table.lists > tbody > tr > td.no_data { height: 200px; }
table.lists > tbody > tr > td > * { color: inherit; }
table.lists.gray { width: 100%; border: none; border-top: 2px solid #333; }
table.lists.gray > thead > tr > th { height: 40px; border-right: none; border-bottom: 1px solid #ddd; background: #F3F3F3; color: #333; font-weight: 500; text-align: center; }
table.lists.gray > tbody > tr > td { height: 50px; padding: 0 10px; border-right: none; border-bottom: 1px solid #ddd; font-size: 14px; color: #888; text-align: center; vertical-align: middle; }
table.lists.gray > tbody > tr > td.align_left { text-align: left; }
table.lists.gray > tbody > tr > td > p { width: 440px; font-size: 14px; color: #333; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
table.lists.gray > tbody > tr > td > p.notice { font-size: 14px; color: #333; font-weight: 600; }
table.lists.gray > tbody > tr > td.no_data { padding: 100px 0; text-align: center; }
table.lists.gray > tbody > tr > td > p { color: #333; font-weight: 500; }
/* 테이블 유형 - 폼 형태 */
table.form { width: 100%; border: 1px solid #ddd; border-top: 2px solid #3268DD; }
table.form tbody > tr > th { padding: 10px 0; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background: #F5F6FA; font-size: 14px; color: #333; text-align: center; vertical-align: middle; }
table.form tbody > tr > th.align_top { vertical-align: top; }
table.form tbody > tr > th.align_left { padding-left: 10px; text-align: left; }
table.form tbody > tr > td { padding: 10px 20px; border-bottom: 1px solid #ddd; font-size: 14px; color: #888; vertical-align: middle; }
table.form tbody > tr > td.align_left { padding: 0 10px; text-align: left; }
table.form.gray { border-top: 2px solid #ddd; }
table.form.white { width: 100%; border: none; }
table.form.white > tbody > tr > th { border: none; background: #fff; font-weight: 600; }
table.form.white > tbody > tr > td { padding: 10px 20px; border: none; font-size: 14px; color: #888; vertical-align: middle; }
/* 테이블 유형 - 뷰 형태 */
table.view { width: 100%; border-top: 2px solid #333; }
table.view > tbody > tr > th { position: relative; padding: 15px 100px 15px 0; border-bottom: 1px solid #ddd; font-size: 16px; color: #333; font-weight: 600; text-align: left; }
table.view > tbody > tr > th.border_none { border-bottom: none; }
table.view > tbody > tr > th > p { position: absolute; top: 17px; right: 0; font-size: 14px; color: #888; font-weight: normal; }
table.view > tbody > tr > td { padding: 20px 0; border-bottom: 1px solid #ddd; overflow: hidden; }
table.view > tbody > tr > td.files > p { position: relative; padding: 0 24px 0 0; font-size: 14px; color: #888; float: left; }
table.view > tbody > tr > td.files > p:after { content: ''; position: absolute; top: 5px; right: 12px; width: 1px; height: 12px; background: #888; }
table.view > tbody > tr > td.files > p + p:after { display: none; }
table.view > tbody > tr > td.files > p:nth-child(n+3) { clear: both; margin: 5px 0 0 111px; }
table.view > tbody > tr > td.files > p > img { padding: 0 5px 0 0; }
table.view > tbody > tr > td.content { padding: 30px 10px; line-height: 30px; font-size: 16px; color: #333; }
table.view > tbody > tr > td.button { padding: 50px 0 0; text-align: center;}
table.view > tbody > tr:last-child > td { border-bottom: none; }
table.view img { max-width: 100%; }
table.font16 > tbody > tr > th { font-size: 16px; }
/* 서브 메뉴 */
.sub_menu { width: 100%; margin: 40px 0 0; }
.sub_menu > ul { position: relative; border-radius: 10px; border: 1px solid #ddd; align-items: flex-start; display: flex; }
.sub_menu > ul > li { position: relative; width: 50%; padding: 15px 20px; border-radius: 10px; background: #fff; text-align: center; font-size: 18px; color: #888; font-weight: 500; cursor: pointer; z-index: 2; }
.sub_menu > ul > li.active { background: #3268DD; border-radius: 10px; color: #fff; font-weight: 500; }
/* 탭 메뉴 */
.tab_menu { margin: 0 auto; background-color: #fff; }
.tab_menu > ul > li { width: calc(100%/3); height: 50px; padding: 0; line-height: 50px; border-bottom: 1px solid #3268DD; border-radius: 0; box-sizing: border-box; background-color: #f8f8f8; font-size: 18px; text-align: center; color: #888; font-weight: 600; transition: all 0.2s ease; cursor: pointer; display: block; float: left; }
.tab_menu > ul > li.active { border: 1px solid #3268DD; border-radius: 10px 10px 0 0; border-bottom: 1px solid #fff; background-color: #fff; font-size: 18px; font-weight: 600; color: #3268DD; }

/* 우편번호 검색 레이어 */
#postcodeLayer { position: fixed; top: 50%; left: 50%; width: 500px; height: 480px; transform: translateX(-50%) translateY(-50%); border: 5px solid #333; overflow: hidden; z-index:13; display:none; }
#postcodeLayer .title { padding: 5px 0 10px 10px; background: #333; color: #fff; }
#postcodeLayer .close { position: absolute; right: 10px; top: 8px; width: 15px; height: 15px; background-size: cover; cursor: pointer; }
#postcodeLayer .close:after { content: '\00d7'; position: absolute; top: -12px; font-size: 30px; color: #fff; cursor: pointer; }