@charset "utf-8";
header .gnb nav .pc_menuArea li a { height: 40px; font-size: 15px; color: #000000; font-weight: 500; display: flex !important; justify-content: center; align-items: center; line-height: 1.5; }

.main_con { min-height: calc(100vh - 194px); }
.main_con .wrap { display: flex; flex-wrap: wrap; width: 1400px; padding: 40px 0; margin: 0 auto; }
.main_con .map_area { width: 100%; height: 320px;  }
.main_con .map_area #map { height: 100%; }

.main_con .title_area { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: -11px; }
.main_con h2 { width: 97%; font-size: 21px; font-weight: 800; }
.main_con .morebtn { display: block; width: fit-content; font-size: 36px; font-weight: 400; }
.main_con .traffic_area { width: 50%; max-height: 330px; overflow: hidden; padding: 30px 20px; box-sizing: border-box; background-color: #2364ac; }
.main_con .traffic_area h2 { color: #ffffff; }
.main_con .traffic_area .morebtn { color: #ffffff; }
.main_con .traffic_area ul { height: 213px; overflow-y: scroll; margin-top: 25px; padding: 5px; box-sizing: border-box; background-color: #225a97; }
.main_con .traffic_area ul li { display: flex; margin-bottom: 15px; }
.main_con .traffic_area ul li:last-child { margin-bottom: 0; }
.main_con .traffic_area ul li .traffic_txt { max-width: 490px; color: #ffffff; margin-left: 12px; }
.main_con .traffic_area ul li .traffic_txt h4, .main_con .traffic_area ul li .traffic_txt p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.main_con .traffic_area ul li .traffic_txt h4 { display: inline-block; width: 100%; font-size: 15px; font-weight: 700; margin-bottom: 0; vertical-align: -webkit-baseline-middle; }
.main_con .traffic_area ul li .traffic_txt .speed { display: inline-block; text-align: center; width: 80px; font-size: 14px; padding: 3px 0; margin-right: 5px; border-radius: 10px; box-sizing: border-box; }
.main_con .traffic_area ul li .traffic_txt .speed.sp01 { background-color: #737373; width: 100px;}
.main_con .traffic_area ul li .traffic_txt .speed.sp02 { background-color: #eb0000; }
.main_con .traffic_area ul li .traffic_txt .speed.sp03 { background-color: #0d872e; }
.main_con .traffic_area ul li .traffic_txt .speed.sp04 { background-color: #ffc400; color: #111111; }
.main_con .traffic_area ul li .traffic_txt p span { color: #49efff; }
.main_con .traffic_area ul li .traffic_txt p { font-size: 14px; color: #ffffff; font-weight: 600; line-height: 17px; }

.main_con .icon_area {  width: 30%; background-color: #c5e1ff; box-sizing: border-box; }
.main_con .icon_area ul { position: relative; display: flex; flex-wrap: wrap; }
.main_con .icon_area ul:before { content: ''; width: 1px; height: 100%; position: absolute; top: 0; left: 50%; background-color: #a9cbf1; }
.main_con .icon_area ul:after { content: ''; width: 100%; height: 1px; position: absolute; top: 49.5%; left: 0; background-color: #a9cbf1; }
.main_con .icon_area ul li { display: flex; align-items: center; justify-content: center; width: 50%; height: 100%; min-height: 161.5px; padding: 25px 10px 15px 10px; text-align: center; box-sizing: border-box; }
.main_con .icon_area ul li a { display: block; height: 100%; }
.main_con .icon_area a p { font-size: 17px; color: #072c56; font-weight: 800; }
.main_con .icon_area a p img { width: 60px; }
.main_con .icon_area a p.titlep { min-height: 36px; margin-top: 12px; }

.main_con .notice_area { width: 20%; padding: 30px; background-color: #ffffff; border: 1px solid #e5e5e5; box-sizing: border-box; }
.main_con .notice_area h2 { width: 88%; word-break: break-all; color: #0057b9; } 
.main_con .notice_area .morebtn { color: #0057b9; }
.main_con .notice_area ul { position: relative; padding-top: 30px; }
.main_con .notice_area ul:after { content: ''; height: 1px; width: 100%; position: absolute; top: 56%; left: 0; background-color: #e5e5e5; }
.main_con .notice_area ul li:first-child { padding-bottom: 70px; }
.main_con .notice_area ul li a p { height: 33px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 13px; font-size: 16px; color: #333333; }
.main_con .notice_area ul li a span { font-size: 14px; color: #6e6e6e; font-weight: 700; }



/* 하단푸터 */
footer { background-color: #eeeeee; padding: 20px 60px; }
footer .footerArea { display: flex; align-items: center; width: 100%; margin: 0 auto; }
footer .footerArea .foot_logo img { display: inline-block; width: 38px; vertical-align: middle; }
footer .footerArea .foot_logo p { display: inline-block; font-weight: 500; margin-left: 10px; vertical-align: middle !important; }
footer .footerArea .foot_text span { display: block; margin-left: 90px; }


@media screen and (max-width:1400px)
{
    .main_con { min-height: calc(100vh - 205px); }
    .main_con .wrap { width: 100%; padding: 0; }

    .footerArea { display: block !important; width: 100% !important; box-sizing: border-box; }
    .footerArea .foot_text { margin-top: 15px;  }
    .footerArea .foot_text span { margin-left: 0 !important; }
}

@media all and (min-width:1099px) and (max-width:1399px)
{
    .main_con .traffic_area ul li .traffic_txt { max-width: 400px; }
}

@media screen and (max-width:1100px)
{
    .main_con .traffic_area, .main_con .icon_area, .main_con .notice_area { width: 100%; }
    .main_con .icon_area:after { width: 91%; }
    .main_con .traffic_area ul li .traffic_txt { width: 83%; max-width: unset; }
    .main_con .traffic_area ul li { width: 100%; align-items: flex-start; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .main_con .notice_area ul li:first-child { padding-bottom: 0; }
    .main_con .notice_area ul li:last-child { display: none; }
    .main_con .notice_area ul:after { content: none; }
    
    footer { background-color: #eeeeee; padding: 20px; }
}

@media screen and (max-width:550px)
{
    .main_con .traffic_area ul li .traffic_condi img { width: 55px; }
}
@media screen and (max-width:420px)
{
    header h1 p { width: 185px; }

    .main_con .traffic_area ul li .traffic_txt p { width: 95%; }

    footer .footerArea .foot_logo p { font-size: 15px; }

    /* 231227_추가 */
    footer .footerArea .foot_logo img { width: 32px; }
    .foot_text { font-size: 14px; }
}


.gm-style-iw-a {
    visibility: visible;
}
.gm-ui-hover-effect{
    display: none !important;
}

.mappopSudden { display: block; position: absolute; overflow: hidden; width: 352px; padding: 0; background: #ffffff; border:1px solid #e6e6e6; z-index: 3; box-sizing: border-box; }
.mappopSudden .pophead { display: flex; justify-content: space-between; align-items: center; background-color: #0650a3; width: 100%; height: 30px; padding: 5px 10px; box-sizing: border-box; }
.mappopSudden .pophead h5 { width: 90%; font-weight: 500; }
.mappopSudden .pophead h5 span { color: #ffffff; font-size: 13px; font-weight: 600; padding: 0 7px; border-right: 1px solid #e0e4f1; vertical-align: -2px; }
.mappopSudden .pophead h5 p { display: inline-block; width: 73%; font-size: 16px; font-weight: 500; color: #fff799; padding-left: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: -6px; }
.mappopSudden .pophead a img { width: 16px; }
.mappopSudden .popcon { width: 100%; padding: 1px 5px 5px 5px; box-sizing: border-box; height: 140px; }
.mappopSudden .popcon table { width: 100%; table-layout: fixed; font-size: 11px; font-weight: 400; border: 1px solid #d5d5d5; border-top: 1px solid #0650a3; height: 100%; }
/*.mappopSudden .popcon table tr { height: 35px; }*/
.mappopSudden .popcon table tr th { width: 30%; padding: 0 5px; font-weight: 600; text-align: center; vertical-align: middle; color: #000000; line-height: 1.3; word-wrap: break-word; background-color: #e2f0ff; border: 1px solid #d5d5d5; border-width: 0 1px 1px 0; box-sizing: border-box; }
.mappopSudden .popcon table tr:last-child th { border-bottom-width: 0; }
.mappopSudden .popcon table tr td { width: 70%; padding: 0 10px; font-weight: 500; color: #000000; vertical-align: middle; line-height: 1.3; word-wrap: break-word; border-bottom: 1px solid #d5d5d5; box-sizing: border-box; }
.mappopSudden .popcon table tr:last-child td { border-bottom-width: 0; }

/* 메인_정보보기 */
.monitor_check { position: absolute; top: 180px; right: 340px; z-index: 900; padding: 10px; background-color: rgba(77, 90, 99, .8); border-radius: 10px; }
.choose_moni { margin-bottom: 10px; }
.choose_moni:last-child { margin-bottom: 0; }
.choose_moni span {display: inline-block;font-size: 14px;color: #ffffff;/* margin: 13px 0 0 5px; *//* vertical-align: top; */}