@charset "utf-8";

/*
    Document : default style definition
    Company  : korea web data center(KODC)
*/
*{box-sizing:border-box;}
html, body {width:100%; height:100%;}
body {margin:0; padding: 0; font-size:15px; letter-spacing:-0.04em; font-family:'Noto Sans R', 'dotum', sans-serif; font-weight:normal; -webkit-text-size-adjust:100%;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input, table, tr, th, td {color:#333; margin:0;padding:0; font-weight:normal; }
hr {display: none;}
dd, li{list-style:none;}
ul:after, dl:after, ol:after{clear:both; display:block;}
a:link, a:visited {color:#333; text-decoration: none;}
a:active, a:hover{color:#333; text-decoration: none;}
a img, input.type-image {border: 0 none;}
textarea {width:100%; height:170px; padding:22px; box-sizing:border-box; background:#f8f8f8; border:1px solid #ddd; font-family:'Noto Sans L', 'dotum', sans-serif;color:#555; font-size:14px; resize:none;}
input.type-text:hover,
input.type-text:focus,
textarea:hover,
textarea:focus,
/*
select:hover,
select:active
*/
{background-color: #fff;}
img{vertical-align:top;}
input, select, label, select { padding:0 0; font-family:'Noto Sans L', 'dotum', sans-serif; font-size:15px;}
input{padding:0 10px; letter-spacing:-1px;  }
select {border:1px solid #d7d7d7; padding:8px 28px 8px 10px; color:#333; height:34px; line-height:15px; background:#fff url(/assets/images/select_arrow.png) no-repeat right 14px center; -webkit-appearance:none; -moz-appearance:none; appearance:none; vertical-align:middle; font-size:14px; letter-spacing:0;}

select option {}
select::-ms-expand {display: none;}
span.button,
img.button,
a.button {cursor: pointer; vertical-align: middle;}
table{border-collapse: collapse; border-spacing:0;}
caption{font-size:0; line-height:0; position:absolute;}
em {font-style:normal;}


input[type="text"], input[type="password"], input[type="tel"], input[type="email"] {font-size:14px; width:100%; padding:8px; box-sizing:border-box; height:42px; border:1px solid #d7d7d7; background:#fff; border-radius:0; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; appearance:none; padding-left:8px; }
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color:#999;
}
::-moz-placeholder { /* Firefox 19+ */
  color:#999;
}
:-ms-input-placeholder { /* IE 10+ */
  color:#999;
}
:-moz-placeholder { /* Firefox 18- */
  color:#999;
}


/* 체크박스 디자인 */
/* .type2 : 영상콘텐츠에서 사용중*/
input[type="checkbox"] {position:absolute; left:-9999px;}
input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; font-size:15px; font-family:'Noto Sans L', 'dotum', sans-serif; color:#000;}
input[type="checkbox"] + label:before {content: ''; display:inline-block; vertical-align:middle; width: 25px; height:25px; margin:0 10px 0 0; background:url(../images/checkbox.png) no-repeat 0 0; background-size:25px;}
input[type="checkbox"]:checked + label:before {background-position-y:-25px;}

label input[type="checkbox"] {}
label input[type="checkbox"] + span {display: inline-block; position: relative; cursor: pointer; vertical-align:middle; margin-top:-6px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; font-size:14px;}
label input[type="checkbox"] + span:before {content: ''; display:inline-block; vertical-align:middle; width: 28px; height: 28px; margin:0 3px 0 0; background:url(/images/checkbox.png) no-repeat 0 0; background-size:28px;}
label input[type="checkbox"]:checked + span:before {background-position-y:-28px;}

input[type="checkbox"].type2 {position:absolute; left:-9999px;}
input[type="checkbox"].type2 + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; font-size:15px; font-family:'Noto Sans L', 'dotum', sans-serif; color:#000;}
input[type="checkbox"].type2 + label:before {content: ''; display:inline-block; vertical-align:middle; width:17px; height:17px; margin:0 0 0 0; background:url(/images/checkbox.png) no-repeat 0 0; background-size:17px;}
input[type="checkbox"].type2:checked + label:before {background-position-y:-17px;}

label input[type="checkbox"].type2 {}
label input[type="checkbox"].type2 + span {display: inline-block; position: relative; cursor: pointer; vertical-align:middle;  -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; font-size:14px;}
label input[type="checkbox"].type2 + span:before {content: ''; display:inline-block; vertical-align:middle; width:17px; height:17px; margin:0 0 0 0; background:url(/images/checkbox.png) no-repeat 0 0; background-size:17px;}
label input[type="checkbox"].type2:checked + span:before {background-position-y:-17px;}


/* 라디오박스 디자인 */
input[type="radio"] {position:absolute; left:-9999px;}
input[type="radio"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
input[type="radio"] + label:before {content: ''; display:inline-block; vertical-align:middle; width: 17px; height: 17px; margin:0 4px 0 2px; background:url(../images/radio.png) no-repeat 0 0; background-size:17px;}
input[type="radio"]:checked + label:before {background-position-y:-17px;}

label input[type="radio"] {position:absolute; left:-9999px;}
label input[type="radio"] + span {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
label input[type="radio"] + span:before {content: ''; display:inline-block; vertical-align:middle; width: 25px; height: 25px; margin:0 4px 0 2px; background:url(../images/radio.png) no-repeat 0 0;}
label input[type="radio"]:checked + span:before {background-position-y:-25px;}

b, h1, h2, h3, dt, strong {font-family:'Noto Sans B', 'dotum', sans-serif; font-weight:700;}

.clear{*zoom:1;}
.clear:after{content:""; display:block; clear:both;}
.ac {text-align:center !important;}
.ar {text-align:right !important;}
.al {text-align:left !important;}
.fl {float:left !important;}
.fr {float:right !important;}
.pr {position:relative;}
.vm {vertical-align:middle !important;}

.red {color:#ff0000 !important;}
.gray {color:#999 !important;}
.black {color:#333 !important;}
.blue {color:#2858a3 !important;}
.sky {color:#3992ff !important;}

.text-right { padding-right: : 30px !important; text-align: right !important;}
.text-left { padding-left: 30px !important; text-align: left !important; }
.text-center { text-align: center !important; }

.btnAc {text-align:center; padding:20px 0;}
.btnArea {margin:3% 0 0;}
.btnArea:after{content:""; display:block; clear:both;}
.btnArea .fl {width:50%;}
.btnArea .fr {width:50%; text-align:right;}
.btnArea.w2 a {margin:0 0.5%; width:192px;}
.btnArea.ar a {margin:0 0.5%; width:100px;}


/*버튼 스타일 */
.btnTypeA {display:inline-block; text-align:center; color:#fff !important; font-size:18px; border:1px solid #138842; background:#138842; vertical-align:middle; height:54px; line-height:54px;}
.btnTypeB {display:inline-block; height:54px;line-height:54px; padding:0; text-align:center; color:#333;  font-size:18px; border:1px solid #ddd; background:#fff; vertical-align:middle;}
.btnTypeC {display:inline-block; text-align:center; color:#fff !important; font-size:16px; background:#333; height:42px; line-height:42px; vertical-align:middle; padding:0 20px;}
.btnTypeD {display:inline-block; padding:10px 25px; text-align:center; color:#fff !important; font-size:16px; border:1px solid #999; background:#999; vertical-align:middle;}

.btnTypeA.navy {background-color:#2858a3; border:0; padding:18px 0; font-size:17px;}

.btnW {display:inline-block; padding:5px 0; width:74px; height:30px; text-align:center; color:#333 !important; font-size:13px; border:1px solid #d7d7d7; background:#fff; vertical-align:middle;}
.btnK {display:inline-block; padding:5px 0; width:74px; height:30px; text-align:center; color:#fff !important; font-size:13px; border:1px solid #333; background:#333; vertical-align:middle;}
.btnG {display:inline-block; padding:0 5px; height:28px; line-height:28px; text-align:center; color:#fff !important; font-size:13px; border:1px solid #aaa; background:#aaa; vertical-align:middle;}
.btnB {display: inline-block;padding: 0 20px;height: 34px;line-height: 34px;text-align: center;color: #fff !important;font-size: 14px;vertical-align: middle;background: #0073d8;border-radius: 4px;}


.full {width:100%;}


/*탭 스타일 */
.tabTypeA {max-width:1200px; margin:0 auto 40px;}
.tabTypeA:after{content:""; display:block; clear:both;}
.tabTypeA li {float:left;}
.tabTypeA.half li {width:50%;}
.tabTypeA.third li {width:33.333%;}
.tabTypeA.fourth li {width:25%;}
.tabTypeA.fifth li {width:20%;}
.tabTypeA.six li {width:16.666%;}
.tabTypeA li a {display:block; font-size:16px; height:52px; line-height:48px; font-family:'Noto Sans L', 'dotum', sans-serif; border:1px solid #d7d7d7; text-align:center; color:#333; background:#fff;}
.tabTypeA li.on a {border-color:#3992ff; color:#3992ff; font-family:'Noto Sans R', 'dotum', sans-serif;}

/* table */
.list {table-layout:fixed; width:100%; border:1px solid #dddddd; /*border-top:1px solid #333;*/  border-collapse: revert;}
.list th {font-family:'Noto Sans R';   border-bottom:1px solid #dddddd;padding:15px 10px;background:#f8f9fa; font-size:16px; line-height:18px; text-align:center; border-top: 1px solid #333;}
.list th.bdgray {border-top: 0;}
.list td {font-family:'Noto Sans L'; font-size:14px; border-bottom:1px solid #dddddd; padding:15px 10px; text-align:center;}
.list td .gray {margin-bottom:5px; font-size:14px;}
.list .fs {font-size:15px;}

.list2 {border-top:1px solid #333;}
.list2 th {border-bottom:1px solid #d7d7d7; padding:15px 10px;}

.form {table-layout:fixed; width:100%;  border:1px solid #dddddd;border-top:1px solid #333;}
.form th {border-bottom:1px solid #dddddd; border-right:1px solid #dddddd; font-family:'Noto Sans R';padding:15px 30px; color:#999; text-align:center; background:#fafbfd; font-size:17px; color:#333; line-height:18px;}
.form td {border-bottom:1px solid #dddddd; font-family:'Noto Sans L';padding:15px 30px; font-size:16px;}
.form .last {border-bottom-color:#333;}
.form .txt {margin-top:7px; font-size:14px;}
.form label {color:#333; margin-right:15px; font-size:15px;}

.form2 th {color:#333; padding:20px 25px;}
.form2 td {color:#666; padding:20px 25px;}

.list_a th { padding:15px 0; font-size:17px; line-height:18px; text-align:center; border:1px solid #e0e0e0; border-top:1px solid #4d4d4d; background:#f9f9f9;}
.list_a td {border:1px solid #e0e0e0; padding:20px 10px; font-size:16px;}

/* paging */
.paging {position:relative; margin:30px auto 10px;}
.paging p {margin:0 auto; padding:0; text-align:center; zoom:1;}
.paging p a {display:inline-block; margin:0 0; box-sizing:border-box; padding:0 5px; width:32px; height:32px; line-height:30px; color:#333; vertical-align:middle; border:1px solid #d7d7d7; font-family:'Roboto', 'Noto Sans R', 'dotum', sans-serif;}
.paging p a:hover, .paging p a:focus, .paging p a:active {color:#333; border:1px solid #333;}
.paging p a.checkOn {font-family:'Noto Sans M'; color:#fff; background:#3992ff; border:1px solid #3992ff;}
.paging p a.pre {width:32px; margin:0px 0 0; padding:0; background:url(/images/pagingIcon.png) 0 0 no-repeat;}
.paging p a.pre:hover, .paging p a.pre:focus, .paging p a.pre:active {background-position:-38px 0;}
.paging p a.first {width:32px; margin:0px 0 0; padding:0; line-height:32px; background:url(/images/pagingIcon.png) -76px 0 no-repeat;}
.paging p a.first:hover, .paging p a.first:focus, .paging p a.first:active {background-position:-114px 0;}
.paging p a.next {width:32px; margin:0px 0 0; padding:0; background:url(/images/pagingIcon.png) 0 -38px no-repeat;}
.paging p a.next:hover, .paging p a.next:focus, .paging p a.next:active {background-position:-38px -38px;}
.paging p a.last {width:32px; margin:0px 0 0; padding:0; background:url(/images/pagingIcon.png) -76px -38px no-repeat;}
.paging p a i {line-height:32px;}
.paging p a.last:hover, .paging p a.last:focus, .paging p a.last:active {background-position:-114px -38px;}
.paging p a.pre span, .paging p a.first span, .paging p a.next span, div.paging p a.last span {display:none;}

.on_text2 li{padding:10px;}

*:focus {outline:none;}

.btnA {display: inline-block;padding: 0 20px;height: 34px;line-height: 34px;text-align: center;color: #fff !important;font-size: 14px;vertical-align: middle;background: #808080;border-radius: 4px;}
button {border: 0;outline: 0;cursor: pointer;}
