@charset "euc-kr";

/*공용*/
#content.main {width:100% !important;}
.main * {box-sizing:border-box;}
.main>* {position:relative; clear:both; overflow:hidden; width:1200px; margin:0 auto;}
.main h2, .main h3 {font-family:NanumSquare;}


/* sect1 - 알림마당/주요소식배너/시설물종류 */
.main .sect1 {margin-top:53px; width:100%; background:url(../images_ebi/main/bg.jpg) no-repeat top center; background-size:cover;}
.main .sect1>* {width:1200px; margin:0 auto;}

.main .sect1 .quick {overflow:hidden;}
.main .sect1 .quick .slogan {padding:80px 0 40px; text-align:center; font-family:NanumSquare;  font-weight:500; line-height:1.4;}
.main .sect1 .quick .slogan p:first-child {font-size:24px;}
.main .sect1 .quick .slogan p+p {font-size:40px; font-weight:400; color:#264593; letter-spacing:-2px;}
.main .sect1 .quick .slogan p+p>span {font-weight:600;}
.main .sect1 .quick .slogan p+p span.c1 {color:#007300;}
.main .sect1 .quick .slogan p+p span.c2 {color:#264593;}
.main .sect1 .quick .slogan p+p span.c3 {color:#0085cf;}
.main .sect1 .quick ul {overflow:hidden; margin-bottom:65px;}
.main .sect1 .quick li {width:14.285%; float:left; text-align:center;}
.main .sect1 .quick li a {
	position:relative; display:inline-block; width:150px; height:150px; margin:0 auto;
	font-size:15px; letter-spacing:-.5px; font-weight:600;
	background:#fff; border-radius:50%;
	transition:all .2s linear !important;
	-webkit-transition:all .2s linear !important;
	-moz-transition:all .2s linear !important;
}
.main .sect1 .quick li a:before {
	clear:both; content:""; display:inline-block; width:70px; height:65px; margin-top:20px;
	background:url(../images_ebi/main/quick.png) no-repeat;
}
.main .sect1 .quick li a:hover {color:#fff; background-color:#0085cf;}
.main .sect1 .quick li a:hover:before {background-image:url(../images_ebi/main/quick_on.png);}

.main .sect1 .quick li a span {display:block;}
.main .sect1 .quick li:nth-child(1) a:before {background-position:0 0;}
.main .sect1 .quick li:nth-child(2) a:before {background-position:-70px 0;}
.main .sect1 .quick li:nth-child(3) a:before {background-position:-140px 0;}
.main .sect1 .quick li:nth-child(4) a:before {background-position:-210px 0;}
.main .sect1 .quick li:nth-child(5) a:before {background-position:-280px 0;}
.main .sect1 .quick li:nth-child(6) a:before {background-position:-350px 0;}
.main .sect1 .quick li:nth-child(7) a:before {background-position:-420px 0;}
.main .sect1 .quick li a span span {font-size:13px; color:#0085cf;}
.main .sect1 .quick li a:hover span span {color:#fff;}

.main .sect1 .wrap {margin-bottom:80px;}
.main .sect1 .wrap>ul>li {float:left; width:400px; height:460px; padding:0 10px;}
.main .sect1 .wrap>ul>li>div {width:380px; height:460px; background:#fff; border-radius:7px; overflow:hidden;}

/* sect1 - 알림마당 */
.main .sect1 .news {position:relative; padding:25px 40px 0;}
.main .sect1 .news h2 {
	display:block; position:relative; 
	font-weight:500; font-size:18px; color:#000; letter-spacing:-1px; line-height:1;	
}
.main .sect1 .news>ul>li {height:460px; width:25%; float:left;}
.main .sect1 .news>ul>li h2 {}
.main .sect1 .news>ul>li h2 a {
	display:inline-block; padding-bottom:5px; padding:0 0 5px; border-bottom:2px solid #fff; background:#fff;
	font-size:18px; font-weight:500; cursor:pointer;
}
.main .sect1 .news>ul>li.on h2 a {color:#0085cf; border-bottom:2px solid #0085cf;}
.main .sect1 .news>ul>li.on .list {display:block;}
.main .sect1 .news .list {background:#fff;}
.main .sect1 .news .list li {clear:both; overflow:hidden; padding:13px 40px; border-bottom:1px solid #e5e5e5;}
.main .sect1 .news .list li:nth-child(5) {border-bottom:0;}
.main .sect1 .news .list {position:absolute; top:65px; left:0; width:100%; display:none;}
.main .sect1 .news .list li a {width:100%; display:block; font-size:13px; color:#666;}
.main .sect1 .news .list li a p {width:300px; font-size:16px;overflow:hidden;	text-overflow:ellipsis; white-space:nowrap;}
.main .sect1 .news .list li a:hover {color:#000;}
.main .sect1 .news .list li a:hover p {color:#0085cf;}
.main .sect1 .news .more {position:absolute; display:none; bottom:20px; right:40px; font-size:13px; font-weight:600; color:#0085cf;}
.main .sect1 .news .more span {position:absolute; left:-9999px;}
.main .sect1 .news>ul>li.on .more {display:block;}

/* 알림마당 분류 색상 */
.main .sect1 .news [class*="c_"] {font-weight:bold; padding-right:10px;}
.main .sect1 .news .c_ddk {color:#0066cc;} /* 동대구 */
.main .sect1 .news .c_gs {color:#c0172c;} /* 감사 */
.main .sect1 .news .c_jh {color:#A24E27;} /* 지하 */
.main .sect1 .news .c_sh {color:#9f2a76;} /* 신천 */
.main .sect1 .news .c_hg {color:#777766;} /* 환경 */
.main .sect1 .news .c_gj {color:#d2c317;} /* 구조물 */
.main .sect1 .news .c_ed {color:#566D9F;} /* 이동 */
.main .sect1 .news .c_mb {color:#374482;} /* 명복 */
.main .sect1 .news .c_dr {color:#0143d8;} /* 두류 */
.main .sect1 .news .c_sj {color:##0074B1;} /* 서재 */
.main .sect1 .news .c_jc {color:#003366;} /* 주차 */
.main .sect1 .news .c_ns {color:#b6a204;} /* 노사 */
.main .sect1 .news .c_bs {color:#B35037;} /* 빙상 */
.main .sect1 .news .c_ds {color:#46822B;} /* 도심 */
.main .sect1 .news .c_sk {color:#2b4383;} /* 사격 */
.main .sect1 .news .c_he{color:#2b4383;} /* 힐링 */
.main .sect1 .news .c_hb {color:#ff4500;} /* 홍보 */
.main .sect1 .news .c_grd {color:#777766;} /* 가로등 */
.main .sect1 .news .c_hk {color:#3c6cbb;} /* 회계 */
.main .sect1 .news .c_sg {color:#3c6cbb;} /* 성과 */
.main .sect1 .news .c_ct {color:#ca3734;} /* 시티 */
.main .sect1 .news .c_bm {color:#B8592C;} /* 시티 */
.main .sect1 .news .c_ss {color:#d14c18;} /* 신서 */


/* sect1 - 시설안내 */
.main .sect1 .kind {position:relative; padding:0;}
.main .sect1 .kind h2 {
	display:block; position:relative; 
	font-weight:500; font-size:18px; color:#000; letter-spacing:-1px; line-height:1;	
}
.main .sect1 .kind>ul {background:#264593; height:145px; padding:0 20px;}
.main .sect1 .kind>ul>li {height:460px; width:33.333%; float:left;}
.main .sect1 .kind>ul>li h2 {padding-top:20px; height:145px; text-align:center;}
.main .sect1 .kind>ul>li.on h2 {background:url(../images_ebi/main/kind_edge.png) no-repeat center bottom;}
.main .sect1 .kind>ul>li h2 a {	
	position:relative; display:block; color:#fff; font-size:18px; font-weight:500; font-family:NanumSquare; cursor:pointer;
}
.main .sect1 .kind>ul>li h2 a span {display:block;}
.main .sect1 .kind>ul>li h2 a:before {
	content:""; position:relative; display:inline-block; width:70px; height:60px; margin-bottom:10px;
	background-image:url(../images_ebi/main/kind.png); background-repeat:no-repeat;
}
.main .sect1 .kind>ul>li:nth-child(1) h2 a:before {background-position:0 0;}
.main .sect1 .kind>ul>li:nth-child(2) h2 a:before {background-position:-70px 0;}
.main .sect1 .kind>ul>li:nth-child(3) h2 a:before {background-position:-140px 0;}
.main .sect1 .kind>ul>li:nth-child(1) h2 a:after {display:none;}
.main .sect1 .kind>ul>li.on h2 a {color:#ffcc00;}
.main .sect1 .kind>ul>li.on h2 a:before {background-image:url(../images_ebi/main/kind_on.png);}
.main .sect1 .kind>ul>li h2 a:after {content:""; position:absolute; left:0; top:10px; display:block; height:80px; width:1px; background:rgba(255,255,255,.2);}
.main .sect1 .kind>ul>li.on .list {display:block;}
.main .sect1 .kind .list {display:none; position:absolute; top:165px; left:0; width:100%; padding:0 20px; background:#fff;}
.main .sect1 .kind .list li {float:left; overflow:hidden;}
.main .sect1 .kind .list li:nth-child(odd) {width:60%; clear:both;}
.main .sect1 .kind .list li:nth-child(even) {width:40%;}
.main .sect1 .kind .list.etc li:nth-child(odd) {width:45%;}
.main .sect1 .kind .list.etc li:nth-child(even) {width:55%;}
.main .sect1 .kind .list li a {width:100%; display:block; position:relative; padding:2px 0 2px 10px; margin:3px 0; font-size:15px; color:#000; letter-spacing:-.5px; line-height:1.4;}
.main .sect1 .kind .list li a:before {content:""; position:absolute; left:0; top:12px; display:block; width:5px; height:2px; background:#264593;}
.main .sect1 .kind .list li a:hover {color:}
.main .sect1 .kind .list li a p {width:300px; font-size:16px;overflow:hidden;	text-overflow:ellipsis; white-space:nowrap;}
.main .sect1 .kind .list li a:hover {color:#0085cf;}
.main .sect1 .kind .list li a:hover p {color:#0085cf;}
.main .sect1 .kind .more {position:absolute; bottom:-10px; right:40px; font-size:13px; font-weight:600; color:#0085cf;}
.main .sect1 .kind .info {position:absolute; left:0; bottom:40px; padding:0 40px; color:#264593; letter-spacing:-1px; line-height:1.2;}
.main .sect1 .kind .info dl {position:relative; padding:30px 0 0 60px; margin-top:20px; background:url(../images_ebi/main/kind_tel.png) no-repeat left 30px; border-top:1px solid #e5e5e5;}
.main .sect1 .kind .info dt {font-family:NanumSquare; font-size:18px; font-weight:500;}
.main .sect1 .kind .info dd {font-family:NanumSquare; font-size:30px; font-weight:600;}
.main .sect1 .kind .info dd p{padding-top:10px; font-size:13px; color:#666; letter-spacing:0; font-weight:normal;}

/*2019-08-22*/
.main .sect1 .kind.style2019>ul>li h2 a:before {background-image:url(../images_ebi/main/kind_1908.png);}
.main .sect1 .kind.style2019>ul>li.on h2 a:before {background-image:url(../images_ebi/main/kind_on_1908.png);}
.main .sect1 .kink.style2019 .list {padding:0 20px !important;}
.main .sect1 .kind.style2019 .info {width:100%; padding:0 20px !important; bottom:30px;}
.main .sect1 .kind.style2019 .info dl {padding:20px 0 0 90px; background-position:20px 20px;}
.main .sect1 .kind.style2019 .info dd p {padding-top:5px;}
.main .sect1 .kind.style2019 .list.etc li:nth-child(odd) {width:55%;}
.main .sect1 .kind.style2019 .list.etc li:nth-child(even) {width:45%;}


/* sect2 - 공단소개 */
.main .sect2 {clear:both; overflow:visible; width:100%; height:280px; background:#0085cf;}
.main .sect2 .wrap {position:relative; width:1200px; margin:0 auto; padding:50px 10px 0; color:#fff;}
.main .sect2 .wrap>* {float:left;}
.main .sect2 .head {width:390px;}
.main .sect2 .head h2 {font-size:36px; font-family:NanumSquare; font-weight:600; letter-spacing:-1px;}
.main .sect2 .head h2:before {
	content:""; display:block; width:240px; height:133px; position:absolute; left:100px; top:-55px;
	background:url(../images_ebi/main/dginfo_mark.png) no-repeat;
}
.main .sect2 .head p {padding-top:20px; font-size:14px; font-family:inherit;}
.main .sect2 .btnWrap {width:790px; text-align:right;}
.main .sect2 .btnWrap a {
	display:inline-block; line-height:1; font-weight:600; color:#fff; width:180px; padding:15px 0; margin-left:10px;
	border:2px solid #fff; border-radius:100px; text-align:center;
	background-image:url(../images_ebi/main/dginfo_arrow.png); background-repeat:no-repeat; background-position:-10px 50%;
	transition:all .2s linear !important;
	-webkit-transition:all .2s linear !important;
	-moz-transition:all .2s linear !important;	
}
.main .sect2 .btnWrap a:hover,
.main .sect2 .btnWrap a:focus {background-position:20px 50%; background-color:#fff; color:#000;}



/* sect3 - */
.main .sect3 {clear:both; width:1200px; margin:-105px auto 0;}
.main .sect3 [class*='area'] {float:left; width:400px; padding:0 10px; overflow:hidden; margin-bottom:20px;}
.main .sect3 [class*='area']>* {width:380px; border-radius:7px; overflow:hidden; background:#fff; border:1px solid #e5e5e5;}

/* sect3 - 알림존 */
.main .sect3 .area1 {height:467px;}
.main .sect3 .sliderWrap {height:272px;}
.main .sect3 .sliderWrap h2 {height:70px; padding:30px 40px 0; font-size:24px; font-weight:500; line-height:1; letter-spacing:-.5px; border-bottom:1px solid #e5e5e5;}
.main .sect3 .slider {position:relative; overflow:visible;}
.main .sect3 .slider ul {position:relative; width:378px;}
.main .sect3 .slider li {height:199px;}
.main .sect3 .slider li img {width:378px; height:200px;}
.main .sect3 .slider li a {display:block; margin-bottom:5px;}
.main .sect3 .banner {margin-top:20px; color:#fff; background:url(../images_ebi/main/banner_bg1.jpg); border:0;}
.main .sect3 .banner a {
	display:block; padding:45px 40px 0 100px; height:175px; color:#fff; font-size:14px; letter-spacing:-.5px;
	background:url(../images_ebi/main/banner_ico1.png) no-repeat 40px 45px;
}
.main .sect3 .banner a h3 {font-size:24px; font-weight:500; padding-bottom:15px;}
.main .sect3 .type1 {}
.main .sect3 .type1 .wrap {position:relative; border:1px solid #e5e5e5;}
.main .sect3 .type1 .head {height:105px; padding:30px 40px; background:#fff; border-radius:7px 7px 0 0; border:0; border-bottom:1px solid #e5e5e5;}
.main .sect3 .type1 .head h2 {height:30px; font-weight:500; color:#000; letter-spacing:-.5px;}
.main .sect3 .type1 .head p {font-size:14px;}
.main .sect3 .type1 .con {position:relative; height:360px; overflow:hidden;}
.main .sect3 .type1 .con iframe {position:absolute; margin-top:-72px; margin-left:-1px;}
.main .sect3 .type1 .more {
	position:absolute; right:40px; top:30px; width:40px; height:40px; text-indent:-9999px;
	background:url(../images_ebi/main/icon_more.png) no-repeat center; border:1px solid #e5e5e5;
}
.main .sect3 .type1 .more:hover {border-color:#000;}

.main .sect3 .area3 .head {border:0;}
.main .sect3 .area3 .list {padding:0 40px 40px 40px;}
.main .sect3 .area3 .list a {display:block; position:relative; padding-left:140px; font-size:15px; margin-bottom:20px;}
.main .sect3 .area3 .list a .img {
	position:absolute; left:0; top:0; width:120px; height:90px; border-radius:7px; background:#f7f7f7;
	background:url(../images_ebi/common/imgNone.png) no-repeat center;
	border:1px solid rgba(0,0,0,.1);
}
.main .sect3 .area3 .list a p {height:70px; overflow:hidden; line-height:1.4;}
.main .sect3 .area3 .list a:hover p {color:#0085cf;}
.main .sect3 .area3 .list a span {display:block; font-size:13px; padding-top:5px;}


/* 하단 배너 */
.main .sect3 .banWrap {clear:both; width:1180px; margin:0 auto 20px; text-align:center; border:1px solid #e0e0e0; font-size:14px; line-height:1.4; overflow:hidden; border-radius:7px;}
.main .sect3 .banWrap dl {float:left; width:25%; padding:20px; border-left:1px solid #e0e0e0;}
.main .sect3 .banWrap dl:first-child {border:0;}
.main .sect3 .banWrap img {margin-bottom:10px;}
.main .sect3 .banWrap a {display:inline-block; margin-top:10px; line-height:1; padding:7px 15px; border:1px solid #e0e0e0; border-radius:100px;}
.main .sect3 .banWrap a:hover {background:#24a1f0; color:#fff; border-color:#24a1f0;}


/* 하단 배너2 */
.main .sect3 .banWrap2 {clear:both; width:1180px; margin:0 auto 20px; text-align:center; border:1px solid #e0e0e0; font-size:14px; line-height:1.4; overflow:hidden; border-radius:7px;}
.main .sect3 .banWrap2 dl {overflow:hidden; padding:20px; border-left:1px solid #e0e0e0;}
.main .sect3 .banWrap2 dl:first-child {border:0;}
.main .sect3 .banWrap2 img {margin-bottom:10px;}
.main .sect3 .banWrap2 a {display:inline-block; margin-top:10px; line-height:1; padding:7px 15px; border:1px solid #e0e0e0; border-radius:100px;}
.main .sect3 .banWrap2 a:hover {background:#24a1f0; color:#fff; border-color:#24a1f0;}

.main .rollBanner {position:relative; width:100%; height:170px; overflow:hidden;}
.main .rollBanner>ul {
	z-index:0; position:absolute; white-space:nowrap; width:1150px; padding:0; overflow:hidden;
}
.main .rollBanner>ul.ani {
	transition:all .5s linear !important;
	-webkit-transition:all .5s linear !important;
	-moz-transition:all .5s linear !important;	
}
.main .rollBanner>ul>li {display:block; float:left; width:25%; height:170px; border-left:1px solid #e5e5e5;}
.main .rollBanner>ul>li:first-child {border:0;}

.main .rollBanner .btnWrap {
	z-index:10; position:absolute; right:0; top:0; height:170px; border-left:1px solid #e5e5e5;
	background-repeat:no-repeat; background-position:center; background-color:#fff;
}
.main .rollBanner .btnWrap .next {background-image:url(../images_ebi/slider/next.jpg);}
.main .rollBanner .btnWrap .prev {background-image:url(../images_ebi/slider/prev.jpg);}
.main .rollBanner .btnWrap .state {background-image:url(../images_ebi/slider/pause.jpg);}
.main .rollBanner .btnWrap .play {background-image:url(../images_ebi/slider/play2.png);}
.main .rollBanner .btnWrap button {
	display:block; width:30px; height:33%; background:#fff; border-top:1px solid #ddd; cursor:pointer;
	background-repeat:no-repeat; background-position:center; text-indent:-9999px;
}
.main .rollBanner .btnWrap button:hover {background-color:#f5f5f5;} 
.main .rollBanner .btnWrap button:first-child {border-top:0;}
