@charset "utf-8";

/* sub layout */
#sub-container{position: relative; display:block; width: 100%; padding-top: 90px; /* padding-bottom:100px; */}
#contents {position: relative; display:flex; width:100%; min-height: 700px; z-index: 1; margin:100px 0 100px;}

@media all and (max-width:1024px) {
    #sub-container{padding-top: 80px;}
    #contents {min-height: 600px; margin: 60px 0 60px;}
}

@media all and (max-width:768px) {
    #sub-container{padding-top: 100px; /* padding-bottom:100px; */}
    #contents {min-height: 500px; margin:40px 0 40px;}
}

/* common */
.txtblk {font-size:1.2rem; vertical-align:super; display:inline-block; padding-left:5px;}
.tooltipped{cursor: pointer}
.material-tooltip {padding: 10px 8px; font-size:1.4rem; z-index: 2000; background-color: transparent; border-radius: 2px; color: #fff; min-height: 36px; line-height: 120%; opacity: 0; position: absolute; text-align: center; max-width: calc(100% - 4px); overflow: hidden; left: 0; top: 0; pointer-events: none; visibility: hidden; background-color: #323232;}

/* Box-style */
.text-box{position: relative; background:#fff; border:1px solid #ccc; padding:20px; clear:both; overflow:hidden;}
.line-box{background: #fff; border: 2px solid #222; box-shadow: 5px 5px 5px rgb(0 0 0 / 10%); border-radius:10px; padding: 30px;}
.gray-box{position: relative; padding:30px; background: #f7f8fb; border:1px solid #ccc; word-break: keep-all; box-shadow: 5px 5px 15px rgba(146,146,154,0.1);}
.gray-box-st1{position: relative; padding:10px 20px; background: #f7f8fb; border:1px solid #ccc; word-break: keep-all;}
.img-box {max-width:100%; text-align:center;}
.overflow-box {min-height: 150px; padding: 20px; border: 1px solid #ccc; border-radius: 10px; overflow-y: auto; background-color:#fff;}
.overflow-box2 {height: auto; padding:50px; background: #f7f8fb; border:1px solid #ccc; border-radius: 10px}
.data-info {overflow: auto; height: 400px;}

/*custom-scroll*/
.data-info.custom-scroll::-webkit-scrollbar-track {background-color: #F7F7F7;}
.data-info.custom-scroll::-webkit-scrollbar-thumb {background-color: #ccc;}

@media all and (max-width:1024px){
    .overflow-box2 {height: auto; padding:30px}
    .data-info {overflow: auto; height: 300px;}
}

@media all and (max-width:768px){
    .modal-content .overflow-box2 .data-info{height: 200px;}
    .text-box-shadow.icon .icon-wrap{display:none;}
}

.radius10 {border-radius:10px;}
.radius20 {border-radius:20px;}

.info-box {position: relative; margin-bottom: 50px;}
.info-box .title-bg {padding: 30px 40px; background: #f7f8fb; border-radius: 10px; border:1px solid #ccc}
.info-box .title-bg.sm {padding: 20px 30px;}
.info-box .title-bg2 {padding: 30px 40px; background: #fff; border-radius: 10px; border:1px solid #dddde1}
.info-box .title-bg2.sm {padding: 20px;}
.info-box .title-cover {display: flex; align-items: flex-start; }
.info-box .sub-h3 {margin-bottom: 20px; font-weight: 600; font-size:2.4rem; text-align: left; display:block; width:100%;}
.info-box .sub-h4 {position: relative; margin-bottom: 10px; font-weight: 600; font-size:2.0rem; text-align: left; display:block; width:100%; padding-left: 23px;}
.info-box .sub-h4:before {content: ''; display: block; position: absolute; top: 14px; left: 7px;  width: 7px; height: 7px; background: #2f3034; border-radius: 60px;}
.info-box .sub-p2 span {display: block;}
.info-box .title-symbol {flex-shrink: 0; margin-right: 30px; border-radius: 30px; background: #fff; width:90px; height:90px; display:flex; align-items: center; justify-content: center;}
.info-box .title-symbol-sm {flex-shrink: 0; margin-right: 30px; border-radius: 10px; background: #fff; width:60px; height:60px; display:flex; align-items: center; justify-content: center;}
.info-box .title-text {font-weight:500}
.info-box .detail-txt{background-color:#fff; border-radius: 10px; padding:20px 30px; margin-top:30px; line-height:1.7}
.info-box .detail-txt p+p{margin-top:20px}
.info-box .detail-img{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top:20px;}
.info-box .detail-img .img-wrap{border-radius: 10px; overflow:hidden; width:200px; height:100%;}
.info-box .detail-img .img-wrap img{width:100%}
.info-box .detail-img .txt-wrap{width: calc(100% - 230px);}
.info-line{padding-bottom: 0; margin-bottom:20px; border-bottom: 1px dashed #dbdbdb;}

@media screen and (max-width: 768px) {
    .gray-box{padding:20px;}
    .info-box {margin-bottom: 50px;}
    .info-box .title-symbol {display:none;}
    .info-box .title-bg {padding:20px 30px; border-radius: 10px;}
    .info-box .title-bg.sm {padding: 20px;}
    .info-box .sub-p1 span {display: inline;}
    .info-box .sub-h3 {margin-bottom: 5px; font-size:2.0rem;}
    .info-box .sub-h4 {font-size:1.6rem;}
    
    .info-box .detail-img{flex-direction: column; margin-top:20px;}
    .info-box .detail-img .img-wrap{width:100%;}
    .info-box .detail-img .txt-wrap{width: 100%; padding-top:10px}
}

.grad-box{position:relative; border-radius:50px 5px 50px; background:#f7f8fb; border:3px solid #2d316c; padding:50px 50px 50px 200px;}
.grad-box:before{content: ''; display:inline-block; position:absolute; z-index:1; left:50px; top:50px; width:107px; height:107px; border-radius:30px 5px; /*border:1px solid #bdcdfc;*/ background: #fff; background-repeat:no-repeat; background-position:center;}
.grad-box.outline:before{background-image:url('../assets/images/ico/step-list04.png')}
.grad-box.info:before{background-image:url('../assets/images/ico/step-list04.png')}
.grad-box .box_title{margin:0 0 15px; font-size:25px; line-height:29px; letter-spacing:-0.05em; font-weight:600; color:#2d316c}
.grad-box .box_text{font-size:17px; line-height:1.6; letter-spacing:-0.05em; font-weight:400}

@media all and (max-width:1024px){
    .grad-box{margin-left:0; border-radius:5px; padding:30px;}
    .grad-box:before{display:none}
    .grad-box .box_title{font-size:20px; line-height:25px}
    .grad-box .box_text{font-size:16px; line-height:22px}
}

/* 타이틀 박스 */
.title_box{position:relative; margin-bottom:36px; padding-top:30px}
.tab_panel + .title_box{margin-top:30px;}
.title_box:before{display:block; position:absolute; top:0; left:30px; z-index:1; width:125px; height:125px; border-radius:15px 15px 30px 15px; box-shadow:7px -13px 25px 0 rgba(99, 99, 99, 0.07); background:#fff url(/site/public/images/template/title_box01.svg) no-repeat center center}
.title_box:not([class*='n']):before{background-size:47px 47px}

/* 참고사항 및 기타 주석 아이콘 */
.explanation{display: block; width:100%;} 
.explanation > p{display:inline-flex; align-content: center; margin:5px 0 0 0; padding:5px 0 0 43px; justify-content: center; align-items: center; background: url('../images/ico/txt-icon.png') no-repeat 15px 50%; font-weight: 500; font-size:1.5rem;}

/* text */
.txt-left{text-align:left !important;}
.txt-right{text-align:right !important;}
.txt-center{text-align:center !important;}
.txt-justify{text-align:justify !important;}
.txt-ellipsis{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.line-clamp2{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.line-clamp3{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.line-clamp4{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 4;-webkit-box-orient: vertical;}

@media screen and (max-width: 768px) { 
	.line-clamp2{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
	.line-clamp3{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
	.line-clamp4{overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;}
}

/* common :: title */
.top-tit{position:relative; width:100%; overflow:hidden; padding-bottom:20px; margin-bottom:20px; border-bottom: 1px dashed #ccc;}
.top-tit p{display:block; font-size:1.8rem;}
.sc-title0{font-size: 3.4rem; display:block; font-weight: 600; color:#027e7b;}
.sc-title1{font-size: 3.0rem; line-height: 40px; font-weight: 600;}
.sc-title2{position:relative; font-size: 2.6rem; padding-left:25px; font-weight: 500; margin-bottom:15px; display:flex; align-items: center;}
.sc-title2:after {content: ""; display: block; position:absolute; top:10px; left:0; width: 20px; height: 20px; border-radius:50px; border-top-left-radius: 0; border: 4px solid transparent; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(45deg, #fff, #fff), linear-gradient(45deg, #2d316c, #ea5449);}
.sc-title3{position:relative; font-size: 1.8rem; padding:0 18px 10px; font-weight: 500; display:block;}
.sc-title3:after {content: ""; display: block; position:absolute; top:7px; left:0; width: 14px; height: 14px; border-radius:50px; border: 3px solid transparent; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(45deg, #fff, #fff), linear-gradient(45deg, #2d316c, #ea5449);}
.sc-title4{display: block; font-size:2.5rem; font-weight:600; line-height: 1.4; margin-bottom: 10px; color:#2d316c}
.sc-title5{position:relative; /*font-family: 'GmarketSansMedium';*/ font-size: 24px; padding-bottom:15px;}
.sc-title5:after {content: ""; display: block; position:absolute; bottom:0; left:0; width: 30px; height: 3px; background: #e60012;}
.total-num{background-color:#ea5449; font-size:1.5rem; border-radius: 30px; height:30px; line-height:28px; display:inline-block; padding:0 13px; margin-left:14px; color:#fff;}

@media all and (max-width:1200px) {
    .top-tit p{display:block; font-size:1.6rem;}
    .sc-title0{font-size: 2.5rem;}
    .sc-title1{font-size: 2.0rem;}
    .sc-title2{position:relative; font-size: 2.0rem;}
    .sc-title2:after {content: ""; display: block; position:absolute; top:8px; left:0; width: 10px; height: 10px; border-radius:50px; border-top-left-radius: 0; border: 4px solid transparent; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(45deg, #fff, #fff), linear-gradient(45deg, #2d316c, #ea5449);}
    .sc-title4{font-size:1.8rem;}
}

@media all and (max-width:1024px) {
    .top-tit p{display:block; font-size:1.6rem;}
    .sc-title0{font-size: 2.0rem;}
    .sc-title1{font-size: 1.8rem;}
    .sc-title2{font-size: 1.8rem;}
}

/* common :: list */
.list-1st { margin: 10px 0; padding: 0}
.list-1st > li {position: relative; margin: 3px 0; padding-left: 20px; line-height:1.6;}
.list-1st > li:before {content: ''; background: #a0a0a0; width: 4px; height: 4px; position: absolute; top: 10px;  left: 0; display: inline-block; border-radius: 5px;}

.list-2st {margin: 15px 0; padding: 0}
.list-2st > li {position: relative; margin: 10px 0; padding-left: 20px; line-height: 1.6}
.list-2st > li:before{content: ''; position: absolute; top: .8rem; left: 0; width: 0; height: 0; border-left: .6rem solid #df2d5a; border-top: .5rem solid transparent; border-bottom: .5rem solid transparent;}

.list-3st {margin: 4px 0; padding: 0; }
.list-3st > li {position: relative; margin: 3px 0; padding-left: 20px;}
.list-3st > li::before {position: absolute; content: ''; top: 11px; left:0; width: 5px; height: 1px; background: #29317A; border-top: 0; border-right: 0; transform: none;}

.num-list > li{position: relative; margin: 15px 0; padding: 0; padding-left: 30px;}
.num-list > li > span {display: inline-block; text-align: center; margin: 0 10px 0 -24px; width: 23px; height: 23px; border-radius: 50%; background: #29317A; color: #fff;}
.num-list > li > strong.tit{font-weight: 500}

.flex-list{position: relative; display:flex; align-items: center;  width:100%; padding-top:10px;}
.flex-list > li{margin-left:15px}
.flex-list > li:first-child{margin-left:0; padding-left:0}
.flex-list > li > span{display:inline-block; color:#000; font-weight: 500; margin-right:8px;}
.flex-list > li > span.badge{padding: 3px 15px; border-radius: 100px; color: #fff; text-align: center; font-size:1.4rem;}

@media all and (max-width:710px){
    .flex-list li{width:50%; margin-left:0}
}
@media all and (max-width:500px){
    .flex-list li{float:none; width:100%}
}

/* common :: 1depth Tab*/
.tab-1depth-group {height:auto; margin-bottom:20px;}
.tab-1depth{display:flex; align-items:center; justify-content: center; }
.tab-1depth li{display:inline-block; margin:10px 15px;}
.tab-1depth li a{width:150px; height:150px; border-radius:120px; display:flex; flex-direction: column; align-items: center; justify-content: center; text-align:center; background-color:#eaeef7; border:1px solid #bfcae3;transition:.2s ease-out;}
.tab-1depth li a.active,
.tab-1depth li a:hover{border:2px solid #bfcae3; box-shadow: 0 0 0 .8rem #f6f8fe;}
.tab-1depth li a span{display:block; margin-top:12px;}
.tab-1depth li i.material-icons-sharp{font-size:35px; margin-top:0; color:#2d316c;}

@media screen and (max-width:768px){
    .tab-1depth{display:flex; flex-wrap: wrap; margin-left:-10px; margin-right:-10px;}
    .tab-1depth li{margin:10px; flex: 1 1 40%;}
    .tab-1depth li a{width:100%; height:90px; border-radius:20px; margin:0 auto;}
}

/* common :: 2depth Tab*/
.tab-2depth-group { margin-bottom:20px; height:auto; background:#fff; border:3px solid #2d316c; border-radius:15px; padding:10px 10px;}
.tab-2depth-group button {display:none}
.tab-2depth {text-align: center; height: auto; display: flex; align-items: center; justify-content:center; flex-wrap: wrap;}
.tab-2depth li {position: relative; display:block; margin:2px 15px; flex: 1;}
.tab-2depth li a { display: block; line-height:1.4; font-weight:500; font-size:1.8rem; transition: 0.4s; letter-spacing: -.5px; }
.tab-2depth li.active a,
.tab-2depth li a.active,
.tab-2depth li:hover a,
.tab-2depth li:active a,
.tab-2depth li:focus a {text-decoration: none; color: #2d316c;}
.tab-2depth li:last-child a:after {content: none;}
.tab-2depth li a span {position: relative; display:block; height: 100%; z-index:2; padding: 10px;}
.tab-2depth li a span:after {content: ""; position: absolute; top:0; bottom:0; left: 0%; width: 100%; height: 100%; background:#eaeef7; border:1px solid #bfcae3; opacity: 0; transition: 0.4s; border-radius:10px;}
.tab-2depth li.active a span:after,
.tab-2depth li a.active span:after,
.tab-2depth li:hover a span:after,
.tab-2depth li.focus a span:after,
.tab-2depth li:active a span:after {opacity: 1; z-index:-1;}

@media screen and (max-width:1024px){
    .tab-2depth li {position: relative; display:block; margin:2px 0; flex: 1;}
    .tab-2depth li a {font-size: 1.6rem;}
}

@media screen and (max-width: 768px) {
    .tab-2depth-group { margin-bottom:10px; border:0 none; border-radius:0; padding:0;}
	.tab-2depth-group button {display: block; padding: 15px 0 15px 13px; width: 100%; text-align: left; border:3px solid #2d316c; border-radius:0; font-weight: 500; font-size:1.5rem;}
	.tab-2depth-group button {display: block; background: url(../images/ico/sub_up_down_.png) no-repeat right 15px}
	.tab-2depth-group button.active {background-position: right -28px;}
	.tab-2depth {display:none; border: 0; position: absolute; width: 100%; z-index: 2; background-color:#fff; border: 1px solid #2d316c; border-bottom:0;}
	.tab-2depth li {width: 100%; margin:0; border-bottom:1px solid #2d316c;}
	.tab-2depth li a {text-align:left; padding: 10px 13px; margin-bottom: -1px; font-size:1.6rem; overflow:hidden;}
    .tab-2depth li:hover a,
    .tab-2depth li.active a {color:#2d316c}
    .tab-2depth li a:after {background: #eaeef7;content: '';position: absolute; height:100%; width:0; left: 0; top: 0; opacity:0; transition: 0.4s;}
    .tab-2depth li.active a:after, 
    .tab-2depth li:hover a:after {height: 100%; left: 0;top: 0; width: 100%; opacity:1;}
    .tab-2depth li:last-child a:after {content: '';}
    .tab-2depth li a span {padding: 0; font-size:1.5rem; }
    .tab-2depth li a span:after {content: ""; display:none;}

}

/* common :: 3depth Tab*/
.tab-3depth {display:flex; flex-flow:row wrap; margin-bottom:40px; width:100%;}
.tab-3depth li {flex: 1; border:1px solid #ccc; margin-left:-1px;; margin-top:-1px;}
.tab-3depth li a {display:block; position:relative; padding:15px 20px; font-size:1.8rem; letter-spacing: -0.05em;}
.tab-3depth li a span {display:flex; align-items:center; height:100%; padding-right:20px; word-break:break-all; line-height:1.5;}
.tab-3depth li.active a,
.tab-3depth li:hover a {font-weight:500; box-shadow:0 0 10px rgba(0,0,0,0.1); background:#fff;}
.tab-3depth li a:before {content: ''; position:absolute; right:15px; top:50%; width:17px; height:3px; background: url('../assets/images/ico/arrow-before.png') no-repeat 0 0; transform: translateY(-50%);  transition:0.3s}
.tab-3depth li.active a:before,
.tab-3depth li a.active:before,
.tab-3depth li:hover a:before {content: ''; position:absolute; right:15px; top:50%; width:18px; height:10px; background: url('../assets/images/ico/arrow2.png') no-repeat 0 0; transform: translateY(-50%);}
.tab-3depth li.active a:after,
.tab-3depth li a.active:after,
.tab-3depth li:hover a:after {content: ''; position:absolute; top:0; left:0; width:calc(100% - 4px); height:calc(100% - 4px); background:transparent; border:2px solid #323232;}

/* .tab-3depth-group-add li a:before {transform: rotate(90deg);}
.tab-3depth-group-add li.active a:before, .tab-3depth-group-add li a.active:before, .tab-3depth-group-add li:hover a:before{transform: rotate(-90deg); top: 42%} */
.tab-3depth li a:before {transform: rotate(90deg);}
.tab-3depth li.active a:before, .tab-3depth li a.active:before, .tab-3depth li:hover a:before{transform: rotate(-90deg); top: 42%}
/*blank*/
.tab-3depth li a[target="_blank"] {margin-bottom:-4px;}
.tab-3depth li a[target="_blank"]:before {display:none;}
.tab-3depth li a[target="_blank"] span {display:inline-block; position:relative; padding-right:20px;}
.tab-3depth li a[target="_blank"] span:before {content:''; position:absolute; top:7px; right:0; width:14px; height:14px; background:url('../images/ico/blank.png') no-repeat 0 0/400% auto;}
.tab-3depth li a[target="_blank"] span:before {background-position:33.333% 100%;}

@media all and (max-width:768px){
    .tab-3depth > li{flex: 1 1 50%;}
    .tab-3depth li a {display:block; position:relative; padding:15px 20px; font-size:1.5rem;}
}
@media all and (max-width:640px){
    .tab-3depth li a {padding:10px 20px;}
}

/* common :: 4depth Tab*/
.tab-4depth-group{position:relative; margin-top:30px; margin-bottom:20px;}
.tab-4depth {position: relative; z-index: 1; display:flex; flex-wrap: wrap}
.tab-4depth > li {display:block; margin: 10px 8px 0 0}
.tab-4depth > li:last-child {margin-right: 0} 
.tab-4depth > li a {display: block; height: 50px; padding: 0 30px; border-radius: 30px; background: #f7f8fb; line-height: 50px; letter-spacing: -.5px; border:1px solid #ccc; transition:.4s ease-out;}
.tab-4depth > li a:hover{box-shadow:0 2px 10px rgba(0,0,0,0.2); transition:.4s ease-out;}
.tab-4depth > li.active a {background:#2d316c; color: #fff; font-weight:500; border:1px solid #2d316c}

@media all and (max-width:768px){
    .tab-4depth > li a {font-size:1.5rem;}
}
@media all and (max-width:640px){
    .tab-4depth {display:flex; justify-content: center;}
    .tab-4depth > li {display:block; margin: 5px 0 0 0; flex: 1 1 40%;}
    .tab-4depth > li a {height: 40px; padding: 0 20px; line-height: 40px; border-radius:0; text-align:center;}
}

/* 검색 :: style2 */
.search-box { border: 2px solid #2d316c; border-radius: 10px; position: relative; padding: 20px 30px 10px 30px;} 
.search-box .top-search .input_w100 { width: calc(100% - 350px); } 
.search-box .col.xl7 { margin-left: 0; } 
.search-box .input-line { margin-bottom: 12px; } 
.search-box .field-inline { display:flex; } 
.search-box .input-field { padding-right: 10px; flex-shrink: 0; } 
.search-box .input-field.nopadding { padding-right: 0; } 
.search-box .input-field > h5,
.search-box .input-field > label { font-size: 100%; padding-right: 10px; word-break: normal; display: flex; align-items: center; font-weight: 500} 
.search-box .input-field > h5.pdnone,
.search-box .input-field > label.pdnone { padding-right: 0; } 
.search-box .category-item { display: flex; align-items: center; flex-wrap: wrap}
.search-box .search-set{display: flex; align-items: center; flex-wrap: wrap; border: 1px solid #adb5bd; border-radius: 5px; height: 40px; background-color:#fff; margin-right:5px}
.search-box .search-set select,
.search-box .search-set input{border:0; background-color:transparent; height:38px; box-sizing: border-box; margin:0;}

select + select,
input + select,
select + input,
input + input,
select + input[type="checkbox"] { margin-left: .5rem; margin-right: .5rem; } 

.search-box [type="checkbox"] + span { margin-right: 5px; }


/* 검색 :: style3 */

/* 검색 */
.search-box.type3{position:relative; margin:0 0 30px 0; padding: 20px 36px; border: none; background: #f1f5fb; border: 1px solid #cfdcee; text-align:center; border-radius: 10px;}
.search-box.type3 .search-com{display: flex; justify-content: center; flex-wrap:wrap; align-items: center}
.search-box.type3 .search-com>*{vertical-align:middle; margin:3px 2px;}
.search-box.type3 .search-com > .btn-item {display: flex; justify-content: center; align-items: center;}
.search-box.type3 .search-com > .btn-item>*{vertical-align:middle; margin:3px 2px;}
.search-box.type3 .search-com > .btn-item .btn{display: flex; justify-content: center; align-items: center;}
.search-box.type3 .input-wrap input[type="text"]{width:300px;}
.search-box.type3 .input-wrap input[type="text"].browser-default{min-width:100%}
.search-box.type3 .hidden-search{display:flex; flex-wrap:wrap; gap:20px 20px; align-items:center; margin:20px 0 0 0; padding:20px 0 0 0; border-top:1px solid #dbdbdb;}




@media only screen and (max-width: 1024px){
    .search-box .valign-wrapper { width: 100%; flex-direction: column; } 
    .search-box .tabs { flex-wrap: wrap; } 
    .search-box .tabs .tab a { border-radius: 5px; padding: 0 5px 0 5px; } 
    .search-box .input-field { padding-right: 0; } 
    .search-box .category-item { display: flex; flex-direction: column; align-items: flex-start; flex-wrap: wrap; width: 100%; } 
    .search-box .input-field .submit-btn { width: 100%; min-width: 100%; display: block; } 

    .search-box .input-field > h5,
    .search-box .input-field > label { min-width: 100%; padding-right: 0; padding-left: 0; margin-bottom: 5px; display: block; } 
    .search-box .input-field.input-inline > h5,
    .search-box .input-field.input-inline > label { min-width: auto; padding-right: 0; padding-left: 0; margin-bottom: 0; display: inline-block; } 
    .search-box .input-field > h5::after,
    .search-box .input-field > label.field-label::after { display: none; width: 0; height: 0; } 
    .search-box select,
    .search-box input { width: 100%; min-width: 100%; } 
    .search-box .input-field .input_w50 { width: 100%; min-width: 100%; } 

    select + select,
    input + select,
    select + input,
    input + input { margin-left: 0; } 

    select,
    input[type=text] { margin-bottom: 5px; } 
    .m-none { display: none !important; } 
    .search-box button.btn,
    .search-box a.btn{ display: flex; justify-content: center; align-items: center; width: 100%; margin-bottom: 5px; } 
    .search-box button i { display: none; } 
    .search-box button.mr_5,
    .search-box button.ml_5 { margin-left: 0; margin-right: 0; } 
    .search-box .right-btn-area { display: block; width: 100%; justify-content: center; } 
    
    .search-box .search-set{display: flex; align-items: center; flex-wrap: wrap; border: 0 solid #adb5bd; border-radius: 0; height: auto; background-color:#fff; margin-right:0}
    .search-box .search-set select,
    .search-box .search-set input{border:1px solid #adb5bd; background-color:transparent; height:40px; box-sizing: border-box; margin:0 0 5px 0;}
}

/* 검색결과 */
.result-box .result-top { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom:8px;} 
.dataTables-length { display: flex; align-items: center;} 
.dataTables-length select {height: 40px; margin-left: 5px; margin-right: 5px;} 

@media only screen and (max-width: 1024px){
    .dataTables-length { display: none} 
}

/* 검색결과 */
.result-count { display: inline-block; font-size: 1.5rem; background-color: #ea5449; color:#fff; padding: 4px 15px; border-radius: 30px; font-weight: 500}
.result-info { position: relative; margin-bottom: 3.0rem; } 
.result-info-box { display: flex; align-items: center; padding: 15px 30px; margin-bottom: 15px; border-radius: 15px; background-color: #e0eaf6; } 
.result-info-box > strong { font-weight: 600; font-size: 1.8rem; padding-left: 40px; background: url(../images/ico/result-ico01.png) no-repeat 0 center; } 
.result-info-box > p { background-color: #fff; border-radius: 5px; display: block; font-size: 1.5rem; font-weight: 500; margin-left: 10px; padding: 8px 15px; color: #2d316c}

@media only screen and (max-width: 1200px){
    .result-info-box { padding: 20px; flex-direction: column; align-items: flex-start; } 
    .result-info-box > strong { font-size: 1.6rem; } 
    .result-info-box > p { margin-left: 0; margin-top: 10px; width: 100%; } 
    .result-info .list-style1.ml_30 { margin-left: 0; } 
}

/* 상세검색 */
.detail-search{padding-top:20px; margin-top:30px; border-top: 1px dashed #9295a6; /* display:none */}
.detail-search > .row{padding: 3px 0;}
.detail-search .input-field > h5{width:100px; padding-right:10px; padding-left:10px; word-break:normal; display:block;}
.detail-search .input-field > .field-item{display: flex; align-items: center}
.detail-search .input-field + .input-field{margin-left:50px}

 @media only screen and (max-width: 1200px){
     .detail-search > .row{padding:0;}
     .detail-search .input-field + .input-field{margin-left:0}
}

 @media only screen and (max-width: 1024px){
     .detail-search .input-field.col{flex-direction: column; align-items: flex-start}
     .detail-search .input-field > .field-item{flex-direction: column; align-items: flex-start}
     .detail-search .input-field > h5{width:100%; padding-right:0; padding-left:0; word-break:normal; display:block;}
}

/* 분류체계 */
.summary-item dl { width:100%; display:flex; flex-wrap: wrap; align-items: center;} 
.summary-item dl dt { position:relative; flex-basis:100px; flex-shrink: 0; margin-right:10px;} 
.summary-item dl dd { font-weight: 400; } 
.summary-item dl dd a { text-decoration: underline; } 
.summary-item dl dd a:hover { color:#2d316c; } 

 @media only screen and (max-width: 1024px){
    .summary-item dl { width:100%; display:flex; flex-direction: column; padding:1.0rem 0; border-bottom:1px solid #ccc; } 
    .summary-item dl dt,
    .summary-item dl dd { display:block; width:100%; } 
    .summary-item dl dt { display:block; flex-basis:100%; width:100%; } 
    .summary-item dl dt::after { width: 0; height: 0; display:none; } 
    .dropdown-btn.w180 {width:100% !important;}
}

/* 리스트 카운터 */
.board_count{display:inline-block; position:relative; padding-left: 40px; line-height: 34px; letter-spacing:-1px; margin-bottom:10px;}
.board_count *{vertical-align:top;}
.board_count:before{display:inline-block; position:absolute; top: 2px; left:0 ;width: 32px; height: 32px;content:''; background-image: url("../images/ico/count-icon.png"); background-repeat: no-repeat; background-position: 50%;border-radius: 50%;}
.board_count strong{color: #2847aa; font-weight:500; font-size: 1.6rem;}
.board_count.not-icons{padding-left:0;margin-bottom:24px;}
.board_count.not-icons:before{display:none;}

/* 하단 정렬방식*/
.row-between{position:relative; display: flex; justify-content: space-between}
@media all and (max-width:768px) {
    .row-between{flex-direction: column; justify-content: center; align-items: center;}
}

/* Table :: tableType */
table.txt-left td,
table td.table-tl{text-align:left !important;}
table td.table-tc{text-align:center !important;}
.td-link table td > a{color:#f99930 !important; font-weight: 500}
.table-wrap{width:100%; position:relative}

/* Table :: tableType1 */
.tableType1{border-top:2px solid #000; width:100%}
.tableType1 table{width:100%}
.tableType1 table.txt-left td{text-align:left;}
.tableType1 td,.tableType1 th{word-wrap:break-word; word-break:break-all; word-break:keep-all; vertical-align: middle;}
.tableType1 table thead{background:#f7f8fb;}
.tableType1 table thead th{padding:10px 0; border-bottom:1px solid #ccc; border-left:1px solid #ccc; text-align:center; font-weight: 500}
.tableType1 table thead th:first-child{border-left:0;}
.tableType1 table tbody th{border-left:1px solid #ccc; border-bottom:1px solid #ccc; padding:8px; word-break:keep-all; background:#f8f8f8;}
.tableType1 table tbody td{border-left:1px solid #ccc; border-bottom:1px solid #ccc; text-align:center; padding:10px 5px; word-break:keep-all}
.tableType1 table tbody td.text-center{text-align:center; padding:18px 0;}
.tableType1 table tbody td:first-child{border-left:0;}
.tableType1 table tbody th:first-child{border-left:0;}
.tableType1 table tbody td.bd-line{border-left:1px solid #ccc;}

/* Table :: tableType2 */
.tableType2{border-top:2px solid #000; letter-spacing:-1px}
.tableType2 table th{padding:12px 15px; border-bottom:1px solid #dcdcdc; background:#f7f8fb; vertical-align:middle; text-align:left; word-break:keep-all}
.tableType2 table td{padding:12px 15px; border-bottom:1px solid #dcdcdc; vertical-align:middle; word-break:keep-all}

/* Table :: tableType3 */
.tableType3 {position:relative; width:100%;}
.tableType3 table {width:100%; border-collapse: collapse; table-layout:fixed; background-color:#fff;}
/*.tableType3 table tr:hover{background-color:#f7f8fb}*/
.tableType3 table thead tr th {padding:15px 4px; line-height:24px; color:#fff; /*border-top:1px solid #c9c9c9; border-bottom:1px solid #c9c9c9;*/ background-color:#2d316c}
.tableType3 table tbody tr td{padding:10px 4px; text-align:center; border-bottom:1px solid #ccc;}
.tableType3 table tbody tr td a:hover{color:#2d316c; text-decoration: underline}
.tableType3 table tbody tr.cursor-pointer-area td .td-col {cursor:pointer;}
.tableType3 table tbody tr.cursor-pointer-area:hover td .td-col {background-color:#f7f8fb;}

@media screen and (max-width: 1024px) { 
    .tableType3 table,
    .tableType3 table tbody,
    .tableType3 table tr,
    .tableType3 table th,
    .tableType3 table td {display: block;}
    .tableType3 table {border-bottom: none;}
    .tableType3 table thead {display: none;}
    .tableType3 table tr {margin-bottom: 15px;}
    .tableType3 table tbody tr th,
    .tableType3 table tbody tr td {position: relative; padding:10px 4px 10px 140px; border-left: 1px solid #c8c8c8; border-right: 1px solid #c8c8c8; min-height: 45px;}
    .tableType3 table tbody tr th {background: none;}
    .tableType3 table tbody tr th:first-child,
    .tableType3 table tbody tr td:first-child {border-top: 1px solid #d5d5d5; border-left: 1px solid #ccc;}
    .tableType3 table tbody tr th:last-child,
    .tableType3 table tbody tr td:last-child {border-right: 1px solid #d5d5d5; }
    .tableType3 table tbody tr td {text-align: left;}
    .tableType3 table tbody tr th:before,
    .tableType3 table tbody tr td:before {content: attr(data-cell-header); display: inline-flex; position: absolute; top: 0; left: 0; width: 120px; height: 100%; background: #f7f8fb; color:#222; align-items: center; justify-content: center;}
}

/* Table :: tableType4 */
.tableType4 table thead tr th {padding:8px 4px; line-height:24px; color:#fff; background-color:#2d316c; border-left:1px solid #5c5f96; text-align:center; vertical-align: middle}
.tableType4 table thead tr th:first-child{border-left:0;}
.tableType4 table tbody th,
.tableType4 table tbody td{border-left:1px solid #ccc; border-bottom:1px solid #ccc; background:#fff; padding:5px 10px; font-size:1.5rem; text-align:center; vertical-align: middle}
.tableType4 table tbody th:first-child{border-left:0;}
.tableType4 table tbody td:first-child{border-left:0;}

@media all and (max-width: 1920px){
    .modal-content-fixed.modal-table{width: 100%; overflow: auto; overflow-y: auto;}
    .tableType4 {width: 1000px;}
}
@media screen and (max-width: 1024px) {
    .tableType4,
    .modal-content-fixed.modal-table .table {width: 100%;}
    .tableType4 table,
    .tableType4 table tbody,
    .tableType4 table tr,
    .tableType4 table th,
    .tableType4 table td {display: block;}
    .tableType4 table {border-bottom: none;}
    .tableType4 table thead {display: none;}
    .tableType4 table tr {margin-bottom: 15px;}
    .tableType4 table tbody tr th,
    .tableType4 table tbody tr td {position: relative; padding:10px 4px 10px 140px; border-left: 1px solid #c8c8c8; border-right: 1px solid #c8c8c8; min-height: 45px;}
    .tableType4 table tbody tr th {background: none;}
    .tableType4 table tbody tr th:first-child,
    .tableType4 table tbody tr td:first-child {border-top: 1px solid #d5d5d5; border-left: 1px solid #ccc;}
    .tableType4 table tbody tr th:last-child,
    .tableType4 table tbody tr td:last-child {border-right: 1px solid #d5d5d5;}
    .tableType4 table tbody tr td {text-align: left;}
    .tableType4 table tbody tr th:before,
    .tableType4 table tbody tr td:before {content: attr(data-cell-header); display: inline-flex; position: absolute; top: 0; left: 0; width: 120px; height: 100%; background: #f7f8fb; color:#222; align-items: center; justify-content: center;}

}








/* Table :: tableType5 */
.tableType5{border-top:2px solid #000; letter-spacing:-1px; width:100%; min-width:100%; display:block;}
.tableType5.bd-gray{border-top:1px solid #ccc;}
.tableType5 table{table-layout:fixed; width:100%; border-right:1px solid #ccc; background-color:#fff;}
.tableType5 table th{padding:5px 10px; border-bottom:1px solid #ccc; border-left:1px solid #ccc; background:#f7f8fa; vertical-align:middle; text-align:center; word-break:break-all}
.tableType5 table td{padding:5px 10px; border-bottom:1px solid #ccc ; border-left:1px solid #ccc; font-size:1.5rem; vertical-align:middle; word-break:keep-all; text-align:center;}
.tableType5 table thead th:first-child{border-right:1px solid #ccc;}
.tableType5 table tbody th{text-align:center; background:#f7f8fa; border-right:1px solid #ccc;}

@media screen and (max-width:1024px){
	/* common */
	.table-responsive {position: relative; display: block; width: 100%; overflow-x: auto; padding-top:50px; background:url("../images/ico/scroll-x.svg") no-repeat right 4px; background-size: 58px 36px;}
	.table-responsive > div.table {width: 1000px;}
}

/* Table :: tableType6 :: write */
.tableType6 {width: 100%; border-top: 2px solid #000;}
.tableType6 table{table-layout:fixed; width:100%; background-color:#fff;}
.tableType6 table tr {width: 100%; border-bottom: 1px solid #ccc;}
.tableType6 table th{padding:5px 10px; font-weight: 500; vertical-align: middle; background-color:#f7f8fa}  
.tableType6 table td {padding:5px 10px; vertical-align: middle; border-right: none;}  
.tableType6 table td input.inp_write[type="text"],
.tableType6 table td input.inp_file[type="text"],
.tableType6 table td textarea.inp_write{display: inline-block; width: 100%; padding: 10px; border: 1px solid #ccc; box-sizing: border-box;}
.tableType6 table td textarea {height: 150px;}
.tableType6 table td .upload_file {display: inline-block; width: 23%; padding: 1px; box-sizing: border-box; background-color: #171717; border: 1px solid #171717; text-align: center; color: #fff; cursor: pointer;}
    
@media only screen and (max-width: 1024px) {
    .tableType6 table colgroup{display: none}
    .tableType6 table tbody th,
    .tableType6 table tbody td {display: block; width: 100%; min-height: 45px;}
    .tableType6 table tbody th {padding-top: 15px; padding-bottom: 0; background-color: transparent; text-align: left;}
    .tableType6 table tbody td {padding: 10px;}
    .tableType6 table>tbody>tr:first-child th+td {border-top: none}
    .tableType6 table>tbody>tr td+th {border-top: 1px solid #ccc;}
}

/* pagination */
.pagination-wrap {position:relative;padding:20px 0 0 0;text-align:center;}
#pagination .page-control {display:inline-block;}
#pagination .page-control .btn-ctrl {display:inline-block;position:relative;width:39px;height:39px;margin:0 2px;line-height:39px;vertical-align:top;border:1px solid #dddde1;border-radius:50%;box-sizing:border-box;transition:border-color .2s;  background:#fff;}
#pagination .page-control .btn-ctrl::after {content:'';display:block;position:absolute;top:50%;left:50%;margin-top:-5px;width:13px;height:11px;}
#pagination .page-control .prev-end::after {margin-left:-8px;transform:rotate(180deg);background:url("../images/ico/arrow02.png") no-repeat;}
#pagination .page-control .prev-one::after {margin-left:-8px;transform:rotate(180deg);background:url("../images/ico/arrow01.png") no-repeat;}
#pagination .page-control .next-one::after {margin-left:-5px;background:url("../images/ico/arrow01.png") no-repeat;}
#pagination .page-control .next-end::after {margin-left:-5px;background:url("../images/ico/arrow02.png") no-repeat;}
#pagination .page-control .btn-ctrl:hover {border:1px solid #81848d;}
#pagination .page-control .prev-one span,
#pagination .page-control .next-one span {display:none;}
#pagination .page-link {display:inline-block;margin:0 4px;}
#pagination .page-link a,
#pagination .page-link .active {display:inline-block;width:39px;height:39px;margin:0 2px;line-height:39px; font-size:16px;vertical-align:top;border:1px solid #dddde1;border-radius:50%;box-sizing:border-box;transition:border-color .2s; background:#fff;}
#pagination .page-link a {color:#92929a;}
#pagination .page-link a:hover {color:#303031;border:1px solid #81848d;}
#pagination .page-link .active {background:#2d316c;color:#fff;border:1px solid transparent;}

@media all and (max-width:1024px) {
    #pagination .page-control .btn-ctrl {width:32px;height:32px;margin:0 1px;line-height:28px;}
    #pagination .page-link {display:inline-block;margin:0 2px;}
    #pagination .page-link a,
    #pagination .page-link .active {width:32px;height:32px;margin:0;line-height:28px; font-size:14px;}
}

@media all and (max-width:768px) {
    .pagination-wrap {position:relative;padding:10px 0;text-align:center; width:100%;}
    #pagination { display:flex; justify-content: space-between; width:100%;}
    #pagination .page-control {width:calc(50% - 6px);}
    #pagination .page-control .prev-end,
    #pagination .page-control .prev,
    #pagination .page-control .next,
    #pagination .page-control .next-end,
    #pagination .page-link {display:none !important;}
    #pagination .page-control .prev-one {display:block;}
    #pagination .page-control .next-one {display:block;}
    #pagination .page-control .btn-ctrl {display:block;width:100%;height:38px;margin:0;font-size:14px !important;line-height:36px;border-radius:0;}    
    #pagination .page-control .prev-one span {display:inline-block;position:relative;padding-left:15px;}
    #pagination .page-control .next-one span {display:inline-block;position:relative;padding-right:15px;}
    #pagination .page-control .btn-ctrl::after {display:none;}
 }

/* Form */
.form-group *[class*=input-wrap] > *{margin-left:5px;}
.form-group.form-group-inline{display: flex;flex-direction: row; flex: 1 0 0%; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%;}
.form-group.form-group-inline *[class*=input-wrap]{display:flex; flex-grow: 1; flex-basis: 0; flex-shrink: 1; align-items: center;}
.form-group.form-group-inline *[class*=input-wrap] input[type="text"],
.form-group.form-group-inline *[class*=input-wrap] select{width:100%;}
.form-group.form-group-inline *[class*=input-wrap] .input-line-text{border-top-right-radius: 0; border-bottom-right-radius: 0; }
.form-group.form-group-inline *[class*=input-wrap].flex > :not(:first-child){ margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0;}
.form-group.form-group-inline *[class*=input-wrap] .btn {padding-right: 15px; padding-left: 15px;}

@media(max-width: 1024px) {
    .form-group.w50,
    .form-group select{width: 100% !important;}
    .form-group *[class*=input-wrap] > *,
    .form-group *[class*=input-wrap] + *{margin-left:0;}
	.form-group.form-group-inline *[class*=input-wrap]{display:block; min-width:100%; margin-bottom:5px}
    .form-group.form-group-inline *[class*=input-wrap].flex{display:flex;}
	.form-group.form-group-inline .bar{display:none; font-size:0}
    .form-group .btn{width:100%; text-align:center;}
}

/* sub */
.sub-container{position: relative; width: 100%; margin:0 auto}
.sub-con{position: relative; width: 100%; max-width:1400px; margin:0 auto}

/* sub-title */
.sub-title { position:relative; display:block; width:100%; /*border-bottom:2px solid #40434b;*/ margin-bottom : 30px; text-align:center;}  
.sub-title::before{content: ''; display: none; width: 0; height: 0; margin-right: 0;  background: #8b8b8b; left: 50%; top: 74px; position: absolute;}
.sub-title h2.pageTitle {font-size: 3.5rem; font-weight: 500;}

@media all and (max-width:768px) {
    .sub-title {margin-bottom : 30px;}  
    .sub-title::before{height: 20px; top: 40px;}
    .sub-title h2.pageTitle {font-size: 2.5rem; font-weight: 600; }
}

/* badge */
.badge-list{display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.badge{padding:3px 10px; font-size: 1.2rem; border-radius:100px; color:#fff; text-align:center;}
.badge-lg{padding:5px 10px; font-size: 1.4rem; border-radius:100px; color:#fff; min-width: 80px; display:inline-block; text-align:center;}
.badge-xlg{padding:5px 20px; font-size: 1.4rem; border-radius:100px; color:#fff; min-width: 80px; display:inline-block; text-align:center;}

/* 정보동의 */
.txt-agree{text-align:right;}

@media all and (max-width:1024px) { 
    .txt-agree{text-align:center;}
}

/* 열람신청 :: TreeView */
.tree {margin:auto; padding:0 0 0 12px;/* overflow-x:hidden; overflow-y:auto;*/ position:relative;}
.tree:before {display:inline-block; content:""; position:absolute; top:-20px; bottom:16px; left:0; z-index:1; border:1px dotted #2d316c; border-width:0 0 0 1px;}
.tree .tree-branch:before,
.tree .tree-item:before {display:inline-block; content:""; position:absolute; top:14px; left:-13px; width:18px; height:0; border-top:1px dotted #2d316c; z-index:1;}
.tree .tree-item {line-height:1; cursor:pointer; max-width:calc(100% - 20px);}
.tree .tree-branch {width:auto; min-height:20px; cursor:pointer;}
.tree .tree-branch,
.tree .tree-item {position:relative; list-style:none; /*border-left:1px solid #fff;*/  margin:2px 0;}
.tree .tree-branch .tree-branch-header {position:relative; min-height:20px; line-height:20px;}
.tree .tree-branch .tree-branch-header {border-radius:0;}
.tree .tree-branch .tree-branch-header,
.tree .tree-item {padding:5px 8px; -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box;}
.tree .tree-branch-name,
.tree .tree-item-name {cursor:pointer;}
.tree .tree-branch .tree-branch-header .tree-branch-name,
.tree .tree-item .tree-item-name {display:inline; z-index:2;}
.ace-icon {text-align:center;}
.tree .tree-minus.ace-icon:first-child,
.tree .tree-plus.ace-icon:first-child {display:inline-block; font-style:normal; vertical-align:middle; height:11px; width:11px; -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; text-align:center; border:1px solid #2d316c; line-height:10px; background-color:#fff; position:relative; z-index:2;}
.tree .tree-minus.ace-icon:first-child:before,
.tree .tree-plus.ace-icon:first-child:before {content:"";display:block; width:7px; height:0; border-top:1px solid #2d316c; position:absolute; top:5px; left:2px;}
.tree .tree-plus.ace-icon:first-child:after {content:""; display:block; height:7px; width:""; border-left:1px solid #2d316c; position:absolute; top:2px; left:5px;}
.tree .tree-branch .tree-branch-header>.tree-branch-name>.ace-icon:first-child,
.tree .tree-item>.tree-item-name>.ace-icon:first-child {display:inline-block; position:relative; z-index:2; top:-1px;}
.tree .tree-item>.tree-item-name>.ace-icon:first-child {margin-right:3px;}
.tree .tree-item>.tree-item-name>.ace-icon:first-child {color:#f9e8ce; width:13px;  height:13px; line-height:13px; font-size:11px; text-align:center; border-radius:3px; -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; background-color:#fafafa; border:1px solid #ccc; box-shadow:0 1px 2px rgba(0, 0, 0, .05);}
.tree .tree-branch>.tree-branch-header>.tree-branch-name>.tree-label {margin-left:5px;}
.tree .tree-branch>.tree-branch-header>.tree-branch-name>.ace-icon:first-child {margin:-2px 0 0 -2px;}
.tree .tree-branch .tree-branch-children {margin:0 0 0 23px; padding:0; position:relative;}
.tree .tree-branch .tree-branch-children:before {display:inline-block; content:""; position:absolute; z-index:1; top:-14px; bottom:16px; left:-14px; border:1px dotted #2d316c; border-width:0 0 0 1px;}
.tree .tree-branch:last-child:after {display:inline-block; content:""; position:absolute; z-index:1; top:15px; bottom:0; left:-15px; border-left:1px solid #FFF;}
.tree .tree-item.tree-selected, .tree .tree-item.tree-selected:hover {background-color:rgba(98,168,209,.16);}
.tree .tree-selected>.tree-item-name>.ace-icon:first-child {background-color:#2d316c; border-color:#2d316c; color:#fff;}
.hidden {display:none !important;}

/* 이미지슬라이드 */
.view-slider {width:100%; position: relative; height: 400px; overflow: hidden;}
.view-slider-img {width:calc(100% - 50px); height: 360px; margin:0 auto; }
.view-slider-img img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 20px;}
.view-slider-content {text-align:center; width: 100%; padding:10px; background: #fff;}
.view-slider-content > span{display:inline-block; padding:0 8px; font-size:17px; font-weight: 500}
.view-slider > .swiper-button-prev,
.view-slider > .swiper-button-next{position: absolute; top: calc(50% - 25px); z-index: 9999; width: 50px; height: 50px; border-radius: 50%; background-color: #fff;}

.view-slider > .swiper-button-prev:after,
.view-slider > .swiper-button-next:after{color:#222; font-size:22px !important ;}

.view-slider > .swiper-button-prev {left:0;}
.view-slider > .swiper-button-next {right:0;}

@media screen and (max-width: 1024px) {
    .view-slider {height: auto;}
    .view-slider-img {width: 100%; flex-shrink: 0; height: auto;}
}

/* 담당자 정보 */
.content-info{position: relative; padding: 15px 25px; border: 1px solid #ccc; background-color: #f7f8fb; text-align: left; border-radius: 10px;}
.content-info strong {position: relative; margin-right: 10px; padding-left: 17px; color: #333; font-weight: 500;}
/* .content-info strong:before { display: block; position: absolute; top:6px; left: 0; width: 13px; height: 17px; background: url(../images/ico/content-info.png) 0 0 no-repeat; content: '';} */
.content-info span {display: inline-block; margin-right: 10px;}


/* 전문정보북마크 */
.includ-form{display:none; margin-top:20px;}
.webzine-list {position:relative; border-top:2px solid #000;}
.webzine-list > ul  > li {padding:35px 20px; border-bottom:1px solid #c8c8c8; overflow:hidden;}
.webzine-list li .date_wrap {float:left;  width:140px;font-size:2.0rem; padding-top:40px;}
.webzine-list li .webzine-field {margin:10px 0;}
.webzine-list li .webzine-field span {color:#2946aa; border:1px solid #2946aa; border-radius:5px; display:inline-block; padding:2px 10px; font-size:1.3rem; margin:3px 2px;}
.webzine-list li .webzine-field span:first-child {margin:3px 2px 3px 0;}
.webzine-list li .webzine-field span.num{color: #fff; border: 1px solid #eb3b54; background-color: #eb3b54;}
.webzine-list li .text-wrap {position:relative;width: 100%;}

.webzine-list li .text-wrap .etc-info{position:relative; left:0; display:flex; flex-direction:column; padding-top:15px; border-top:0 dashed #dbdbdb; width:100%;}
.webzine-list li .text-wrap .etc-info li{position:relative; display:flex; align-items: center; font-weight: 500}
.webzine-list li .text-wrap .etc-info span.material-icons-outlined{font-size:1.8rem; color:#116a7b; margin-right:10px;}
.webzine-list li .text-wrap .etc-info span:nth-child(2){margin-right:10px; color:#116a7b;}

.webzine-list li .text-wrap .bem em.label {display:inline-block; background:#2b467b; color:#fff; font-size:1.3rem; padding:0 10px; line-height:24px; border-radius:5px;}
.webzine-list li .text-wrap .bem .company {display:inline-block;}
.webzine-list li .text-wrap .list-wrap{position:relative; width:100%;}

.webzine-list li .text-wrap .step{position:absolute; right:0; top:10px;}
.webzine-list li .text-wrap .step a span{color:#fff; display:block; font-size:1.6rem; width:80px; height:80px; line-height:80px; border-radius:80px; text-align:center; margin-left:10px; transition:all 0.5s ease;}
.webzine-list li .text-wrap .step .mstep01 {background:#2946aa;}
.webzine-list li .text-wrap .step a:hover .mstep01 {border:2px solid #265bbc; color:#265bbc; background-color:#fff;}
.webzine-list li .text-wrap .step .mstep02 {background:#969696;}
.webzine-list li .text-wrap .step a:hover .mstep02 {border:2px solid #969696; color:#969696; background-color:#fff;}
.webzine-list li .text-wrap .step .mstep03 {background:#009cff;}
.webzine-list li .text-wrap .step a:hover .mstep03 {border:2px solid #009cff; color:#009cff; background-color:#fff;}
.webzine-list li .text-wrap .btitle{font-size: 2.4rem; line-height: 2px; padding:10px 0; width:840px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block;}
.webzine-list li .text-wrap .btitle a:hover {text-decoration:underline; color:#315498;}
.webzine-list li .text-wrap .btext {font-size:1.6rem; color:#7d7d7d; width:840px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.webzine-list li .text-wrap .more {position:absolute; right:0; bottom:0; color:#2152b2;}

.webzine-list.bookmark li .text-wrap .btn_w{position:absolute; right:0; bottom:0;}
.webzine-list.bookmark li .text-wrap a.btn .book-ico{display:inline-block; width:18px; height:18px; background:url(../images/ico/book-file.png) no-repeat 0 0; background-size:100% 18px; margin-right:7px;}
.webzine-list.bookmark li .text-wrap a.btn .pdf-ico{display:inline-block; width:18px; height:18px; background:url(../images/ico/pdf-file.png) no-repeat 0 0; background-size:100% 18px; margin-right:7px;}

.etc_info{display:flex; flex-wrap:wrap; font-size:1.5rem;}
.etc_info span{position:relative; -webkit-box-flex:1; flex:1 1 50%; margin-top:0.5px;}
.etc_info span > em{display:inline-block; padding-right:1px; margin-right:0.7px; position:relative;}
.etc_info span > em:after{content: ""; display: block; background-color: #2847aa; width: 1px; height: 15px; position: absolute; right: 10px; top: 5px;}

@media all and (max-width:1400px) {
	.webzine-list  li .text-wrap .btitle {width:650px;}
	.webzine-list  li .text-wrap .btext {width:650px;}
}

@media all and (max-width:1200px) {
	.webzine-list  li .text-wrap .btitle {width:800px;}
	.webzine-list  li .text-wrap .btext {width:800px;}
	.webzine-list  li .text-wrap .bdate {position:relative;}
}

@media all and (max-width:1024px) {
    .webzine-list > ul  > li {padding:20px 0;}
    .webzine-list li .text-wrap .etc-info{padding-top:0;}
	.webzine-list li .date_wrap  {width:100%; padding:0 0 10px 0;}
	.webzine-list li .text-wrap {width:100%;}
	.webzine-list li .text-wrap .bem .company {margin-top:10px;}
	.webzine-list li .text-wrap .btitle {width:100%;}
	.webzine-list li .text-wrap .btext {width:100%;}
	.webzine-list li .text-wrap .bdate {position:relative; margin-top:10px;}
	.webzine-list li .text-wrap .more {position:relative; display:block; padding-top:10px;}
	.webzine-list li .text-wrap .step{position:relative; left:0; top:0;margin-top:20px;}
	.webzine-list li .text-wrap .step a span{color:#fff; display:block; font-size:.1rem; width:120px; height:40px; line-height:40px; border-radius:50px; text-align:center; margin-left:0; transition:all 0.5s ease;}
    .webzine-list.bookmark li .text-wrap .btn_w{position:relative; left:0; bottom:0;}
}

@media all and (max-width:768px) {
	.webzine-list li .date_wrap {font-size:0.1rem;}
	.webzine-list li .text-wrap .btitle {font-size:18px;}
	.webzine-list li .text-wrap .bem .company {display:block; margin:10px 0;}
	.webzine-list li .text-wrap .bem li:first-child {padding-left:0;}
	.etc_info span{position:relative; -webkit-box-flex:1; flex:1 1 100%; margin-top:0.5px;}
}

@media only screen and (max-width: 640px){
    .webzine-list.bookmark li .text-wrap .btn_w{position:relative; display:block; top:0; right:0; top:0; bottom:0;}
    .webzine-list.bookmark li .text-wrap .btn_w>* {margin:3px 0;}
    .webzine-list.bookmark li .text-wrap .btn_w a.btn{display:flex; align-items: center; justify-content: center; width:100%;}
}

/* 자료즐겨찾기 */
.list-box.w3fr {position: relative; width: 100%; display: grid; gap:20px; width: 100%; grid-template-columns: repeat(3, 1fr);}
.list-box.w4fr {position: relative; width: 100%; display: grid; gap:20px; width: 100%; grid-template-columns: repeat(4, 1fr)}
.list-box > li {display:block; width: 100%; vertical-align: top; border:1px solid #ccc; border-radius: 20px; overflow:hidden;}
.list-box > li:nth-of-type(3n) {padding-right: 0;}

.list-box > li > a {position: relative; display: block; width: 100%; height: 100%;}
.list-box > li > a::after {content: ""; border: 5px solid #2847aa; width: 100%; height: 100%; border-radius: 20px; position: absolute; top: 0; left: 0; box-sizing:border-box; opacity: 0; transition: all .3s;}
.list-box > li > a:hover::after {opacity: 1}
.list-box > li > a .list-img {display: block; width: 100%; position: relative; border-radius: 2px; overflow: hidden; background:url(../images/common/noimg.png)no-repeat center;}
.list-box > li > a .list-img:before {content: ''; display: block; padding-bottom: 74.8571%;}
.list-box > li > a .list-img img {position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; transition: .3s; transform: scale(1);}
.list-box > li > a .list-img img:hover {transform: scale(1.1);}
.list-box > li > a .list-txt{position: relative; display:block; min-height: 140px; padding: 20px;}
.list-box > li > a .list-txt .tit-infotop {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; overflow: hidden; font-weight: 500; height:30px; font-size: 1.8rem;}
.list-box > li > a .list-txt .st-name {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.4rem; margin-bottom:5px; }
.list-box > li > a .list-txt .step-txt {font-size: 1.4rem; margin-bottom:5px; line-height:1.5; padding:5px 10px; background: #f6f6f6; border:1px solid #ccc; word-break: keep-all; border-radius: 8px;}
.list-box > li > a .list-txt .info-txt{display: -webkit-box; overflow:hidden; text-overflow: ellipsis; word-break: break-word; height:50px; -webkit-line-clamp: 2; line-height:1.5; -webkit-box-orient: vertical; margin-top:15px; word-break:keep-all;}

.list-box > li > a .list-txt > ul > li{padding:5px 0;}
.list-box > li > a .list-txt .btn-down{position:absolute; bottom:20px; right:20px; background-color: #e6f5f8; width:45px; height:45px; border-radius: 50px; text-align:center; }
.list-box > li > a .list-txt .btn-down span{color:#2847aa;}

@media all and (max-width:1200px) {
    .list-box.w4fr {grid-template-columns: repeat(2, 1fr)}
    .list-box > li > a .list-txt .info-txt{height:65px; -webkit-line-clamp: 3;}
}

@media all and (max-width:1024px) {
    .list-box.w3fr,
    .list-box.w4fr {gap:30px; grid-template-columns:1fr;}
    .list-box > li {border-radius: 1px; border-radius: 10px;}
    .list-box > li > a {display: flex; justify-content: space-between;}
    .list-box > li > a::after {border-radius: 10px;}
    .list-box > li > a .list-img {width: 270px; border-radius: 0;}
    .list-box > li > a .list-img:before {content: ''; display: block; padding-bottom:56.25%;}
    .list-box > li > a .list-txt{position: relative; display:block; width: calc(100% - 300px); min-height: 140px; padding-left:0;}
}

@media all and (max-width:768px) {
    .list-box > li > a {flex-direction: column;}
    .list-box > li > a .list-img {display: block; width: 100%;}
    .list-box > li > a .list-txt{width:100%; min-height: auto; padding:20px;}
}


/* Contents */
.row_con{position: relative; display: flex; flex-wrap: wrap; width: 100%; border-bottom:1px solid #dfdfdf; padding-bottom:40px; margin-bottom:40px;}
.row_con .title_warp{width: 25%; vertical-align: top;}
.row_con .con_warp{width: 75%; vertical-align: top}
.row_con .con_warp_w100{width: 100%; display:block;}

@media only screen and (max-width: 1024px) {
    .row_con{position: relative; display: flex; flex-direction: column;}
	.row_con .title_warp{width: 100%; vertical-align: top; margin-bottom:0;}
    .row_con .title_warp .sc-title2{margin-bottom:0;}
	.row_con .title_warp br{display:none;}
	.row_con .con_warp{width: 100%; vertical-align: top}
}