@charset "utf-8";

#detail_con h4 {min-height:31px; padding-left:17px; margin-top:60px; font-size:22px; background:url('/main/img/contents/bl.gif') no-repeat left 5px;}
#detail_con h4:first-child {margin-top:0;}
.bl02 {position:relative; line-height:1.6em; font-weight:bold; font-size:18px;}
.bl02+.bl03 {margin-left:20px;}
.bl02+.bl03>li {margin-top:15px;}
.bl02+.bl04 {margin-left:20px;}
h4+.bl03 {margin-left:20px;}
h4+.bl03>li:first-child, h4+p.bl03 {margin-top:20px;}
.bl03>li, p.bl03 {position:relative; margin-top:10px; margin-left:5px; padding-left:12px; line-height:1.6em; font-size:16px;}
.bl03>li:before, p.bl03:before {display:block; content:""; position:absolute; left:0; top:11px; width:4px; height:5px; border-radius:50%; background:#4f5cb4;}
.bl04>li, p.bl04 {position:relative; margin-top:4px; margin-left:5px; padding-left:8px; line-height:1.6em; font-size:14px;}
.bl04>li:before, p.bl04:before {display:block; content:""; position:absolute; left:0; top:11px; width:3px; height:3px; background:#888;}
.bl05>li, p.bl05 {position:relative; padding-left:8px; margin-top:2px; line-height:1.6em; color:#666; font-size:13px;}
.bl05>li:before, p.bl05:before {display:block; content:""; position:absolute; left:0; top:11px; width:3px; height:1px; background:#999;}
.stbl {margin-left:10px; margin-top:4px !important; padding-left:13px !important; font-size:14px; color:#333; line-height:1.5em; background:url('/main/img/contents/stbl.gif') no-repeat left 6px;}
.stbl:before {display:none !important;}
.gourl { margin-right:3px; padding-right:15px; font-weight:600; color:#de3131 !important; background:url('/img/sub/ic_gourl.gif') right 4px no-repeat; text-decoration:underline !important; }
.gourl2 { margin-right:3px; padding-right:15px; font-weight:600; background:url('/img/sub/ic_gourl_gray.gif') right 4px no-repeat; text-decoration:underline !important; }
.sfont { font-size:14px; color:#5f5f5f; }

.nobl {background:none;}
.nobl:before {display:none !important;}

.para01 {margin-top:35px;}
.para02 {margin-top:20px; margin-left:20px;}

#detail_con .point {font-weight:bold; color:#c83f50; text-decoration:underline;}

#detail_con .c_red {color:#c83f50;}
#detail_con .c_blue {color:#0019b1;}

#detail_con ol.step {display:flex; justify-content: space-between; margin-top:20px; font-size:0; line-height:0; overflow:hidden;}
#detail_con ol.step>li {position:relative; vertical-align:top; text-align:center; margin-bottom:1%; font-size:15px; line-height:1.4em; border:1px solid #dbdbdb;}
#detail_con ol.step>li:first-child {margin-left:0 !important; border:2px solid #505bb4;}
#detail_con ol.step>li:last-child {border:2px solid #039591;}
#detail_con ol.step>li:first-child:nth-last-of-type(5), 
#detail_con ol.step>li:first-child:nth-last-of-type(5) ~ li {width:19.4%; margin-left:3%;}
#detail_con ol.step>li:first-child:nth-last-of-type(4), 
#detail_con ol.step>li:first-child:nth-last-of-type(4) ~ li {width:22.5%; margin-left:3%;}
#detail_con ol.step>li:first-child:nth-last-of-type(3), 
#detail_con ol.step>li:first-child:nth-last-of-type(3) ~ li {width:31%; margin-left:3%;}
#detail_con ol.step>li:before {display:block; content:""; position:absolute; left:-26px; top:48%; width:13px; height:13px; border-right:2px solid #9d9d9d; border-bottom:2px solid #9d9d9d; transform:rotate(-45deg);}

#detail_con ol.step.col3 {flex-wrap:wrap;}
#detail_con ol.step.col3>li {width:31%; margin-left:3%;}
#detail_con ol.step.col3>li:nth-child(3n+1) {margin-left:0;}

#detail_con ol.step>li p.num {padding:15px 0; font-weight:bold; color:#939393; background:#f6f6f6;}
#detail_con ol.step>li:first-child p.num {color:#666ca1; background:#e8eaf7;}
#detail_con ol.step>li:last-child p.num {color:#039591; background:#e8f7f5;}
#detail_con ol.step>li p.num span {display:inline-block; width:22px; height:22px; color:#fff; border-radius:50%; background:#8d8d8d;}
#detail_con ol.step>li:first-child p.num span {background:#444c8d;}
#detail_con ol.step>li:last-child p.num span {background:#039591;}
#detail_con ol.step>li p.tit {padding:15px 0; font-size:16px; color:#222;}
#detail_con ol.step>li p.txt {padding-bottom:15px; color:#888;}


table.data {position:relative; width:100%; margin-top:20px;}
table.data:before {display:block; content:""; position:absolute; left:0; top:0; width:100%; height:3px; background:linear-gradient(to right, #4b5fb3, #0d999d);}
table.data:after {display:block; content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#0c0c0c;}
table.data.fix {table-layout:fixed;}

table.data th {padding:13px 15px 15px; font-weight:bold; color:#111; font-size:17px; line-height:22px;}
table.data thead {border-bottom:1px solid #ddd;}
table.data th, table.data td {word-break:break-all;}
table.data thead th {border-top:1px solid #ddd; border-left:1px solid #ddd; background:#f7f7f9;}
table.data tbody th,table.data tfoot th, table.data td {text-align:center; padding:15px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd;}
table.data tr:first-child th:first-child {border-left:none;}
table.data tbody th {font-size:15px; background-color:#f9f9f9;}

table.data tfoot th, table.data tfoot td {text-align:center; padding:10px 20px; font-weight:bold; background-color:#f9f9f9;}

table.data td:last-child {border-right:0 !Important;}
table.data tbody tr th:first-child, table.data tfoot th:first-child {border-right:1px solid #ddd; border-left:0;}
table.data tbody tr td:first-child {border-left:none; border-right:1px solid #ddd;}
table.data .bdr_line {border-right:1px solid #ddd;}
table.data tbody tr.strLine {border-top:2px dashed #c8c8c8;}
table.data tbody tr.strLine:first-child {border-top:0;}
table.data tbody tr.strLine>td:first-child {font-weight:bold;}
table.data tbody tr.bgColor {background:#f0f0f0}

table.data td>.bl03>li:first-child, table.data td>p.bl03:first-child {margin-top:0;}
table.data.overcolor tr:hover, table.data tr.point {background:#fbfbea;}
table.data.manyData th, table.data.manyData td {padding-left:5px !important; padding-right:5px !important; letter-spacing:-1px;}
table.data .finance_group td {padding:10px 10px 10px 25px; border-bottom-style:dotted}
table.data .finance_blank {padding-left:10px}


.tbox {position:relative; padding:30px 45px; border-radius:0 20px 0 20px; background:#f6f6f6;}
.tbox>p.tit {font-size: 18px; font-weight: bold; color: #f53a3a; margin-bottom: 10px;}
.sbox {margin:25px 0; font-size:14px; line-height:1.5em; color:#666;}
.tbox>.bl03>li:first-child, .conBox>.bl03>li:first-child, .conBox2>.bl03>li:first-child {margin-top:0;}
.mark {min-height:22px; padding-left:25px; color:#555; background:url('/main/img/contents/mark.gif') no-repeat left 2px;}

.golink, .godown {display:inline-block; min-height:19px;}
.golink {padding-left:18px; margin-left:3px; margin-right:3px; background:url('/main/img/contents/golink.gif') left 7px no-repeat; text-decoration:underline !important;}
.godown {padding-left:20px; margin-left:3px; margin-right:3px; background:url('/main/img/contents/godown.gif') left 5px no-repeat; text-decoration:underline !important;}

.conbtnBox {text-align:center; margin-top:25px;}
.tbox .conbtnBox {margin-top:30px;}
.conbtn {position:relative; overflow:hidden; display:inline-block; text-align:center; padding:12px 30px 14px 65px; border-radius:5px 0 5px 0; border:1px solid #555; z-index:1;}
.conbtn:hover {color:#fff; border-color:#202551; background:linear-gradient(to right, #4d55ae, #383f88);}
.conbtn.down:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('/main/img/contents/conbtn_down.png') 28px 12px no-repeat; z-index:2;}
.conbtn.down:hover:before {background-image:url('/main/img/contents/conbtn_down_on.png');}
.conbtn.link {padding-left:60px;}
.conbtn.link:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('/main/img/contents/conbtn_link.png') 27px 15px no-repeat; z-index:2;}
.conbtn.link:hover:before {background-image:url('/main/img/contents/conbtn_link_on.png');}
.conbtn+.conbtn {margin-left:10px;}
.conbtn.print {padding-right:65px;}
.conbtn.print:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('/main/img/contents/conbtn_print.gif') right 30px top 13px no-repeat; z-index:2;}

.consbtn {display:inline-block; margin-top:5px; padding:3px 15px 5px 15px; color:#fff; font-size:13px; line-height:22px; border-radius:10px 0 10px 0; background-color:#4a60b2; background-repeat:no-repeat; transition:.3s;}
.consbtn.link {padding-left:33px; background-image:url('/main/img/contents/golink_w.gif'); background-position:15px 9px;}
.consbtn.down {padding-left:35px; background-image:url('/main/img/contents/godown_w.gif'); background-position:15px 9px;}
.consbtn2 {display:inline-block; margin-top:5px; margin-bottom:5px; padding:3px 13px 5px; font-size:13px; border-radius:30px; border:1px solid #aaa;}
.consbtn2.view {padding-right:30px; background:url('/main/img/contents/ic_view.gif') no-repeat right 10px center;}
.consbtn:first-child {margin-top:0;}

#detail_con .photo{position:relative; margin-top:20px; padding:30px; border:3px solid #eee; text-align:center; background:#fff; }
#detail_con .photo img {max-width:100%;}

/*design_con*/
.greeting .intro {position:relative; border:8px solid #dfe5e9; background:url('/main/img/contents/greeting_introbg.gif') repeat;}
.greeting .intro:before {right:5px; bottom:0; width:289px; height:219px; background:url('/main/img/contents/greeting_introbg2.png') no-repeat;}
.greeting .intro:after {left:20px; top:100%; width:97px; height:62px; margin-top:8px; background:url('/main/img/contents/greeting_bg.gif') no-repeat; z-index:-1;}
.greeting .intro .photo {display:inline-block; margin-left:-8px; margin-top:-8px; margin-bottom:-8px; border:8px solid #4f5bb4;}
.greeting .intro .photo img {vertical-align:top;}
.greeting .intro>p {position:absolute; left:270px;}
.greeting .intro>p.tit {top:65px; width:100%; max-width:386px; height:75px; background:url('/main/img/contents/greeting_intro.gif') no-repeat; background-size:100%;}
.greeting .intro>p.txt {top:170px; font-size:18px; line-height:1.5em;}
.greeting .intro>p.txt strong {position:relative; color:#363d86; z-index:1;}
.greeting .intro>p.txt strong:after {display:block; content:""; position:absolute; left:0; bottom:-3px; width:100%; height:55%; background:rgba(202,214,234,.77); z-index:-1;}
.greeting>p {margin-top:35px; font-size:16px; line-height:1.5em; color:#6f6f6f;}
.greeting>p strong {color:#323232;}
.greeting .list {margin-top:30px;}
.greeting .list p {margin-top:10px; color:#111;}
.greeting .list p span {position:relative;}
.greeting .list p span:after {display:block; content:""; position:absolute; left:0; bottom:-3px; width:100%; height:55%; z-index:-1;}
.greeting .list p span.num1:after {background:#cec3e0;}
.greeting .list p span.num2:after {background:#f8d2d8;}
.greeting .list p span.num3:after {background:#f5e9d5;}
.greeting .sign img {margin-left:5px;}

/*시민게시대 신청*/
.citizen_placard {text-align:center; border-radius:5px; border:1px solid #dedede; background:#f7f7f7;}
.citizen_placard .tit {padding:25px 10px; font-size:25px; border-bottom:1px solid #dedede;}
.citizen_placard .tit span {margin-left:20px;}
.citizen_placard .con {padding:20px;}
.citizen_placard .con>div {position:relative;}
.citizen_placard .con>div:before {content:""; position:absolute; left:50%; top:-20px; bottom:-20px; width:1px; background:#dedede;}
.citizen_placard .con>div:after {display:block; content:""; clear:both;}
.citizen_placard .con ul {position:relative; float:left; width:47.5%; padding:.5%; background:#ccc;}
.citizen_placard .con ul:nth-of-type(2) {float:right;}
.citizen_placard .con ul:before {content:""; position:absolute; top:50%; width:7px; height:7px; border-radius:50%; background:#474747;}
.citizen_placard .con ul:nth-of-type(1):before {right:-14px;}
.citizen_placard .con ul:nth-of-type(2):before {left:-14px;}
.citizen_placard .con ul li {position:relative; float:left; width:120px; height:145px; margin:1.4%; }
.citizen_placard .con ul li:before {content:""; position:absolute; left:0; top:0; width:120px; height:144px; background:url('/placard/img/contents/citizen_placard_bg1.png') no-repeat; z-index:5;}
.citizen_placard .con ul li.inuse:before {background-image:url('/placard/img/contents/citizen_placard_bg2.png');}
.citizen_placard .con ul li.inuse:after {content:""; position:absolute; left:2.5%; top:2%; width:95%; height:98%; border-radius:5px; background:#474747;}
.citizen_placard .con ul li p, .citizen_placard .con ul li .tag {z-index:10;}
.citizen_placard .con ul li p.name {position:relative; top:50%; transform:translateY(-75%);}
.citizen_placard .con ul li.inuse p.name {color:#fff;}
.citizen_placard .con ul li.waiting p.name {color:#b2b2b2; font-size:44px;}
.citizen_placard .con ul li .tag {position:absolute; bottom:0; left:0; right:0; padding:5px 5px 7px; font-size:14px; border-radius:0 0 5px 5px;}
.citizen_placard .con ul li.inuse .tag {color:#fff; background:#283447;}
.citizen_placard .con ul li.waiting .tag {display:block; background:#fff;}
.dataScroll {display:none;}

.advertisement-ex-pl {background:#f5f5f5; padding:16px 20px; text-align: center; border:3px solid #eee;}
.advertisement-ex-txt {color:red; font-size:13px; font-weight: bold;}
.advertisement-ex-po {display:block; color:#0070c0; font-size:32px; font-weight: bold;}
.advertisement-ex-po.im {color:red;}

/*tablet~mobile*/
@media screen and (max-width:800px) {
	#detail_con .point:after {display:none;}

	#detail_con ol.step {flex-direction: column;}
	#detail_con ol.step>li {/* float:none; */ width:100% !important; margin:1% 0 33px !important;}

	#detail_con ol.step>li:before {left:50% !important; top:auto; bottom:-20px; margin-left:-10px; transform:rotate(45deg);}
	#detail_con ol.step>li:last-child:before {display:none;}

	.greeting .intro>p.tit {width:50%;}
	.greeting .intro>p.txt br {display:none;}

	.citizen_placard .con {width:100%; overflow-x:scroll;}
	.citizen_placard .con>div {width:850px;}
	.dataScroll {display:block; position:Absolute; left:50%; top:50%; text-align:center; padding-top:70px; width:110px; height:110px; margin-left:-55px; background:rgba(0,0,0,.8) url(/placard/img/contents/ic_scroll.png) no-repeat center 20px/35%; border-radius:100px; font-size:14px; color:#fff; z-index:20;}
}


/*mobile*/
@media screen and (max-width:640px) {
	.tableScroll {width:100%; overflow-x:scroll;}
	.tableScroll>table {min-width:800px;}
	table.data th, table.data td {padding:10px; font-size:14px !important;}

	.greeting .intro .photo img {width:170px;}
	.greeting .intro>p {left:210px;}
	.greeting .intro>p.tit {top:40px;}
	.greeting .intro>p.txt {top:115px;}
}

/*mobile_min*/
@media screen and (max-width:480px) {	
	.conbtn {width:100%; margin-left:0 !Important;}

	.greeting .intro {text-align:center;}
	.greeting .intro .photo {margin:20px auto; border:0;}
	.greeting .intro>p {position:static;}
	.greeting .intro>p.tit {width:80%;}
	.greeting .intro>p.txt {padding:5px 15px 30px;}
}