@charset "utf-8";
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

/* 초기화 */
html {font-size:14px;}
body {min-width:280px;margin:0 auto;padding:0;font-size:14px;font-family: 'Pretendard', 'Malgun Gothic', sans-serif;color:var(--txt-color-def);background:#fff; letter-spacing:-0.05em; box-sizing:border-box;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:'Pretendard', 'Malgun Gothic', sans-serif}

ul, ol, dl,dt,dd {margin:0;padding:0;list-style:none}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family:'Pretendard', 'Malgun Gothic', sans-serif;font-size:1em; border:0;}
input[type="submit"] {cursor:pointer}
button {cursor:pointer;transition:all 0.3s}

p {margin:0;padding:0;word-break:break-all}
hr  {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:var(--txt-color-def);text-decoration:none; transition:all 0.3s}
br {font-size:0;}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

input[type=text],input[type=password], textarea {
	outline:none;
}

/*SELECT CUSTOM**/
.select_cst {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="email"],
input[type="date"],
input[type="url"],
input[type="search"],
input[type="number"],
input[type="submit"]  { 
	-webkit-appearance: none; /*브라우저 스타일 초기화*/
    -moz-appearance: none; /*브라우저 스타일 초기화*/
    appearance: none; /*브라우저 스타일 초기화*/
	font-family:'Pretendard', 'Malgun Gothic', sans-serif;
}
input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
	-webkit-appearance: none; /*브라우저 스타일 초기화*/
    -moz-appearance: none; /*브라우저 스타일 초기화*/
    appearance: none; /*브라우저 스타일 초기화*/
}
input::placeholder,
textarea::placeholder {
	color:var(--txt-color-gray);
}
textarea, select, button {
	-webkit-appearance: none; /*브라우저 스타일 초기화*/
    -moz-appearance: none; /*브라우저 스타일 초기화*/
    appearance: none; /*브라우저 스타일 초기화*/
	font-family: 'Pretendard', 'Malgun Gothic', sans-serif;
	background:none;
	color:var(--txt-color-def);
}
img {max-width:100%;height:auto;}
.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;
}

/* COMMON */
html {scroll-behavior: smooth;}

/*FLEX*/
.flexBox{display: -webkit-box;display: -ms-flexbox;display: flex;width:100%;-webkit-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.flexBox.area02{-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flexBox.area02 > *{width:48%;}
.flexBox.area02.ver_noList > *{width:auto;}
.flexBox.area02.ver_auto_h{-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;}
.flexBox.area03 > *{width:32%;margin-right:2%;}
.flexBox.area03 > *:nth-child(3n){margin-right:0}
.flexBox.area04 > *{width:36%;margin-right:2%;}
.flexBox.area04 > *:nth-child(3n){margin-right:0}
.flexBox.ver_js-sb{-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flexBox.ver_nowrap{-webkit-box-lines: single;-ms-flex-wrap: nowrap;flex-wrap: nowrap;}

.mobVer {display:none !important}
.inner{width:800px;margin-left:auto;margin-right:auto}
.inner2{width:825px;margin-left:auto;margin-right:auto;}
.btn_box{text-align:center}
.btn_box.tr{text-align:right}
.btn_box.ver_btm{margin-top:30px}
.btn_box a + a{margin-left:5px}
@media (max-width: 768px) {
	.m-column{-webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column;}
	.m-column > *{width:100% !important}
	.btn_box{	display:flex;justify-content: space-between;align-items: center;}
    .btn_box > *{min-width:49% !important;}

}
@media (max-width: 970px) {
	.inner,.inner2{width:96%;margin-left:auto;margin-right:auto}
	.inner2{width:90%;margin-left:auto;margin-right:auto}
	
}
@media (max-width: 768px) {
	.inner{min-width: 280px;width:84%}
	.flexBox.area02.ver_noList.m-column-reverse,
	.flexBox.area02.ver_noList.m-column{-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;}
	.inner.m_ver_full {width:100%}
}
@media (max-width: 280px) {
	.inner{min-width: inherit;width:95%}
}

.tc {text-align:center !important}
.newBtn{all: unset;display: inline-block;min-width: 230px;line-height:52px;text-align: center;font-size: 16px;background: #d6321b;-webkit-transition: all .2s;-moz-transition: all .2s;-ms-transition: all .2s;-o-transition: all .2s;transition: all .2s;cursor:pointer;border:0;border-radius:5px;color:#FFF;box-sizing: border-box;}
.newBtn.log_btn{background:linear-gradient(to right, #e95213, #930b12);}
.newBtn.btn_s{line-height:32px;font-size:12px;min-width:80px}
.newBtn.btn_gray{border:1px solid #b8b8b8;background:#b8b8b8;color:#FFF}
.newBtn.fullBtn{width:100%}

/* color */
.red {color:#d6321b !important}
.bg_white {background:#FFF !important}

/*INPUT CUSTOM*/
.inp input{line-height:50px;border:1px solid #DDD;border-radius:5px;padding:0 18px;width:100%}
.inp.ver_nm input{background:url(../img/common/ico_nm.png) no-repeat 18px center;padding-left:30px}


/*SCROLL CUSTOM*/
::-webkit-scrollbar {
	width:1rem;		
	background-color:transparent;
}
::-webkit-scrollbar-thumb {
	width:2rem;		
	border-radius:5em;
    background-clip: padding-box;
    border:2px solid transparent;
	background-color:#f2f2f2;
}
::-webkit-scrollbar-track {
	width:2rem;		
	background-color:transparent;		
} 

.tbl table{width:100%;border-spacing: 0;border:1px solid #DDD;border-right:0}
.tbl table thead th{text-align:center;background:#f8f8f8;font-size:13px;color:#333;font-weight:500;line-height:1.2;border-right:1px solid #DDD;padding:15px 10px;font-weight:500;border-bottom:1px solid #DDD}
.tbl table tbody td{font-size: 14px;padding:8px 12px;color: #333;border-top: 1px solid #DDD;border-right:1px solid #DDD;text-align:center}
.tbl table tbody td:first-child{text-align:left}
.tbl.tl table tbody td{text-align:left}
.tbl table tbody tr:first-child td,.tbl table tbody tr:first-child th{border-top:0}
.tbl table tbody th{text-align: left;font-size: 14px;padding: 0 10px;color: #333;border-top: 1px solid #DDD;border-right:1px solid #DDD;background:#f8f8f8;line-height:34px;font-weight:500}
.tbl table .w10{width:10%}
.tbl table .w15{width:15%}
.tbl table .w20{width:20%}
.tbl table .w25{width:25%}
.tbl table .w30{width:30%}
.tbl table .w35,.w35p{width:35%}
.tbl table .w40{width:40%}
.tbl table .w50{width:50%}
.tbl table .w60{width:60%}
.tbl table .w70{width:70%}

.ws_1 {width:300px;}
.ws_2 {width:510px;}
.tbl table td.b_blue{background:#ecf2ff;color:#0051ff;text-align:center}
.tbl.ver_tc table tbody td:first-child{text-align:center !important}
.tbl.ver_tc table tbody td:nth-child(2){text-align:left !important}

@media (max-width: 768px) {
	.tbl table .mw10{width:10% !important}
	.tbl table .mw15{width:15% !important}
	.tbl table .mw20{width:20% !important}
	.tbl table .mw22{width:23% !important}
	.tbl table .mw33{width:27% !important}
	.tbl table .mw25{width:25% !important}
	.tbl table .mw30{width:30% !important}
	.tbl table .mw40{width:40% !important}
	.tbl table .mw50{width:50% !important}
	.tbl table .mw60{width:60% !important}
	.tbl table .mw70{width:70% !important}
	.head_box{ display: flex;justify-content: space-between;align-items: center;}
	.head_box h1{width:33%}
	.head_box h1 img{width:100%}
	.head_box .newBtn{}
	.tbl table tbody td {padding:6px 5px;font-size:13px;    letter-spacing: -1px;}
	.tbl table thead th{padding:6px 2px}
}

.tbl dt{text-align:left;background:#f8f8f8;font-size:14px;color:#333;font-weight:500;line-height:1.2;padding:8px 10px;width: 55%;}
.tbl dd{font-size: 14px;color: #333;text-align:left;flex: 1;padding: 8px 10px;border-left: 1px solid #DDD;/* height: 30px; */}
.tbl dl + dl{border-left: 1px solid #DDD;/* align-items: center; */}
.tbl dl{display: flex;width:28%;border-left: 1px solid #DDD;border-top: 1px solid #DDD;}
.tbl dl.w2{width:44%}
.tbl dl.w2 dt{width:34%}
.tbl.flexBox {border-right:1px solid #DDD;border-bottom:1px solid #DDD}
.tbl.flexBox.area02 dt{width:30%}
.tbl.flexBox.area02 > * {width:50%}


/*HEADER*/
.h1_wrap{margin-bottom: 25px;}
.h1_wrap h1 a{display:inline-block;}
header .flexBox{align-items: center;}
header .flexBox a.newBtn{width:80px !important}


/*FOOTER*/
footer {text-align:center;padding:100px 0}
footer img{width:145px}


@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

.loading_box .loading{display: inline-block;z-index: 100;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width:30%}
.loading_box .loading > img{max-width:100%;	-webkit-animation: rotate-center .9s linear infinite both;animation: rotate-center 1s linear infinite both;}
.loading_box .loading .load_txt{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.loading_box:after{content:'';display:block;position:fixed;background:rgba(0,0,0,.8);left:0;right:0;top:0;bottom:0;z-index:99}

@media (max-width: 768px) {
	.h1_wrap{margin-bottom:15px}
	.h1_wrap h1 a img{width:auto; height:30px}
	.pcVer {display:none !important}
	.mobVer {display:block !important}
	table.tbl .w1{width:33.3%}
	table.tbl .w2{width:33.3%}
	table.tbl .w3{width:33.3%}
	footer {text-align:center;padding:50px 0}
	footer img{width:30%}
	.tbl dt{width:46% !important;font-size:13px}
	.tbl dd{padding:6px 5px;font-size:13px}
	.tbl dl{width:50%}
	.tbl dl.w2{width:50%}
	.tbl table tbody th{padding:0 5px;font-size:13px;line-height: 1.2;}
	.tbl.flexBox.area02 dt {width:23% !important}
	.tbl dt {padding: 6px 5px}

}