@charset "utf-8";

#container{position:relative}
#container:before{display:block; content:''; position:absolute; left:calc(0px - (100vw - min(100vw, 1440px))/2 - 11px); right:0px; top:0px; height:18rem; width:100vw; background:url(/open_content/council/img/sub/sub_bg.png) no-repeat center center, var(--grabg); transform:rotate(180deg); z-index:-1}
#container:after{display:block; content:''; clear:both;}
#lmenu{float:left; width:21.4286%; margin-top:2.2rem;}
#lmenu>p{display:flex; justify-content:center; align-items:center; height:15.8rem; background:var(--gra); border-radius:10px 10px 0px 0px; font-size:3.2rem; color:#fff; font-weight:700;}
#lmenu>ul{border:1px solid #d7d7d7; border-radius:0px 0px 10px 10px; overflow:hidden; }
#lmenu>ul>li+li{border-top:1px solid #d7d7d7;}
#lmenu>ul>li>a{display:block; position:relative; padding:2.1rem 3rem 2rem; font-size:1.8rem; font-weight:500; letter-spacing:-.08rem; }
#lmenu>ul>li>a:before,
#lmenu>ul>li>a:after{display:block; content:''; position:absolute; right:3rem; top:50%; margin-top:-1.2rem; border:2px solid #C0C0C0}
#lmenu>ul>li>a:before{width:2.4rem; height:2.4rem; border-radius:50px; }
#lmenu>ul>li>a:after{width:.8rem; height:.8rem; margin-right:.9rem; margin-top:-.4rem; border-width:2px 2px 0px 0px; transform:rotate(45deg)}




#lmenu>ul>li> ul a[target=_blank]{padding-right: 18px; background: url(/open_content/council/img/inc/ic_newwin.png) no-repeat right 4px  / 14px}
#lmenu>ul>li>ul{display:none; padding:0rem 3rem 2rem; }
#lmenu>ul>li>ul li+li{margin-top:1rem;}
#lmenu>ul>li>ul li{position:relative; padding-left:1.3rem;}
#lmenu>ul>li>ul li:before{display:block; content:''; position:absolute; left:0px; top:.8rem; width:5px; height:5px; background:var(--color); opacity:.8; border-radius:10px}
#lmenu>ul li.on>a{color:var(--color); font-weight:600}
#lmenu>ul>li.select,
#lmenu>ul>li.on{background:#F7FCF8;}
#lmenu>ul>li.on>a:before{border-color:var(--color); background:var(--color)}
#lmenu>ul>li.on>a:after{border-color:#fff}
#lmenu>ul>li.on>ul{display:block;}

#data_control {display:none;}
#data_control {margin:8.5rem 0px 40px; border-top:2px solid #484848; border-bottom:2px solid #484848;}
#data_control .control .tit {font-size:1.6rem; font-weight:500}
#data_control .control {}
#data_control .control>article {position:relative; padding:15px 20px; overflow:hidden;}
#data_control .control p.tit  {font-weight:bold; color:#4a5a67;}
#data_control .control ul.con {overflow:hidden;}
#data_control .control ul.con li {display:inline-block;}
#data_control .control .manager {background:#f5f5f5;}
#data_control .control .manager ul.con li {position:relative; padding-left:12px; margin-right:25px}
#data_control .control .manager ul.con li:before {content:""; position:absolute; left:0; top:11px; width:5px; height:5px; border-radius:50%; background:#484848;}
#data_control .control .manager ul.con li span.q {}
#data_control .control .satisfy {padding:35px 20px;}
#data_control .control .satisfy ul.con li {margin-right:15px;}
#data_control .control .satisfy ul.con li input {vertical-align:middle; margin-top:-2px}
#data_control .control .satisfy ul.con li label {display:inline-block; min-height:26px; line-height:26px; padding-left:30px;}
#data_control .control .satisfy ul.con li.satisfy01 label {background:url(/open_content/share/images/inc/ic_satisfy01.gif) no-repeat left center;}
#data_control .control .satisfy ul.con li.satisfy02 label {background:url(/open_content/share/images/inc/ic_satisfy02.gif) no-repeat left center;}
#data_control .control .satisfy ul.con li.satisfy03 label {background:url(/open_content/share/images/inc/ic_satisfy03.gif) no-repeat left center;}
#data_control .control .satisfy ul.con li.satisfy04 label {background:url(/open_content/share/images/inc/ic_satisfy04.gif) no-repeat left center;}
#data_control .control .satisfy ul.con li.satisfy05 label {background:url(/open_content/share/images/inc/ic_satisfy05.gif) no-repeat left center;}
#data_control .control .satisfy p.data_btn {position:absolute; right:20px; top:50%; transform:translateY(-50%);}
#data_control .control .satisfy p.data_btn .data_btnlink {display:inline-block; vertical-align:top; text-align:center; width:100px; height:4rem; line-height:3.9rem; color:#fff; border:0; border-radius:3px;}
#data_control .control .satisfy p.data_btn .data_btnlink-blue {background:#324bc6;}
#data_control .control .satisfy p.data_btn .data_btnlink-gray {background:#484848;}
#data_control .info {margin-top:5px; padding:30px 20px; border-top:1px solid #484848;}
#data_control .info .qrcode {position:relative; overflow:hidden;}
#data_control .info .qrcode li img {vertical-align:middle;}
#data_control .info .qrcode li.qr {float:left;}
#data_control .info .qrcode li.qr img {width:100%; max-width:100px;}
#data_control .info .qrcode li.txt {float:left; margin-left:30px; margin-top:5px;}
#data_control .info .qrcode li.open {position:absolute; right:0; top:50%; transform:translateY(-50%);}
#data_control .control .reply {border-top:1px dotted #ccc;}
#data_control .control .reply p.tit input[type=button] {padding:2px 7px; cursor:pointer; vertical-align:middle;}
#data_control .control .reply div.con {padding-right:72px;}
#data_control .control .reply div.con textarea {padding:5px 1%; width:98%; height:50px; border:1px solid #ccc;}
#data_control .control .reply p.reply_btn {position:absolute; bottom:10px; right:20px;}
#data_control .control .reply p.reply_btn input {height:62px; width:62px; font-weight:bold; cursor:pointer ;}

#contents{float:right; width:73.14286%; font-family:'Spoqa';}
#contents h3{font-size:3.2rem; font-weight:700; font-family:'SCDream', 'Malgun Gothic', '맑은고딕', sans-serif;}
#con_tit{display:flex; flex-direction:column; justify-content:center; gap:1rem; position:relative; height:18rem}
#location *{display:unset; box-shadow:unset; overflow:unset}
#location>ol>li{display:inline-block; vertical-align:middle; color:#737373; font-size:1.4rem}
#location>ol>li:first-child{position:relative; top:-1px; width:16px; height:16px; font-size:0px; background:url(/open_content/council/img/sub/ic_home.png) no-repeat center / cover;}
#location>ol>li+li{position:relative; padding-left:1.5rem;}
#location>ol>li+li:before{content:''; position:absolute; left:.4rem; top:.8rem; width:.45rem; height:.45rem; border:1px solid #999; border-width:1px 1px 0px 0px; transform:rotate(45deg)}
#contentShare{display:flex; position:absolute; right:0px; top:50%; margin-top:-1.8rem; font-size:0px; }
#contentShare>li{position: relative; margin-left:.4rem;}
#contentShare>li a{display:block; font-size:0px; width:3.6rem; height:3.6rem; background:#fff url(/open_content/council/img/sub/ic_shareSns.png) no-repeat left top / 200%; border-radius:1rem; border:1px solid #C3E0D8; overflow:hidden; text-indent:-5000px;}
#contentShare>li:last-child>a{background-position-x:right}
#contentShare div{display:none;}
#contentShare ul{display:flex; gap:2px; --bgy:-3.4rem; position:absolute; right:calc(100% + 4px); top:0px;}
#contentShare ul>li>a{background-color:#333; border:1px solid rgba(0,0,0,.2)}
#contentShare ul>li.sns00>a{background-color:#666; background-position-y:var(--bgy)}
#contentShare ul>li.sns01>a{background-color:#4868AC; background-position-y:calc(var(--bgy) * 2)}
#contentShare ul>li.sns02>a{background-color:#1DA1F3; background-position-y:calc(var(--bgy) * 3)}
#contentShare ul>li.sns03>a{background-color:#6859F7; background-position-y:calc(var(--bgy) * 4)}
#contentShare ul>li.sns03_2>a{background-color:#644a3e; background-position-y:calc(var(--bgy) * 5)}
#contentShare ul>li.sns04>a{background-color:#59C843; background-position-y:calc(var(--bgy) * 6)}
#contentShare .sns_close{position:absolute; left:0px; top:0px; background:#333; border-color:#333}
#contentShare .sns_close:after,
#contentShare .sns_close:before{display: block; content:''; position:absolute; top:50%; left:21%; width:60%; height:1px; background:#fff; transform:rotate(45deg)}
#contentShare .sns_close:before{transform:rotate(-45deg)}
#tab{padding-top:6rem;}
#tab ul{ display:flex; gap:.8rem .6%; flex-wrap:wrap}
#tab ul>li{flex:0 0 24.5%}
#tab ul>li a{display:block; content:''; text-align:center; padding:1rem .5rem; background:#fbfbfb; border:1px solid #ddd; border-radius:5px}
#tab ul>li.on a{background:var(--color); border-color:currentColor; color:#fff}
.stab{margin-top: 1rem; padding:max(3%, 1rem) max(4%, .5rem); background: #f5f5f5; border-radius:10px}
.stab ul{display: flex; flex-wrap: wrap;}
.stab ul li{padding: 3px 2rem;}
.stab ul li.on a{color:var(--color)}
#detail_con {margin:6rem 0 9rem;}

h4, .bl01 {position: relative; margin-top: 6rem; padding-left: 3rem; font-size: 2.5rem; font-weight: 700;}
h4::before, h4::after {content: ''; position: absolute; width: 1.4rem; height: 2.5rem; transform: rotate(30deg); border-radius: 5rem;}
h4::before {left: 0; top: 0;  background: rgba(253, 210, 59, 80%)}
h4::after {left: 0.2rem; top: 1.35rem; background: rgba(20	, 144, 143, 80%)}

.para01 {padding: 3rem 0 0 1.5rem;}
.para02 {padding: 1.2rem 0 0 2.8rem;}

.bl02 {position: relative; margin-top: 4rem; margin-bottom: 0.8rem; padding-left: 1.8rem; font-size: 1.8rem; font-weight: 700; color: #26AA50;}
.bl02::before {content:''; position:absolute; left:0; top:0.5rem; width:0.6rem; height:1.8rem; background: #26AA50; border-radius: 0.2rem;}
/* .bl03 {position: relative; margin-left: 1.4rem;} */
ul.bl03 {margin-left: 1.4rem;}
.bl03>li, p.bl03 {position: relative; margin-top: 2.4rem; padding-left: 2.3rem; font-size: 1.6rem;}
.bl03>li::before, p.bl03::before {content: ''; position: absolute; left: 0; top: 0.6rem; width: 1.5rem; height: 1.5rem; border: 5px solid var(--point03); border-radius: 50%;}
.bl03>li>.bl04 {margin-left: 0;}
.bl04 {position: relative;  margin-top: 1.2rem; margin-left: 1.8rem;}
p.bl04, .bl04>li {position: relative; margin-bottom: 0.8rem; padding-left: 1.3rem;}
p.bl04::before, .bl04>li::before {content: ''; position: absolute; left: 0; top: 1rem; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--point03);}
.bl04>li:last-child {margin-bottom: 0;}
.bl04 {margin-left: 1.2rem;}
.bl04>li>.bl04 {margin-bottom:1.2rem;}
.bl05 {margin-top: 0.5rem;}
.bl05>li, p.bl05 {position: relative; padding-left:1.2rem; margin: 0.1rem 0; color: #626262; font-size:1.4rem;}
.bl05>li::before, p.bl05::before {content: ''; position: absolute; left: 0; top: 1rem; width: 0.6rem; height: 0.2rem; border-radius: 0.2rem; background:#626262;}
.nobl{padding-left: 0px !important}
.nobl:before{display: none;}

h4+.bl04 {margin-top: 1.6rem; margin-left: 3rem;}
.bl02 + .bl04 {margin-top: 1.5rem; margin-left: 1.5rem;}
.para01>.bl02 {margin-top: 0;}
.para01:has(.tbox02)>.bl02 {margin-top: 3.5rem;}

.tbox01 {position: relative; padding: 4rem; border:1px dashed var(--point03); border-radius: 1rem; overflow: hidden;}
.tbox01::before {content: ''; display: block; position: absolute; width: 17rem; height: 17rem; right: -1.5rem; bottom:-5rem; background: url(/open_content/council/img/sub/tbox_bg.png) no-repeat;}
.tbox02 {padding: 3rem; background: #FBFDFA; border: 1px solid #B3E1C0;}
.tbox02>ul.bl04 {margin-top: 0; margin-left: 0;}

table.data{width: 100%; border-spacing: 0; border-collapse: separate; border: 1px solid #1DA473; border-radius: 1rem; overflow: hidden;}
.bl04 table.data{margin-top: 1rem;}
table.data thead th{text-align:center; padding: 1.2rem 2rem; color: #fff; font-size: 1.6rem; font-weight: 700; border-left: 1px solid #168F63; word-break:keep-all; background:#1DA473;}
/* table.data thead th:nth-child(1){border-radius: 1rem 0 0 0;}
table.data thead th:nth-last-child(1){border-radius: 0 1rem 0 0; border-right-width: 0;} */
table.data thead th:nth-child(1){border-left-width: 0;}
table.data tbody>tr>th,
table.data tbody>tr>td{text-align: center; padding: 1.5rem 2rem; border: 1px solid #BAD0D1; border-top-width: 0; border-right-width: 0; word-break:keep-all;}
table.data tbody>tr>th{border-left: 0;}
table.data tbody>tr>th, table.data tbody>tr>td.bg_g {background: #eee;}
/* table.data tbody>tr>th:nth-child(1), table.data tbody>tr>td:nth-child(1) {border-left: 1px solid #1DA473;}
table.data tbody>tr>th:nth-last-child(1), table.data tbody>tr>td:nth-last-child(1) {border-right: 1px solid #1DA473;}
table.data tbody>tr:nth-last-child(1)>td, table.data tbody>tr:nth-last-child(1)>th {border-bottom: 1px solid #1DA473;}
table.data tbody>tr:nth-last-child(1)>td:nth-child(1), table.data tbody>tr:nth-last-child(1)>th:nth-child(1) {border-radius: 0 0 0 1rem;}
table.data tbody>tr:nth-last-child(1)>td:nth-last-child(1), table.data tbody>tr:nth-last-child(1)>th:nth-last-child(1) {border-radius: 0 0 1rem 0;} */
/* table.data tbody>tr>td:nth-last-child(1){border-right: 0;} */
table.data tbody>tr:nth-last-child(1)>th,
table.data tbody>tr:nth-last-child(1)>td{border-bottom: 0;}
table.data .bdb0{border-bottom: 0;}
table .bl04,
table .bl05{text-align: left; margin: 0;}
table.data.fix {table-layout:fixed;}
table.data th.bdl {border-left: 1px solid #168F63 !important;}
table.data th.bdl2 {border-left: 1px solid #BAD0D1 !important;}
table.data th.bdb {border-bottom: 1px solid #168F63 !important;}
.tb_point {color: #ffff6a !important;}
table.data thead th.bdl {border-left:1px;}
table.data thead th.bdb {border-bottom:1px;}

/* https://www.seo.incheon.kr/open_content/council/introduce/authority.jsp */
.step {display: flex; justify-content: space-between; text-align: center; gap: 3rem; margin: 0.8rem 0;}
.step>li { position: relative; flex: 1 1 auto; display: flex; flex-direction: column; text-align: center; width: 100%;}
.step>li::before {content: ''; position: absolute; right: -2.3rem; top: calc( 50% - 1.86rem ); bottom: 0; margin: auto; width: 1rem; height: 1.86rem; background: url(/open_content/council/img/sub/step_arr.svg) no-repeat center / 100%;}
.step>li:nth-last-child(1):before {display: none;}
.step>li .num {padding: 1.2rem 2rem; color: #fff; font-weight: 700; border-radius: 0.5rem 2.5rem 0rem 0rem; background:#27A273;}
.step>li:nth-of-type(1) .num,
.step>li:nth-last-of-type(1) .num {background: var(--color);}
.step>li .con {display: flex; justify-content: center; align-items: center; height: 100%; padding: 2rem 3rem; border: 1px solid #ddd ; border-top-width: 0; border-radius: 0rem 0rem 0.5rem 0.5rem;}
.step.group_step>li .con {flex-direction: column; justify-content: space-between;}
.step.group_step>li .con span.step_sfont {margin-top:1rem; padding:0.5rem 1.5rem; color:#6f6f6f; font-size:1.3rem; border-radius:50rem; background:#efefef;}
.step.col3 {flex-wrap: wrap;}
.step.col3 li {width: 30%;}
.step.col3 li:nth-child(3)::before { width: 0rem; height: 0rem;}
.step02{margin-top: 1rem;}
.step02>li{display: flex; gap:5px; position: relative; margin-bottom: 2rem;}
.step02>li:AFter{display:block; content: ''; position: absolute; width: .8rem; height: .8rem; left: 9.5%; bottom: -1.5rem; ;border:0px solid #333; border-width:0px 2px 2px 0px; transform: rotate(45deg) translateY(-50%);}
.step02>li .q{text-align: center; padding: 1.6rem 1rem; min-width: 20%; color: #fff; font-weight: 700; border-radius: .5rem; background:var(--color)}
.step02>li:nth-child(2n) .q{background: #27A273;}
.step02>li .a{flex-grow:1; padding: 1.6rem max(2vw, .5rem); ;/* border:1px solid #27A273; */ border:2px solid #eee; border-radius: .5rem;}
.step02>li:last-child:AFter{display:none}
.instep{display: flex; flex-wrap: wrap;}
.instep>li{position: relative; padding: 0px 3rem; margin-right: 2rem; border:1px solid #666; border-radius: 5rem; background: #fff;}
.instep>li:AFter{display:block; content: ''; position: absolute; right: -1rem; width: .8rem; height: .8rem; top: 50%; border:1px solid #333; border-width:1px 1px 0px 0px; transform: rotate(45deg) translateY(-50%);}
.instep>li:last-child:AFter{display:none}

.conbtnBox {text-align: center; margin: 4rem auto 0 auto;}
.conbtn, .sbtn {display: inline-block; padding: 1.5rem 7rem 1.5rem 4rem; color: #fff; font-size: 1.6rem; line-height: 2.4rem; font-weight: 500; border-radius: 50rem; background-repeat: no-repeat; background-position: right 3.6rem top 1.5rem; transition: .2s;}
.conbtn.link_btn {background-image: url(../img/contents/link-arr.svg); background-color: #195461;}
.conbtn.down_btn {background-image: url(../img/contents/down-arr.svg); background-color: #299d41;}
.conbtn.link_btn:hover {background-position: right 2.8rem top 1.5rem; }
.conbtn.down_btn:hover {background-position: right 3.6rem top 2rem; }
.sbtn {position: relative; margin-left:0.4rem; padding:0.4rem 2.8rem 0.4rem 2rem; color:#fff; font-size: 1.4rem; background: var(--point02);}
.sbtn:after {content:''; display:inline-block; position: relative; right:-0.6rem; top:0.25rem; width:1.4rem; height:1.4rem; background:url(/open_content/council/img/sub/down-btn.svg) no-repeat center;}
.sbtn.link_btn:after {top:.15rem; background:url(../img/contents/link-arr.svg) no-repeat center / 18px}

.tbox {position: relative; padding: 4rem; line-height: 160%; margin-bottom: 2.5rem; border: 1px dashed var(--point03); border-radius: 1rem;  background: url(../img/contents/tbox.svg) no-repeat right -2rem bottom -5rem / 17rem;}

/***************************************************************************************************************************/


@media all and (min-width:801px){
	#data_control .control .tit {position:absolute; top:50%; left:20px; transform:translateY(-50%);}
	#data_control .control ul.con,
	#data_control .control div.con {padding-left:130px;}
	#data_control .control .satisfy {padding-right:100px;}
	#data_control .control .reply p.tit span.view_reply {display:block; margin-top:5px;}
}

@media screen and (max-width:800px){
	#container:before{left:-5.5%; height:15rem; background-size:200%}
	#location{display:none;}
	#lmenu{display:none;}
	#contents{float:none; width:100%}
	#con_tit{height:15rem}
	#contentShare ul{ --bgy:-3.35rem; flex-direction:column}
	#data_control .control ul.con li {margin-top:5px; white-space:nowrap;}
	#data_control .control .satisfy {padding:20px;}
	#data_control .control .satisfy p.data_btn {position:static; margin-top:10px; transform:none;}
	#data_control .control .satisfy p.data_btn .data_btnlink {width:49%;}
	#data_control .control .satisfy ul.con li label {background-size:20px !important; padding-left:25px}
	#data_control .control .manager ul.con li:before {top:7px;}
	#data_control .info {display:none;}

	.tableBox{position:relative; display:block; overflow-x:auto;}
	.tableBox table{min-width:80rem; -webkit-text-size-adjust: 100%;}
	.dataScroll{position:absolute; left:calc(50% - 6rem); top:5rem; display:block; text-align:center; width: 12rem; height:12rem; padding-top: 8rem; font-size:1.4rem; color:#fff; border-radius: 50%; background:rgba(0,0,0,.7) url(/share/images/program/ic_scroll.png) no-repeat center 2.3rem / 4.3rem; z-index: 9;}

}
