@charset "utf-8";
/* ---------- 공통 스타일 ---------- */


/* common */
.blind,legend{display:block; position:absolute; top:-100000em; left:0; overflow:hidden}
:root legend{margin-top:-1px; font-size:0; line-height:0}
.ellipsis{display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis}
.hidden{display:none}


/* scrollbar */
::-webkit-scrollbar{width:8px; height:8px;}
::-webkit-scrollbar-corner{background:transparent; border-right:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6;}
::-webkit-scrollbar-track
{
	background-color:#f2f2f2; background-image:-moz-linear-gradient(left, #f2f2f2 0%, #fff 100%);
 	background-image: linear-gradient(left, #f2f2f2 0%, #fff 100%);
	background-image: -webkit-linear-gradient(left, #f2f2f2 0%, #fff 100%);
	background-image: -o-linear-gradient(left, #f2f2f2 0%, #fff 100%);
	background-image: -ms-linear-gradient(left, #f2f2f2 0%, #fff 100%);
	border: 1px solid #e6e6e6;
}
::-webkit-scrollbar-thumb{background:#c8c8c8; border:1px solid #b8b8b8; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
::-webkit-scrollbar-thumb:hover{background:#8a8a8a; border:1px solid #737373;}


/* skip nav */
#skip{position:relative; z-index:9999}
#skip a{position:absolute; top:-40px; left:0; width:100%; height:38px; background-color:#023668; font-size:14px; line-height:38px; color:#fff; text-align:center}
#skip a:hover,#skip a:focus,#skip a:active{top:0; text-decoration:none}


/* align */
.tleft{text-align:left !important}
.tcenter{text-align:center !important}
.tright{text-align:right !important}
.clearfix {display:block; clear:both; height:0}
.clearfix:after{content:""; display: block; clear:both}


/* text color */
.txt_info{color:#0c76d3 !important}
.txt_success{color:#07a953 !important}
.txt_warning{color:#ef8821 !important}
.txt_danger{color:#f6695e !important}


/* default */
.fl{float:left}
.fr{float:right}
.cboth{display:block; content:"";clear:both}
.inblk{display:inline-block}
.vgt{vertical-align:top !important}
.vgm{vertical-align:middle}
.ovh{overflow:hidden}
.cp{cursor:pointer}


/* padding */
.pd00 {padding:0 !important}
.pd05 {padding:5px !important}
.pd10 {padding:10px !important}
.pd20 {padding:20px !important}
.pd30 {padding:30px !important}
.pd40 {padding:40px !important}
.pd50 {padding:50px !important}
.pr00 {padding-right:0 !important}
.pr05 {padding-right:5px !important}
.pr10 {padding-right:10px !important}
.pr15 {padding-right:15px !important}
.pr20 {padding-right:20px !important}
.pr25 {padding-right:25px !important}
.pr35 {padding-right:35px !important}
.pl05 {padding-left:5px !important}
.pl10 {padding-left:10px !important}
.pl15 {padding-left:15px !important}
.pl20 {padding-left:20px !important}
.pl25 {padding-left:25px !important}
.pl30 {padding-left:30px !important}
.pl35 {padding-left:35px !important}


/* width px */
.wid10 {width:10px !important}
.wid20 {width:20px !important}
.wid30 {width:30px !important}
.wid40 {width:40px !important}
.wid50 {width:50px !important}
.wid60 {width:60px !important}
.wid65 {width:65px !important}
.wid70 {width:70px !important}
.wid80 {width:80px !important}
.wid90 {width:90px !important}
.wid100 {width:100px !important}
.wid110 {width:110px !important}
.wid120 {width:120px !important}
.wid130 {width:130px !important}
.wid140 {width:140px !important}
.wid150 {width:150px !important}
.wid160 {width:160px !important}
.wid170 {width:170px !important}
.wid180 {width:180px !important}
.wid190 {width:190px !important}
.wid200 {width:200px !important}
.wid210 {width:210px !important}
.wid220 {width:220px !important}
.wid230 {width:230px !important}
.wid240 {width:240px !important}
.wid250 {width:250px !important}
.wid254 {width:254px !important}
.wid260 {width:260px !important}
.wid270 {width:270px !important}
.wid280 {width:280px !important}
.wid290 {width:290px !important}
.wid300 {width:300px !important}
.wid310 {width:300px !important}
.wid320 {width:320px !important}
.wid330 {width:330px !important}
.wid340 {width:340px !important}
.wid350 {width:350px !important}
.wid360 {width:360px !important}
.wid370 {width:370px !important}
.wid380 {width:380px !important}
.wid390 {width:390px !important}
.wid400 {width:400px !important}
.wid500 {width:500px !important}
.wid600 {width:600px !important}
.wid700 {width:700px !important}
.wid800 {width:800px !important}
.wid900 {width:900px !important}
.wid1000 {width:1000px !important}
.wid1100 {width:1100px !important}
.wid1200 {width:1200px !important}


/* width % */
.wid10p {width:10% !important}
.wid20p {width:20% !important}
.wid30p {width:30% !important}
.wid40p {width:40% !important}
.wid50p {width:50% !important}
.wid60p {width:60% !important}
.wid70p {width:70% !important}
.wid80p {width:80% !important}
.wid90p {width:90% !important}
.wid100p {width:100% !important}


/* height px */
.hei40 {height:40px !important}
.hei100 {height:100px !important}
.hei200 {height:200px !important}
.hei300 {height:300px !important}
.hei400 {height:400px !important}
.hei500 {height:500px !important}
.hei600 {height:600px !important}
.hei700 {height:700px !important}
.hei800 {height:800px !important}
.hei900 {height:900px !important}


/* margin */
.mg00 {margin:0px !important}
.mg05 {margin:5px !important}
.mg10 {margin:10px !important}
.mg15 {margin:15px !important}
.mg20 {margin:20px !important}
.mg25 {margin:25px !important}
.mg30 {margin:30px !important}
.mg35 {margin:35px !important}
.mg40 {margin:40px !important}
.mg45 {margin:45px !important}
.mg50 {margin:50px !important}
.mg60 {margin:60px !important}
.mg70 {margin:70px !important}
.mg80 {margin:80px !important}

.mgt00 {margin-top:0px !important}
.mgt05 {margin-top:5px !important}
.mgt10 {margin-top:10px !important}
.mgt15 {margin-top:15px !important}
.mgt20 {margin-top:20px !important}
.mgt25 {margin-top:25px !important}
.mgt30 {margin-top:30px !important}
.mgt35 {margin-top:35px !important}
.mgt40 {margin-top:40px !important}
.mgt45 {margin-top:45px !important}
.mgt50 {margin-top:50px !important}
.mgt60 {margin-top:60px !important}
.mgt70 {margin-top:70px !important}
.mgt80 {margin-top:80px !important}

.mgr00 {margin-right:0px !important}
.mgr02 {margin-right:2px !important}
.mgr05 {margin-right:5px !important}
.mgr10 {margin-right:10px !important}
.mgr15 {margin-right:15px !important}
.mgr20 {margin-right:20px !important}
.mgr25 {margin-right:25px !important}
.mgr30 {margin-right:30px !important}
.mgr35 {margin-right:35px !important}
.mgr40 {margin-right:40px !important}
.mgr50 {margin-right:50px !important}
.mgr60 {margin-right:60px !important}
.mgr70 {margin-right:70px !important}
.mgr80 {margin-right:80px !important}

.mgb00 {margin-bottom:0px !important}
.mgb05 {margin-bottom:5px !important}
.mgb10 {margin-bottom:10px !important}
.mgb15 {margin-bottom:15px !important}
.mgb20 {margin-bottom:20px !important}
.mgb25 {margin-bottom:25px !important}
.mgb30 {margin-bottom:30px !important}
.mgb35 {margin-bottom:35px !important}
.mgb40 {margin-bottom:40px !important}
.mgb45 {margin-bottom:45px !important}
.mgb50 {margin-bottom:50px !important}
.mgb55 {margin-bottom:55px !important}
.mgb60 {margin-bottom:60px !important}
.mgb70 {margin-bottom:70px !important}
.mgb80 {margin-bottom:80px !important}

.mgl00 {margin-left:0px !important}
.mgl05 {margin-left:5px !important}
.mgl10 {margin-left:10px !important}
.mgl15 {margin-left:15px !important}
.mgl20 {margin-left:20px !important}
.mgl25 {margin-left:25px !important}
.mgl30 {margin-left:30px !important}
.mgl35 {margin-left:35px !important}
.mgl40 {margin-left:40px !important}
.mgl50 {margin-left:50px !important}
.mgl60 {margin-left:60px !important}
.mgl70 {margin-left:70px !important}
.mgl80 {margin-left:80px !important}


/* padding */
.pd00 {padding:0 !important}
.pd05 {padding:5px !important}
.pd10 {padding:10px !important}
.pd20 {padding:20px !important}
.pd30 {padding:30px !important}
.pd40 {padding:40px !important}
.pd50 {padding:50px !important}

.pt00 {padding-top:0 !important}
.pt05 {padding-top:5px !important}
.pt10 {padding-top:10px !important}
.pt15 {padding-top:15px !important}
.pt20 {padding-top:20px !important}
.pt25 {padding-top:25px !important}
.pt30 {padding-top:30px !important}
.pt35 {padding-top:35px !important}
.pt40 {padding-top:40px !important}
.pt45 {padding-top:45px !important}
.pt50 {padding-top:50px !important}

.pr00 {padding-right:0 !important}
.pr05 {padding-right:5px !important}
.pr10 {padding-right:10px !important}
.pr15 {padding-right:15px !important}
.pr20 {padding-right:20px !important}
.pr25 {padding-right:25px !important}
.pr35 {padding-right:35px !important}
.pr40 {padding-right:40px !important}
.pr45 {padding-right:45px !important}
.pr50 {padding-right:50px !important}

.pb00 {padding-bottom:0 !important}
.pb05 {padding-bottom:5px !important}
.pb10 {padding-bottom:10px !important}
.pb15 {padding-bottom:15px !important}
.pb20 {padding-bottom:20px !important}
.pb25 {padding-bottom:25px !important}
.pb35 {padding-bottom:35px !important}
.pb40 {padding-bottom:40px !important}
.pb45 {padding-bottom:45px !important}
.pb50 {padding-bottom:50px !important}

.pl00 {padding-left:0 !important}
.pl05 {padding-left:5px !important}
.pl10 {padding-left:10px !important}
.pl15 {padding-left:15px !important}
.pl20 {padding-left:20px !important}
.pl25 {padding-left:25px !important}
.pl30 {padding-left:30px !important}
.pl35 {padding-left:35px !important}
.pl40 {padding-left:40px !important}
.pl45 {padding-left:45px !important}
.pl50 {padding-left:50px !important}


/* hiddentext */
.hiddentext div {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext dl {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext dt {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext dd {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext p {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext ul {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}
.hiddentext li {font-size:0; line-height:0; padding:0; margin:0; height:0; width:0}


/* ---------- inputxt ---------- */
/* inputxt_normal */
.inputxt_normal{display:inline-block; position:relative; height:38px; border:1px solid #d6d6d6; vertical-align:middle; border-radius:2px; box-sizing:border-box}
.inputxt_normal.spider{display:block; margin-right:0}
.inputxt_normal input{position:relative; height:36px; line-height:36px; margin:0; border:0; padding:0 8px; margin:0; text-align:left; font-size:14px; color:#101010; box-sizing:border-box; background:#fff}
.inputxt_normal.spider input{width:100%}
.inputxt_normal input[disabled]{background:#eeeeee; color:#b4b4b4}
.inputxt_normal input[readonly]{background:#f5f5f5}
.inputxt_normal input[readonly] ~ .ui-datepicker-trigger{}

.inputxt_normal.search input{padding-right:30px}
.inputxt_normal.search .btn_search{display:block; font-size:16px; position:absolute; right:0; top:0; width:30px; height:36px; margin:0; padding:0; line-height:38px; text-align:center; color:#808080; border:0; font-size:18px; border-left:1px solid #eaeaea; background:#fff; border-radius:0; cursor:pointer}
.inputxt_normal.delete input{padding-right:30px}
.inputxt_normal.delete .btn_delete{display:block; font-size:16px; position:absolute; right:0; top:0; width:30px; height:36px; margin:0; padding:0; line-height:38px; text-align:center; color:#808080; border:0; font-size:18px; border-left:1px solid #eaeaea; background:#fff; border-radius:0; cursor:pointer}

.inputxt_normal.dateinput .ui-datepicker-trigger{display:block; font-size:16px; position:absolute; right:0; top:0; width:30px; height:36px; margin:0; padding:0; line-height:35px; text-align:center; color:#808080; border:0; background:#fff url('../images/common/ico_datepicker_blue.png') 50% 50% no-repeat; background-size:17px 15px; border-left:1px solid #d6d6d6; border-radius:0; cursor:pointer}


/* ---------- select ---------- */
/* select_normal */
.select_normal{display:inline-block; *display:inline; position:relative; height:38px; border:1px solid #d6d6d6; vertical-align:middle; border-radius:2px; overflow:hidden; *zoom:1; box-sizing:border-box}
.select_normal.spider{display:block}
.select_normal select{width:100%; height:36px; line-height:36px; color:#303030; padding:0; padding-left:10px; background:none; font-size:14px; -webkit-appearance:none; -moz-appearance:none; appearance:none; border:0; margin:0; cursor:pointer; border-radius:0; background:#fff url("../images/common/select_normal.png") right 50% no-repeat; background-size:30px 36px}
.select_normal select[disabled]{background:#eeeeee url("../images/common/select_normal.png") right 50% no-repeat; background-size:30px 36px; color:#b4b4b4}
.select_normal select[readonly]{background:#f5f5f5 url("../images/common/select_normal.png") right 50% no-repeat; background-size:30px 36px;}
.select_normal option{line-height:24px; font-size:13px}
.select_normal select::-ms-expand{display:none}


/* datepicker customer */
.ui-datepicker{z-index:99999 !important}
.ui-datepicker-year, .ui-datepicker-month{height:22px; line-height:22px; color:#fff; padding:0; padding-left:10px; font-size:13px; -webkit-appearance:none; -moz-appearance:none; border:0; margin:0; cursor:pointer; border-radius:0;  background:#515b75 url('../images/common/select_date.png') right 50% no-repeat; background-size:31px 34px}
.ui-datepicker-year option, .ui-datepicker-month option {line-height:30px; font-size:13px; color:#303030; background:#fff; font-weight:normal}
.ui-datepicker-year::-ms-expand, .ui-datepicker-month::-ms-expand{display:none}


/* ---------- textarea ---------- */
/* textarea_normal */
.textarea_normal{display:inline-block; position:relative; background:#fff; border:1px solid #d6d6d6; border-radius:2px}
.textarea_normal.spider{display:block}
.textarea_normal textarea{display:block; width:100%; border:0; padding:15px; color:#303030; font-size:14px; outline:none; border-radius:2px; box-sizing:border-box; resize:vertical}
.textarea_normal textarea[disabled]{background:#eeeeee}
.textarea_normal textarea[readonly]{background:#f5f5f5}


/* ---------- paging ---------- */
/* paging_ty1 */
.paging_ty1{position:relative; margin-top:35px; text-align:center; font-size:0; letter-spacing:0; word-spacing:0}
.paging_ty1 .ctrl{display:inline-block; position:relative; width:42px; height:42px; margin-left:-1px; background-color:#fff; background-position:50% 50%; background-repeat:no-repeat; vertical-align:middle; border:1px solid #ebebeb; box-sizing:border-box; transition:all .30s ease}
.paging_ty1 .ctrl:hover{border:1px solid #c2c2c2; z-index:1}
.paging_ty1 .ctrl.fir{background-image:url("../images/common/paging_first.png"); background-size:12px 12px;}
.paging_ty1 .ctrl.bac{background-image:url("../images/common/paging_back.png"); background-size:7px 12px;}
.paging_ty1 .ctrl.nex{background-image:url("../images/common/paging_next.png"); background-size:7px 12px;}
.paging_ty1 .ctrl.las{background-image:url("../images/common/paging_last.png"); background-size:12px 12px;}
.paging_ty1 .num{display:inline-block; position:relative; min-width:42px; height:42px; margin-left:-1px; padding:0 5px; text-align:center; background-color:#fff; vertical-align:middle; border:1px solid #ebebeb; box-sizing:border-box; transition:all .30s ease}
.paging_ty1 .num:hover{border:1px solid #c1c1c1; z-index:1}
.paging_ty1 .num p,
.paging_ty1 .num strong{display:inline-block; position:relative; padding:10px 0 0; line-height:130%; color:#808080; font-size:15px; font-weight:normal; letter-spacing:-0.2px}
.paging_ty1 .num.active{background:#fff; border:1px solid #018de7; z-index:2}
.paging_ty1 .num.active strong{color:#018de7; font-weight:300}
.paging_ty1 .num.active strong:after{content:""; position:absolute; left:50%; bottom:-1px; width:100%; height:1px; margin-left:-50%; background:#018de7}


/* ---------- checkbox ---------- */
/* btn_check */
.btn_check {position:relative; display:inline-block; min-width:22px; min-height:22px; vertical-align:middle}
.btn_check input[type="checkbox"]{position:absolute; top:0; left:0; margin:0}
.btn_check .hero{display:block; position:absolute; top:0; left:0; width:22px; height:22px; background-image:url('../images/common/check_normal.png'); background-size:240px 24px; background-position:0 0; cursor:pointer}
.btn_check input[type='checkbox']:checked + .hero {background-position:-48px 0}
.btn_check input[type='checkbox']:checked:hover + .hero {background-position:-48px 0}
.btn_check strong{padding-left:25px; display:block; line-height:21px; font-size:14px; color:#505050; letter-spacing:-0.2px; font-weight:normal; cursor:pointer}

.btn_check input[disabled] + .hero{background-position:-72px 0}
.btn_check input[disabled]:checked + .hero{background-position:-96px 0}
.btn_check input[disabled]:checked:hover + .hero{background-position:-96px 0}

.btn_check input[readonly] + .hero{background-position:-72px 0}
.btn_check input[readonly]:checked + .hero{background-position:-96px 0}
.btn_check input[readonly]:checked:hover + .hero{background-position:-96px 0}

.check_origin{display:inline-block; position:relative; vertical-align:middle}
.check_origin input[type="checkbox"]{width:13px; height:13px; margin:0; margin-top:-1px; padding:0; vertical-align:middle}
.check_origin strong{display:inline-block; margin-left:2px; line-height:15px; font-size:14px; color:#505050; letter-spacing:-0.2px; font-weight:normal; cursor:pointer}


/* ---------- radio ---------- */
/* btn_radio */
.btn_radio {position:relative; display:inline-block; min-width:22px; min-height:22px; vertical-align:middle}
.btn_radio input[type="radio"]{position:absolute; top:0; left:0; margin:0}
.btn_radio .hero{display:block; position:absolute; top:0; left:0; width:22px; height:22px; background-color:#fff; background-image:url('../images/common/check_normal.png'); background-size:240px 24px; background-position:-120px 0; cursor:pointer}
.btn_radio input[type='radio']:checked + .hero {background-position:-168px 0}
.btn_radio input[type='radio']:checked:hover + .hero {background-position:-168px 0}
.btn_radio strong{padding-left:25px; display:block; line-height:21px; font-size:14px; color:#505050; letter-spacing:-0.2px; font-weight:normal; cursor:pointer}

.btn_radio input[disabled] + .hero{background-position:-192px 0}
.btn_radio input[disabled]:checked + .hero{background-position:-216px 0}
.btn_radio input[disabled]:checked:hover + .hero{background-position:-216px 0}

.btn_radio input[readonly] + .hero{background-position:-192px 0}
.btn_radio input[readonly]:checked + .hero{background-position:-216px 0}
.btn_radio input[readonly]:checked:hover + .hero{background-position:-216px 0}

/* radio_origin */
.radio_origin{display:inline-block; position:relative; vertical-align:middle}
.radio_origin input[type="radio"]{width:13px; height:13px; margin:0; margin-top:-1px; padding:0}
.radio_origin strong{display:inline-block; margin-left:2px; line-height:15px; font-size:14px; color:#505050; letter-spacing:-0.2px; font-weight:normal; cursor:pointer;}

/* radio_select */
.radio_select{display:inline-block; position:relative; vertical-align:middle}
.radio_select input[type="radio"]{position:absolute; top:0; left:0; margin:0; z-index:1}
.radio_select .hero{display:block; position:relative; line-height:150%; font-weight:normal; color:#606060; border:1px solid #d6d6d6; text-align:center; letter-spacing:-0.8px; border-radius:2px; background:#fff; cursor:pointer; transition:all .30s ease; z-index:2}
.radio_select .hero span{display:block; padding:9px 15px 8px; font-size:14px}
.radio_select.small .hero span{padding:5px 12px 6px}

.radio_select input[type='radio']:checked + .hero{background:#018de7; border:1px solid #018de7; color:#fff !important}
.radio_select.info .hero{border:1px solid #018de7 !important; color:#018de7 !important}
.radio_select.info input[type='radio']:checked + .hero{background:#018de7; color:#fff !important}
.radio_select.primary .hero{border:1px solid #193975 !important; color:#193975 !important}
.radio_select.primary input[type='radio']:checked + .hero{background:#193975; color:#fff !important}
.radio_select.sereni .hero{border:1px solid #848894 !important; color:#848894 !important}
.radio_select.sereni input[type='radio']:checked + .hero{background:#848894; color:#fff !important}



/* ---------- file_import ---------- */
/* file_import */
.file_import_set{position:relative}
.file_import_set li{margin-bottom:3px}
.file_import_set li:last-child{margin-bottom:0}
.file_import_set .file_import{display:inline-block; vertical-align:middle}
.file_import_set .info_util{position:relative}
.file_import{display:inline-block; position:relative; padding-left:71px; box-sizing:border-box}
.file_import.spider{width:100%}
.file_import label
{
	display:block; position:absolute; left:0; top:0; line-height:150%; margin:0; padding:5px 12px 6px;
    color:#fff; text-align:center; font-size:13px;
    letter-spacing:-0.5px; border-radius:2px 0 0 2px; cursor:pointer; font-weight:normal; letter-spacing:0;
	background:#515b75; border:1px solid #515b75
}
.file_import label input{position:absolute; width:0; height:0; overflow:hidden}
.file_import div{position:relative; height:30px; border:1px solid #d6d6d6; vertical-align:middle; border-radius:2px 0 0 2px}
.file_import input{width:100%; height:30px; margin:0; padding:0; line-height:30px; border:0; text-align:left; font-size:13px; text-indent:10px; color:#303030; background:#fff; border-radius:2px 0 0 2px; box-sizing:border-box}
.file_import input[disabled]{background:hsl(0, 0%, 93%)}
.file_import input[readonly]{background:#f9f9f9}
