@charset "utf-8";
@import url('layout.css');
@import url('table.css');
@import url('common.css');



.prediction{position: relative;}
.prediction .inner{position: relative;}
.prediction .timeInfo{position:absolute; top:-50px; right:0; width:220px; display:inline-block; height:35px; line-height: 35px; border:1px solid #919191; padding:0 10px; background: #fff; vertical-align:middle; box-sizing:border-box; z-index: 999;}
.prediction .timeInfo span{display:inline-block; height:12px; line-height: 10px;  font-size:12px; color:#777; border-right:1px solid #ddd; padding-right:10px; margin-right:10px; vertical-align: middle;}
.prediction .timeInfo strong{color:#333; font-size:12px;}

.prediction .inner .wrap{clear: both; display: block; margin-bottom:35px; box-sizing:border-box; } 
.prediction .inner .wrap:after{display:block;clear:both;content:'';}
.prediction .inner .wrap > .l{float:left; width:48%; }
.prediction .inner .wrap > .r{float:right; width:48%; box-sizing:border-box;}
.prediction .txt1{clear:both; position:relative; line-height:22px; font-size:16px; font-weight:normal; color:#444; background:url(../img/common/line_dot.png) 5px 10px no-repeat; padding-left:14px; margin-bottom: 10px; box-sizing:border-box;}
.prediction .txtcolor1{color:#28c613;}
.prediction .txtcolor2{color:#eda917;}
.prediction .txtcolor3{color:#ff0000;}
.prediction .txtcolor1, .prediction .txtcolor2, .prediction .txtcolor3{font-weight: bold;}


@media screen and (max-width: 1024px){
	
}

@media screen and (max-width: 768px){
	.prediction .wrap > .l{float:none; width:100% !important; margin-bottom:50px; }
	.prediction .wrap > .r{float:none; width:100% !important; padding-left:0px;}

}

@media screen and (max-width: 480px){
	
}






/*탭공통*/
.prd_tab1{clear:both; display:block; height:40px; width:100%;  }
.prd_tab1 li{float:left; width:33.3%; height:40px; border-bottom:1px solid #e9e9e9;}
.prd_tab1 li.on{border-bottom:1px solid #000;}
.prd_tab1 li a{display:block; line-height: 40px; color:#919191; font-size:14px; text-align: center;}
.prd_tab1 li.on a{background: url(../img/prdc/ico_tab1.png) 90% 50% no-repeat; background-size:7px; color:#444;}


.prd_tab2{clear:both; display:block; height:35px; width:100%;  }
.prd_tab2 li{float:left; width:25%; height:35px; border:1px solid #919191; box-sizing:border-box; border-right:none;}
.prd_tab2 li:last-child{border-right:1px solid #919191;}
.prd_tab2 li.on{ background: #919191;}
.prd_tab2 li a{display:block; line-height: 35px; color:#919191; font-size:14px; text-align: center;}
.prd_tab2 li.on a{color:#fff;}

.prd_tab3{clear:both; display:block; height:35px; width:100%;  }
.prd_tab3 li{float:left; width:25%; height:35px; border:1px solid #bbb; box-sizing:border-box; border-right:none;}
.prd_tab3 li:last-child{border-right:1px solid #bbb;}
.prd_tab3 li.on{ background: #f3f3f3;}
.prd_tab3 li a{display:block; line-height: 35px; color:#919191; font-size:14px; text-align: center;}
.prd_tab3 li.on a{color:#333;}

.prd_tab1col{}
.prd_tab1col li{width:100%;}

.prd_tab2col{}
.prd_tab2col li{width:50%;}

.prd_tab3col{}
.prd_tab3col li{width:33.3%;}


/* 혼잡 색상 */
.prd_type{display:inline-block; border-radius:50%; width:8px; height:8px; background:#ddd; }
.prd_type.t1{background:#00f; }
.prd_type.t2{background:#57c513 }
.prd_type.t3{background:#f7e015; }
.prd_type.t4{background:#f97f05; }
.prd_type.t5{background:#ce0a0c; }



/*이벤트*/
.prd_event{ position:relative; height:40px; line-height:40px; border:1px solid #eee; background: #fafafa; vertical-align: middle; }
.prd_event > span{ display:inline-block; height:22px; line-height: 22px; margin-left:10px; background: #1344bf; color:#fff; font-size:11px;  padding:0 7px; vertical-align: top; margin-top:9px;}
.prd_event > a{display:inline-block; width:calc(100% - 35%); text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.prd_event > a span{}
.prd_event > a i{position:absolute; top:9px; right:10px;display:inline-block; width:22px; height:22px; border:1px solid #d0d0d0; background: #fff url(../img/prdc/ico_more.png) 50% 50% no-repeat; background-size:15px;}





.prd_now{padding-top:0 !important;}
.prd_now .now{display: block; height:40px; line-height: 40px; color:#777; font-size:12px; padding-left:17px; background: url(../img/prdc/ico_time.png) 0 50% no-repeat; background-size:13px; }
.prd_now div > .l{position:relative; float:left; width:42%; height:184px; padding-top:65px; background: #f9f9f9; border:1px solid #ebebeb; box-sizing:border-box; }
.prd_now div > .l .spd{position:absolute; top:0; left:0; display:block; width:100%; height:65px; line-height: 70px; font-size:40px; font-weight: bold; color:#666; text-align: center; overflow: hidden; white-space:nowrap;}
.prd_now div > .l .spd.t1{color:#00f;}
.prd_now div > .l .spd.t2{color:#57c513;}
.prd_now div > .l .spd.t3{color:#f7e015;}
.prd_now div > .l .spd.t4{color:#f97f05;}
.prd_now div > .l .spd.t5{color:#ce0a0c;}
.prd_now div > .l .spd i{display: inline-block; width:15px; height: 15px; border:2px solid #dfdfdf; margin-right:5px;  }
.prd_now div > .l .spd span{ font-size:14px; color:#8f8f8f; font-weight: normal;}
.prd_now div > .l .per{position:relative; height:55px; width:calc(100% - 20px); margin-left:10px; }
.prd_now div > .l li:last-child{border-top:1px solid #ddd; }
.prd_now div > .l .per i{ position:absolute; left:0px; top:10px;  display:inline-block;  font-size: 11px; color:#666;}
.prd_now div > .l .per span{position:absolute; right:0px; top:10px; display:inline-block; height:20px; line-height: 20px; font-size:18px; font-weight: bold; color:#444; vertical-align: middle; }
.prd_now div > .l .per span img{display:inline-block; width:9px; vertical-align: middle; margin-right:3px;}

.prd_now div > .r{float:right; position:relative; width:56%; }
.prd_now div > .r .line{position:absolute; top:35px; left:48%; display:block; width:15px; text-align: center;}
.prd_now div > .r .line i{display:inline-block; width:3px; height:115px; background: #bbb;}
.prd_now div > .r ul{position:relative; height:55px; }
.prd_now div > .r li{display: inline-block; font-size:0;  height:55px;}
.prd_now div > .r .cont_l .spd{left:0; width:45%;}

.prd_now div > .r .spd span{font-size:12px; font-weight: normal;}
.prd_now div > .r .spd i{display:inline-block; width:100%; font-size:13px; line-height: 15px; color:#919191;  font-weight: normal;}
.prd_now div > .r .spd i img{width:5px; margin-left:5px; vertical-align: middle;}

.prd_now div > .r .prd_type{position:absolute; top:20px; left:48%; width:15px; height:15px;}

.prd_now div > .r .time{position:absolute; top:15px; font-size:13px; color:#333;}
.prd_now div > .r .cont_l .time{left:57%; }
.prd_now div > .r .cont_r .time{right:55%;}

.prd_now div > .r .spd{position:absolute;  width:43%; font-size:17px; line-height: 15px; color:#333; text-align: center; border:1px solid #ddd; font-weight: bold; border-radius:3px; padding:0; padding-top:6px; box-sizing:border-box;}
.prd_now div > .r .cont_l .spd{left:0;}
.prd_now div > .r .cont_l .spd:after{content: ""; background: url(../img/prdc/box_arrow.png) 0 0 no-repeat; background-size:8px; position:absolute; width:6px; height:6px; top:24px; right:-6px; }
.prd_now div > .r .cont_r .spd{ right:0;}
.prd_now div > .r .cont_r .spd:after{content: ""; background: url(../img/prdc/box_arrow2.png) 0 0 no-repeat; background-size:8px; position:absolute; width:6px; height:6px; top:24px; left:-6px; }


/*그래프*/
.grp1{display:block; height:150px;}



/*혼잡예상시간대*/
.grp1_info{position:relative; height:45px; font-size:12px;}
.grp1_info span{position:absolute; top:7px; left:0px; line-height: 14px; }
.grp1_info p{position:absolute; top:0; left:51px; width:calc(100% - 55px); height:45px; line-height: 45px; font-size: 0;}
.grp1_info p span{position:static;  display:inline-block !important; font-size:0; width:8.33%; text-align: center;}
.grp1_info p i{display:inline-block; font-size:0; }


/*범례*/
.prd_legend{height:40px; line-height: 40px; background: #fcfcfc; border:1px solid #e7e7e7; text-align: center; box-sizing:border-box; }
.prd_legend li{display:inline-block; font-size:11px; color:#777; width:18%;}
.prd_legend li i{margin-right:3px;}




/*주간교통예보*/
.prd_weekly{}
.prd_weekly .wk_cont{}
.prd_weekly .wk_cont li{position:relative; height:55px;  border-bottom:1px solid #e9e9e9;}
.prd_weekly .wk_cont .tit{}
.prd_weekly .wk_cont .cont{}
.prd_weekly .wk_cont li p{width:25%;}
.prd_weekly .wk_cont li strong{position:absolute; top:0; display:block; width:35%;  font-weight:normal; text-align: center;}
.prd_weekly .wk_cont li strong:nth-child(2){right:35%;}
.prd_weekly .wk_cont li strong:nth-child(3){right:0%;}

.prd_weekly .wk_cont .tit strong{font-size:17px;padding:10px 0;}
.prd_weekly .wk_cont .tit strong span{display:block; font-size:11px; color:#919191; white-space:nowrap;}

.prd_weekly .wk_cont .cont p, .prd_weekly .wk_cont .cont strong{height:55px; line-height: 55px; text-align: center;}
.prd_weekly .wk_cont .cont strong i{width:16px; height:16px; vertical-align: middle; margin-right:5px; }
.prd_weekly .wk_cont .cont strong span{display:inline-block;   text-align: right; font-size:16px;}
.prd_weekly .wk_cont .cont strong span:last-child{margin-left:10%;}

.prd_weekly .wk_cont .cont p{font-size:0;}
.prd_weekly .wk_cont .cont p i{display:inline-block; color:#444; font-size: 22px; width:36px; height:36px; line-height: 36px; font-weight: bold; border-radius:50%; }
.prd_weekly .wk_cont .cont p.on i{ background: #0481c2; color:#fff;}
.prd_weekly .wk_cont .cont p.on span{color:#0481c2;}

.prd_weekly .wk_cont .cont p span{display:inline-block; font-size:15px; color:#919191; margin-left:5px;}






/*구간별통행속도*/
.prd_mSection{margin-top:10px; }
.prd_mSection .cont{display:block; width:100%; height:auto;}
.prd_mSection .cont .t{position:relative; width:100%; height:100%; }
.prd_mSection .cont .t > img{width:100%; border:1px solid #eee; border-top:none; border-bottom:none; box-sizing:border-box;} 	
.prd_mSection .cont .t span{position:absolute; top:0; left:0; display:block; width:100%;  height:100%;  }
.prd_mSection .cont .t span.line1{ background: url(../img/prdc/section_line1.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line2{ background: url(../img/prdc/section_line2.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line3{ background: url(../img/prdc/section_line3.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line4{ background: url(../img/prdc/section_line4.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line5{ background: url(../img/prdc/section_line5.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line6{ background: url(../img/prdc/section_line6.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line7{ background: url(../img/prdc/section_line7.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line8{ background: url(../img/prdc/section_line8.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line9{ background: url(../img/prdc/section_line9.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line10{ background: url(../img/prdc/section_line10.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line11{ background: url(../img/prdc/section_line11.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line12{ background: url(../img/prdc/section_line12.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line13{ background: url(../img/prdc/section_line13.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line14{ background: url(../img/prdc/section_line14.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line15{ background: url(../img/prdc/section_line15.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line16{ background: url(../img/prdc/section_line16.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line17{ background: url(../img/prdc/section_line17.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line18{ background: url(../img/prdc/section_line18.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line19{ background: url(../img/prdc/section_line19.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t span.line20{ background: url(../img/prdc/section_line20.png) 0 0 no-repeat; background-size:100%;}
.prd_mSection .cont .t a{position:absolute; display:block; width:40px; height:40px; line-height: 40px; margin-left:-20px; margin-top:-20px;border-radius:50%; background:#919191; text-align: center; color:#fff; font-size:13px; letter-spacing: -1px; overflow: hidden;}
.prd_mSection .cont .t a.on{background: #0481c2;}



@media screen and (max-width: 900px){
.prd_mSection .cont .t a{width:36px; height:36px; line-height: 36px; margin-left:-18px; margin-top:-18px; font-size: 12px; }	
}

@media screen and (max-width: 768px){
.prd_mSection .cont .t a{width:50px; height:50px; line-height:50px; margin-left:-25px; margin-top:-25px;  font-size:14px; }		
}

@media screen and (max-width: 600px){
.prd_mSection .cont .t a{width:40px; height:40px; line-height: 40px; margin-left:-20px; margin-top:-20px;  }		
}

@media screen and (max-width: 480px){
.prd_mSection .cont .t a{width:30px; height:30px; line-height: 30px; margin-left:-15px; margin-top:-15px; font-size: 11px; }	
}


.prd_mSection .cont .t .p_center{top:41%; left:47.4%;   }
.prd_mSection .cont .t .p1{top:25.5%; left:59%; }
.prd_mSection .cont .t .p2{top:9.7%; left:69.05%; }
.prd_mSection .cont .t .p3{top:34.25%; left:73.1%; }
.prd_mSection .cont .t .p4{top:19.5%; left:90.6%; }
.prd_mSection .cont .t .p5{top:49.5%; left:73.1%; }
.prd_mSection .cont .t .p6{top:63.8%; left:90%; }
.prd_mSection .cont .t .p7{top:63.4%; left:66%; }
.prd_mSection .cont .t .p8{top:80.8%; left:79.8%; }
.prd_mSection .cont .t .p9{top:63.8%; left:52.2%; }
.prd_mSection .cont .t .p10{top:84%; left:54.3%; }
.prd_mSection .cont .t .p11{top:63.8%; left:40.6%; }
.prd_mSection .cont .t .p12{top:82.5%; left:38.5%; }
.prd_mSection .cont .t .p13{top:57.9%; left:29.1%; }
.prd_mSection .cont .t .p14{top:78.78%; left:18.5%; }
.prd_mSection .cont .t .p15{top:43.7%; left:26%; }
.prd_mSection .cont .t .p16{top:41%; left:8.5%; }
.prd_mSection .cont .t .p17{top:30.7%; left:28.1%; }
.prd_mSection .cont .t .p18{top:21.3%; left:14%; }
.prd_mSection .cont .t .p19{top:25.5%; left:41.1%; }
.prd_mSection .cont .t .p20{top:12.2%; left:30.7%; }


.prd_mSection .cont .b{margin:0 auto;  display:block; font-size:0; width:70%; max-width:320px;  margin-top:10px; } 
.prd_mSection .cont .b li{display:inline-block; width:50%;}
.prd_mSection .cont .b p{display:block; height:30px; line-height: 30px; vertical-align: middle; font-size:13px; color:#fff; background: #0481c2; text-align: center;}
.prd_mSection .cont .b li:last-child p{background: #029fca;}
.prd_mSection .cont .b p img{display:inline-block; width:7px;  line-height: 30px; vertical-align: middle; margin:0 10px; }
.prd_mSection .cont .b strong{display:block; height:65px; line-height: 65px; font-size:30px; color:#444; vertical-align: middle; text-align: center; border:1px solid #eee; font-weight: bold; box-sizing:border-box;}
.prd_mSection .cont .b i{height:14px; width:14px; vertical-align: top; margin-top:23px; margin-right:10px;}
.prd_mSection .cont .b span{font-size:20px; font-weight: normal;}





























/*도로별 혼잡 시간 및 구간정보 검색 */
.prediction .roadInfo{clear:both; display:block; height:250px; border:1px solid #aaa; box-sizing:border-box; }
.prediction .roadInfo .l{float:left; width:300px; height:100%; border-right:1px solid #b6b6b6; box-sizing:border-box;}
.prediction .roadInfo .l > p{padding:7px; box-sizing:border-box;}
.prediction .roadInfo .l > p strong{position:relative; display:block; height:30px; line-height: 30px; border:1px solid #c5c6c6; border-radius:2px; vertical-align: middle; }
.prediction .roadInfo .l > p strong input{position:absolute;left:0; top:0; border:none; width:calc(100% - 40px); height:30px; line-height: 30px; vertical-align: middle;}
.prediction .roadInfo .l > p strong .b{position: absolute; right:0; top:0; height:30px; width:30px; border-left:1px solid #ddd; background: url(../img/prdc/ico_sub_search.png) 50% 50% no-repeat;}
.prediction .roadInfo .l dl{display: block; border-top:1px solid #919191;}
.prediction .roadInfo .l dt{height:35px; line-height: 35px; border-bottom:1px solid #ededed; background: #f6f6f6; color:#888; font-size: 12px; font-weight:bold; padding-left:10px; }
.prediction .roadInfo .l dd{ height:165px; overflow-y: auto;}
.prediction .roadInfo .l dd > a{display:block; height:30px; line-height: 30px; border-bottom:1px solid #ddd; color:#444; font-size: 12px; padding-left:15px; background: url(../img/common/dot.png) 10px 50% no-repeat; box-sizing:border-box;}

.prediction .roadInfo .r{float:right; width:calc(100% - 300px); padding:10px; box-sizing:border-box; }
.prediction .roadInfo .r .tab{}
.prediction .roadInfo .r .tab > a{display: inline-block; width:65px; height:25px; line-height:25px; color:#919191; font-weight: bold; font-size:12px; margin-right:15px;}
.prediction .roadInfo .r .tab > .on{color:#222; border-bottom:1px solid #222; background: url(../img/prdc/ico_tab_arrow.png) 95% 50% no-repeat;}
.prediction .sectionTable{width:100%; text-align: center;}
.prediction .sectionTable th, .prediction .sectionTable td{text-align: center; padding:0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.prediction .sectionTable th{font-size: 11px; color:#666; font-weight: normal;}
.prediction .sectionTable td > i{ display:inline-block; width:100%; height:9px; vertical-align: middle;}
.prediction .sectionTable td > i.dot1{background: #00f; }
.prediction .sectionTable td > i.dot2{background: #57c513; }
.prediction .sectionTable td > i.dot3{background: #f7e015; }
.prediction .sectionTable td > i.dot4{background: #f97f05; }
.prediction .sectionTable td > i.dot5{background: #ce0a0c; }
.prediction .roadInfo .r .tableWrap{height:200px; overflow-y: auto;}


/*도로별 혼잡정보*/
.prd_road{}
.prd_road .prd_tab2{}
.prd_road .prd_tab2 li{border-top:none;}
.prd_road .prd_tab2 li:first-child{border-left:none;}
.prd_road .prd_tab2 li:last-child{border-right:none;}
.prd_road .cont{padding:0 10px; height:calc(100% - 40px); box-sizing:border-box; overflow-y: scroll;}
.prd_road .cont1 li{position:relative; display:block; height:40px; border-bottom:1px solid #eee; }
.prd_road .cont1 li > a{display:inline-block; font-size:13px; color:#444; max-width:60%; height:40px; line-height: 40px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.prd_road .cont1 li strong{position:absolute; top:7px; right:0; font-size:0; border:1px solid #ccc; border-radius:3px; overflow: hidden;}
.prd_road .cont1 li strong a{ display:inline-block; max-width:70px; height:24px; line-height: 24px; font-size:11px; color:#919191; font-weight: normal; padding:0 7px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.prd_road .cont1 li strong a:first-child{border-right:1px solid #ccc;}
.prd_road .cont1 li strong a.on{background:#dbdbdb; color:#444;}

.prd_road .data_box{overflow-x: auto; height:100%; overflow-y: auto;}
.prd_road .data_box table{min-width:500px; white-space: nowrap; }

.prd_road .cont3{line-height: 40px; font-size:0; overflow-y: hidden !important;}
.prd_road .cont3 input{width:calc(100% - 33px); height:30px; line-height: 30px; border:1px solid #ddd; box-sizing:border-box; border-radius:3px; vertical-align: middle; font-size:12px;}
.prd_road .cont3 a{display:inline-block; width:30px; height:30px; line-height: 30px; margin-left:3px; border:1px solid #539bed; border-radius:3px; box-sizing:border-box; vertical-align: middle; font-size:12px; text-align: center; background: #539bed url(../img/prdc/btn_search5.png) 50% 50% no-repeat; background-size:18px;} 



@media screen and (max-width: 1024px){
	.prediction .prd_traffic > p{width:90px; padding:5px 0 5px 5px;}
	
}

@media screen and (max-width: 768px){
	.prediction .wrap > .l{float:none; width:100%; margin-bottom:50px;}
	.prediction .wrap > .r{float:none; width:100%; padding-left:0px;}
	.prd_road .data_box{height:248px;}
	
	.prediction .inner .roadInfo{height:450px;}
	.prediction .roadInfo .l{float:none; width:100%; height:200px; border-right:none; border-bottom:1px solid #b6b6b6; }
	.prediction .roadInfo .l dd{ height:115px;}
	.prediction .roadInfo .r{float:none; width:100%;}
	

}

@media screen and (max-width: 480px){

}




/*좌측달력*/
.prdCalendar{display:block; background: #515f79; padding: 15px;  text-align: center; box-sizing:border-box;}
.prdCalendar strong{display: block; font-size: 22px; color:rgba(255,255,255,0.4); font-weight:normal;}
.prdCalendar strong span{color:#fff; padding-left:10px;}
.prdCalendar table{ text-align: center; display: inline-block;}
.prdCalendar table th {height:28px; color:#fff; font-size: 12px; text-align: center; font-weight:normal;}
.prdCalendar table td {height: 28px; line-height: 28px; width:28px; }
.prdCalendar table td a{display:block; height: 24px; line-height: 24px; color:#fff; font-size: 11px; width:24px; text-align: center;}
.prdCalendar table td.sun a{color:#ff6a6a;}
.prdCalendar table td.sat a{color:#919191;}
.prdCalendar table td.today a{background: #539bed; color:#fff;}
.prdCalendar table td.otherM a{color:rgba(255,255,255,0.3);}

/**예측 검색*/
.prdSearch1{clear:both; display: block; padding:10px;}
.prdSearch1 .l{float:left; width:auto; border:1px solid #888; border-radius: 3px; box-sizing:border-box;}
.prdSearch1 .l a{float:left; height:28px; line-height:28px; color:#919191; font-size: 12px; font-weight:bold; padding:0 10px; }
.prdSearch1 .l a:first-child{border-right:1px solid #888;}
.prdSearch1 .l a.on{color:#444;}
.prdSearch1 .r{float:right; }
.prdSearch1 .r select{width:65px; height:30px; }


/*예측 팝업*/
/**/
.map_layer.prediction{width:600px}
.map_layer.prediction .wrapPd{padding:8px;}
.map_layer.prediction ul.tabs{overflow:hidden;margin-bottom:0px; padding:8px; padding-bottom:0;} 
.map_layer.prediction ul.tabs > li{float:left;width:50%; border-top:3px solid #4e4e4e;}
.map_layer.prediction ul.tabs > li.last{float:none;width:auto;overflow:hidden;}
.map_layer.prediction ul.tabs > li > a{display:block;height:30px;line-height:30px;text-align:center;font-weight:bold;background-color:#f6f6f6;border:1px solid #c2c2c2;border-right:none;}
.map_layer.prediction ul.tabs > li.last > a{border-right:1px solid #c2c2c2;}
.map_layer.prediction ul.tabs > li.active > a{border-bottom:1px solid #fff;background-color:#fff;color:#b51415;}

.map_layer.prediction .box1{border-top:1px solid #919191; }
.map_layer.prediction .box1 > p{ height:35px; line-height: 35px;  background: #f6f6f6; font-size: 12px; padding-left:10px; font-weight:bold;}
.map_layer.prediction .box1 .cont{padding:0px; box-sizing:border-box;}

.map_layer.prediction .txtpoint1{font-size:16px; line-height: 25px; font-weight:bold;}
.map_layer.prediction .txtpoint2{font-size:12px; font-weight:normal; color:#666;}
.map_layer.prediction .bl{display:inline-block; width:1px; height:15px; background: #ccc; margin:0px 10px;}

.map_layer.prediction .roadInfo{height:auto; overflow-y: auto;}
.map_layer.prediction .roadInfo:after{display:block;clear:both;content:'';}
.map_layer.prediction .roadInfo .tableWrap{height:150px; overflow-y: auto; padding:10px;}




















































