@charset "utf-8";


/*모바일 */
@media (max-width:1500px){

/*메뉴 */
.mainlimo{display: none;}
.topgo{display: block;}
.menutop{position: fixed; top: 0; width: 75%; z-index: 999;}

.menubox{position:relative; top: 0; left: 0; right: 0; width: 100%; height: 55px; bottom: auto; border-bottom: 1px solid #e1e1e1; box-sizing:border-box; background: #fff; min-height:  auto; border-right: none; z-index: 9991;}
.menubox h1{height: 54px; padding-left: 5px;}
.menubox h1 a{display: block; height: 54px; background: url(../images/m_logo.png)left no-repeat;}
.menuli, .select_site{display: none;}
.on .menuli{display: block; position: static; background: #fff; overflow: hidden; width: 100%; margin-left:0; border-bottom: 2px solid #7fbe26; border-top: 1px solid #eaeaea;}
.menuwrap{height: auto; padding: 0}
.on .m_menu_back{display: none;}
.menuli .menu{width: 50%; border-right: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea;}
.menuli li:nth-child(2n), .on .menu_sub, .on .menu_sub li{ border-right: none;}
.on .menu_sub{ border-right: none; margin-top: 0}
.scrollbtn{bottom: 15px;}

.select_site{position: fixed; width:75%; z-index: 999}
.menuli li{height: auto;}
.menutop li{height: 36px; line-height: 36px;}
.menutop li button{height: 35px; }

.menu_sub{position: static; border-bottom: none; width: 100%; left: 0; margin-top: 0;}
.menu_sub ul{width: 100%;}
.menu_sub ul li{width: 100%;}
.menu_sub li a{text-align: center; line-height: 40px;}
.menu1 .menu_sub ul li, .menu2 .menu_sub ul li, .menu3 .menu_sub ul li, .menu4 .menu_sub ul li, .menu5 .menu_sub ul li{margin-left: 0;}
.menubox .menuli .menu > a{width: 100%; height: 44px; line-height:44px;}
.menubox .menuli .menu:hover > a{border-bottom: none;}
.menubox .menuli .clicked .m_menua, .menubox .menuli .clicked:hover .m_menua{color: #0083bb; border-bottom:2px solid #0083bb;}
.m_menu{top: 0; right: 0px; width: 94px;}


.menuli .menu > a{padding-top: 0; font-size: 15px;}
.menuli .menu1 > a, .menuli .menu2 > a, .menuli .menu3 > a, .menuli .menu4 > a, .menuli .menu5 > a, .menuli .menu6 > a,
.wrap1 .menuli .menu1 > a, .wrap2 .menuli .menu2 > a, .wrap3 .menuli .menu3 > a, .wrap4 .menuli .menu4 > a, .wrap5 .menuli .menu5 > a , .wrap6 .menuli .menu6 > a,
.menuli .menu1:hover > a,.menuli .menu2:hover > a,.menuli .menu3:hover > a,.menuli .menu4:hover > a,.menuli .menu5:hover > a,.menuli .menu6:hover > a
{background:none;}

.w1200{width: 100%; height: 100%;}

/*메인 */
.wrap article{padding-left: 0;}
.mainh2{top:66px; width: 207px; margin-left: -103px;}
.mainh2 img, .main_conten{width: 100%;}
.weatherBox{display: none;}
.main1dan{height: auto; height:480px; }
.main_conten2{width: 95%;}
.mapBox{width: 100%; float: none; height:100%;}
.main_trafficBox{width: 100%; float: none; border-top-right-radius:0; padding-top: 20px; height:348px; overflow: hidden;}
.traffic_conten li:nth-child(3n){border-bottom: 1px dotted #f3f3f3}
.traffic_conten li:nth-child(4n){border-bottom: none;}

.main_trafficBox h3{width:170px; background-size: 100%; margin-left: 10px;}
.main_trafficBox h3 span{font-size:21px; line-height: 25px; }
.tr_play{margin-top: 5px; width: 98px; height: 40px; top: 10px; right: 10px;}
.playbtn li{float: left; width: 30px; height: 30px; margin-left: 2px;}
.traffic_conten .trList{padding: 3px 0; height: 52px;}
.traffic_conten{width: 100%; left:10px; top: 95px; right: 10px;}

.maingoBox{border-bottom-left-radius:0; height:141px; padding: 0;}
.maingoBox li{width:25%; height: 141px;}
.maingoBox li.go1{background:url(../images/main_go1.png)center 14px no-repeat; background-size:62px; }
.maingoBox li.go2{background:url(../images/main_go2.png)center 14px no-repeat; background-size:62px;}
.maingoBox li.go3{background:url(../images/main_go3.png)center 14px no-repeat; background-size:62px; }
.maingoBox li.go4{background:url(../images/main_go4.png)center 14px no-repeat; background-size:62px; }
.maingoBox li a{padding:77px 0 0 0;  text-align: center;}
.maingoBox .title{font-size: 13px; line-height: 15px; letter-spacing:-2px;}
.maingoBox .title span{font-size: 12px; line-height: 12px; color: #fff; margin-top: 5px;}
.maingoBox .txt{font-size: 11px; line-height: 13px; letter-spacing:-1px;  display: none;}

.main_conten3{width: 95%; padding-top: 53px;}
.main_conten3 h3 img{width: 70%;}
.service{margin-top:0;}
.service .box{width: 100%; margin-top: 20px}
.box2 .conten .cctvView{width: 100%; text-align: center;}
.m_none{display: none;}
.main_bus{padding-top: 21px; padding-bottom: 70px}
.main_bus h4{width: 20%; font-size: 13px; background:url(../images/main_bus1.png)right 36px no-repeat; display: block; float: left;}
.main_bus ul{display: block; float: right; width: 80%;}
.main_bus ul li{width: 31%;}
.main_bus ul li a{font-size: 12px; }
.mapinfo ul{padding: 2px 10px; display: block;}
.mapinfo{border-bottom: 1px solid #dcdcdc; height: 55px; padding-top: 6px;}
.mapinfo .fast{border-right: none;}

footer{padding-left: 0;}
footer address{font-size: 11px; line-height: 14px;}
.ad1{line-height: 14px;}
.capy{font-size: 11px; line-height: 13px;}

/*교통정보 */
.submax{padding:30px 0 90px 0;}
.leftBox .subtop a{display: none;}
.leftBox .subtop{height:32px; line-height: 31px;}
.trbox{top:66px; }
.leftBox{border-right: none;}
.leftBox .tab, .leftBox .tab li{height: 35px;}
.leftBox .tab li a{line-height: 33px; font-size: 13px;}
.trcontenBox{top: 108px;}
.leftBox .subtop h2{font-size:14px}
.mapview, .m_map_top{display: block;}
.wrap_100 article{left: 0; top: 55px;}
.leftBox{width: 100%;}
.map_box{ left: 0; display: none;}
.delay_info .comment{display: none;}
.delay_info{bottom: 0; top: auto;}
.delay_info_left{width: 100%;}
.sub_list_line li .txttitle{padding: 11px 34px 11px 5px;}
.subTitlebox{height:63px; margin-top: 4px; padding-top: 1px; background-size:60px;}
.subTitlebox p{line-height: 12px; font-size: 11px;}
.subTitlebox h3{font-size:16px; margin-bottom:0; padding-top: 2px;}
.searchbox{height: 40px;}
.inner input{height: 37px;}
.inner .btn_search{top: 2px;}
.tab2{margin: 7px 0 0 0;}
.tab2 li{height: 30px; width: 107px;}
.tab2 li a{font-size: 12px; line-height: 25px;}
.tab2 li.click a{background:url(../images/sub_tab_click.png)center no-repeat; background-size:auto 29px;}
.tab2 li a{background:url(../images/sub_tab_nml.png)center no-repeat; background-size:auto 29px;}

.st2Box .searchBox{width: 100%; float: none; height: 662px;}
.st2Box .stchart{width: 100%; float: none; border-top: none; border-left: 1px solid #e2e2e2; border-bottom: none; position: static;}
.submax .h3box h3{padding-left: 10px;}

/*cctv */
.sub_list_line .listarrow li{padding:10px 7px 11px 7px;}
/*vms팝업 */
.pop_vms{top: 44px; left: 50%; right: auto; margin-left: -160px;}

/*스마트교차로, 주차장 */
.unbox{top:32px;}
.tmapgo{display: block;}
.wrap4 .delay_info{text-align: center;}
.wrap4 .delay_info .comment{display: inline-block; line-height: 19px; margin: 8px auto; float: none;}

/*스마트교차로 */
.smartBox , .smartBox.mainsmart{width:auto; height:400px; left:2px; right:2px; margin: 0; top: 42px;}
.smartmap .map_btn{display: none;}
.smart_cctvset{display:block;}
.cctv0, .cctv1, .cctv2, .cctv3, .cctv4, .cctv5, .cctv6, .cctv7, .cctv8,
.mainsmart .cctv0,.mainsmart .cctv1,.mainsmart .cctv2,.mainsmart .cctv3,.mainsmart .cctv4,.mainsmart .cctv5,.mainsmart .cctv6,.mainsmart .cctv7,.mainsmart .cctv8{top: 5px!important; left: 50%!important; right:auto!important; bottom:auto!important; margin-top:0!important; margin-left:-160px!important; display: none;}
.s_pop_close{display: block;}
.leftBox .Titlebox6{background: url(../images/tr_img6.png)right 6px no-repeat; background-size:48px; }

/*통계 */
.chartText{background-size:40%; }
.stats4 .trdep dt{width: 66px;}
.subtab{height: 48px;}
.subtab li a{line-height:48px; font-size:12px; letter-spacing: -0.5px;}
.subtab li.click a{font-size:12px;}
.subtab li.click a img{width: 15px; display: none;}
.subtabBox a span{display: block;}
.wrap5 .subtab li a{line-height: 14px; height: 48px; padding: 10px 0 9px 0; box-sizing:border-box;}
.sub1200{padding:30px 0 100px 0;}
.h3box{margin-bottom: 15px;}
.h3box h3{font-size: 27px; line-height: 34px;}
.stBox{width: 95%; margin: 0 auto; top:0px}
.stsub1 .stBox{width: 95%; margin: 0 auto; top:50px;}
.stBox .st1, .stBox .st2, .stBox .st3, .stBox .st4, .stBox .st5{width: 100%; margin-right: 0; margin-bottom: 5px; margin-top: 0;}
.st3Title{line-height: 20px;}
.st3Title span{display: block;}
.st3car li p img{width: 90%;}
.st5 .grapBox{width: 100%; float: none;}
.st5{height: 765px;}
.st5 .grap{width: 290px; margin: 0 auto; margin-bottom: 20px;}
.chartDetail{display: none;}
.searchBox{padding: 10px;}
.searchBox table{width: 100%; float: none;}
.search_btn{float: none; width: 100%; text-align: center; margin-top: 10px; margin-bottom: 10px;}
.search_btn li{display:inline-block; width: 83px; height: 35px}

.searchleft{width: 100%; float: none; overflow: hidden; margin-bottom:0;}
.trdep{width: 100%;}
.trdep dt{font-size: 12px; height: 27px; line-height: 25px;}
.trdep dd .w220{width: 100%}
.trdep dd .w100{width: 46%}
.searchleft .dep50p{width: 100%;}
.stats4 .searchleft{width: 100%;}
.smart_info{float: none; width: 100%; text-align: center; overflow: hidden; margin-top: 0;}
.smart_info li{display: inline-block;float: none; font-size: 12px;}
.smart_info ul{float: none; }
.smart_info li p{width: 15px; height: 15px}
.stats4 .trdep{width: 100%;}
.stBox .search_btn3{width: 39%;}
.smartSt_map{height: 400px;}
.chart{height: 350px;}

.stats1day{position: static; margin-top: 12px;}
.h3box.stats1h3box{height: auto;}

.grapBox2 .grap{height: 134px;}
.stBox .st3{height: 423px;}
.stBox .st3 .grapBox1{right: 10px; bottom: auto; height: 189px;}
.stBox .st3 .grapBox2{width: auto; left: 10px; top: 200px;}
.grapBox2 .grap li{width: 33%;}

.grapBox2 .grap li:last-child{width: 33.3%;}
.stBox .st5 .dan1{height:288px; }
.stBox .st5 .dan1 .all2{width: 100%;}
.stBox .st5 .dan1 .allgrap{left: 5px; top:145px;}
.stBox .st5 .grapBox{float: none; width: 100%; margin-right: 0;}
.stBox .st5{height:765px; }

.wrap5 .h3box{height: 50px; margin-left: 8px;}
.wrap5 .submax{padding: 21px 0 90px 0;}
.wrap5 .submax .h3box h3{font-size: 23px; margin-bottom: 16px;}
.wrap5 .submax .info{font-size: 12px; line-height: 17px; display: block;}
.st .sttitle1{margin: 10px 0; letter-spacing: -1px;background:url(../images/title_bg3.png)center left no-repeat; width:195px; padding-right: 127px;}
.st .sttitle1 span{right:7px; }
.st4 .info{right: 2px;}

.chartmapBox{height: 349px; border-left: 1px solid #e2e2e2;  border-right: 1px solid #e2e2e2}
.stmapbtn{right: 13px; top: 2px;}

/*센터소개 */
.subtab .centerli .libox li.click a{letter-spacing: -1px;}
.centerTabBox{height: 125px;}
.subtabBox{width: 100%;}
.sub1200{width: 100%;}
.centerBox{width: 95%; margin: 0 auto;}
.centerBox .box{width: 100%; margin-bottom: 5px}
.imgBox img{width: 100%;}
.center1list{margin-top: 40px;}
.center1list li{width:49%; height: 338px; margin-bottom: 20px;}
.CLli{height: 290px;}
.CLli .CLtitle h5{letter-spacing: -3px;}
.CLli .txt{font-size: 12px;}

.Cleft{float: none; width: 100%; text-align: center; padding: 30px 0; height: 231px;}
.Cright{float: none; width: 100%; padding: 8px; text-align: center; height: auto;}
.ctitle{display: inline-block; font-size: 20px; width: 240px; height: 70px; line-height: 63px;}
.cinfo{display: inline-block; font-size: 14px;}
.cr_title{display: inline-block; font-size: 17px; background:none; height: 56px; line-height:50px; padding-right: 0;}
.cr_title span{font-size: 18px;}
.cr_info{display: inline-block; font-size: 13px; padding-bottom: 10px;}
.centerBox2{padding: 0 5px; box-sizing: border-box;}
.sistem dl{margin-right: 0; width: 100%;margin-bottom: 5px;}
.imgBox{height: auto;}



/*공지사항 */
.notisearchBox{margin-bottom: 0}
.notiBox .noticount{height: 40px; line-height: 40px; font-size: 13px;}
.notisearchBox select{width: 23%;  font-size: 12px; padding: 0 5px;}
.notisearchBox input{width: 50%; font-size: 12px; padding: 0 5px;}
.notisearchBox button{width: 19%; font-size: 12px;}
.notisearchBox button img{margin-top: 2px;}
.notiBox table th, .notiBox table td{font-size: 12px;}
.notilist td:nth-child(1), .notilist th:nth-child(1){width:10%;}
.notilist td:nth-child(2), .notilist th:nth-child(2){width: 60%; text-align: left;}
.notilist td:nth-child(3), .notilist th:nth-child(3){width: 15%;}
.notilist td:nth-child(4), .notilist th:nth-child(4){display: none;}
.notilist td:nth-child(5), .notilist th:nth-child(5){width: 15%;}
.btn_jump li, .btn_num li{width: 19px; height: 19px;}
.page li a{line-height: 17px;}
.btn_jump li, .btn_num li{font-size: 11px; margin: 0 1px;}
.notiBox .notiview th{width: 21%;}

/*찾아오시는길 */
.wayleft{display: none;}
.wayright{left: 0; border-left: 1px solid #c3c3c3; padding: 5px; font-size: 12px; height: 68px;}
.wayright dt{width: 86px;}
.centerWay h4{font-size: 13px;}
.centerWay p{font-size: 12px; line-height: 18px;}
.centerWay{margin-top:8px; }
.waymap{height: 350px}

/*정류장 팝업 */
.pop_busstop{width:350px; height:284px; padding:5px 5px 0 5px; }

.busRoutemap{display:block; position: absolute; right: 10%; top: 8px; width: 60px; background: #efefef; font-size: 11px; color: #000; height: 20px; border: 1px solid #ccc; border-radius:20px; }

.main_popupBox{width: 93%; top:64px;}
.popupConten img{width: 100%}

/*사이트맵 */
.sitemapconten{width: 100%; height: auto; left: 0; margin: 0; top:18px; position: absolute;}
.contenSite{ height: auto; margin-top: 15px;}
.contenSite .box{width: 50%; padding-bottom: 50px; border-left:1px solid rgba(255,255,255,0.2); border-right: none;}
.contenSite .box:last-child{border-right:1px solid rgba(255,255,255,0.2); box-sizing:content-box; border-left: none;}
.contenSite .box h2{font-size: 21px;}
.contenSite .box ul{margin-top: 12px;}
.contenSite .box ul a{font-size: 14px; line-height: 30px; height: 30px;}
.sitemapclose{width:67px; height: 67px; background: url(../images/sitemap_close2.png)center no-repeat;}
.sitemapBodyclick ~ article{max-height: 850px;}


}

@media (max-width:899px){
	.chartText{background-size:70%; }

	}

@media (max-width:440px){
.grapBox2 .grap li img{width: 99%;}
.chartText{background-size:90%; }	
}