@charset "utf-8";
/*-------------------------------------------------------------------
속성순서 :레이아웃, 사이징, 박스모양, 글자모양, 문단모양, 기타모양
형태 :display visibility
흐름 :float clear
위치 :position left right top bottom z-index
크기 :width height overflow
박스 :margin padding border
배경 :background
글자 :text font color
기타 :cursor
-------------------------------------------------------------------*/

@import url(font/noto_font/font_NotoSansKR.css);
@import url(font/icon/remixicon.css);
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap');

*{font-family: "Roboto",'NotoSansKR','NanumSquare', 'Noto Serif KR', sans-serif;  font-weight: 400;  word-break:keep-all;  color:#000}
*:focus { outline:none;  }
* {box-sizing: border-box;  word-wrap: break-word;  word-break: keep-all; }
*:before, *:after {-webkit-box-sizing: inherit;  -moz-box-sizing: inherit;  box-sizing: inherit; }


body, input, textarea, select, button, table{margin:0;  font-size:17px;   color:#555}
body, h1, h2, h3, h4, h5, dl, dt, dd, ul, li, ol, th, td, p, form, fieldset, legend, button { margin: 0;  padding: 0;  }

h1,h2,h3,h4,h5,h6 {font-weight:normal; }
ul,ol,dl,dt,dd{margin:0; padding:0; list-style:none}
table{table-layout:fixed; border-collapse:collapse; border-spacing:0;  width:100%; }
.dn{display:none}
.cursor { cursor: pointer; }

/* 숨김영역 */
hr, legend, .skip { position:absolute;  width:0;  height:0;  font-size:0;  line-height:0;  overflow:hidden;  left:-9999px; }
caption { width:0;  height:0;  font-size:0;  line-height:0;  left:-9999px; }

/*list*/
dl, ul, ol, li {list-style: none outside none; }
ul:after{content:'';  clear:both;  display:block; }
ul li{ word-wrap:break-word;  word-break:keep-all; }
ul > li > ul{margin-left:15px; }

/*Link*/
a:link,
a:visited,
a:active,
a:hover,a:focus{text-decoration:none !important;  color:#323236 }

/*이미지정렬*/
img {vertical-align:top; max-width:100%}
li img { vertical-align:top; }
td img { vertical-align:middle; }

/* align */
.fl_l{float:left; }
.fl_r{float:right}
.fl_n{float:none}
.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}

.dp_n{display:none; }
.dp_b{display:block; }
.dp_ib{display:inline-block; }
.dp_i{display:inline; }

.va_t{vertical-align:top; }
.va_m{vertical-align:middle; }
.va_b{vertical-align:bottom; }

.ta_l{text-align:left  !important; }
.ta_c{text-align:center  !important; }
.ta_r{text-align:right !important}

.posR{position:relative; }
.posA{position:absolute; }

.flex {display: flex;}
.flex * {flex: 1;}
.flex .auto {flex-basis: auto;}


/*Inputs*/

/* ie 아이콘삭제 */
input[type=search]::-ms-clear {  display: none;  width : 0;  height: 0;  }
input[type=search]::-ms-reveal {  display: none;  width : 0;  height: 0;  }
input[type=text]:disabled {  color:#444;  }

/* Chrome 아이콘삭제*/
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none;  }

select::-ms-expand {display: none; }
input::-ms-clear {display: none;  }

input, textarea, select, img { vertical-align: middle;  }
input[type="text"],input[type="email"],input[type="number"],
input[type="password"] {width:100%; height:47px;  padding:0 5px;  line-height:20px;  border:1px solid #cecece; border-radius:5px;  vertical-align:middle;  box-sizing:border-box; }
input[type="submit"] {padding:0 5px; vertical-align:middle;  cursor:pointer;  border:none;  box-sizing:border-box; }
input[type="file"] {cursor:pointer;  vertical-align:middle;  box-sizing:border-box; }
input[type="submit"], button {
    -webkit-appearance: none;  /*Safari/Chrome*/
    -moz-appearance: none;  /*Firefox*/
    -ms-appearance: none;  /*IE*/
    -o-appearance: none;  /*Opera*/
    -webkit-border-radius: 0;
}
input[type="number"] {text-align: right; }

textarea {border:1px solid #ccc;  padding:5px;  box-sizing:border-box; }
select {border:1px solid #ccc; height:47px;  padding: 0 35px 0 10px;  cursor:pointer;  vertical-align:middle;  width:100%; border:1px solid #cecece; border-radius:5px;}
select {background:url(../images/common/select_arr.png) no-repeat 90% center #fff; -webkit-appearance: none; }

input[readonly="readonly"]{background:#ddd; }

/*라디오, 체크박스*/
input[type="checkbox"]{ display:none }
input[type="checkbox"] + em{ display:inline-block; width:20px; height:20px; border: 1px solid #ddd; border-radius: 3px; vertical-align:middle; }
input[type="checkbox"]:checked + em{ background:url(../images/common/icon_check.png) no-repeat center; }

input[type="radio"]{ display:none }
input[type="radio"] + em{display:inline-block;width: 15px;height: 15px;margin-right:5px;background: #fff;vertical-align:middle;border-radius: 50px;border: 1px solid #ddd;}
input[type="radio"]:checked + em{background: #0056b8;}
.null_box{text-align:center;padding: 10px;border: 1px solid #ddd;margin-top: 10px;}
.add_box{}
input[id ^="datepicker"] {background: url(../images/common/icon_control.png) no-repeat 90% center;}

/*파일등록 디자인화*/
.filebox input[type="file"] { position: absolute; width: 0; height: 0; opacity:0}
.filebox label {display: inline-block; color: #fff; vertical-align: middle; background-color: #999; cursor: pointer; border: 1px solid #ebebeb; float: right; width: 100px; height: 33px;line-height: 33px; text-align: center;}
.filebox .upload-name {display: inline-block; font-size:18px; vertical-align: middle; border: 1px solid #cecece; width: calc(100% - 110px);}


/* Flex */
.flexform{-webkit-appearance:none; /* 폼 콘트롤 요소 플렉스 아이템화 */}
/* container */
.fWrap{flex-wrap:nowrap;-webkit-box-lines:single;-ms-flex-wrap:nowrap;}/* 줄바꿈 금지 */
.fFloat{flex-flow :row wrap;}
.fCont{display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;}
.fColumn{flex-direction:column;}
.fColumnR{flex-direction:column-reverse;}
.fRow{flex-direction:row;}
.fRowR{flex-direction:row-reverse;}
.fCenter{justify-content: center;-webkit-box-align: center;-ms-flex-align: center;}
.fBetween{justify-content:space-between;-webkit-box-align:space-between;-ms-flex-align:space-between;}
.fAround{justify-content:space-around;-webkit-box-align:space-around;-ms-flex-align:space-around;}
.fLeft{justify-content:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;}
.fRight{justify-content:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;}
.fFull{align-items:stretch;}
.fTop{align-items:flex-start;}
.fBottom{align-items:flex-end;}
.fMiddle{align-items:center;}
.fTnB{align-items:space-between;}
.fVertical{align-items:space-around;}
/* item */
.fBox{flex:1 1 auto;}
.fBoxDefault{flex:0 1 auto;}
.fBoxVertical{align-self:center;}
.fBoxBottom{align-self:flex-end;}
.fBoxTop{align-self:stretch;}
.fBoxHFull{align-self:stretch;}


/*그리드*/
.area:after {display:block; content:''; clear:both}
.area.div1 li, .area.div2 li, .area.div3 li, .area.div4 li, .area.div5 li, .area.div6 li, .area.div7 li, .area.div8 li, .area.div9 li, .area.div10 li, .area.div11 li, .area.div12 li {display:inline; float:left;}
.area.div1 li {width:100%;}
.area.div2 li {width:50%;}
.area.div3 li {width:33.333333%;}
.area.div4 li {width:25%;}
.area.div5 li {width:20%;}
.area.div6 li {width:16.666666%;}
.area.div7 li {width:14.285714%;}
.area.div8 li {width:12.5%;}
.area.div9 li {width:11.111111%;}
.area.div10 li {width:10%;}
.area.div11 li {width:9.090909%;}
.area.div12 li {width:8.333333%;}


@media (max-width: 1440px) { }
@media (max-width: 1200px) { }
@media (max-width: 1024px) { }
@media (max-width: 768px) { }
@media (max-width: 576px) { }
@media (max-width: 440px) {	}
