@charset "UTF-8";
@import url('./fonts.css');


/* 기본 */
html {overflow-y:scroll; height:100%; background:#f8f8f8;}
body {margin:0 auto;padding:0;width:100%;max-width:768px; min-width:320px; /*min-width:400px;*/ font-family:'Noto Sans KR','Poppins', AppleSDGothicNeo-Regular,'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif; font-size:1em; color:#333; outline:0;  background:#fff;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-family:'Noto Sans KR';}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none;}
ul li, ol, li {margin:0;padding:0;list-style:none;word-break:keep-all;}

legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;}
input, button {margin:0;padding:0;font-family:'Noto Sans KR', dotum, sans-serif;}
input[type="submit"]{cursor:pointer}
input[type=checkbox] {accent-color:#000; appearance:checkbox;}
input[type=radio] {accent-color:#000; appearance:radio;}
input:read-only {background-color: #ededed;}
button {cursor:pointer; outline:none; border:none; background:transparent;}
table{border-collapse:collapse;border-spacing:0;word-break:keep-all;}
iframe{border:0}
div, p, span, strong, table, thead, tbody, tfoot, th, td, ul, ol, li, input, form, select, textarea, button, dl, dt, dd, a {margin:0; padding:0;}

textarea, select { font-size:1em;font-family:'Noto Sans KR', dotum, sans-serif;}
select {margin:0}
p {margin:0;padding:0; word-break:keep-all;}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {text-decoration:none; color:#000;}
a:hover {text-decoration:none;}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/* 아이폰 기본스타일 제거 */
input, textarea {appearance:none; -webkit-appearance:none; -webkit-border-radius:0;}
select {-webkit-appearance:none; -moz-appearance:none;  appearance:none;  color:#333; background:#fff url('/images/select_bg.png') no-repeat 98% center;}
select::-ms-expand {display:none;}


::selection {background:#1f282d; color:#fff;}


/* 아이콘 크기 6.4.2ver */
.fsi10 {font-size:10px;}
.fsi12 {font-size:12px;}
.fsi13 {font-size:13px;}
.fsi14 {font-size:14px;}
.fsi16 {font-size:16px;}
.fsi20 {font-size:20px;}
.fsi35 {font-size:35px;}
.fsi40 {font-size:40px;}

/* 레이아웃 */
.mgauto {margin:auto;}
.mb0 {margin-bottom:0px !important;}
.mt0 {margin-top:0px !important;}
.mt5 {margin-top:5px;}
.mt7 {margin-top:7px;}
.mt10 {margin-top:10px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt35 {margin-top:35px;}
.mt40 {margin-top:40px;}

.ml2 {margin-left:2px;}
.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml15 {margin-left:15px;}

.mr2 {margin-right:2px;}
.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr15 {margin-right:15px;}

.pd0 {padding:0 !important;}
.pd010 {padding:0 10px;}
.pd20 {padding:20px;}
.pd25 {padding:25px;}
.pd50 {padding:50px;}

.wd19 {width:19%;}
.wd24 {width:24%;}
.wd32 {width:32.3333%;}
.wd49 {width:49%;}
.wd80 {width:80%;}
.wd100 {width:100%;}
.wd0100 {width:100% !important;}
.wd240 {width:240px;}

.mwd100 {max-width:100%;}
.mwd250 {width:100%; max-width:250px;}
.mwd300 {width:100%; max-width:300px;}

.img100 {max-width:100%;}

.right {text-align:right;}
.center {text-align:center;}

.flex {display:flex; align-items:center;}
.flex > .frm_input {flex: 1;}
.flxst {align-items:flex-start;}
.flxend {align-items:flex-end;}
.flxbtw {justify-content:space-between;}

.dsn {display:none;}

/* 서브콘텐츠 */
.scont {width:100%; padding:30px 20px 50px;}
.brbox {border:1px solid #111; border-radius:15px;}

.snoti {border-top:2px solid #222; border-bottom:1px solid #ddd; margin-top:30px !important;}
.snoti.mt0 {margin-top:0px !important;}
.snoti h5 {width:100%; position:relative; padding:12px 10px; border-bottom:1px solid #ddd; font-size:16px; font-weight:500; cursor:pointer;}
.snoti h5 i {margin-right:4px;}
.snoti h5 .tgbtn {position:absolute; right:10px; top:19px; margin:0;}
.snoti .txt {padding:10px;}
.snoti .txt p {font-size:14px; line-height:20px; color:#555; padding-left:8px; margin:4px 0; position:relative;}
.snoti .txt p:before {content:""; display:inline-block; width:2px; height:2px; border-radius:5px; background:#999; position:absolute; left:0; top:11px;}
.snoti .txt p span {font-size:13px; color:#888; letter-spacing:-0.04em; line-height:15px; word-break:break-all;}
.snoti .txt h6 {font-size:14px; color:#222; font-weight:500;}

.dv_step_box {display:flex; justify-content:center; align-items:center;}
.dv_step_box > i {margin:0 15px; opacity:0.3;}
.dv_step_box .step {text-align:center;}
.dv_step_box .step .icon {width:30px; height:30px; display:flex; justify-content:center; align-items:center; margin:0 auto 5px; color:#fff; background:#ddd; border-radius:50%;}
.dv_step_box .step .icon i {}
.dv_step_box .on .icon {background:#111;}
.dv_step_box .step p {font-size:14px; color:#111;}
.dv_step_box .step p span {display:block; font-size:13px; color:#a6a6a6; font-weight:600;}

.dot_list {}
.dot_list li {padding-left:12px; position:relative; margin-top:10px;}
.dot_list li:first-child {margin-top:0;}
.dot_list li:before {content:"·"; position:absolute; left:0; top:0px; color:#26aeff;}
.dot_list li h6 {font-size:16px; color:#111; font-weight:400;}
.dot_list li p {font-size:15px; color:#777;}
.dot_list li p b {font-weight:400;}
.dot_list li p a.btn {margin-left:5px;}
.dot_list li span {font-size:14px; color:#999; display:block; margin-top:5px;}

.step_box {margin:0 auto 20px;}
.step_box .step {display:flex; align-items:center; border-radius:50px; overflow:hidden;}
.step_box .step li {width:100%; display:inline-block; height:5px; background:#ddd;}
.step_box .step li.on {background:#005cb9;}
.step_box p.ing {font-size:14px; font-weight:500; color:#999; text-align:right; margin-top:7px;}
.step_box p.ing b {color:#005cb9;}

/* 타이틀&텍스트 */
h3.ctit {font-size:23px; color:#111; margin-bottom:20px; text-align:center;}
h4.stit {font-size:20px; color:#1f282d; margin-bottom:15px;}
h5.iptit {font-size:15px; color:#222; font-weight:500; line-height:30px;}
p.exc_txt {font-size:13px; color:#dc1018; margin-top:5px;}
p.info_txt {font-size:14px; color:#444;}
p.info_txt2 {font-size:13px; color:#444;}
p.title {font-size:20px; color:#111; margin-bottom:20px; text-align:center;}
p.explan {font-size:15px; color:#111; margin-bottom:20px; text-align:center;}

.cl_blue {color:#005cb9 !important;}
.cl_minus {color:#fc7126 !important}
.cl_plus {color:#006ad5 !important;}
.cl_red {color:#dc1018 !important;}

.op02 { opacity:0.2;}
.op05 { opacity:0.5;}


/* 버튼 */
a.btn,.btn {display:inline-flex; align-items: center; justify-content: center; line-height: normal !important; text-align:center; border-radius:4px; letter-spacing:-0.03em; padding:0 10px; font-weight:400; vertical-align:middle; transition:all 0.2s; -webkit-transition:all 0.2s; -moz-transition:all 0.2s; -o-transition:all 0.2s;}

.btn01 {height:40px; line-height:40px; font-size:14px; color:#fff; background:#005cb9;}
.btn01:hover {background:#006ad5;}
.btn03 {height:40px; line-height:40px; font-size:13px; color:#788085; border:1px solid #b5babd;}
.btn03:hover {color:#1f282d; border-color:#313f48;}
.btn04 {height:35px; line-height:35px; font-size:12px; color:#fff; background:#555;}
.btn04:hover {color:#fff; background:#111;}
.btn05 {height:30px; line-height:30px; padding:0 10px !important; font-size:12px; color:#fff; background:#005cb9;}
.btn05:hover {background:#006ad5;}

.btn_ad {height:45px; line-height:45px; /*font-size:15px; color:#fff; background:#0e0e0e;*/}
.btn_sbm {height:45px; line-height:45px; font-size:15px; color:#fff; background:#005cb9;}
.btn_sbm:hover {background:#006ad5; color:#fff;}
.btn_sbm2 {height:45px; line-height:45px; font-size:14px; color:#fff; background:#252525;}
.btn_sbm2:hover {background:#000;}
.btn_ars {height:45px; line-height:45px; font-size:14px; color:#fff; background:#555; border:none;}

.btn_bsc {height:40px; line-height:40px; padding:0 30px !important; font-size:14px; color:#fff; background:#555;}
.btn_bsc:hover {background:#333;}
.btn_bsc:disabled {background-color:#a7a5a5 !important; cursor:default;}
.btn_bsc2 {height:35px; line-height:35px; font-size:14px; color:#fff; background:#788085;}
.btn_bsc2:hover {background:#505a61;}
.btn_bsc3 {height:35px; line-height:35px; font-size:14px; padding:0 20px !important; color:#fff; background:#005cb9; white-space: nowrap;}
.btn_bsc3:hover {background:#006ad5;}

.btn_wrap {display:flex; justify-content:space-between; flex-wrap:wrap;}
.flxbtw .btn_wrap {justify-content: flex-end; column-gap: 5px;}
.tab_btn {display:flex; border:1px solid #005cb9; border-radius:7px; overflow:hidden;}
.tab_btn li {width:100%; text-align:center; height:40px; line-height:40px; border-left:1px solid #005cb9; }
.tab_btn li:first-child {border-left:none;}
.tab_btn li a {display:block; font-size:13px; color:#005cb9; cursor: pointer;}
.tab_btn li label {display:block; font-size:13px; color:#005cb9; cursor: pointer;}
.tab_btn li.on {background:#005cb9;}
.tab_btn li.on a {color:#fff;}
.tab_btn li.on label {color:#fff;}

.tab_btn2 {display:flex; border:1px solid #ddd; border-radius:7px; overflow:hidden;}
.tab_btn2 li {width:100%; text-align:center; height:50px; line-height:50px; border-left:1px solid #ddd; background:#f5f5f5; }
.tab_btn2 li:first-child {border-left:none;}
.tab_btn2 li a {display:block; font-size:13px; color:#888; cursor: pointer; }
.tab_btn2 li label {display:block; font-size:13px; color:#888; cursor: pointer; }
.tab_btn2 li.on {background:#ddd;}
.tab_btn2 li.on a {color:#111;} 
.tab_btn2 li.on label {color:#111;} 
.bt_tab_btn {display:flex; border:1px solid #005cb9; border-radius:7px; overflow:hidden;}
.bt_tab_btn button {width:100%; text-align:center; height:40px;font-size:14px; color:#005cb9; border-left:1px solid #005cb9; }
.bt_tab_btn button:first-child {border-left:none;}
.bt_tab_btn button.on {background:#005cb9; color:#fff;}
.bt_tab_btn2 {display:flex; border:1px solid #ddd; border-radius:7px; overflow:hidden;}
.bt_tab_btn2 button {width:100%; text-align:center; height:45px; font-size:13px; color:#888; border-left:1px solid #ddd; background:#f5f5f5; }
.bt_tab_btn2 button:first-child {border-left:none;}
.bt_tab_btn2 button.on {background:#ddd; color:#111;}
.bt_tab_btn2 button span {display:inline-block;}

@media (max-width:359px){
	.bt_tab_btn2 button {letter-spacing:-0.04em;}
 }
 
 
.btn_edit {height:20px; line-height:18px; font-size:11px; padding:0 5px !important; color:#999; border-radius:3px !important; border:1px solid #ccc;}
.btn_edit:hover {color:#fff; background:#777;}
.btn_edit2 {font-size:14px; color:#005cb9; opacity:0.8;}
.btn_edit2:hover {opacity:1;}
.btn_edit3 {color:#005cb9; opacity:0.8; text-decoration:underline;}
.btn_edit3:hover {opacity:1;}
.btn_edit4 {color:#005cb9; opacity:0.8; text-decoration:underline;}
.btn_edit4:hover {opacity:1;}
.btn_del {font-size:12px; padding:2px 5px !important; color:#fff; border-radius:3px !important; border:none; background:#dc1018;}
.btn_del:hover {}


.pgnation {display:flex; justify-content:center; align-items:center;}
.pgnation ul {margin:0 5px; text-align:center;}
.pgnation ul li {display:inline-block; cursor:pointer; padding:5px 10px; margin:0; font-size:12px; color:#888; border-radius:5px; border:1px solid #ccc;}
.pgnation ul li.on {background:#1f282d; border-color:#1f282d; color:#fff;}
.pgnation button {border:none; background:none; color:#666; margin:0 2px;}
.pgnation button.nview {opacity:0.5;}

p.total {font-size:15px; white-space: nowrap;}
ul.sort {display:flex;}
ul.sort li {}
ul.sort li svg {display:none; width:12px; position:relative; top:-1px;}
ul.sort li i {display:none; width:12px; position:relative; top:-1px;}
ul.sort li:after {content:"|"; font-size:12px; color:#aaa; margin:0 10px; position:relative; top: -2px;}
ul.sort li:last-child:after {display:none;}
ul.sort li a {font-size:15px; color: #999;}
ul.sort li.on i {display:inline-block; font-size:13px;}
ul.sort li.on svg {display:inline-block; font-size:13px;}
ul.sort li.on a {color:#111;}
/* 2024.06 수정 */
.search_filter {flex-wrap: wrap; margin-left: auto; justify-content: flex-end;}


/* 기본폼 */
.wrdiv {}
.wrdiv label {font-size:16px; color:#222; line-height:35px; font-weight:500;}
textarea, .frm_input {border:1px solid #ddd; background:#fff; color:#222; vertical-align:middle; max-width: 100%; padding:6px 10px; height:45px; font-size:14px; border-radius:5px;}
.frm_input:placeholder {color:#777;}
.frm_select {border:1px solid #ddd; color:#222; vertical-align:middle; padding:6px 10px; height:45px; font-size:14px; border-radius:5px;}
textarea {width:100%;height:200px;padding:10px;}
textarea:focus, .frm_input:focus, .frm_select:focus {outline:none;border:1px solid #aaa;}
.frm_input {height:45px;}
.full_input{width:100%;} 
input.readonly, input.readonly::placeholder {color:#111;}

@media screen and (max-width: 320px) {
    .scont {padding: 20px 15px 40px;}
    .brbox {padding: 15px;}
    .frm_input:placeholder {font-size: 0.75rem;}
}