@import url("common.css");
#header {position:absolute;}

/*공통*/

.btn-color1 {background-color: #03A1AC; color:#fff;}
.btn-color2 {background-color: #BE1824; color:#fff;}
.btn-color3 {background-color: #5E5A57; color:#fff;}
.btn-color1:hover {background-color: #009AA5; color:#fff;}
.btn-color2:hover {background-color: #BE1824; color:#fff;}
.btn-color3:hover {background-color: #56514E; color:#fff;}

.font-color1 {color:#08449A;}
.font-color2 {color:#03A1AC;}
.font-color3 {color:#AE0C17;}
.font-color4 {columns: #5e5a57;;}

/* 라디오/체크박스 */
.form_check{padding: 0 10px 10px 35px; position: relative;}
.mark, mark {padding: 1.5em; background-color: #f7f9ff;}
.mark label{margin-top: 2px; margin-bottom: 2px; margin-left: 6px;}
.form_check input {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark {position: absolute; top: 0; left: 0; height: 22px; width: 22px; background-color: #ddd; border-radius: 5px;}
.form_check:hover input ~ .checkmark {background-color: #ccc;}
.form_check input:checked ~ .checkmark {background-color: #08449A;}
.checkmark:after {content: ""; position: absolute; display: none;} 
.form_check input:checked ~ .checkmark:after {display: block;}
.form_check .checkmark:after {left: 7px; top: 3px; width: 8px; height: 12px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}




/*서브상단*/
.sub_visual{position:relative;max-width:2560px;margin:0 auto;height:350px;overflow:hidden;background-repeat:no-repeat;background-position:center top;}
.sub_visual.visual01{background-image:url('../../img/visual_img.jpg')}


.sub_visual .title_warp { max-width:1240px; margin:0 auto; display:table;}
.sub_visual .title_warp {position: relative;   text-align:center; margin:200px auto; z-index:2}
.sub_visual .main_title h2{font-size:40px; font-weight:500; text-align:center; color:#353535; letter-spacing:-1px ; color:#fff;}

.sub_visual h3,
.sub_visual .main_title{
	animation-duration: 0.7s;
	animation-fill-mode: both;
	animation-iteration-count: 1;
	animation-timing-function: ease;
	-webkit-animation-duration: 0.7s;
	-webkit-animation-fill-mode: both;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease;
	animation-delay: 0.3s; 
	-webkit-animation-delay: 0.3s;
	animation-name:visual-tit;
	 -webkit-animation-name:visual-tit;
}
.sub_visual .main_title {animation-delay: 0.6s; -webkit-animation-delay: 0.6s;} 

 @keyframes visual-zoom {
	0% {transform:scale(1.2);}
	100% {transform:scale(1);}
}
@-webkit-keyframes visual-zoom {
	0% {transform:scale(1.2);}
	100% {transform:scale(1);}
}

@keyframes visual-tit {
	0% {opacity:0; -webkit-opacity:0; transform:translateY(20px);}
	100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);}
}
@-webkit-keyframes visual-tit {
	0% {opacity:0; -webkit-opacity:0; transform:translateY(20px);}
	100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);}
}


 @media screen and (max-width: 980px) { 
    .sub_visual { height:200px; padding-top:30px;}
	.sub_visual .title_warp { width:100%; margin:90px auto;}
	.sub_visual .title_warp h2 {font-size:28px;}
 }
 @media screen and (max-width: 640px) {
	.sub_visual { height:150px;}
	.sub_visual .title_warp {margin:50px auto}
 } 
/*서브상단*/


/*서브 제목*/
.content_wrap { width:100%; }
.content_wrap .txtCon {clear:both;}
.content_wrap .txtCon .sub_title {margin:40px 0 20px 0; text-align:left; display: flex; justify-content: space-between; align-items: center;}
.content_wrap .txtCon .sub_title h2 {font-size:2.38em; color:#353535; line-height:130%; font-weight: bold;}
.content_wrap .txtCon .sub_title li {display: inline-block;}
.content_wrap .txtCon .sub_title li i {font-size:12px; color:#888;}
.content_wrap .txtCon .content_area { width:100%; padding-bottom:120px;}


@media screen and (max-width:640px) {
	.content_wrap .txtCon .sub_title {margin:30px 0 15px 0;}
	.content_wrap .txtCon .sub_title h2 { font-size:28px}
	.content_wrap .txtCon .content_area { width:100%; padding-bottom:80px;}
}
@media screen and (max-width:414px) {
    
}
/*서브 제목*/


/* 지도 */
.map_area { background-color: #F9F9F9; position: relative; overflow: hidden;}
.map_wrapper {display: flex;}
.sidebar {top:0; width:380px; border-right:1px solid #ddd;background: #fff; overflow: hidden; z-index: 99;}
.sidebar .map_list {height: 70vh; overflow-y: scroll;}
.sidebar .map_list .list:hover {background-color: #f8f8f8;}
.sidebar-toggle {visibility: hidden; margin-top: 10px; background-color: #08449a; border:0; width:100%; color: #fff; border-radius: 5px; padding:10px 0; cursor: pointer;}

.filter {position: absolute; top:10px; right:10px; }
.filter ul {background-color: #fff; border:1px solid #ddd; padding:10px 15px; border-radius: 10px;}
.filter ul li {margin-bottom:5px; font-size: 14px;}
.filter ul li img {margin-right:5px;} 

.map_list .list {padding:20px; border-bottom:1px solid #ddd;}
.map_list .list:last-child {border-bottom:0;}
.map_list .list a {display: block;}
.map_list .list a span.badge {border-radius:5px; padding:5px 5px 5px 20px; font-size:0.88em; color:#fff;}
.map_list .list a span.badge-agency1 {background: #0072BC url('../../img/ico-circle.svg') 5px center no-repeat;} /*사회적경제*/
.map_list .list a span.badge-agency2 {background: #31A9C8 url('../../img/ico-circle.svg') 5px center no-repeat;} /*로컬창업공간*/
.map_list .list a span.badge-agency3 {background: #00A087 url('../../img/ico-square.svg') 5px center no-repeat;} /*창업지원기관*/
.map_list .list a span.badge-agency4 {background: #6BB16D url('../../img/ico-square.svg') 5px center no-repeat;} /*창업지원기관(대학)*/
.map_list .list a span.badge-agency5 {background: #C86A97 url('../../img/ico-rhombus.svg') 5px center no-repeat;} /*기술지주회사*/
.map_list .list a span.badge-agency6 {background: #F47649 url('../../img/ico-rhombus.svg') 5px center no-repeat;} /*투자기관*/
.map_list .list a span.badge-agency7 {background: #E7BB2B url('../../img/ico-agency.svg') 5px center no-repeat;} /*전문연구기관*/
.map_list .list a span.badge-agency8 {background: #7B8C95 url('../../img/ico-agency.svg') 5px center no-repeat;} /*유관기관*/
.map_list .list a h6 {font-size: 1.25em; padding-top:10px;}
.map_list .list a h6 span {padding-left:10px; color:#666; font-size: 16px; font-weight: normal;}
.map_list .list a p {background: url('../../img/ico-pin.svg') center left no-repeat; padding-left: 20px; color:#666;}

.post { width: 100%; height: 80vh;}
.post h3 {font-size: 1.5em;; font-weight: 400; color:#222;}
.post h3 strong {font-weight:bold;}

.map_main {display: flex; flex-direction: column; align-content: center; padding: 1.25em; flex-grow: 1;}
.sidebar {background-color: #fff; transition: 0.7s;}
.sidebar.is-closed {transform: translateX(0);}
.sidebar .title {display: flex; justify-content: space-between; align-items: center; border-bottom:1px solid #ddd; padding:0 20px 15px 20px;}
.sidebar h4 {font-weight: 800; font-size:1.25em;}
.sidebar span b {color:#08449a}

.search {margin:20px;}
.search_in {border:1px solid #08449a; border-radius: 5px; display: flex; justify-content: space-between; overflow: hidden;}
.search_in input {padding-left:10px; width:calc(100% - 60px); border:0;}
.search_in button {border:0; width:50px; height:50px; background-color: #fff;}

.map_content {text-align: center;  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.map_content img {height:90%;}


@media screen and (max-width: 980px) { 
	.sidebar {position: absolute; width:250px; height: 100vh; background: white; box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px; transition: 0.7s;}
    .sidebar.is-closed {transform: translateX(-260px);}
	.sidebar-toggle {visibility: visible; position: absolute;}
	.map_list .list a h6 span {display: block; padding-left: 0;}
	.map_list .list a p {background: url('../../img/ico-pin.svg') left center no-repeat; padding-left: 20px; color:#666;}
	.filter ul {padding:5px 10px;}
	.filter ul li {margin-bottom:5px; font-size: 12px; letter-spacing: -.7pt;;}
}
  
/* 지도 */


/* 회원가입 */
.join_intro_box {background: #EAF1F9; padding:30px 0; text-align: center; z-index: -2;  margin-bottom:60px;}
.join_intro_box h4 {font-size: 1.5em; color:#222; font-weight: bold; position:relative; overflow: hidden; display: inline-block; z-index: 2; margin-bottom: 10px;}
.join_intro_box h4::after {content: ''; background: #A4C9FF; width: 100%; height:8px; position: absolute; left:0; z-index: -1; bottom:5px;} 
.join_type ul {display: flex; flex-wrap: wrap; margin:0 -15px}
/*  2025-04-28 박태균 취창업 개선 전문가 추가로 인한 변경*/
.join_type ul li {width: calc(100% / 5 - 30px); margin:15px; bordeR:1px solid #eee; border-radius: 5px; padding:30px 15px; transition: all .3s ease;}
/*  2025-04-28 박태균 취창업 개선 전문가 추가로 인한 변경*/
.join_type ul li h6 {text-align: center; font-weight: bold; font-size: 1.50em;}
.join_type ul li .img {text-align: center; height: 130px; margin:20px 0;}
.join_type ul li a {text-align: center; display: block; margin-top:20px;}
.join_type ul li:first-child:hover {border-color: #5E5A57;}
.join_type ul li:nth-child(2):hover {border-color: #08449A;}
.join_type ul li:nth-child(3):hover {border-color: #03A1AC;}
.join_type ul li:nth-child(4):hover {border-color: #BE1824;}
.join_type ul li:nth-child(5):hover {border-color: #198754;}

/* 약관동의 */
.agree_input {margin:0 auto;}
.agree_input h5 {font-weight: bold; padding-bottom:5px; color:#222;}
.agree_input h5 span {font-size:.8em; padding-left:5px; font-weight: normal;}
.agree_input .agree_box {border:1px solid #ddd; overflow-y: scroll; min-height: 100px; max-height: 150px; margin-bottom:10px; padding:15px; }
.agree_input ul li {display: inline-block;}
.agree_input > div {margin-bottom:30px;}

.join_input {border:1px solid #e5e5e5; padding:40px; border-radius: 10px;}
.join_input .row  {padding:5px 0;}
.join_input small {color:#999; padding-top:5px; display: block;}

@media screen and (max-width: 980px) { 
	.join_type ul {margin:0 -10px;}
	.join_type ul li {width: calc(100% / 2 - 20px); margin:10px;}
	.join_intro_box {margin-bottom:30px;}

	.join_input {padding:20px;}
}

.filter_box {border:1px solid #ddd; overflow-y: scroll; height:200px; border-radius: 5px;}
.filters { display: flex; flex-wrap: wrap; padding:10px;}
.filters label {width:calc(100% / 4 - 10px); margin:10px;}

label.filter_list {border: 1px solid #ddd; position: relative; cursor: pointer; margin:5px;}
label.filter_list span { text-align: center; transition: 300ms ease all; padding: 10px; display: block; height: 100%; word-break: break-word;}
.filter_list input[type="checkbox"] {display: none;}
.filter_list input[type="checkbox"]:checked + span {background: #08449A; color:#fff;}
.filter_list input[type="checkbox"]:checked + span::after {position: absolute; background: #08449A;}

/*2024-03-25 박태균 마이페이지 회원정보수정 라디어버튼 수정 */
.filter_list input[type="radio"] {display: none;}
.filter_list input[type="radio"]:checked + span {background: #08449A; color:#fff;}
.filter_list input[type="radio"]:checked + span::after {position: absolute; background: #08449A;}

/*태그*/
.tags-container {display: flex; flex-wrap: wrap; margin-top:10px;}
.tags-container > input {flex: 1 0 auto; margin: 5px; border: none;}
.tags-container > input:focus {outline: none;}
.tag {margin: 5px; background-color: #eceff2; padding: 2px 24px 2px 8px; font-size: 15px; color: #2a4a4b; position: relative; border-radius: 4px; display: inline-block; max-width: 161px; white-space: nowrap; text-align: center; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box;}
.tag::after {content: 'x'; position: absolute; right: 6px; top: 2px; font-size: 12px; color: #a7b8d1;}

/* 게시판-검색 */
.bd { position: relative; width:100%; box-sizing: border-box; max-width: 600px; margin:0 auto 10px auto;}
.bd_area {display: flex; align-items: flex-start;}
.bd_search { padding: 0rem 2rem; border-radius: 5rem; box-shadow: 0rem .4rem .8rem 0rem rgba(0,0,0,.1);}
.bd_group {display: flex; justify-content: space-between; align-items: center; flex: 1; position: relative;
padding: 0rem 1.2rem; border-radius: 5rem; background-color: #fff; border: 1px solid #d5dae0; box-sizing: border-box; height: 3.2rem; font-size: 1rem; line-height: 2.2rem; letter-spacing: -0.05rem; font-weight: 500;}
.bt_group {display: flex; justify-content: space-between; align-items: center; flex: 1; position: relative;
padding: 0rem 1.2rem; border-radius: 5rem; background-color: #fff; border: 1px solid #d5dae0; box-sizing: border-box; height: 3.2rem; font-size: 1rem; line-height: 2.2rem; letter-spacing: -0.05rem; font-weight: 500;}
.bd_text {width: 100%; height: 100%; text-overflow: ellipsis; border:0;}
.bd_search .btn_search {border:0; background-color: transparent;}
.bd_search .btn_search::before {content: ""; display: block; width: 2rem; height: 2.4rem; background: url('../../img/ico-search.png') no-repeat center;}
.pageArea .page-link {height:40px; line-height: 1.1; margin:0 5px; border-radius: 50% !important;}


/* 자유게시판 */
.board_list {border-top: 1px solid #5a6375;}
.board_list .board_tit {display: flex; align-items: center; justify-content: space-between; padding: 1.4rem 1.2rem; font-size: 1.18rem; line-height: 2.2rem; letter-spacing: -0.05rem; color: #444}
.board_list .board_tit .tit_badge { display: inline-block; margin-right: .4rem; color: gray;}
.board_list .board_tit .board_tit_txt { flex: 1; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all;}
.board_list .board_tit.notice .board_tit_txt { padding-left: 4.8rem; text-indent: -2.4rem}
.board_list .board_tit .board_date { font-size: 1rem; line-height: 2.4rem; letter-spacing: -0.04rem; color: gray;}
.board_list li { border-bottom: 1px solid #e5e9ee;}
.board_list li.notice { background-color: #fbfbfd;}
.board_list li a:hover { background-color: #f6f7fb;}


/* 갤러리게시판 */
.gallery_list {display: flex; flex-wrap: wrap; }
.gallery_list a {width: calc(50% - 20px);  outline:1px solid #ddd;  border-radius: 5px; text-decoration: none; color: #000; margin:10px 10px; padding:10px;}
.gallery_list a:hover { text-decoration:none; color:#0072BC; outline: 1px solid #08449A;}
.gallery_list figure { margin: 0; overflow: hidden; margin-bottom: 10px;}
.gallery_list figure .img { overflow: hidden; border-radius: 5px;}
/* 2024-04-05 박태균 height auto에서 max-height: 100%로 변경*/
/* .gallery_list figure img {max-width:100%; height: auto; display: block; transition: transform .2s ease-in-out;} */
.gallery_list figure img {max-width:100%; max-height: 100%; display: block; transition: transform .2s ease-in-out;}
.gallery_list figure figcaption { margin-top:15px; }
.gallery_list figure p.date { padding-top:20px; color:#888; font-size: .9rem;}
.gallery_list a:hover img {transform: scale(1.15);}  

@media screen and (min-width:50em) {
	.gallery_list a {width:calc(25% - 20px);}
}

.board_content {padding: 1.4rem 1.2rem 5rem;  border-top: 1px solid #e5e9ee; border-bottom: 1px solid #e5e9ee;font-size: 1rem; line-height: 2.4rem; letter-spacing: -0.04rem; color: #444;}


/*FAQ*/
.acc_list {border-top: 1px solid #222;}
.acc h3 {font-size: 1.2rem;  color: #444; padding: 20px 15px; margin: 0; cursor: pointer;
position: relative; display: flex; }
.acc h3 span {font-weight: bold; font-size: 1.4rem; color:#8692a0; margin-right:20px;}
.acc h3:after { content: ''; position: absolute; right: 20px; font-size: 40px;top: 50%;
transform: translateY(-50%); width:20px; height:14px; background: url('../../img/ico-arrow.png') center no-repeat;
transition: all .3s;}
.acc.active h3:after {content: ''; transform: rotate(180deg);}
.acc .content { background-color: #f6f7fb; display: none; border-top: 1px solid #e5e9ee;}
.acc .content span {font-weight: bold; font-size: 1.4rem; color:#08449A; margin-right:20px;}
.acc .content-inner {display: flex; padding: 20px; }
.acc .content * { margin-top: 0; line-height: 1.5; }
.acc { border-bottom: 1px solid #e5e9ee;}

.board_write {border-top:1px solid #222;}
.board_write .form-group {display: flex; flex-wrap: wrap; vertical-align: middle; align-items: center;  align-items: stretch;}
.board_write .form-group .tit {background-color: #f9f9f9; border-bottom:1px solid #e5e5e5; padding:10px; font-weight: 500; display: flex; align-items: center;}
.board_write .form-group .tit .point {color:#F47649}
.board_write .form-group .con {border-bottom: 1px solid #e5e5e5;  padding:10px;}
.board_write .form-group textarea {min-height: 300px;}
.board_write button i {font-size:13px; margin-right:10px;}


/* 지원사업 */
.project {background-color: #F7F8FB; padding:50px 0; margin-bottom:50px;}

.project-slide .list {padding:10px;}
.project-slide .list a {border:1px solid #ddd; background: #fff; display: block; border-radius: 10px; padding:20px 20px 30px 20px;}
.project-slide .list a:hover {border:1px solid #08449A; box-shadow: 0 4px 4px rgba(8, 68, 154, 0.1);}
.project-slide .list a li {display: flex; align-items: center; margin-bottom:10px;}


.project-slide .list a span.agency_tit {background: #D2DFF2; border:1px solid #D2DFF2; padding:5px; margin-right:10px;}
.project-slide .list a p.title {font-weight: 500; font-size: 1.33em; color:#222; width:100%; overflow: hidden;
	text-overflow: ellipsis; white-space: nowrap;}

.dots_custom { text-align: center; display: block; margin: 10px auto; padding: 0;}
.dots_custom li {list-style: none; cursor: pointer; display: inline-block; margin: 0 3px; padding: 0;}
.dots_custom li button { border: none; background: #d1d1d1; color: transparent; cursor: pointer; display: block;
	height: 10px; width: 10px; border-radius: 100%; padding: 0;}
.dots_custom li.slick-active button { background-color: #08449A;}

.project_search {background: #f7f8fb; border-radius: 10px; padding:30px; margin-bottom:20px;}
.project_search form li {float: left;}
.project_search form .search {margin:0;}
.project_search form .bd_group {border-radius: 5px; box-shadow: none; height:2.8rem; padding:0 15px;}
.project_search form .bt_group {border-radius: 5px; box-shadow: none; height:2.8rem; padding:0 5px;}
.project_search form .col-4 {padding:0 5px;}
.project_search form .col-6 {padding:0 5px;}

.project_list {border-top: 1px solid #5a6375;}
.project_list li { border-bottom: 1px solid #e5e9ee; }
.project_list li a {display: block; padding:20px 0;}
.project_list li a:hover { background-color: #f6f7fb;}
.project_list li .board_tit_txt {font-weight: 500; font-size: 1.33em; color:#222; width:100%; overflow: hidden;
	text-overflow: ellipsis; white-space: nowrap; margin:20px 0 10px;}
.project_list li .board_datail {color:#999; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

span.field {padding:5px; border:1px solid; margin-right:10px;}
span.field-1 {border-color: #08449A; color:#08449a;}
span.field-2 {border-color: #639C1B; color:#639C1B;}
span.field-3 {border-color: #F37F14; color:#F37F14;}
/*span.field-4 {border-color: #BE1824; color:#BE1824;}*/

.d-day {border:1px solid #ddd; color:#444;}


.project_view .row {border-top:1px solid #222; border-bottom:1px solid #e5e5e5;}
.project_view .group {display: flex; border-bottom:1px solid #e5e5e5;}
.project_view .group:last-child {border-bottom:0;}
.project_view .group span {background: #F7F8FB; padding:20px 10px; text-align: center; width:130px;}
.project_view .group p {width:calc(100% - 130px); padding:20px 10px;}
.project_view .con {padding:50px 0 100px;}
.project_view .con h4 {padding-bottom:15px; font-weight: 500;}
.project_view .con h5 {padding-bottom:15px; color:#08449A; font-weight: 500;}
.project_view .link {margin-top:10px;}
.project_view .link li {border:1px solid #ddd; margin-bottom:10px; padding:15px; border-radius: 10px; display: flex;}
.project_view .link li label {width:120px;}
.project_view .link li label i {font-size:13px;}
.project_view .link li p {width: calc(100% - 120px); }
.project_view .link li p a {word-break: break-all;}

@media screen and (max-width: 980px) {
	.project {padding:30px 0; margin-bottom:30px;}
	.project-slide .list {padding:5px;}
	.project_search {padding:20px;}
	.project_view .col-4 {width:50%;}
	.project_view .group span, .project_view .group p {padding:10px;}
	.project_view .con {padding:30px 0 60px 0;}
	.project_view .link li {display: block;}
}

@media screen and (max-width: 640px) {
	.project_search form .col-4 {width:50% !important}
	.project_view .col-4 {width:100%;}
	.project_view .col-6 {width:100%;}
	.project_view .col-8 {width:100%;}
}