@charset "utf-8";

.rwd-topbar,
.rwd-drawer,
.rwd-drawer-overlay,
.rwd-bottombar {
    display: none;
}

.social-share-group {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 6px;
    margin: 6px 0;
}

.social-share-btn {
    display: -webkit-inline-flex;
    display: inline-flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 4px;
    color: #ffffff !important;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
    padding: 0;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.social-share-btn svg {
    width: 17px;
    height: 17px;
    display: block;
}

.social-share-btn:hover {
    transform: translateY(-2px);
    opacity: 0.92;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.18);
}

.social-share-btn:active {
    transform: translateY(0);
}

/* 品牌專屬色系 */
.social-share-btn.share-fb {
    background-color: #1877f2 !important;
}

.social-share-btn.share-line {
    background-color: #06c755 !important;
}

.social-share-btn.share-threads {
    background-color: #101010 !important;
}

.social-share-btn.share-x {
    background-color: #000000 !important;
}

.social-share-btn.share-tg {
    background-color: #229ed9 !important;
}

.social-share-btn.share-plurk {
    background-color: #ff574d !important;
}

/* 活動清單微型按鈕 */
.board_share .social-share-group {
    margin: 2px 0 0 0;
    gap: 4px;
}

.board_share .social-share-btn {
    width: 22px;
    height: 22px;
    border-radius: 3px;
}

.board_share .social-share-btn svg {
    width: 12px;
    height: 12px;
}

@media screen and (max-width: 1023px) {

    div.wrapper {
        width: auto;
        max-width: 1000px;
        min-height: 0;
        padding: 0 8px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* --- 頂部聯播列 --- */
    #url_top {
        width: auto;
        height: auto;
        line-height: 1.6;
        padding: 4px 8px;
        text-align: center;
    }

    /* --- Banner 區 --- */
    div.banner,
    div.banner-fb {
        width: auto;
        height: auto;
        min-height: 110px;
        background-position: left top;
    }
	
    div.banner_bg {
        height: 280px;
    }

    /* 左右導覽列改為堆疊，避免在窄螢幕互相重疊 */
    div.banner_left,
    div.banner_right {
        float: none;
        display: block;
        margin: 0;
        padding: 4px 0 4px 200px;
        /* 保留左側 Logo 點擊區 (a.banner_link 190x90) */
        line-height: 1.8;
    }

    /* --- 麵包屑導覽 --- */
    ul.sitemap {
        height: auto;
        overflow: hidden;
        margin: 5px 0;
    }

    /* --- 主內容 / 側邊欄：雙欄改單欄 --- */
    div.frame_left {
        width: auto;
        float: none;
        margin-left: 0;
    }

    div.frame_right {
        margin-left: 0;
    }

    div.fixed {
        float: none;
        width: auto;
        max-width: 460px;
        margin: 16px auto 0;
    }

    /* --- 頁尾 --- */
    div.footer {
        height: auto;
        padding-bottom: 16px;
    }

    div.footer_frame {
        width: auto;
        height: auto;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    div.about {
        width: auto;
    }

    /* 頁尾原以絕對定位排版，於窄螢幕改回正常文件流 */
    div.partner,
    div.copyright,
    div.policy {
        position: static;
        width: auto;
        height: auto;
        border-left: none;
        padding: 8px 0 0 0;
        margin-top: 8px;
    }

    div.partner {
        border-top: 1px dashed #cccccc;
    }
	
    div.content_frame_body img,
    div.small_frame img,
    div.middle_content img,
    div.event_descript img {
        max-width: 100%;
    }
	
    body {
        overflow-x: hidden;
    }

    /* 寬表格改為容器內水平捲動，避免撐破版面 */
    .rwd-table-scroll {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media screen and (max-width: 767px) {

    /* --- 隱藏桌面版頁首，改用 RWD 頂部列 --- */
    #url_top,
    div.banner,
    div.banner-fb,
    div.banner_bg {
        display: none;
    }

    /* 為固定式頂部列預留空間 */
    body {
        padding-top: 50px;
    }

    div.wrapper {
        padding: 0 8px;
    }

    ul.sitemap {
        font-size: 12px;
        margin: 8px 0;
    }

    div.fixed {
        max-width: none;
    }

    body div.footer {
        height: auto !important;
        background: #f8fafc !important;
        border-top: 1px solid #e2e8f0 !important;
        padding: 20px 16px 84px !important;
        /* 84px 預留給底部功能列 */
        box-sizing: border-box !important;
    }

    body div.footer_frame {
        width: 100% !important;
        height: auto !important;
        margin: 0 auto !important;
        padding: 0 !important;
        position: static !important;
        text-align: center !important;
    }

    body div.footer div.about {
        width: 100% !important;
        background: none !important;
        padding: 0 !important;
        margin: 0 auto 12px !important;
        text-align: center !important;
    }

    body div.footer div.about p {
        display: none !important;
    }

    body div.footer div.about img {
        float: none !important;
        display: inline-block !important;
        margin: 0 auto 6px !important;
        max-width: 140px !important;
        height: auto !important;
    }

    body div.footer div.partner {
        display: none !important;
    }

    body div.footer div.policy {
        position: static !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 6px 12px !important;
        margin: 10px 0 8px !important;
        font-size: 13px !important;
    }

    body div.footer div.policy a {
        color: #64748b !important;
        text-decoration: none !important;
    }

    body div.footer div.copyright {
        position: static !important;
        font-size: 12px !important;
        color: #94a3b8 !important;
        line-height: 1.5 !important;
    }


    /* --- 表單元素加大觸控熱區 --- */
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    select,
    textarea {
        max-width: 100%;
		width: 100%;
        font-size: 16px;
        padding: 8px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    input[type="submit"],
    input[type="button"],
    button {
        min-height: 44px;
        padding: 8px 16px;
        font-size: 15px;
    }

    /* --- 側邊固定浮動連結（問題反應／回到上層）於手機端隱藏，避免遮擋內文 --- */
    .float-link,
    body .float-link {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {

    .rwd-topbar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 50px;
        background: #007BCB;
        z-index: 1000;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    }

    .rwd-topbar__btn {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 50px;
        height: 50px;
        padding: 0;
        border: 0;
        background: transparent;
        cursor: pointer;
        line-height: 0;
        text-align: center;
    }

    .rwd-topbar__btn svg {
        width: 24px;
        height: 24px;
        vertical-align: middle;
        fill: #ffffff;
    }

    .rwd-topbar__btn img {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        vertical-align: middle;
        border: 1px solid rgba(255, 255, 255, 0.6);
    }

    .rwd-topbar__title {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-width: 0;
        margin: 0;
        padding: 0 4px;
        color: #ffffff;
        font-size: 16px;
        font-weight: normal;
        line-height: 50px;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .rwd-topbar__title a {
        color: #ffffff;
        text-decoration: none;
    }
}

@media screen and (max-width: 767px) {

    .rwd-drawer-overlay {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 1001;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity 0.25s ease, visibility 0.25s ease;
        transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    .rwd-drawer-overlay.is-open {
        opacity: 1;
        visibility: visible;
    }

    .rwd-drawer {
        display: block;
        position: fixed;
        top: 0;
        bottom: 0;
        width: 78%;
        max-width: 300px;
        background: #ffffff;
        z-index: 1002;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        -webkit-transition: -webkit-transform 0.25s ease;
        transition: transform 0.25s ease;
    }

    .rwd-drawer--left {
        left: 0;
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-box-shadow: 2px 0 6px rgba(0, 0, 0, 0.2);
        box-shadow: 2px 0 6px rgba(0, 0, 0, 0.2);
    }

    .rwd-drawer--right {
        right: 0;
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-box-shadow: -2px 0 6px rgba(0, 0, 0, 0.2);
        box-shadow: -2px 0 6px rgba(0, 0, 0, 0.2);
    }

    .rwd-drawer.is-open {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
	
    .rwd-drawer__header {
        background: #58C9E6;
        color: #ffffff;
        padding: 0 16px;
        height: 50px;
        line-height: 50px;
        font-size: 15px;
    }

    .rwd-drawer__header a {
        color: #ffffff;
    }

    .rwd-drawer__group {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .rwd-drawer__divider {
        background: #f0f0f0;
        color: #007BCB;
        font-size: 13px;
        font-weight: bold;
        padding: 8px 16px;
        border-top: 1px solid #e0e0e0;
        border-bottom: 1px solid #e0e0e0;
    }

    .rwd-drawer__group li a {
        display: block;
        padding: 12px 16px;
        /* 觸控熱區 >= 44px 高 */
        color: #444444;
        font-size: 15px;
        border-bottom: 1px solid #eeeeee;
        text-decoration: none;
    }

    .rwd-drawer__group li a:active {
        background: #eaf6fc;
    }
}

@media screen and (max-width: 767px) {

    .rwd-bottombar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        height: 48px;
        background: #ffffff;
        border-top: 1px solid #d5d5d5;
        z-index: 1000;
    }

    .rwd-bottombar a {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
        flex: 1 1 0;
        display: block;
        line-height: 48px;
        text-align: center;
        color: #007BCB;
        font-size: 13px;
        text-decoration: none;
        border-left: 1px solid #eeeeee;
    }

    .rwd-bottombar a:first-child {
        border-left: 0;
    }

    .rwd-bottombar a.is-active {
        color: #FF8706;
        font-weight: bold;
    }

    /* 有底部列時，避免頁尾內容被遮住 */
    body.has-rwd-bottombar {
        padding-bottom: 48px;
    }
}

body.rwd-drawer-open {
    overflow: hidden;
}

body div.travel h3 {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l2.4 6.6L21 11l-5.4 4.4L17 22l-5-3.8L7 22l1.4-6.6L3 11l6.6-2.4z'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #f5c46e 0%, #eeb653 45%, #e09f30 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.guest h3 {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 3z'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #2ebd68 0%, #229350 45%, #197a40 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.board h3 {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='2' width='8' height='4' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cline x1='9' y1='12' x2='15' y2='12'/%3E%3Cline x1='9' y1='16' x2='15' y2='16'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #ff7373 0%, #ff5454 45%, #e83a3a 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.board {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body div.who2 strong,
body div.who#reg_query strong,
body #reg_query_title_login,
body #reg_query_title {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3Cpolyline points='8 11 10.5 13.5 14 9'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #74e5e3 0%, #54ddda 45%, #38c2bf 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.new_event strong {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #43c2f5 0%, #1bb0ef 45%, #0d96d4 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.new_partner strong,
body div.about_event strong,
body div.good_event strong {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #4ecbf5 0%, #25bcef 45%, #10a2d4 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.facebook {
    background-image: none !important;
    padding-top: 0 !important;
    position: relative !important;
}

body div.facebook::before {
    content: "留言與討論" !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #a6bcee 0%, #8ea6d8 45%, #768ec2 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
}

body div.member,
body div.who,
body div.who2,
body div.new_event,
body div.new_partner,
body div.about_event,
body div.good_event,
body div.about_us,
body div.about_us2,
body div.about_us3,
body div.facebook,
body div.hot_event {
    background-image: none !important;
    background-color: transparent !important;
    padding-top: 0 !important;
}

/* 電腦版左欄區塊統一內縮 15px，寬度 650px */
@media screen and (min-width: 768px) {

    body div.frame_left div.event_content,
    body div.frame_left div.who,
    body div.frame_left div.facebook {
        margin-left: 15px !important;
        width: 650px !important;
        box-sizing: border-box !important;
    }
}

body div.guest {
    position: relative !important;
}

body div.guest ul.small_tab {
    position: absolute !important;
    top: 6px !important;
    right: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    gap: 3px !important;
    z-index: 2 !important;
}

body div.guest ul.small_tab li {
    float: none !important;
    margin: 0 !important;
}

body div.guest ul.small_tab li a {
    display: block !important;
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    height: 24px !important;
    line-height: 24px !important;
    width: auto !important;
    padding: 0 7px !important;
    text-shadow: none !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}

body div.guest ul.small_tab li a:hover,
body div.guest ul.small_tab li.active a {
    background: #ffffff !important;
    color: #229350 !important;
    font-weight: bold !important;
    border-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

body div.good_event,
body div.new_event,
body div.hot_event {
    position: relative !important;
}

body div.good_event ul.middle_tab,
body div.new_event ul.middle_tab,
body div.hot_event ul.middle_tab {
    position: absolute !important;
    top: 6px !important;
    right: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    gap: 4px !important;
    z-index: 2 !important;
}

body div.good_event ul.middle_tab li,
body div.new_event ul.middle_tab li,
body div.hot_event ul.middle_tab li {
    float: none !important;
    margin: 0 !important;
}

body div.good_event ul.middle_tab li a,
body div.new_event ul.middle_tab li a,
body div.hot_event ul.middle_tab li a {
    display: block !important;
    background: rgba(255, 255, 255, 0.25) !important;
    background-image: none !important;
    color: #ffffff !important;
    border-radius: 3px !important;
    font-size: 11px !important;
    height: 24px !important;
    line-height: 24px !important;
    width: auto !important;
    padding: 0 8px !important;
    text-shadow: none !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}

body div.good_event ul.middle_tab li a:hover,
body div.good_event ul.middle_tab li.active2 a,
body div.new_event ul.middle_tab li a:hover,
body div.new_event ul.middle_tab li.active2 a,
body div.hot_event ul.middle_tab li a:hover,
body div.hot_event ul.middle_tab li.active2 a {
    background: #ffffff !important;
    background-image: none !important;
    color: #10a2d4 !important;
    font-weight: bold !important;
    border-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

body div.member ul.middle_tab {
    position: static !important;
    display: flex !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: linear-gradient(to bottom, #4ecbf5 0%, #25bcef 45%, #10a2d4 100%) !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    box-sizing: border-box !important;
    align-items: center !important;
}

body div.member ul.middle_tab li {
    float: none !important;
    margin: 0 !important;
    height: 36px !important;
    line-height: 36px !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

body div.member ul.middle_tab li#c1 {
    flex: 1 1 auto !important;
}

body div.member ul.middle_tab li#c1 a {
    display: block !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px !important;
    background-color: transparent !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    padding: 0 12px 0 36px !important;
    width: auto !important;
    height: 36px !important;
    line-height: 36px !important;
    text-align: left !important;
    text-decoration: none !important;
    border: none !important;
    box-sizing: border-box !important;
}

body div.member ul.middle_tab li#c2 {
    flex: 0 0 auto !important;
    margin-right: 8px !important;
    height: auto !important;
    line-height: normal !important;
}

body div.member ul.middle_tab li#c2 a {
    display: block !important;
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    height: 24px !important;
    line-height: 24px !important;
    width: auto !important;
    padding: 0 8px !important;
    text-shadow: none !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}

body div.member ul.middle_tab li#c2 a:hover,
body div.member ul.middle_tab li#c2.active2 a {
    background: #ffffff !important;
    color: #10a2d4 !important;
    font-weight: bold !important;
    border-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}



body div#event_like.who strong {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l2.4 6.6L21 11l-5.4 4.4L17 22l-5-3.8L7 22l1.4-6.6L3 11l6.6-2.4z'/%3E%3C/svg%3E") no-repeat 10px center / 18px 18px,
        linear-gradient(to bottom, #43c2f5 0%, #1bb0ef 45%, #0d96d4 100%) !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 12px 0 36px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.06) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28) !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

body div.middle_footer,
body div.small_frame_footer,
body div.sub_content_frame_footer {
    background: #f9f9f9 !important;
    background-image: none !important;
    border-left: 1px solid #bbbbbb;
    border-right: 1px solid #bbbbbb;
    border-bottom: 1px solid #bbbbbb;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    height: 6px !important;
}

body div.content_frame_footer {
    background: #ffffff !important;
    background-image: none !important;
    border-left: 1px solid #bbbbbb;
    border-right: 1px solid #bbbbbb;
    border-bottom: 1px solid #bbbbbb;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    height: 6px !important;
}

@media screen and (max-width: 767px) {

    /* --- 推薦活動輪播 --- */
    #adblock {
        width: auto;
    }

    #adblock ul.showbox,
    #adblock ul.showbox li {
        width: 100%;
    }

    #adblock a img {
        width: 100%;
        height: auto;
    }

    #adblock ul.eventlink {
        display: none;
    }

    div.event_descript {
        width: auto;
        right: 0;
        margin: 10px;
    }

    /* --- 最新公益活動 / 熱門活動 雙欄改單欄 --- */
    div.travel {
        float: none;
        width: auto;
        margin-bottom: 8px;
    }

    div.guest {
        margin-left: 0;
        width: auto;
        margin-bottom: 8px;
    }

    div.middle_content {
        height: auto;
        min-height: 180px;
    }

    div.travel_left {
        float: none;
        width: auto;
        text-align: center;
    }

    div.travel_photo {
        display: inline-block;
        width: 126px;
        height: 126px;
        margin: 0 auto;
        text-align: center;
    }

    div.travel_left .link ul {
        display: flex;
        justify-content: center;
        margin: 8px 0 0 0;
        padding: 0;
        list-style: none;
        height: auto;
    }

    div.travel_left .link li {
        float: none;
        margin: 0 4px;
    }

    div.travel_right {
        margin-left: 0;
        margin-top: 10px;
        text-align: left;
    }

    /* --- 區塊標題列的頁籤（北部／中部／南部…）允許換行 --- */
    ul.small_tab,
    ul.middle_tab {
        position: static;
        margin: 0 0 8px 0;
        overflow: hidden;
    }

    ul.small_tab li,
    ul.middle_tab li {
        float: left;
        margin: 0 1px 1px 0;
    }

    /* --- 首頁側欄去蕪存菁：手機端隱藏底部重複的桌機側欄 --- */
    body div.frame_left+div.frame_right div.fixed>div.member,
    body div.frame_left+div.frame_right div.fixed>div.who2#reg_query,
    body div.frame_left+div.frame_right div.fixed>div.fb-page,
    body div.frame_left+div.frame_right div.fixed>div.new_event,
    body div.frame_left+div.frame_right div.fixed>div.new_partner,
    body div.frame_left+div.frame_right div.fixed>ins.adsbygoogle {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {

    /* --- 搜尋面板：手機端預設收合，由底部列的「搜尋設定」開關 --- */
    .rwd-search-panel {
        display: none;
        padding-bottom: 20px;
    }

    .rwd-search-panel.is-open {
        display: block;
    }

    /* --- 篩選表格改為高權重區塊排列與 Flex 自動折行 --- */
    body table.search,
    body table.search tbody,
    body table.search tr,
    body table.search th,
    body table.search td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body table.search th {
        padding: 10px 0 4px 0 !important;
        font-weight: bold;
        color: #007BCB;
        text-align: left;
    }

    body table.search td {
        padding: 0 0 10px 0 !important;
    }

    body table.search ul {
        float: none !important;
        margin: 0 0 6px 0 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    body table.search li {
        float: none !important;
        display: inline-block !important;
        margin: 0 !important;
        flex: 0 0 auto !important;
    }

    body table.search li a {
        display: inline-block !important;
        line-height: 24px !important;
        padding: 4px 10px !important;
        border-radius: 4px !important;
    }

    body table.search select {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 6px;
        margin-bottom: 6px;
        box-sizing: border-box !important;
    }

    body table.search input.small {
        width: calc(50% - 15px) !important;
        min-width: 90px;
        display: inline-block !important;
    }

    body table.search input.keywords {
        width: calc(100% - 70px) !important;
        max-width: 240px !important;
        display: inline-block !important;
    }

    body table.search .btn_small {
        display: inline-block !important;
        vertical-align: middle;
        line-height: 28px;
        padding: 0 12px;
    }
	
    div.content_frame_body {
        padding: 8px 8px 30px;
    }
	
    body #evtlist .board_item,
    body #ajaxlist .board_item {
        padding: 10px 0 !important;
        border-bottom: 1px solid #eeeeee !important;
    }

    body #evtlist .board_item_frame,
    body #ajaxlist .board_item_frame {
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding: 0 !important;
    }

    body #evtlist .board_item_frame a.img,
    body #ajaxlist .board_item_frame a.img {
        flex: 0 0 80px !important;
        width: 80px !important;
        height: 80px !important;
        display: block !important;
        margin: 0 !important;
        float: none !important;
    }

    body #evtlist .board_item_frame a.img img,
    body #ajaxlist .board_item_frame a.img img {
        width: 80px !important;
        height: 80px !important;
        object-fit: cover !important;
        border-radius: 4px !important;
        margin: 0 !important;
        float: none !important;
        display: block !important;
    }

    body #evtlist .board_right,
    body #ajaxlist .board_right {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin-left: 0 !important;
    }

    body #evtlist .board_right h4,
    body #ajaxlist .board_right h4 {
        margin: 0 0 4px 0 !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    body #evtlist .board_right em,
    body #ajaxlist .board_right em {
        display: block !important;
        font-size: 12px !important;
        color: #ff8706 !important;
        line-height: 1.4 !important;
        margin-bottom: 4px !important;
    }

    body #evtlist .board_right p,
    body #ajaxlist .board_right p {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        font-size: 12px !important;
        color: #666666 !important;
        line-height: 1.4 !important;
        margin: 0 0 4px 0 !important;
    }

    body #evtlist .board_share,
    body #ajaxlist .board_share {
        display: none !important;
    }

    div.board a.board_add {
        position: static;
        display: block;
        margin: 4px 0 8px 0;
    }
	
    div.pager {
        height: auto;
    }

    div.pager ul {
        position: static;
        white-space: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 8px 0;
    }

    div.pager li {
        float: none;
        display: inline-block;
        vertical-align: middle;
    }
}

@media screen and (max-width: 1023px) {
	
    body div.wrapper {
        width: auto;
        max-width: 1000px;
        min-height: 0;
    }

    body div.frame {
        background: none;
        padding-left: 0;
        padding-right: 0;
    }

    /* --- 主要欄位：強制單欄、解除浮動 --- */
    body div.frame_left,
    body div.frame_right,
    body div.fixed {
        float: none;
        width: auto;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    body div.fixed {
        margin-top: 16px;
    }

    /* --- 清除浮動，避免後續區塊被擠進浮動元素旁的狹縫 --- */
    div.frame:after,
    div.frame_left:after,
    div.frame_right:after,
    div.fixed:after,
    div.small_frame:after,
    div.event_item:after,
    div.board_item_frame:after {
        content: "";
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
    }

    /* --- 側邊欄小工具：解除會造成擠壓的浮動 --- */
    div.accumulate {
        float: none;
        display: block;
        margin-bottom: 6px;
    }

    div.small_frame,
    div.middle_content,
    div.content_frame_body {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* --- 側邊欄內的縮圖維持固定尺寸，不被通用規則撐大 --- */
    div.event_item img,
    div.member img,
    div.new_partner img {
        width: 62px;
        height: 62px;
        float: left;
        margin-right: 10px;
    }

    div.event_item p {
        margin-left: 74px;
    }

    /* --- 「最新公益活動」區塊的輪播照片：維持 120x120 並置中 --- */
    div.travel_photo {
        display: inline-block;
        max-width: 100%;
    }

    div.travel_photo img {
        width: 120px;
        height: 120px;
        margin: 3px;
    }

    /* --- 內嵌廣告 / 社群外掛不得撐破版面 --- */
    iframe,
    ins.adsbygoogle,
    div.fb-page,
    div.fb-page span,
    div.fb-page iframe {
        max-width: 100% !important;
    }
}

@media screen and (max-width: 767px) {

    /* 活動列表縮圖：置中、維持既有 120x120 比例 */
    div.board_item_frame a.img {
        display: block;
        text-align: center;
    }

    div.board_item_frame img {
        float: none;
        display: inline-block;
        width: 120px;
        height: 120px;
        margin: 0 0 8px 0;
    }
}

@media screen and (max-width: 767px) {

    /* 詳細頁／報名表單的資料表格改為區塊排列 */
    table.detail,
    table.detail tbody,
    table.detail tr,
    table.detail th,
    table.detail td {
        display: block;
        width: auto;
    }

    table.detail th {
        padding: 8px 0 4px;
        text-align: left;
        font-weight: bold;
        color: #007BCB;
        background-image: none;
        /* 移除固定寬度的標題底圖，避免破圖 */
    }

    table.detail td {
        padding: 0 0 10px;
    }

    /* 報名表單欄位全寬 */
    table.detail input[type="text"],
    table.detail input[type="email"],
    table.detail input[type="tel"],
    table.detail input[type="date"],
    table.detail select,
    table.detail textarea {
        width: 100%;
        max-width: 100%;
    }

    input[type="date"] {
        -webkit-appearance: none;
        appearance: none;
        border: 1px solid #bbbbbb;
        border-radius: 4px;
        background: #ffffff;
        min-height: 44px;
        line-height: normal;
    }
}

.rwd-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

@media (max-width: 1023px) {

    body div.top {
        height: auto;
        line-height: 24px;
        padding: 8px;
    }

    body div.top span {
        float: none !important;
        display: block;
        margin-right: 0 !important;
    }

    body div.top ul.tab {
        position: static;
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 8px;
    }

    body div.top ul.tab li {
        float: none;
        flex: 1 1 calc(50% - 4px);
    }

    body div.top ul.tab li a {
        background-image: none;
        background-color: #e6f5f8;
        padding: 6px 12px;
        border-radius: 4px;
        display: block;
        text-align: center;
        box-sizing: border-box;
    }

    body div.top ul.tab li.active a {
        background-color: #007BCB;
        color: #ffffff;
    }

    body div.banner {
        background-size: cover;
        min-height: auto;
    }

    body div.banner div.control {
        padding: 8px;
    }

    body div.banner div.control div.selector {
        float: none;
        margin-bottom: 8px;
    }

    body div.banner div.control div.selector select {
        max-width: 100%;
    }

    body div.banner div.control ul.tab {
        float: none;
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    body div.banner div.control ul.tab li {
        float: none;
    }

    body div.wrapper {
        display: block;
    }

    body div.wrapper div.left {
        width: 100%;
        float: none;
        margin-bottom: 16px;
    }

    body div.wrapper div.left ul {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    body div.wrapper div.left ul li {
        flex: 1 1 auto;
    }

    body div.wrapper div.left ul li a {
        display: block;
        padding: 8px 12px;
        text-align: center;
        background: #e6f5f8;
        border-radius: 4px;
    }

    body div.wrapper div.left ul.event li {
        flex: 1 1 100% !important;
    }
    body div.wrapper div.left ul.event li a {
        min-height: 40px !important;
        line-height: 24px !important;
        padding: 8px 12px 8px 33px !important;
        text-align: left !important;
        box-sizing: border-box !important;
        background-color: #e6f5f8 !important;
        background-repeat: no-repeat !important;
        background-position: 10px center !important;
    }

    body div.box {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body div.wrapper div.right {
        margin-left: 0 !important;
    }

    body table {
        font-size: 12px;
    }

    body table:not(.form):not(.data) th,
    body table:not(.form):not(.data) td {
        padding: 6px 8px;
        white-space: nowrap;
    }

    body div.footer {
        padding: 16px 8px;
        text-align: center;
    }

    body div.footer p {
        line-height: 1.6;
    }
	
    #fancybox-wrap,
    .ui-dialog {
        max-width: 95vw !important;
        left: 2.5vw !important;
    }

    #fancybox-inner,
    .ui-dialog .ui-dialog-content {
        max-width: 100% !important;
        overflow-x: auto;
    }
	
    a.float-link {
        position: fixed !important;
        bottom: 16px !important;
        left: 0 !important;
        z-index: 999;
    }
}

@media screen and (max-width: 767px) {

    body div.frame_left,
    body div.frame_right,
    body div.event_content,
    body div.who,
    body div.who2,
    body div.facebook,
    body div#event_like,
    body div#event_comment {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
    }
	
    body div.event_detail {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body div.detail_left,
    body div.detail_right {
        width: 100% !important;
        margin-left: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
    }

    body div.detail_photo {
        width: 222px !important;
        max-width: 100% !important;
        margin: 0 auto 12px !important;
        /* 海報圖置中 */
        display: block !important;
    }

    body div.detail_photo img {
        max-width: 196px !important;
        height: auto !important;
    }

    body div.detail_left a.join,
    body div.detail_left a.sub,
    body div.detail_left a.full,
    body div.detail_left a.expired {
        margin: 10px auto !important;
        /* 報名大按鈕置中 */
        display: block !important;
    }

    body div.detail_share {
        display: flex !important;
        justify-content: center !important;
        gap: 6px !important;
        height: auto !important;
    }

    body div.detail_share a {
        float: none !important;
        margin: 0 !important;
    }

    body div.detail_action {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        height: auto !important;
        gap: 6px !important;
    }

    body div.detail_action a {
        float: none !important;
        margin: 0 4px !important;
    }

    body table.detail {
        width: 100% !important;
        max-width: 100% !important;
    }

    body table.detail th {
        width: 75px !important;
    }

    body table.detail td {
        padding-left: 6px !important;
    }
	
    body div[style*="border-bottom:1px dashed #CCCCCC"] {
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
    }

    body div[style*="border-bottom:1px dashed #CCCCCC"] input[type="text"] {
        max-width: 100% !important;
    }
	
    body div.event_content {
        width: 100% !important;
        margin-left: 0 !important;
        box-sizing: border-box !important;
    }

    body ul.content_tab,
    body div.content_tab {
        display: flex !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 0 -1px 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body ul.content_tab li,
    body div.content_tab a {
        flex: 1 1 0 !important;
        width: auto !important;
        float: none !important;
        text-align: center !important;
        height: 38px !important;
        line-height: 38px !important;
        padding: 0 !important;
        margin: 0 1px 0 0 !important;
        background-image: none !important;
        background-color: #e6f5f8 !important;
        border: 1px solid #bbbbbb !important;
        border-bottom: 0 !important;
        border-radius: 4px 4px 0 0 !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }

    body ul.content_tab li a {
        display: block !important;
        line-height: 38px !important;
        color: #666666 !important;
    }

    body ul.content_tab li.active,
    body div.content_tab a.active {
        background-color: #ffffff !important;
        border-bottom: 1px solid #ffffff !important;
    }

    body ul.content_tab li.active a,
    body div.content_tab a.active {
        color: #007BCB !important;
        font-weight: bold !important;
    }
	
    body .chfont,
    body div.chfont {
        display: none !important;
    }

    body div.content_left,
    body div.content_right {
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
        box-sizing: border-box !important;
    }

    body #infocont {
        width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        font-size: 16px !important;
        line-height: 1.7 !important;
        color: #333333 !important;
    }

    body #infocont p {
        font-size: 16px !important;
        line-height: 1.7 !important;
        margin-bottom: 12px !important;
    }

    body #infocont img,
    body #infocont iframe,
    body #infocont table,
    body #infocont video {
        max-width: 100% !important;
        height: auto !important;
        box-sizing: border-box !important;
    }
	
    body #session_start,
    body #session_prep,
    body #session_end {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        padding-bottom: 8px !important;
        box-sizing: border-box !important;
    }

    body #session_start table,
    body #session_prep table,
    body #session_end table {
        min-width: 520px !important;
        width: 100% !important;
    }

    body div#event_like {
        margin-top: 16px !important;
    }

    body div#event_like .board_item {
        padding: 8px 0 !important;
        border-bottom: 1px dashed #e0e0e0 !important;
    }

    body div#event_like .board_item:nth-child(n+4) {
        display: none !important;
    }

    body div#event_like .board_item_frame {
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    body div#event_like .board_item_frame a.img {
        flex: 0 0 60px !important;
        width: 60px !important;
        height: 60px !important;
        margin: 0 !important;
        display: block !important;
    }

    body div#event_like .board_item_frame a.img img {
        width: 60px !important;
        height: 60px !important;
        object-fit: cover !important;
        border-radius: 4px !important;
        margin: 0 !important;
        float: none !important;
        display: block !important;
    }

    body div#event_like .board_right {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    body div#event_like .board_right h4 {
        margin: 0 0 4px 0 !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    body div#event_like .board_right em {
        display: block !important;
        font-size: 12px !important;
        color: #ff8706 !important;
        line-height: 1.4 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body div#event_like .board_right p,
    body div#event_like .board_share {
        display: none !important;
    }
	
    body div#event_comment {
        margin-top: 16px !important;
    }

    body div#event_comment .content_frame_body {
        max-height: 360px !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
	
    body div.frame_left~div.frame_right div.login,
    body div.frame_left~div.frame_right div.member,
    body div.frame_left~div.frame_right div.good_event,
    body div.frame_left~div.frame_right .fb-page {
        display: none !important;
    }

    body div.about_event {
        display: block !important;
        margin-top: 16px !important;
    }
	
    .rwd-topbar__title {
        padding: 0 8px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }
	
    body .submenu {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding-bottom: 8px !important;
        margin-bottom: 12px !important;
    }

    body .submenu_link {
        border-right: 0 !important;
        line-height: 24px !important;
        height: auto !important;
        padding: 4px 10px !important;
        background: #f0f8ff !important;
        border: 1px solid #d4ebf9 !important;
        border-radius: 3px !important;
        font-size: 13px !important;
        display: inline-block !important;
    }

    body .iframe_footer,
    body div[style*="border:1px solid #BBB"],
    body div[style*="border:1px solid #bbb"],
    body div[style*="border: 1px solid #BBB"] {
        padding: 12px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    body .iframe_footer table,
    body .iframe_footer tbody,
    body .iframe_footer tr,
    body .iframe_footer td,
    body div[style*="border:1px solid #BBB"] table,
    body div[style*="border:1px solid #BBB"] tbody,
    body div[style*="border:1px solid #BBB"] tr,
    body div[style*="border:1px solid #BBB"] td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }

    body .iframe_footer td img,
    body div[style*="border:1px solid #BBB"] td img {
        float: none !important;
        display: block !important;
        margin: 0 0 8px 0 !important;
        max-width: 140px !important;
        height: auto !important;
    }

    body .iframe_footer p,
    body div[style*="border:1px solid #BBB"] p {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        margin: 4px 0 0 0 !important;
        line-height: 1.6 !important;
        font-size: 13px !important;
    }

    body div.npopost_menu,
    body div.service_menu {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 14px 0 !important;
        box-sizing: border-box !important;
        background: none !important;
        padding: 0 !important;
    }
    body div.npopost_menu .service_menu_frame,
    body div.service_menu .service_menu_frame {
        border: none !important;
        padding: 0 !important;
    }
    body div.npopost_menu ul.navi,
    body div.service_menu ul.navi,
    body div.service_menu ul {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }
    body div.npopost_menu li,
    body div.service_menu li {
        float: none !important;
        width: auto !important;
        flex: 1 1 calc(50% - 6px) !important;
        min-width: 130px !important;
        margin: 0 !important;
        list-style: none !important;
    }
    body div.npopost_menu li a,
    body div.service_menu li a {
        display: block !important;
        background: #f1f5f9 !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 4px !important;
        color: #334155 !important;
        padding: 8px 6px !important;
        font-size: 13px !important;
        line-height: 18px !important;
        text-align: center !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body div.npopost_menu ul.navi li a,
    body div.service_menu ul.navi li a {
        pointer-events: none !important;
        cursor: default !important;
    }
    body div.npopost_menu li.active a,
    body div.npopost_menu li a:hover,
    body div.service_menu li.active a,
    body div.service_menu li a:hover {
        background: #2563eb !important;
        color: #ffffff !important;
        border-color: #2563eb !important;
        font-weight: 600 !important;
    }
    body div.npopost_menu div.service_menu_footer,
    body div.service_menu div.service_menu_footer {
        display: none !important;
    }

    body div.service_content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        clear: both !important;
    }
    body div.service_content h3 {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 0 10px 0 !important;
        background-size: cover !important;
    }
    body div.service_frame,
    body #wizard {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 480px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        padding: 10px 4px !important;
        border-left: none !important;
        border-right: none !important;
        background: #ffffff !important;
        position: relative !important;
    }
	
    body div.service_template {
        clear: both !important;
        position: static !important;
        width: auto !important;
    }
    body .service_frame .page,
    body #wizard .page {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        float: none !important;
    }

    body .service_frame table.form,
    body .service_frame table.data,
    body div.frame table.form,
    body div.frame table.data,
    body .service_frame table.form tbody,
    body .service_frame table.data tbody,
    body div.frame table.form tbody,
    body div.frame table.data tbody,
    body .service_frame table.form th,
    body .service_frame table.data th,
    body div.frame table.form th,
    body div.frame table.data th,
    body .service_frame table.form td,
    body .service_frame table.data td,
    body div.frame table.form td,
    body div.frame table.data td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: left !important;
        float: none !important;
    }
	
    body .service_frame table.form tr:not(#cycle_week):not(#cycle_month):not(.regarea):not(.reg_local):not(#venue_h_form):not(#venue_v_form),
    body div.frame table.form tr:not(#cycle_week):not(#cycle_month):not(.regarea):not(.reg_local):not(#venue_h_form):not(#venue_v_form),
    body .service_frame table.data tr:not(#cycle_week):not(#cycle_month):not(.regarea):not(.reg_local):not(#venue_h_form):not(#venue_v_form),
    body div.frame table.data tr:not(#cycle_week):not(#cycle_month):not(.regarea):not(.reg_local):not(#venue_h_form):not(#venue_v_form) {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: left !important;
        float: none !important;
    }
    body .service_frame table.form th,
    body .service_frame table.data th,
    body div.frame table.form th,
    body div.frame table.data th {
        font-weight: 600 !important;
        padding: 12px 0 4px 0 !important;
        color: #1e293b !important;
        background: none !important;
        border: none !important;
        font-size: 14px !important;
        width: 100% !important;
    }
    body .service_frame table.form td,
    body .service_frame table.data td,
    body div.frame table.form td,
    body div.frame table.data td {
        padding: 2px 0 10px 0 !important;
        border: none !important;
        width: 100% !important;
    }
	
    body .service_frame table.enstable,
    body .service_frame table.enstable tbody,
    body .service_frame table.enstable tr,
    body .service_frame table.enstable th,
    body .service_frame table.enstable td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: left !important;
        float: none !important;
    }
    body .service_frame table.enstable th,
    body .service_frame table.enstable td {
        padding: 6px 0 !important;
        border: none !important;
        white-space: normal !important;
    }
	
    body .service_frame table:not([class]),
    body .service_frame table:not([class]) tbody,
    body .service_frame table:not([class]) tr,
    body .service_frame table:not([class]) th,
    body .service_frame table:not([class]) td,
    body div.frame table:not([class]),
    body div.frame table:not([class]) tbody,
    body div.frame table:not([class]) tr,
    body div.frame table:not([class]) th,
    body div.frame table:not([class]) td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: left !important;
        float: none !important;
        white-space: normal !important;
    }
    body .service_frame table:not([class]) th,
    body .service_frame table:not([class]) td,
    body div.frame table:not([class]) th,
    body div.frame table:not([class]) td {
        padding: 6px 0 !important;
        border: none !important;
    }

    body div.right table.data,
    body div.right table.data tbody,
    body div.right table.data tr,
    body div.right table.data th,
    body div.right table.data td,
    body div.content table.data,
    body div.content table.data tbody,
    body div.content table.data tr,
    body div.content table.data th,
    body div.content table.data td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: left !important;
        float: none !important;
        white-space: normal !important;
    }
    body div.right table.data th,
    body div.right table.data td,
    body div.content table.data th,
    body div.content table.data td {
        padding: 6px 0 !important;
        border: none !important;
    }
    body div.right input[type="text"],
    body div.right select,
    body div.right textarea,
    body div.content input[type="text"],
    body div.content select,
    body div.content textarea {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
	
    body .service_frame input[type="text"],
    body .service_frame select,
    body .service_frame textarea,
    body div.frame input[type="text"],
    body div.frame select,
    body div.frame textarea {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 15px !important;
        padding: 8px 10px !important;
        border-radius: 4px !important;
        display: block !important;
    }
    body .service_frame #fee,
    body div.frame #fee {
        width: 120px !important;
        display: inline-block !important;
        margin-right: 4px !important;
    }
    body .service_frame input[name="fee_note"],
    body div.frame input[name="fee_note"] {
        width: 100% !important;
        margin-top: 6px !important;
    }
    body .service_frame input[size="70"],
    body .service_frame input[size="60"],
    body .service_frame input[size="50"],
    body .service_frame input[size="40"],
    body .service_frame input[style*="width:350px"],
    body .service_frame input[style*="width:300px"],
    body .service_frame input[name="address"],
    body div.frame input[size="70"],
    body div.frame input[size="60"],
    body div.frame input[size="50"],
    body div.frame input[size="40"],
    body div.frame input[style*="width:350px"],
    body div.frame input[style*="width:300px"],
    body div.frame input[name="address"] {
        width: 100% !important;
    }

    body .service_frame input[name="dt_beg"],
    body .service_frame input[name="dt_cls"],
    body .service_frame input[name="time_beg"],
    body .service_frame input[name="time_cls"],
    body .service_frame input[name="reg_beg"],
    body .service_frame input[name="reg_cls"],
    body div.frame input[name="dt_beg"],
    body div.frame input[name="dt_cls"],
    body div.frame input[name="time_beg"],
    body div.frame input[name="time_cls"],
    body div.frame input[name="reg_beg"],
    body div.frame input[name="reg_cls"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
        margin: 4px 0 !important;
    }

    body .service_frame #cycle_week table,
    body .service_frame #cycle_month table,
    body .service_frame #cycle_week tbody,
    body .service_frame #cycle_month tbody,
    body .service_frame #cycle_week tr,
    body .service_frame #cycle_month tr,
    body div.frame #cycle_week table,
    body div.frame #cycle_month table,
    body div.frame #cycle_week tbody,
    body div.frame #cycle_month tbody,
    body div.frame #cycle_week tr,
    body div.frame #cycle_month tr {
        display: block !important;
        width: 100% !important;
    }
    body .service_frame #cycle_week td,
    body .service_frame #cycle_month td,
    body div.frame #cycle_week td,
    body div.frame #cycle_month td {
        display: inline-block !important;
        width: auto !important;
        min-width: 44px !important;
        padding: 6px 10px !important;
        background: #f8fafc !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 4px !important;
        margin: 2px !important;
        box-sizing: border-box !important;
        text-align: center !important;
        vertical-align: top !important;
    }

    body #att_group br,
    body #evt_group br,
    body #iss_group br,
    body #att_item br,
    body #evt_item br,
    body #iss_item br {
        display: none !important;
    }
    body #att_group input[type="checkbox"],
    body #evt_group input[type="checkbox"],
    body #iss_group input[type="checkbox"],
    body #att_item input[type="checkbox"],
    body #evt_item input[type="checkbox"],
    body #iss_item input[type="checkbox"] {
        margin-left: 14px !important;
    }

    body td > p[style*="float"] {
        float: none !important;
        display: block !important;
        width: 100% !important;
    }

    body img[style*="max-width:530px"],
    body img[width="400"][height="300"] {
        max-width: 100% !important;
        height: auto !important;
    }

    body .service_frame img[width="554"],
    body .service_content img[width="554"] {
        max-width: 100% !important;
        height: auto !important;
    }

    body td input[style*="float"],
    body td div[style*="float"] {
        float: none !important;
        display: block !important;
        clear: both !important;
    }
    body td input[style*="float"] {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    body td br + span[style*="color"] {
        display: block !important;
        clear: both !important;
    }

    body div[style*="width:90%"][style*="margin:10px 30px"] {
        width: auto !important;
        margin: 10px 12px !important;
        box-sizing: border-box !important;
    }

    body div.login input[type="button"] {
        min-width: 90px !important;
        min-height: 40px !important;
        padding: 6px 16px !important;
        font-size: 14px !important;
        margin: 6px 8px 6px 0 !important;
        box-sizing: border-box !important;
    }
    body #post_pic {
        width: 100% !important;
        overflow: hidden !important;
    }
    body #thumbnail {
        max-width: 100% !important;
        height: auto !important;
        float: none !important;
        display: block !important;
        margin: 0 auto 10px !important;
    }
    body #thumbnailpreview {
        float: none !important;
        margin: 10px auto !important;
    }

    body span.step1,
    body span.step2,
    body span.step3,
    body span.complete {
        position: static !important;
        float: none !important;
        clear: both !important;
        display: block !important;
        width: 100% !important;
        margin: 8px 0 !important;
    }
    body .mang_image {
        float: none !important;
        margin: 8px 0 !important;
    }

    body .addfield {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: auto !important;
        display: block !important;
        margin: 6px 0 !important;
    }

    body .cke,
    body .cke_reset {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body .service_frame #capimg {
        margin: 8px 0 !important;
        display: inline-block !important;
    }
    body .service_frame #getcaptcha {
        float: none !important;
        margin: 0 0 0 10px !important;
        display: inline-block !important;
    }
    body .service_frame div[style*="padding-left:90px"] {
        padding-left: 0 !important;
    }
	
    body .service_frame .btn_nav {
        display: flex !important;
        justify-content: center !important;
        gap: 12px !important;
        margin: 20px 0 30px !important;
    }

    body .service_frame .btn_nav input {
        min-width: 120px !important;
        height: 44px !important;
        line-height: 44px !important;
        font-size: 16px !important;
        flex: 1 1 auto !important;
        max-width: 45% !important;
        background: #2563eb !important;
        background-image: none !important;
        color: #ffffff !important;
        border: none !important;
        border-radius: 4px !important;
        box-sizing: border-box !important;
        padding: 0 12px !important;
    }

    body .service_frame a.btn_large {
        display: inline-block !important;
        width: auto !important;
        height: auto !important;
        min-width: 100px !important;
        min-height: 40px !important;
        line-height: 40px !important;
        padding: 0 16px !important;
        font-size: 14px !important;
        text-align: center !important;
        background: #2563eb !important;
        color: #ffffff !important;
        border-radius: 4px !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body .service_frame input[type="checkbox"],
    body .service_frame input[type="radio"] {
        width: 20px !important;
        height: 20px !important;
        vertical-align: middle !important;
    }
    body .service_frame #cycle_week label,
    body .service_frame #cycle_month label {
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
    }
	
    body #edm-body {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 6px !important;
        box-sizing: border-box !important;
        background: none !important;
    }

    body #edm-body #edm-header {
        padding-top: 2px !important;
        margin-bottom: 4px !important;
        text-align: right !important;
    }
	
    body #edm-body #edm-header a[style*="float:right"] {
        float: none !important;
        display: inline-block !important;
        text-align: center !important;
        padding: 6px 14px !important;
        margin: 0 0 6px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        color: #166534 !important;
        background: #ffffff !important;
        border-radius: 999px !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
    }
    body #edm-body #edm-header #logo {
        width: 100% !important;
        text-align: center !important;
        margin: 0 auto 4px !important;
		position: absolute;
        top: 30px;
        left: -105px;
    }
    body #edm-body #edm-header #logo img {
        max-width: 140px !important;
        height: auto !important;
    }
    body #edm-body #edm-header #search {
        float: none !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 6px !important;
        margin: 6px 0 !important;
        height: auto !important;
        background: none !important;
    }

    body ul.navigation {
        position: static !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 6px !important;
        width: 100% !important;
        padding: 6px 2px 10px !important;
        margin: 10px 0 15px 0 !important;
        scrollbar-width: thin !important;
    }
    body ul.navigation > li {
        flex: 0 0 auto !important;
        float: none !important;
        margin: 0 !important;
        background: none !important;
    }
    body ul.navigation dt a {
        padding: 6px 12px !important;
        font-size: 13px !important;
        border-radius: 4px !important;
        background: #f1f5f9 !important;
        color: #1e293b !important;
        display: block !important;
        white-space: nowrap !important;
        border: 1px solid #cbd5e1 !important;
    }
    body ul.navigation > li.active dt a {
        background: #2563eb !important;
        color: #ffffff !important;
        border-color: #2563eb !important;
    }
    body ul.navigation dd {
        display: none !important;
    }

    body #sidebar {
        width: 100% !important;
        float: none !important;
        margin: 0 0 10px 0 !important;
        padding: 0 !important;
    }
    body #sidebar .Pbody {
        width: 100% !important;
        box-sizing: border-box !important;
        margin-bottom: 8px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 4px !important;
        overflow: hidden !important;
    }
    body #sidebar .Ptitle {
        font-size: 14px !important;
        padding: 8px 12px !important;
        background: #f8fafc !important;
        font-weight: 600 !important;
        color: #1e293b !important;
        border-bottom: 1px solid #cbd5e1 !important;
    }
    body #sidebar .Pcontent ul {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 8px 12px !important;
        margin: 0 !important;
    }
    body #sidebar .Pcontent li {
        list-style: none !important;
        margin: 0 !important;
    }
    body #sidebar .Pcontent li a {
        display: inline-block !important;
        padding: 4px 10px !important;
        background: #e2e8f0 !important;
        color: #334155 !important;
        border-radius: 3px !important;
        font-size: 13px !important;
        text-decoration: none !important;
    }
    body #sidebar .Pfoot {
        display: none !important;
    }

    body #sub-ul {
        height: auto !important;
        margin: 8px 0 !important;
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 0 !important;
    }

    body #sub-ul li {
        height: auto !important;
        list-style: none !important;
        margin: 0 !important;
        flex: 1 1 calc(50% - 6px) !important;
        background: none !important;
    }
    body #sub-ul li a {
        display: inline-block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        padding: 5px 12px !important;
        background: #3b82f6 !important;
        color: #ffffff !important;
        border-radius: 4px !important;
        font-size: 13px !important;
        text-decoration: none !important;
    }

    body #main {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
        padding: 4px 0 !important;
    }

    body #main .control-title {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        padding: 8px 0 !important;
        box-sizing: border-box !important;
        line-height: 2.4 !important;
    }
    body #main .control-title select,
    body #main .control-title input {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 2px 4px 2px 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    body #main .control-title input.cquery {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 6px !important;
    }

    body div[style*="border:1px solid #a4cc94"],
    body .innermainContent,
    body div.dataTables_wrapper {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        box-sizing: border-box !important;
        margin-top: 6px !important;
        padding: 2px !important;
    }

    body #main table {
        display: block !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body table.list,
    body table.report,
    body #grouplist,
    body table.show_list {
        min-width: 650px !important;
        width: 100% !important;
    }
    body table.list th,
    body table.list td,
    body #grouplist th,
    body #grouplist td {
        padding: 8px 6px !important;
        font-size: 13px !important;
    }
    body #edm-body select,
    body #edm-body input[type="text"] {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body #edm-body input[type="submit"],
    body #edm-body input[type="reset"],
    body #edm-body input[type="button"] {
        min-width: 90px !important;
        min-height: 40px !important;
        padding: 6px 16px !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }

    body .top,
    body .bottom {
        position: static !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        padding: 8px !important;
        left: auto !important;
        bottom: auto !important;
    }
    body .dataTables_wrapper {
        min-height: 0 !important;
    }
    body .dataTables_length,
    body .dataTables_filter,
    body .dataTables_info,
    body .dataTables_paginate {
        position: static !important;
        float: none !important;
        width: 100% !important;
        text-align: left !important;
        padding: 4px 0 !important;
        margin: 0 !important;
        left: auto !important;
        bottom: auto !important;
        top: auto !important;
        box-sizing: border-box !important;
    }
    body .dataTables_filter input,
    body .dataTables_length select {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body .dataTables_processing {
        width: 90% !important;
        max-width: 250px !important;
        left: 5% !important;
        margin-left: 0 !important;
        box-sizing: border-box !important;
    }

    body .paging_full_numbers {
        position: static !important;
        left: auto !important;
        bottom: auto !important;
        width: 100% !important;
        height: auto !important;
        margin-top: 8px !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
    }

    body #msg_ssc,
    body #msg_notice {
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        left: auto !important;
        top: auto !important;
        box-sizing: border-box !important;
        margin: 10px 0 !important;
    }

    body div.right div.tab {
        height: auto !important;
        min-height: 0 !important;
        padding: 8px 0 !important;
    }
    body div.right div.tab ul {
        position: static !important;
        left: auto !important;
        bottom: auto !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    body div.right div.tab li {
        float: none !important;
        list-style: none !important;
        flex: 1 1 calc(50% - 4px) !important;
    }
    body div.right div.tab li a,
    body div.right div.tab ul.title li a {
        width: 100% !important;
        height: auto !important;
        min-height: 36px !important;
        line-height: 36px !important;
        box-sizing: border-box !important;
        background: #f1f5f9 !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 4px !important;
        margin-right: 0 !important;
        color: #334155 !important;
    }
    body div.right div.tab li.active a,
    body div.right div.tab li a:hover,
    body div.right div.tab ul.title li.active a {
        background: #2563eb !important;
        border-color: #2563eb !important;
        color: #ffffff !important;
    }

    body div.right div.tab div.bottom {
        display: none !important;
    }

    body div.step ul {
        height: auto !important;
        overflow: visible !important;
        display: flex !important;
        flex-wrap: wrap !important;
        margin-left: 0 !important;
    }
    body div.step li {
        float: none !important;
        margin-left: 0 !important;
    }
	
    body div[style*="float:left; padding-top:8px"],
    body div[style*="float:left; padding-top:15px"] {
        float: none !important;
        display: block !important;
        clear: both !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
}