/* ============================================================ */
/* 42種 天氣圖示　即時訊息＞天氣資訊使用的 icon*/
/* ============================================================ */
.wthr_icon.w_1 {
    background-image: url(../image/weather/2024_1.png);
}

.wthr_icon.w_2 {
    background-image: url(../image/weather/2024_2.png);
}

.wthr_icon.w_3 {
    background-image: url(../image/weather/2024_3.png);
}

.wthr_icon.w_4 {
    background-image: url(../image/weather/2024_4.png);
}

.wthr_icon.w_5 {
    background-image: url(../image/weather/2024_5.png);
}

.wthr_icon.w_6 {
    background-image: url(../image/weather/2024_6.png);
}

.wthr_icon.w_7 {
    background-image: url(../image/weather/2024_7.png);
}

.wthr_icon.w_8 {
    background-image: url(../image/weather/2024_8.png);
}

.wthr_icon.w_9 {
    background-image: url(../image/weather/2024_9.png);
}

.wthr_icon.w_10 {
    background-image: url(../image/weather/2024_10.png);
}

.wthr_icon.w_11 {
    background-image: url(../image/weather/2024_11.png);
}

.wthr_icon.w_12 {
    background-image: url(../image/weather/2024_12.png);
}

.wthr_icon.w_13 {
    background-image: url(../image/weather/2024_13.png);
}

.wthr_icon.w_14 {
    background-image: url(../image/weather/2024_14.png);
}

.wthr_icon.w_15 {
    background-image: url(../image/weather/2024_15.png);
}

.wthr_icon.w_16 {
    background-image: url(../image/weather/2024_16.png);
}

.wthr_icon.w_17 {
    background-image: url(../image/weather/2024_17.png);
}

.wthr_icon.w_18 {
    background-image: url(../image/weather/2024_18.png);
}

.wthr_icon.w_19 {
    background-image: url(../image/weather/2024_19.png);
}

.wthr_icon.w_20 {
    background-image: url(../image/weather/2024_20.png);
}

.wthr_icon.w_21 {
    background-image: url(../image/weather/2024_21.png);
}

.wthr_icon.w_22 {
    background-image: url(../image/weather/2024_22.png);
}

.wthr_icon.w_23 {
    background-image: url(../image/weather/2024_23.png);
}

.wthr_icon.w_24 {
    background-image: url(../image/weather/2024_24.png);
}

.wthr_icon.w_25 {
    background-image: url(../image/weather/2024_25.png);
}

.wthr_icon.w_26 {
    background-image: url(../image/weather/2024_26.png);
}

.wthr_icon.w_27 {
    background-image: url(../image/weather/2024_27.png);
}

.wthr_icon.w_28 {
    background-image: url(../image/weather/2024_28.png);
}

.wthr_icon.w_29 {
    background-image: url(../image/weather/2024_29.png);
}

.wthr_icon.w_30 {
    background-image: url(../image/weather/2024_30.png);
}

.wthr_icon.w_31 {
    background-image: url(../image/weather/2024_31.png);
}

.wthr_icon.w_32 {
    background-image: url(../image/weather/2024_32.png);
}

.wthr_icon.w_33 {
    background-image: url(../image/weather/2024_33.png);
}

.wthr_icon.w_34 {
    background-image: url(../image/weather/2024_34.png);
}

.wthr_icon.w_35 {
    background-image: url(../image/weather/2024_35.png);
}

.wthr_icon.w_36 {
    background-image: url(../image/weather/2024_36.png);
}

.wthr_icon.w_37 {
    background-image: url(../image/weather/2024_37.png);
}

.wthr_icon.w_38 {
    background-image: url(../image/weather/2024_38.png);
}

.wthr_icon.w_39 {
    background-image: url(../image/weather/2024_39.png);
}

.wthr_icon.w_40 {
    background-image: url(../image/weather/2024_40.png);
}

.wthr_icon.w_41 {
    background-image: url(../image/weather/2024_41.png);
}

.wthr_icon.w_42 {
    background-image: url(../image/weather/2024_42.png);
}

.wthr_icon.w_n_1 {
    background-image: url(../image/weather/2024_n_1.png);
}

.wthr_icon.w_n_2 {
    background-image: url(../image/weather/2024_n_2.png);
}

.wthr_icon.w_n_3 {
    background-image: url(../image/weather/2024_n_3.png);
}

.wthr_icon.w_n_4 {
    background-image: url(../image/weather/2024_n_4.png);
}

.wthr_icon.w_n_5 {
    background-image: url(../image/weather/2024_5.png);
}

.wthr_icon.w_n_6 {
    background-image: url(../image/weather/2024_6.png);
}

.wthr_icon.w_n_7 {
    background-image: url(../image/weather/2024_7.png);
}

.wthr_icon.w_n_8 {
    background-image: url(../image/weather/2024_8.png);
}

.wthr_icon.w_n_9 {
    background-image: url(../image/weather/2024_9.png);
}

.wthr_icon.w_n_10 {
    background-image: url(../image/weather/2024_10.png);
}

.wthr_icon.w_n_11 {
    background-image: url(../image/weather/2024_11.png);
}

.wthr_icon.w_n_12 {
    background-image: url(../image/weather/2024_12.png);
}

.wthr_icon.w_n_13 {
    background-image: url(../image/weather/2024_13.png);
}

.wthr_icon.w_n_14 {
    background-image: url(../image/weather/2024_14.png);
}

.wthr_icon.w_n_15 {
    background-image: url(../image/weather/2024_15.png);
}

.wthr_icon.w_n_16 {
    background-image: url(../image/weather/2024_16.png);
}

.wthr_icon.w_n_17 {
    background-image: url(../image/weather/2024_17.png);
}

.wthr_icon.w_n_18 {
    background-image: url(../image/weather/2024_18.png);
}

.wthr_icon.w_n_19 {
    background-image: url(../image/weather/2024_n_19.png);
}

.wthr_icon.w_n_20 {
    background-image: url(../image/weather/2024_n_20.png);
}

.wthr_icon.w_n_21 {
    background-image: url(../image/weather/2024_n_21.png);
}

.wthr_icon.w_n_22 {
    background-image: url(../image/weather/2024_n_22.png);
}

.wthr_icon.w_n_23 {
    background-image: url(../image/weather/2024_23.png);
}

.wthr_icon.w_n_24 {
    background-image: url(../image/weather/2024_n_24.png);
}

.wthr_icon.w_n_25 {
    background-image: url(../image/weather/2024_n_25.png);
}

.wthr_icon.w_n_26 {
    background-image: url(../image/weather/2024_n_26.png);
}

.wthr_icon.w_n_27 {
    background-image: url(../image/weather/2024_n_27.png);
}

.wthr_icon.w_n_28 {
    background-image: url(../image/weather/2024_28.png);
}

.wthr_icon.w_n_29 {
    background-image: url(../image/weather/2024_n_29.png);
}

.wthr_icon.w_n_30 {
    background-image: url(../image/weather/2024_30.png);
}

.wthr_icon.w_n_31 {
    background-image: url(../image/weather/2024_n_31.png);
}

.wthr_icon.w_n_32 {
    background-image: url(../image/weather/2024_32.png);
}

.wthr_icon.w_n_33 {
    background-image: url(../image/weather/2024_n_33.png);
}

.wthr_icon.w_n_34 {
    background-image: url(../image/weather/2024_34.png);
}

.wthr_icon.w_n_35 {
    background-image: url(../image/weather/2024_n_35.png);
}

.wthr_icon.w_n_36 {
    background-image: url(../image/weather/2024_36.png);
}

.wthr_icon.w_n_37 {
    background-image: url(../image/weather/2024_37.png);
}

.wthr_icon.w_n_38 {
    background-image: url(../image/weather/2024_38.png);
}

.wthr_icon.w_n_39 {
    background-image: url(../image/weather/2024_39.png);
}

.wthr_icon.w_n_40 {
    background-image: url(../image/weather/2024_40.png);
}

.wthr_icon.w_n_41 {
    background-image: url(../image/weather/2024_41.png);
}

.wthr_icon.w_n_42 {
    background-image: url(../image/weather/2024_42.png);
}

.wthr_group {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    align-items: center;
}

.wthr_icon_bmb,
.wthr_icon {
    display: inline-block;
    /* 或 block 都可 */
    width: 34px;
    height: 34px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 34px auto;
    /* 你本來就有 */
}

.wthr_marker_img {
    width: 35px;
    height: 35px;
}

/* ============================================================ */
/* 42種 天氣圖示　即時訊息＞天氣資訊使用的 icon*/
/* ============================================================ */

/* ============================================================ */
/*                     road mark                                */
/* ============================================================ */
span.mark {
    font-size: 0;
    width: 22px;
    height: 22px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 2px;
    background-size: 22px 22px;
}

/* 國道 梅花圖標 11種 */
span.mark_10010 {
    background: url("../image/mark/10010.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10018 {
    background: url("../image/mark/10018.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10019 {
    background: url("../image/mark/10019.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10020 {
    background: url("../image/mark/10020.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10030 {
    background: url("../image/mark/10030.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10031 {
    background: url("../image/mark/10031.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10040 {
    background: url("../image/mark/10040.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10050 {
    background: url("../image/mark/10050.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10060 {
    background: url("../image/mark/10060.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10080 {
    background: url("../image/mark/10080.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_10100 {
    background: url("../image/mark/10100.png") no-repeat center center;
    background-size: 22px 22px;
}

/* 南港聯絡道 */
span.mark_10039 {
    background: url("../image/mark/10039.png") no-repeat center center;
    background-size: 22px 22px;
}

/* 港西聯外道路" 台2己 */
span.mark_10038 {
    background: url("../image/mark/10038.png") no-repeat center center;
    background-size: 22px 22px;
}

/* 快速道路 紅盾圖標  */
span.mark_20620 {
    background: url("../image/mark/20620.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20640 {
    background: url("../image/mark/20640.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20660 {
    background: url("../image/mark/20660.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20680 {
    background: url("../image/mark/20680.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20720 {
    background: url("../image/mark/20720.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20740 {
    background: url("../image/mark/20740.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20741 {
    background: url("../image/mark/20741.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20760 {
    background: url("../image/mark/20760.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20780 {
    background: url("../image/mark/20780.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20820 {
    background: url("../image/mark/20820.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20840 {
    background: url("../image/mark/20840.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20860 {
    background: url("../image/mark/20860.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20880 {
    background: url("../image/mark/20880.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20610 {
    background: url("../image/mark/20610.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2061J {
    background: url("../image/mark/2061J.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2062J {
    background: url("../image/mark/2062J.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20650 {
    background: url("../image/mark/20650.png") no-repeat center center;
    background-size: 22px 22px;
}

/* 省道 藍盾圖標  */
span.mark_20010 {
    background: url("../image/mark/20010.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20020 {
    background: url("../image/mark/20020.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2002b {
    background: url("../image/mark/2002b.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20030 {
    background: url("../image/mark/20030.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20090 {
    background: url("../image/mark/20090.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20140 {
    background: url("../image/mark/20140.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20170 {
    background: url("../image/mark/20170.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2014B {
    background: url("../image/mark/2014B.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2014E {
    background: url("../image/mark/2014E.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20280 {
    background: url("../image/mark/20280.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_2061E {
    background: url("../image/mark/2061E.png") no-repeat center center;
    background-size: 22px 22px;
}

span.mark_20630 {
    background: url("../image/mark/20630.png") no-repeat center center;
    background-size: 22px 22px;
}

/* 省道 長方形框  */
span.mark_31180,
span.mark_31360,
span.mark_31390,
span.mark_31440,
span.mark_31480 {
    width: 32px;
    height: 32px;
}

span.mark_31180 {
    background: url("../image/mark/31180.png") no-repeat center center;
    background-size: 32px 32px;
}

span.mark_31360 {
    background: url("../image/mark/31360.png") no-repeat center center;
    background-size: 32px 32px;
}

span.mark_31390 {
    background: url("../image/mark/31390.png") no-repeat center center;
    background-size: 32px 32px;
}

span.mark_31440 {
    background: url("../image/mark/31440.png") no-repeat center center;
    background-size: 32px 32px;
}

span.mark_31480 {
    background: url("../image/mark/31480.png") no-repeat center center;
    background-size: 32px 32px;
}

/* 省道 彰195  */
span.mark_31950 {
    width: 40px;
    height: 32px;
    background: url("../image/mark/31950.png") no-repeat center center;
    background-size: 40px 32px;
}

/* 省道 宜4匝道  */
span.mark_3y4 {
    width: 40px;
    height: 32px;
    background: url("../image/mark/3y4.png") no-repeat center 7px;
    background-size: 40px 32px;
}

/* 106乙 */
span.mark_3106e {
    width: 40px;
    height: 32px;
    background: url("../image/mark/3106e.png") no-repeat center 7px;
    background-size: 40px 32px;
}

/* ============================================================ */
/*                     road mark  END                              */
/* ============================================================ */