html, body, div, span, h1, h2, h3, h4, h5, h6, address, img, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, article, aside, header, footer, nav, section, p { font-family: 'Lato', 'SUITE', sans-serif; letter-spacing: -0.02em;}
.wrap {width:85%;}
.wrap_sub {width:75%; margin: 0 auto; position: relative;}
.inner{width:85%; margin: 0 auto; position: relative;}
html,body {width: 100%; height: 100%;}
#fs_wrap {width: 100%; height: 100%;}
.fs_container_wrap {width: 90%; height: 100%;}
input{line-height: 1; margin: 0; font-family: inherit; color: inherit; box-sizing: border-box; appearance: none; vertical-align: middle; outline: none;}
button{font-family: 'Lato', 'SUITE', sans-serif;}
a:link{text-decoration: none;}
a:visited,a:active{color: unset;}
table{border-collapse: collapse; width: 100%; table-layout: fixed;}

.sub-content{display: block; padding-top:212px;}

/* 1920사이즈 이하는 pc 레이아웃으로 고정 */
@media screen and (max-width:1920px){
    body{width: 1920px;}
 }
 

/* location */
.location{width: 100%; height: 35px; background: #f5f5f5; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin-top:115px;}
.location .wrap_sub{height: 100%;}
.location ul{height: 100%; display: flex; align-items: center;}
.location ul li{font-size: 1rem; color: #444; font-weight: 500; height: 100%; line-height: 32px; background: url(../images/location_arrow.png) right top -13px no-repeat;}
.location ul li:first-child{border-left: 1px solid #ddd; border-right: 1px solid #ddd; background: unset;}
.location ul li:first-child a{background: url(../images/home_icon.png) center no-repeat; padding: 0 30px;}
.location ul li a{padding: 0 60px 0 22px; font-size: 0.8rem;}


/* sub left menu */
#left_menu{position: sticky; top: 30px; display: inline-block; width: 300px;}
#left_menu .title{margin-top: 40px; width: 85%; height: 100px; padding: 20px; text-align: center; border-radius: 20px 20px 0 0; background: linear-gradient(266deg, #1468C1 -3.39%, #42A6DB 48.37%, #8DF5FF 104.95%); background-image: url(../images/left_menu_bg.png); background-repeat: no-repeat; display: flex; align-items: center; justify-content: center;}
#left_menu .title span{font-weight: 700; font-size: 1.5rem; color: #fff;}
#left_menu .left_menu_list{border: 1px solid #e4e8e9; border-top: none; border-radius: 0 0 20px 20px; background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,.1); width:85%;}
#left_menu .left_menu_list ul{padding: 10px 20px 20px; display: block;}
#left_menu .left_menu_list ul li{}
#left_menu .left_menu_list ul li a{padding: 12px 30px 8px 0; font-size: 1rem; font-weight: 600; border-bottom: 1px solid #e8f1fb; display: flex; align-items: center; min-height: 50px; position: relative;} 
#left_menu .left_menu_list ul li a::after{position: absolute; content: ''; right: 0; width: 19px; height: 19px; background: url(../images/left_menu_arrow.png) no-repeat; top: 18px; transition: all 0.3s;}
#left_menu .left_menu_list ul li:hover a::after,
#left_menu .left_menu_list ul li.on a::after{background: url(../images/left_menu_arrow_on.png) no-repeat;}
#left_menu .left_menu_list ul li:hover a span,
#left_menu .left_menu_list ul li.on a span{color: #2A4B84;}


/* sub content */
#container{padding: 0px 0px 150px 0px; display: inline-block; width: 985px; vertical-align: top; margin-top:30px;}
#container .page_tit{font-size: 1.8rem; font-weight: 700; margin-bottom: 1rem; border-bottom: 2px dotted #dbdbdb; padding-bottom: 0.3rem;}
#container .page_inner{}

/* search field */
#field{background: #F5FBFF; border-radius: 10px; padding: 1px 10px;  margin-bottom: 1rem; border: 1px solid #e4e7e7;}
#field .form-line{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; border-bottom: 1px solid #c0e1eb70; margin-bottom:-2px;}
#field .form-line .form-group{display: flex; flex-wrap: nowrap; margin: 0.5rem 0 0.5rem 0; flex: 0 0 90%; max-width: 90%; padding: 0 0.5rem 0 3rem;}
#field .form-line .form-group label{display: flex; align-items: center; margin-right: 0rem; width: 5rem; font-size: 0.9rem;font-weight: 600;}
#field .form-line .form-group span{display: flex; align-items: center; margin-right: 0rem; font-size: 0.8rem; padding-bottom:3px; padding-left:5px;}
#field .form-line .form-group label.tit{word-break: keep-all;}
#field .form-line .form-group input{padding: 0.5rem 0.5rem; color: #555; background-color: #fff; border: 1px solid #ddd;}
#field .form-line .form-group .form-input{flex: 1 1 auto; width: 1%; display: block; min-height: 2rem; font-size: 0.9rem; font-weight: 400;}

/* search field */
#field{background: #F5FBFF; border-radius: 10px; padding: 1px 10px;  margin-bottom: 1rem; border: 1px solid #e4e7e7;}
#field .form-line2 {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; border-bottom: 1px solid #c0e1eb70; margin-bottom:-2px;}
#field .form-line2 .form-group2{display: flex; flex-wrap: nowrap; margin: 0.5rem 0 0.5rem 0; flex: 0 0 90%; max-width: 90%; padding: 0 0.5rem 0 3rem;}
#field .form-line2 .form-group2 label{display: flex; align-items: center; margin-right: 0rem; width: 5rem; font-size: 0.9rem;font-weight: 600;}
#field .form-line2 .form-group2 span{display: flex; align-items: center; margin-right: 0rem; font-size: 0.8rem; padding-bottom:3px; padding-left:5px;}
#field .form-line2 .form-group2 label.tit{word-break: keep-all;}
#field .form-line2 .form-group2 input{padding: 0.5rem 0.5rem; color: #555; background-color: #fff; border: 1px solid #ddd;}
#field .form-line2 .form-group2 .form-input{display: block; min-height: 2rem; font-size: 0.9rem; font-weight: 400;}

#field .form-line .form-group.check ul{display: flex;}
#field .form-line .form-group.check ul li{display: flex;}
#field .form-line .form-group.check input.radio{margin-right: 4px;}
#field .form-line .form-group.check label.check{display: inline; width: auto;font-size: 0.7rem; line-height: 34px;}

#field .form-line .form-group .form-data{display: flex; flex: 1 1 auto; width: 1%; flex-wrap: nowrap; align-items: center; margin: 0.5rem 0 0.5rem 0;}
#field .form-line .form-group .form-data > .form-input{flex: 0 0 45%; max-width: 45%;}
#field .form-line .form-group .form-data button.calendar{padding: 0; margin-left: -0.5rem; line-height: 1;background: unset; margin-top: 0;padding-right: 0.5rem;}
#field .form-line .form-group .form-data span{display: block; margin: 0 0.6rem;}

#field .form-line .form-group .form-select{flex: 1 1 auto;}
#field .form-line .form-group .form-control{width: 100%; flex: 1 1 auto; height: 32px; line-height: 32px; padding: 0.5rem 1rem; font-size: 0.7rem; font-weight: 400; color: #888;}

#field .form-line .form-group.btn{display: flex; max-width: 16%;}
#field .form-line .form-group .search_btn{height: 32px; width: 150px; padding: 0.5rem 0.4rem; background-color: #2A4B84; color: #fff; border-radius: 3px; font-weight: 600; font-size: 0.7rem;}
#field .form-line .form-group .reset_btn{padding: 0.4rem 0.6rem; background-color: #fff; border: 1px solid #2A4B84; border-radius: 3px;    margin-left: 0.5rem;}

/* table */
.border_info{margin-bottom: 0.6rem; color: #464646; font-size: 0.8rem;font-weight: 600;}
.border_info .current{color: #3B9DF8;}
.table_list{border-top: 2px solid #0A194E; text-align: center; font-size: 0.8rem;}
.table_list tr th{vertical-align: middle;}
.table_list tr th:first-child, 
.table_list tr td:first-child{border-left: 0;}
.table_list thead th {padding: 0.3rem 0.5rem; background: #F7F7F7;}
.table_list .dhead{border-bottom: 1px solid #d2d2d2;}
.table_list .dbody tr{border-bottom: 1px solid #e8e8e8;}
.table_list .dbody tr td{padding: 0.4rem 0.5rem; font-size: 0.8rem; color: #555;}
.table_list .dbody tr td a{background: #0A194E; border: 1px solid #989898; padding: 0.2rem 0.3rem; border-radius: 5px; color: #fff; font-size: 0.7rem; transition: all 0.2s; width:20px;}
.table_list .dbody tr td a.print_btn{background: #989898;}
.table_list .dbody tr td a:hover{background: #0A194E; border: 1px solid #0A194E; color: #ffff00;}
.table_list .dbody tr td a.dtl{background: #0080c0; width:50px;}
.table_list .dbody tr td a.dtl:hover{background: #0080c0; border: 0px solid #0A194E; color: #ffff00;}

.table_list1{border-top: 2px solid #369; text-align: center; font-size: 0.8rem;}
.table_list1 tr th{vertical-align: middle;}
.table_list1 tr th:first-child, 
.table_list1 tr td:first-child{border-left: 0;}
.table_list1 thead th {padding: 0.3rem 0.5rem; background: #e5eff5;}
.table_list1 .dhead{border-bottom: 1px solid #d2d2d2;}
.table_list1 .dbody tr{border-bottom: 1px solid #e8e8e8;}
.table_list1 .dbody tr td{padding: 0.4rem 0.5rem; font-size: 0.8rem; color: #555;}
.table_list1 .dbody tr td a{background: #0A194E; border: 1px solid #989898; padding: 0.2rem 0.3rem; border-radius: 5px; color: #fff; font-size: 0.7rem; transition: all 0.2s; width:20px;}
.table_list1 .dbody tr td a.print_btn{background: #989898;}
.table_list1 .dbody tr td a:hover{background: #0A194E; border: 1px solid #0A194E; color: #ffff00;}
.table_list1 .dbody tr td a.dtl{background: #0080c0; width:50px;}
.table_list1 .dbody tr td a.dtl:hover{background: #0080c0; border: 0px solid #0A194E; color: #ffff00;}


.reg{ height: 32px; width: 150px; padding: 0.3rem 0.4rem; background-color: #808080; color: #fff; border-radius: 3px; font-weight: 600; font-size: 0.7rem; margin-left: 634px;}
.reg:hover{background: #808080; border: 0px solid #0A194E; color: #ffff00;}

.linkDtl{ color: #2173c5; cursor: pointer;}
.linkDtl:hover{color: #ff0080;}

.btn-print{	width:24px; height:24px; border:1px solid #d0d0d0; background-image:url(../images/bg-gra.jpg); background-position:left top; background-repeat:repeat-x; background-size:100% 100%; position:relative; text-indent:-9999px; display:inline-block;	}
.btn-print:before{	width:16px; height:16px; content:""; display:block; position:absolute; left:50%; top:50%; margin:-8px 0 0 -8px; background:url(../images/ico-print.png) no-repeat center center;	}

/* 푸터 */
footer {background: #424242; padding:5px 0; color: #828282; position : fixed; bottom:0; width: 100%}
footer .wrap{display: flex; align-items: center;}
footer ul.info{margin-left: 100px;}
footer ul.info li.item {font-size:0.7rem; font-weight: 400;line-height: 20px;}
footer ul.info li.item span {font-weight: 800;}

/* popup */
#popup {background:#fff;}
#popup .tWrap{position:relative; height:35px; padding:8px 15px 4px 20px; background:#15366f;}
#popup .tWrap h2{font-family:NanumGothic; font-size:18px; color:#fff; line-height:31px;}
#popup .tWrap sm{font-family:NanumGothic; font-size:14px; color:#fff; line-height:31px;}
#popup .tWrap h4{font-family:NanumGothic; font-size:14px; color:#fff; line-height:31px;}
#popup .tWrap .popClose{position:absolute; top:12px; right:15px;}
#popup .cWrap{overflow:hidden; padding:20px;}
#popup .cWrap ol{list-style:decimal; padding:0 15px;}
#popup .cWrap ol > li{margin-bottom:20px; line-height:20px;}
#popup .cWrap ul > li{margin-bottom:10px; line-height:20px;}

table.type03 {border-collapse: collapse; text-align: left; line-height: 1.5; border-top: 1px solid #ccc; border-left: 3px solid #369; margin : 20px 0px;}
table.type03 th {width: 70px;padding-right: 20px;padding-top: 10px;font-weight: bold;vertical-align: top;color: #153d73;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;text-align : right;background: #e5eff5;}
table.type03 td {width: 349px;padding: 10px;vertical-align: top;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;font-size: 0.9rem;padding-left:20px; white-space: pre-wrap;}

table.type04 {border-collapse: collapse; text-align: left; line-height: 1.5; border-top: 1px solid #ccc; border-left: 0px solid #369; margin-bottom : 20px; margin-top : 5px;}
table.type04 th {width: 180px;padding:10px; font-weight: bold;vertical-align: top;color: #153d73;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;text-align : left;background: #e5eff5; font-size:0.92rem;}
table.type04 td {padding: 10px;vertical-align: top;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;font-size: 0.9rem;padding-left:20px;}
table.type04 td small{font-size:0.7rem;}

table.type05 {border-collapse: collapse; text-align: left; line-height: 1.5; border-top: 1px solid #ccc; border-left: 0px solid #369; margin-bottom : 20px; margin-top : 5px;}
table.type05 th {width: 150px;padding:10px; font-weight: bold;vertical-align: top;color: #153d73;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;text-align : left;background: #e5eff5; font-size:0.92rem;}
table.type05 td {padding: 10px;vertical-align: top;border-right: 0px solid #ccc;border-bottom: 1px solid #ccc;font-size: 0.9rem;padding-left:20px;}
table.type05 td small{font-size:0.7rem;}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.buttons {
    margin: 0%;
    text-align: center;
}

.uploadButton {
    margin: 0%;
    text-align: center;
    pointer-events: none;
}

.btn-hover {
    width: 100px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    margin: 0px;
    height: 30px;
    text-align:center;
    border: none;
    background-size: 300% 100%;

    border-radius: 50px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:focus {
    outline: none;
}

.btn-hover.color-1 {
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
   /* box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75); */
}
.btn-hover.color-2 {
    background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19);
   /* box-shadow: 0 4px 15px 0 rgba(229, 66, 10, 0.75); */
}
.btn-hover.color-3 {
    background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7);
   /* box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.75); */
}
.btn-hover.color-4 {
    background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
   /* box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.75); */
}
.btn-hover.color-5 {
    background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673);
  /*  box-shadow: 0 4px 15px 0 rgba(23, 168, 108, 0.75); */
}
.btn-hover.color-6 {
    background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021);
   /* box-shadow: 0 4px 15px 0 rgba(83, 176, 57, 0.75); */
}
.btn-hover.color-7 {
    background-image: linear-gradient(to right, #6253e1, #852D91, #A3A1FF, #F24645);
   /* box-shadow: 0 4px 15px 0 rgba(126, 52, 161, 0.75); */
}
.btn-hover.color-8 {
    background-image: linear-gradient(to right, #29323c, #485563, #2b5876, #4e4376);
   /* box-shadow: 0 4px 15px 0 rgba(45, 54, 65, 0.75); */
}
.btn-hover.color-9 {
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
   /* box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75); */
}
.btn-hover.color-10 {
       background-image: linear-gradient(to right, #ed6ea0, #ec8c69, #f7186a , #FBB03B);
   /* box-shadow: 0 4px 15px 0 rgba(236, 116, 149, 0.75); */
}
.btn-hover.color-11 {
     background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f);  
    /*   box-shadow: 0 5px 15px rgba(242, 97, 103, .4); */
}

.required{	color:#ff0000 !important;margin-left:5px;}

.filebox input[type="file"] { position: absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.filebox label {display: inline-block; padding: .5em .75em; color: #999; font-size: inherit; line-height: normal; vertical-align: middle; background-color: #fdfdfd; cursor: pointer; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius: .25em;}
/* named upload */
.filebox .upload-name {display: inline-block; padding: .5em .75em; font-size: inherit; font-family: inherit; line-height: normal; vertical-align: middle; background-color: #f5f5f5; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius: .25em; -webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; }
/* imaged preview */
.filebox .upload-display { margin-bottom: 5px;}
@media(min-width: 768px) {
    .filebox .upload-display { display: inline-block; margin-right: 5px; margin-bottom: 0; }
}
.filebox .upload-thumb-wrap {display: inline-block; width: 54px; padding: 2px; vertical-align: middle; border: 1px solid #ddd; border-radius: 5px; background-color: #fff;}
.filebox .upload-display img {display: block; max-width: 100%; width: 100% \9; height: auto;}
.filebox.bs3-primary label {color: #fff; background-color: #337ab7; border-color: #2e6da4;}


.span-hover {
    width: 80px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    margin: 0px;
    height: 30px;
    text-align:center;
    border: none;
    background-size: 300% 100%;
    line-height:1.8rem;
    border-radius: 5px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    margin-top:0px;
}

.flexed{display: flex; justify-content: center;}

.span-hover:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    color:#fff;
}

.span-hover:focus {
    outline: none;
    color:#fff;
}

.span-hover.color-1 {
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
   /* box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75); */
}
.span-hover.color-2 {
    background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19);
   /* box-shadow: 0 4px 15px 0 rgba(229, 66, 10, 0.75); */
}
.span-hover.color-3 {
    background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7);
   /* box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.75); */
}
.span-hover.color-4 {
    background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
   /* box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.75); */
}
.span-hover.color-5 {
    background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673);
  /*  box-shadow: 0 4px 15px 0 rgba(23, 168, 108, 0.75); */
}
.span-hover.color-6 {
    background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021);
   /* box-shadow: 0 4px 15px 0 rgba(83, 176, 57, 0.75); */
}
.span-hover.color-7 {
    background-image: linear-gradient(to right, #6253e1, #852D91, #A3A1FF, #F24645);
   /* box-shadow: 0 4px 15px 0 rgba(126, 52, 161, 0.75); */
}
.span-hover.color-8 {
    background-image: linear-gradient(to right, #29323c, #485563, #2b5876, #4e4376);
   /* box-shadow: 0 4px 15px 0 rgba(45, 54, 65, 0.75); */
}
.span-hover.color-9 {
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
   /* box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75); */
}
.span-hover.color-10 {
       background-image: linear-gradient(to right, #ed6ea0, #ec8c69, #f7186a , #FBB03B);
   /* box-shadow: 0 4px 15px 0 rgba(236, 116, 149, 0.75); */
}
.span-hover.color-11 {
     background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f);  
    /*   box-shadow: 0 5px 15px rgba(242, 97, 103, .4); */
}

.pop-layer { display: none; position: absolute; top: 50%; left: 50%; height: auto; background-color: #fff9e5; border: 1px solid #3571b526; z-index: 10; border-radius: 5px; box-shadow: 0px 0px 10px 0px rgb(96 127 159 / 86%);}
.pop-layer .pop-container { padding: 5px 15px; }
.pop-layer p.ctxt { color: #02273d; line-height: 25px; font-size:0.9rem;}
.pop-layer .btn-r { width: 100%; margin: 10px 0 20px; padding-top: 10px; border-top: 1px solid #DDD; text-align: right; }
a.btn-layerClose { display: inline-block; height: 25px; padding: 0 14px 0; border: 1px solid #304a8a; background-color: #3f5a9d; font-size: 13px; color: #fff; line-height: 25px; }
a.btn-layerClose:hover { border: 1px solid #091940; background-color: #1f326a; color: #fff; }