@charset "UTF-8";

.ui_list > li.ad_container > .yap-loaded > a > .text > h3:hover, .ui_list > li > .content > .extcon > .meta > .block.tool > .link:hover, .ui_list > li > .content > .title > a:hover, ins {
    text-decoration: underline
}

.ui_text .input, .ui_text .number, .ui_text .select, .ui_text .textarea, body, html {
    background-color: #fff;
    color: #333
}

/*.ui_block > .title, caption, em, h1, h2, h3, h4, i, strong, td, th {
    font-weight: 400
}*/

.ui_icon, .ui_icon + span {
    *vertical-align: auto;
    zoom: 1
}

.ui_list > li.ad_container > .yap-loaded > a > .text > h3, body, button, input, select, textarea {
    font-family: PingFangTC,"Microsoft JhengHei",Arial,sans-serif
}

.wrap > .wrap_header > .bottom > .container > .nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap
}

.ui_text .checkbox, .ui_text .email, .ui_text .error, .ui_text .input, .ui_text .label, .ui_text .number, .ui_text .radio, .ui_text .select, .ui_text .textarea, .ui_text .tips, .ui_text .txt, .ui_text .ui_text_group.magic_checkbox, .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon, .ui_text .ui_text_group.magic_file > .magic_file_btn, .ui_text .ui_text_group.magic_file > .magic_file_name, .ui_text .ui_text_group.magic_radio, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon, .ui_text input[type=checkbox], .ui_text input[type=radio], .ui_text.ui_text_group.magic_checkbox, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon, .ui_text.ui_text_group.magic_file > .magic_file_btn, .ui_text.ui_text_group.magic_file > .magic_file_name, .ui_text.ui_text_group.magic_radio, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1
}

body, button, h1, h2, h3, h4, input, select, textarea {
    line-height: 1.5
}

.ui_text .input, .ui_text .number, .ui_text .pd, .ui_text .select, .ui_text .textarea, .ui_text .ui_text_group.magic_file > .magic_file_btn, .ui_text.ui_text_group.magic_file > .magic_file_btn {
    padding: .625rem
}

.ui_text .input, .ui_text .number, .ui_text .select {
    height: 2.5rem
}

    .ui_text .input, .ui_text .input.error, .ui_text .number, .ui_text .number.error, .ui_text .select, .ui_text .select.error, .ui_text .textarea, .ui_text .textarea.error {
        font-size: 16px;
        font-size: 1rem
    }

a, a:hover {
    color: #e5724f
}

.ui_text .input, .ui_text .number, .ui_text .select, .ui_text .textarea, .ui_text .ui_text_group.magic_file > .magic_file_btn, .ui_text.ui_text_group.magic_file > .magic_file_btn {
    border-radius: .3125rem;
    border: .0625rem solid #ddd
}

    .ui_text .input:focus, .ui_text .number:focus, .ui_text .select:focus, .ui_text .textarea:focus, .ui_text .ui_text_group.magic_file > .magic_file_btn:focus, .ui_text.ui_text_group.magic_file > .magic_file_btn:focus {
        border-color: #515e73
    }

    .ui_text .input:invalid:not(:focus):not(:placeholder-shown), .ui_text .number:invalid:not(:focus):not(:placeholder-shown), .ui_text .select:invalid:not(:focus):not(:placeholder-shown), .ui_text .textarea:invalid:not(:focus):not(:placeholder-shown), .ui_text .ui_text_group.magic_file > .magic_file_btn:invalid:not(:focus):not(:placeholder-shown), .ui_text.ui_text_group.magic_file > .magic_file_btn:invalid:not(:focus):not(:placeholder-shown) {
        border-color: #c13a3a
    }

.container {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

/*a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    word-wrap: break-word;
    word-break: break-word;
    -webkit-text-size-adjust: 100% !important;
    -ms-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent
}*/

caption, img, td, th {
    vertical-align: middle
}

:focus {
    outline: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption, td, th {
    text-align: left
}

.ui_btn, .ui_notfind.nopost > .content, .ui_text .tc, .ui_text.btn {
    text-align: center
}

blockquote, q {
    quotes: none
}

    blockquote:after, blockquote:before, q:after, q:before {
        content: "";
        content: none
    }

em, i, strong {
    font-style: normal
}

del {
    text-decoration: line-through
}

mark {
    background: 0 0
}

img {
    border: none;
    -ms-interpolation-mode: bicubic;
    -webkit-touch-callout: none
}

a {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: 0 0;
    -webkit-transition: all .3s;
    transition: all .3s;
    cursor: pointer
}

.ui_icon, .ui_icon + span, input, select {
    vertical-align: middle
}

body, html {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    overflow: auto;
    -webkit-overflow-scrolling: touch !important
}

input[type=text], textarea {
    -webkit-user-modify: read-write-plaintext-only;
    -webkit-tap-highlight-color: rgba(255,255,255,0)
}

input:-ms-clear {
    display: none !important;
    display: none
}

[class*=" ui_icon"], [class*=" ui_btn"], [class^=ui_icon], [class^=ui_btn], body, button, input, select, textarea {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-feature-settings: 'liga','kern'
}

    [class*=" ui_icon"], [class*=" ui_btn"], [class^=ui_icon], [class^=ui_btn], button, input[type=reset], input[type=button], input[type=submit], select, textarea {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none
    }

html {
    line-height: 1;
    font-size: 16;
    font-size: 100%
}

body {
    font-size: 16px;
    font-size: 1rem;
    overflow: hidden
}

a:active, a:hover, a:hover.ui_btn, a:hover.ui_icon, a:hover > .ui_btn, a:hover > .ui_icon, a:link, a:visited {
    text-decoration: none
}

h1 {
    font-size: 20px;
    font-size: 1.25rem;
    color: #333
}

h2 {
    font-size: 18px;
    font-size: 1.125rem;
    color: #333
}

h3 {
    font-size: 16px;
    font-size: 1rem;
    color: #333
}

h4 {
    font-size: 14px;
    font-size: .875rem;
    color: #333
}

button, input, select, textarea {
    font-size: 16px;
    font-size: 1rem;
    color: #333;
    background: 0 0
}

    input[type=radio], input[type=checkbox] {
        background: initial
    }

    input.placeholder, textarea.placeholder {
        color: #999
    }

    input:-moz-placeholder, textarea:-moz-placeholder {
        color: #999
    }

    input::-moz-placeholder, textarea::-moz-placeholder {
        color: #999
    }

    input:-ms-input-placeholder, textarea:-ms-input-placeholder {
        color: #999
    }

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
        color: #999
    }

ol, ul {
    list-style: none;
    font-size: 0;
    font-size: 0rem
}

    ol > li, ul > li {
        font-size: 16px;
        font-size: 1rem
    }

@media only screen and (max-width: 800px) {
    ::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0
    }

    a {
        -webkit-transition: none;
        transition: none
    }

    .no_mobile {
        display: none !important
    }
}

@media only screen and (min-width: 800px) {
    .no_pc {
        display: none !important
    }
}

.ui_notfind, .ui_text.col {
    display: -webkit-box;
    display: -ms-flexbox
}

.ui_hlc1 {
    color: #515e73 !important
}

.ui_notfind {
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 3rem 2rem;
    border: .0625rem solid #ddd;
    background-color: #fafafa
}

    .ui_notfind:before {
        display: block;
        margin-right: 1rem;
        width: 5.3125rem;
        height: 5.3125rem;
        background: url(/images/bg_404.png) center center no-repeat;
        background-size: contain;
        content: ""
    }

    .ui_notfind > .content > .title {
        font-size: 24px;
        font-size: 1.5rem;
        font-weight: 700;
        color: #333;
        line-height: 1.33
    }

    .ui_notfind > .content > p {
        font-size: 20px;
        font-size: 1.25rem;
        color: #333
    }

@media only screen and (max-width: 800px) {
    .ui_notfind {
        padding: 2rem 1rem
    }

        .ui_notfind:before {
            margin-right: .5rem
        }

        .ui_notfind > .content {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1
        }

            .ui_notfind > .content > p {
                font-size: 18px;
                font-size: 1.125rem
            }
}

.ui_notfind.nopost {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 8.75rem 0rem;
    border: none;
    background-color: transparent
}

    .ui_notfind.nopost:before {
        margin: 0rem 0rem 1.75rem;
        width: 12.375rem;
        height: 4rem;
        background: url(/images/bg_404_post.png) center center no-repeat;
        background-size: contain;
        content: ""
    }

    .ui_notfind.nopost > .content > .title {
        margin-bottom: .625rem;
        color: #999
    }

    .ui_notfind.nopost > .content > p {
        font-size: 16px;
        font-size: 1rem;
        color: #ccc
    }

@media only screen and (max-width: 800px) {
    .ui_notfind.nopost {
        padding: 3.125rem 0rem
    }
}

.img, .post_img, .user_img {
    overflow: hidden
}

    .img img, .img > img, .imgimg, .post_img img, .post_img > img, .post_imgimg, .user_img img, .user_img > img, .user_imgimg {
        max-width: 100%;
        max-height: 100%
    }

.user_img {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: #fff
}

    .user_img img, .user_img > img, .user_imgimg {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background-size: contain
    }

.rsimg {
    position: relative
}

    .rsimg img, .rsimg > img {
        position: absolute;
        left: 50%;
        top: 50%;
        margin-right: -50%;
        -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        max-width: none;
        max-height: none
    }

.post_video, .ui_text .ui_text_group, .ui_text.ui_text_group {
    position: relative
}

.post_video {
    display: block;
    height: 0;
    padding-bottom: 56.25%
}

    .post_video > embed, .post_video > iframe, .post_video > object, .post_video > video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.ui_icon {
    display: -moz-inline-stack;
    display: inline-block;
    *display: inline;
    background-repeat: no-repeat;
    text-indent: -999em;
    overflow: hidden;
    white-space: nowrap;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    fill: currentcolor;
    width: 1.75rem;
    height: 1.75rem
}

    .ui_icon + span {
        display: -moz-inline-stack;
        display: inline-block;
        *display: inline;
        margin: 0;
        padding: 0
    }

.ui_btn, .ui_text .label {
    display: -moz-inline-stack;
    vertical-align: middle;
    *vertical-align: auto;
    zoom: 1
}

.ui_btn {
    display: inline-block;
    *display: inline;
    color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    padding: .625rem 1.25rem;
    border-radius: .3125rem;
    border: .0625rem solid transparent;
    background-color: transparent;
    -webkit-transition: all .3s;
    transition: all .3s;
    line-height: 1
}

.ui_adblock > .title, .ui_text .pd_tb {
    padding: .625rem 0rem
}

.ui_btn:active, .ui_btn:hover {
    text-decoration: none;
    color: #fff
}

.ui_btn.btn1 {
    background-color: #515e73;
    border-color: #515e73
}

    .ui_btn.btn1:hover {
        background-color: rgba(81,94,115,.9);
        border-color: rgba(81,94,115,.9)
    }

.ui_btn.btn2 {
    border-color: #515e73;
    color: #515e73
}

    .ui_btn.btn2:hover {
        color: #fff;
        background-color: #515e73
    }

.ui_btn.btn_facebook {
    background-color: #507bbf
}

    .ui_btn.btn_facebook:hover {
        background-color: rgba(80,123,191,.9)
    }

.ui_btn.btn_line {
    background-color: #00b900
}

    .ui_btn.btn_line:hover {
        background-color: rgba(0,185,0,.9)
    }

.ui_btn.btn_twitter {
    background-color: #3db4f6
}

    .ui_btn.btn_twitter:hover {
        background-color: rgba(61,180,246,.9)
    }

.ui_btn.btn_instagram {
    background-image: -webkit-linear-gradient(9deg,#ffce6c,#ff7d50 9%,#dd1d67 31%,#a241b2 65%,#5750a3);
    background-image: linear-gradient(81deg,#ffce6c,#ff7d50 9%,#dd1d67 31%,#a241b2 65%,#5750a3);
    border: none
}

.ui_btn.btn_cancel, .ui_btn.disabled {
    background-color: #ccc
}

    .ui_btn.btn_cancel.active, .ui_btn.btn_cancel.hover, .ui_btn.btn_cancel:active, .ui_btn.btn_cancel:hover, .ui_btn.disabled.active, .ui_btn.disabled.hover, .ui_btn.disabled:active, .ui_btn.disabled:hover {
        background-color: #999
    }

.ui_text {
    margin-bottom: 1.25rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

    .ui_text:last-child {
        margin-bottom: 0
    }

    .ui_text .input.error, .ui_text .number.error, .ui_text .select.error, .ui_text .textarea.error {
        color: #c13a3a;
        border: .0625rem solid #c13a3a
    }

    .ui_text .input, .ui_text .number, .ui_text .textarea {
        width: 100%;
        max-width: 20rem
    }

@media only screen and (max-width: 800px) {
    .ui_btn {
        -webkit-transition: none;
        transition: none
    }

    .ui_text .input, .ui_text .number, .ui_text .textarea {
        max-width: none
    }
}

.ui_text .input {
    min-width: 1em
}

    .ui_text .input.verifycode {
        max-width: 10.875rem
    }

.ui_text .textarea {
    height: 6rem;
    overflow: hidden;
    overflow-y: auto;
    resize: none;
    vertical-align: middle
}

.ui_text .select {
    padding: 0rem .625rem
}

.ui_text .checkbox, .ui_text .radio {
    margin: 0rem .625rem 0rem 0rem;
    line-height: normal
}

.ui_text .label {
    display: inline-block;
    *display: inline
}

    .ui_text .label.required:before {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        margin-right: .1875rem;
        content: "*";
        color: #c13a3a
    }

.ui_text .error, .ui_text .tips, .ui_text .txt {
    color: #999;
    font-size: 14px;
    font-size: .875rem;
    line-height: 1.25
}

    .ui_text .error .ui_icon, .ui_text .tips .ui_icon, .ui_text .txt .ui_icon {
        width: 1rem;
        height: 1rem
    }

.ui_text .error {
    color: #c13a3a
}

.ui_text .txt {
    color: #333
}

.ui_text .email {
    padding: .75rem 0rem
}

.ui_text.btn {
    margin-top: 1.875rem
}

    .ui_text.btn > .ui_btn {
        margin-right: .625rem;
        padding: .9375rem 2.5rem
    }

        .ui_text.btn > .ui_btn:last-child {
            margin-right: 0
        }

.ui_text.col {
    display: flex
}

    .ui_text.col > .label {
        margin-right: 1rem;
        padding: .75rem 0rem;
        width: 6.25rem;
        text-align: right;
        color: #333
    }

@media only screen and (max-width: 800px) {
    .ui_text .input.verifycode {
        max-width: none
    }

    .ui_text.col > .label {
        width: 4.5rem
    }
}

.ui_text.col > .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

    .ui_text.col > .content .error, .ui_text.col > .content .tips, .ui_text.col > .content .txt {
        margin: .625rem 0rem 0rem
    }

.ui_block, .ui_breadcrumbs {
    margin-bottom: 1rem
}

.ui_text.col > .content .error {
    font-style: italic
}

.ui_text.col > .content .input.error, .ui_text.col > .content .number.error, .ui_text.col > .content .select.error, .ui_text.col > .content .textarea.error {
    margin-top: 0;
    -webkit-box-shadow: 0rem 0rem .25rem 0rem #c13a3a;
    box-shadow: 0rem 0rem .25rem 0rem #c13a3a
}

.ui_text .ui_text_group.addon, .ui_text.ui_text_group.addon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

    .ui_text .ui_text_group.addon > .addon, .ui_text.ui_text_group.addon > .addon {
        padding: 0rem .625rem;
        border: .0625rem solid #ddd;
        color: #515e73;
        background-color: #f8f8f8;
        line-height: 1
    }

        .ui_text .ui_text_group.addon > .addon > .ui_icon, .ui_text.ui_text_group.addon > .addon > .ui_icon {
            width: 1.25rem;
            height: 1.25rem
        }

        .ui_text .ui_text_group.addon > .addon:not(:first-child):not(:last-child), .ui_text.ui_text_group.addon > .addon:not(:first-child):not(:last-child) {
            border-radius: 0;
            border-left: none;
            border-right: none
        }

        .ui_text .ui_text_group.addon > .addon:first-child, .ui_text.ui_text_group.addon > .addon:first-child {
            border-right: none;
            border-radius: .3125rem 0rem 0rem .3125rem
        }

        .ui_text .ui_text_group.addon > .addon:last-child, .ui_text.ui_text_group.addon > .addon:last-child {
            border-left: none;
            border-radius: 0rem .3125rem .3125rem 0rem
        }

    .ui_text .ui_text_group.addon > .control, .ui_text.ui_text_group.addon > .control {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

        .ui_text .ui_text_group.addon > .control:not(:first-child):not(:last-child), .ui_text.ui_text_group.addon > .control:not(:first-child):not(:last-child) {
            border-radius: 0
        }

        .ui_text .ui_text_group.addon > .control:first-child, .ui_text.ui_text_group.addon > .control:first-child {
            border-radius: .3125rem 0rem 0rem .3125rem
        }

        .ui_text .ui_text_group.addon > .control:last-child, .ui_text.ui_text_group.addon > .control:last-child {
            border-radius: 0rem .3125rem .3125rem 0rem
        }

.ui_text .ui_text_group.icon > .ui_icon, .ui_text.ui_text_group.icon > .ui_icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: .625rem;
    width: 1.25rem;
    height: 1.25rem;
    color: #999
}

.ui_text .ui_text_group.icon > .input, .ui_text.ui_text_group.icon > .input {
    padding: .625rem .625rem .625rem 2.25rem
}

.ui_text .ui_text_group.magic_checkbox, .ui_text .ui_text_group.magic_radio, .ui_text.ui_text_group.magic_checkbox, .ui_text.ui_text_group.magic_radio {
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    zoom: 1;
    *display: inline;
    padding: .75rem 0rem
}

    .ui_text .ui_text_group.magic_checkbox > .checkbox, .ui_text .ui_text_group.magic_checkbox > .radio, .ui_text .ui_text_group.magic_radio > .checkbox, .ui_text .ui_text_group.magic_radio > .radio, .ui_text.ui_text_group.magic_checkbox > .checkbox, .ui_text.ui_text_group.magic_checkbox > .radio, .ui_text.ui_text_group.magic_radio > .checkbox, .ui_text.ui_text_group.magic_radio > .radio {
        position: absolute;
        display: none
    }

        .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon {
            display: -moz-inline-stack;
            display: inline-block;
            vertical-align: middle;
            *vertical-align: auto;
            zoom: 1;
            *display: inline;
            position: relative;
            padding-left: 1.5rem;
            cursor: pointer
        }

            .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon:before {
                position: absolute;
                top: 50%;
                -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);
                left: 0;
                content: "";
                border-radius: 50%;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                width: 1rem;
                height: 1rem;
                background-color: #fff;
                border: .0625rem solid #ddd
            }

            .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon:before {
                border: .0625rem solid #ddd
            }

                .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:before:hover, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon:before:hover, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:before:hover, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon:before:hover, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:before:hover, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon:before:hover, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:before:hover, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon:before:hover {
                    border-color: #515e73
                }

            .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .radio + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .radio + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .radio + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .radio + .magin_icon:after {
                display: none
            }

        .ui_text .ui_text_group.magic_checkbox > .checkbox:checked + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .radio:checked + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox:checked + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .radio:checked + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox:checked + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .radio:checked + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox:checked + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .radio:checked + .magin_icon:before {
            border: .3125rem solid #515e73
        }

        .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled], .ui_text .ui_text_group.magic_checkbox > .radio[disabled], .ui_text .ui_text_group.magic_radio > .checkbox[disabled], .ui_text .ui_text_group.magic_radio > .radio[disabled], .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled], .ui_text.ui_text_group.magic_checkbox > .radio[disabled], .ui_text.ui_text_group.magic_radio > .checkbox[disabled], .ui_text.ui_text_group.magic_radio > .radio[disabled] {
            cursor: not-allowed
        }

            .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon, .ui_text .ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon, .ui_text .ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon, .ui_text .ui_text_group.magic_radio > .radio[disabled] + .magin_icon, .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon, .ui_text.ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon, .ui_text.ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon, .ui_text.ui_text_group.magic_radio > .radio[disabled] + .magin_icon {
                cursor: not-allowed;
                color: #e4e4e4
            }

                .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:hover, .ui_text .ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:hover, .ui_text .ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:hover, .ui_text .ui_text_group.magic_radio > .radio[disabled] + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .radio[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .radio[disabled] + .magin_icon:hover, .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:hover, .ui_text.ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:hover, .ui_text.ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:hover, .ui_text.ui_text_group.magic_radio > .radio[disabled] + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .radio[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .radio[disabled] + .magin_icon:hover {
                    cursor: not-allowed
                }

                .ui_text .ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .radio[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .radio[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox[disabled] + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .radio[disabled] + .magin_icon:before {
                    border-color: #e4e4e4
                }

        .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text .ui_text_group.magic_radio > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_checkbox > .checkbox + .magin_icon:before, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:after, .ui_text.ui_text_group.magic_radio > .checkbox + .magin_icon:before {
            border-radius: .1875rem
        }

.ui_text .ui_text_group.magic_file, .ui_text.ui_text_group.magic_file {
    cursor: pointer
}

    .ui_text .ui_text_group.magic_file > .file, .ui_text.ui_text_group.magic_file > .file {
        display: none
    }

    .ui_text .ui_text_group.magic_file > .magic_file_btn, .ui_text.ui_text_group.magic_file > .magic_file_btn {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        background-color: #fff;
        border-color: #515e73;
        color: #515e73;
        cursor: pointer
    }

    .ui_text .ui_text_group.magic_file > .magic_file_name, .ui_text.ui_text_group.magic_file > .magic_file_name {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        margin-left: 1rem;
        color: #999;
        cursor: pointer
    }

.ui_text .ui_text_group.triangles:after, .ui_text.ui_text_group.triangles:after {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-top: .15625rem;
    right: .625rem;
    display: -moz-inline-stack;
    display: inline-block;
    *vertical-align: auto;
    *display: inline;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    zoom: 1;
    *display: inline;
    width: 0;
    height: 0;
    border-width: .3125rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-style: solid dashed dashed;
    border-color: #666 transparent transparent;
    content: ""
}

.ui_text .ui_text_group.triangles > .control, .ui_text.ui_text_group.triangles > .control {
    padding: .625rem 1.625rem .625rem .625rem
}

    .ui_text .ui_text_group.triangles > .control.select, .ui_text.ui_text_group.triangles > .control.select {
        padding: 0rem 1.625rem 0rem .625rem
    }

.ui_text .ui_text_group.verifycode, .ui_text.ui_text_group.verifycode {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 800px) {
    .ui_text .ui_text_group.verifycode, .ui_text.ui_text_group.verifycode {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

.ui_text .ui_text_group.verifycode > .ui_text_group, .ui_text .ui_text_group.verifycode > .verifycode, .ui_text.ui_text_group.verifycode > .ui_text_group, .ui_text.ui_text_group.verifycode > .verifycode {
    max-width: none;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.ui_text .ui_text_group.verifycode > img, .ui_text.ui_text_group.verifycode > img {
    margin-left: .5rem;
    height: 2.5rem
}

.ui_text .ui_text_group.verifycode > a, .ui_text.ui_text_group.verifycode > a {
    margin-left: .5rem;
    font-size: 14px;
    font-size: .875rem
}

.ui_breadcrumbs > a, .ui_breadcrumbs > span {
    font-size: 16px;
    font-size: 1rem;
    line-height: 1;
    color: #999;
    margin-left: .4375rem
}

    .ui_breadcrumbs > a:after, .ui_breadcrumbs > span:after {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        content: "";
        width: .5rem;
        height: .5rem;
        border-style: solid;
        border-color: inherit;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transform: rotate(315deg);
        -ms-transform: rotate(315deg);
        transform: rotate(315deg);
        -webkit-transform-origin: 33.3% 33.3%;
        -ms-transform-origin: 33.3% 33.3%;
        transform-origin: 33.3% 33.3%;
        border-width: 0rem .0625rem .0625rem 0rem
    }

    .ui_breadcrumbs > a:first-child, .ui_breadcrumbs > span:first-child {
        margin-left: 0
    }

    .ui_breadcrumbs > a:last-child:after, .ui_breadcrumbs > span:last-child:after {
        display: none
    }

.ui_block > .title, .ui_block > .title > .more {
    display: -webkit-box;
    display: -ms-flexbox
}

.ui_block:last-child {
    margin-bottom: 0
}

.ui_block > .title {
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .625rem;
    font-size: 24px;
    font-size: 1.5rem;
    color: #515e73
}

@media only screen and (max-width: 800px) {
    .ui_block > .title {
        font-size: 20px;
        font-size: 1.25rem
    }
}

.ui_block > .title > .more {
    font-size: 16px;
    font-size: 1rem;
    text-align: right;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ui_adblock {
    margin-bottom: 1rem;
    text-align: center;
    background-color: #eee;
    line-height: 0
}

    .ui_adblock:last-child {
        margin-bottom: 0
    }

@media only screen and (max-width: 800px) {
    .adunit {
        max-width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        margin-bottom: .625rem
    }

        .adunit:last-child {
            margin-bottom: 0
        }
}

.adunit .adsbygoogle {
    max-width: 100%
}

.ui_adblock > .title {
    font-size: 14px;
    font-size: .875rem;
    font-weight: 700;
    color: #aaa
}

.ui_adblock > .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .ui_adblock > .content > .adunit {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: center;
        margin: 0 auto;
        overflow: hidden
    }

@media only screen and (max-width: 800px) {
    .ui_adblock > .content > .adunit {
        max-width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        margin-bottom: .625rem
    }

        .ui_adblock > .content > .adunit:last-child {
            margin-bottom: 0
        }
}

.ui_adblock > .content > .adunit iframe {
    vertical-align: middle
}

@media only screen and (min-width: 800px) {
    .ui_adblock > .content.cols2 > .adunit {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%
    }
}

.ui_mask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,.6);
    z-index: 9;
    -webkit-transition: opacity .15s linear;
    transition: opacity .15s linear
}

.ui_dialog {
    position: fixed;
    top: 50%;
    left: 50%;
    margin: 0 auto;
    z-index: 10;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transition: opacity .15s linear;
    transition: opacity .15s linear;
    width: 100%;
    max-width: 31.25rem
}

    .ui_dialog > .ui_dialog_popup {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
        -webkit-transition: -webkit-transform .3s ease-out;
        transition: -webkit-transform .3s ease-out;
        transition: transform .3s ease-out;
        transition: transform .3s ease-out,-webkit-transform .3s ease-out
    }

    .ui_dialog.hidden {
        opacity: 0;
        filter: alpha(opacity=0)
    }

        .ui_dialog.hidden > .ui_dialog_popup {
            -webkit-transform: translate(0,-25%);
            -ms-transform: translate(0,-25%);
            transform: translate(0,-25%)
        }

    .ui_dialog .tc {
        text-align: center
    }

.ui_dialog_popup {
    padding: .5625rem 1.5rem 1.5rem;
    border-radius: .3125rem;
    -webkit-box-shadow: 0rem 0rem .625rem 0rem rgba(0,0,0,.5);
    box-shadow: 0rem 0rem .625rem 0rem rgba(0,0,0,.5);
    background-color: #fff
}

@media only screen and (max-width: 800px) {
    .ui_adblock > .content.cols2 > .adunit {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%
    }

    .ui_dialog_popup {
        padding: .5625rem 1rem 1.5rem
    }
}

.ui_dialog_popup > .header {
    padding-bottom: .375rem;
    border-bottom: .0625rem solid #ddd
}

    .ui_dialog_popup > .header > .title {
        text-align: center;
        color: #515e73;
        font-size: 24px;
        font-size: 1.5rem
    }

.ui_dialog_popup > .main {
    margin-top: 1.5rem
}

.ui_dialog_popup > .footer {
    margin-top: 2rem
}

    .ui_dialog_popup > .footer > .btn {
        text-align: center
    }

        .ui_dialog_popup > .footer > .btn > .ui_btn {
            margin: 0rem .625rem
        }

#win_notifications {
    top: 0 !important
}

    #win_notifications > .ui_dialog_popup {
        padding: 1rem 2rem;
        border-radius: 0;
        position: relative
    }

@media only screen and (max-width: 800px) {
    #win_notifications > .ui_dialog_popup {
        padding: 1rem
    }
}

#win_notifications > .ui_dialog_popup > .header {
    display: none
}

#win_notifications > .ui_dialog_popup > .main {
    margin: 0
}

    #win_notifications > .ui_dialog_popup > .main > .btn_close {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 6;
        width: 1.5rem;
        height: 1.5rem;
        line-height: 1.5rem;
        text-align: center;
        background: #c3c3c3;
        font-size: 20px;
        font-size: 1.25rem;
        color: #4e4e4e
    }

    #win_notifications > .ui_dialog_popup > .main > .content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

        #win_notifications > .ui_dialog_popup > .main > .content > .img {
            margin-right: 1rem;
            width: 5rem;
            height: 5rem
        }

        #win_notifications > .ui_dialog_popup > .main > .content > .msg {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1
        }

#win_notifications > .ui_dialog_popup > .footer {
    margin-top: 1rem
}

    #win_notifications > .ui_dialog_popup > .footer > .btn {
        text-align: right;
        direction: rtl;
        unicode-bidi: bidi-override
    }

        #win_notifications > .ui_dialog_popup > .footer > .btn > .ui_btn {
            margin: 0rem .5rem;
            padding: .5rem 1rem
        }

.ui_nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .ui_nav > li.share, .ui_nav > li > a {
        display: -ms-flexbox;
        -webkit-box-align: center
    }

    .ui_nav > li {
        margin-left: 1.25rem
    }

@media only screen and (max-width: 800px) {
    .ui_nav > li {
        margin-left: .625rem
    }
}

.ui_nav > li:first-child {
    margin-left: 0
}

.ui_nav > li > a {
    font-size: 14px;
    font-size: .875rem;
    -webkit-transition: color .5s;
    transition: color .5s;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.ui_nav > li.share {
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

    .ui_nav > li.share > .title {
        margin-right: 1.25rem;
        color: #999;
        font-size: 14px;
        font-size: .875rem
    }

    .ui_nav > li.share > .content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

        .ui_nav > li.share > .content > .sub, .ui_nav > li.share > .content > a {
            margin-left: 1.25rem;
            color: #999
        }

            .ui_nav > li.share > .content > .sub:first-child, .ui_nav > li.share > .content > a:first-child {
                margin-left: 0
            }

            .ui_nav > li.share > .content > .sub > .ui_icon, .ui_nav > li.share > .content > a > .ui_icon {
                width: 1.5rem;
                height: 1.5rem
            }

            .ui_nav > li.share > .content > .sub:hover, .ui_nav > li.share > .content > a:hover {
                color: #515e73
            }

.ui_list > li.ad_container > .yap-loaded > a > .img, .ui_list > li > .img {
    width: 32%
}

.ui_list > li.ad_container > .yap-loaded > a > .text, .ui_list > li > .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (min-width: 800px) {
    .ui_list > li.ad_container > .yap-loaded > a > .img, .ui_list > li > .img {
        width: 49%
    }

    .ui_list > li.ad_container > .yap-loaded > a > .text, .ui_list > li > .content {
        padding: 1rem
    }
}

.ui_list > li.ad_container > .yap-loaded > a > .text > h3, .ui_list > li > .content > .title > a {
    font-size: 18px;
    font-size: 1.125rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 5.0625rem;
    height: auto;
    color: #333;
    vertical-align: middle;
    line-height: 1.33
}

@media only screen and (max-width: 800px) {
    .ui_list > li.ad_container > .yap-loaded > a > .img, .ui_list > li > .img {
        position: relative;
        margin-right: .5rem
    }

    .ui_list > li.ad_container > .yap-loaded > a > .text > h3, .ui_list > li > .content > .title > a {
        line-height: 1.5;
        font-size: 16px;
        font-size: 1rem;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        max-height: 4.5rem;
        height: auto;
        font-weight: 500
    }
}

.ui_list > li.ad_container > .yap-loaded > a > .text > .desc, .ui_list > li > .content > .con {
    margin-top: 1rem;
    color: #999;
    line-height: 1.5;
    font-size: 16px;
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 4.5rem;
    height: auto
}

@media only screen and (max-width: 800px) {
    .ui_list > li.ad_container > .yap-loaded > a > .text > .desc, .ui_list > li > .content > .con {
        display: none
    }

    .ui_list {
        background-color: #fff;
        padding: 0rem 1rem
    }
}

.ui_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .ui_list > li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        overflow: hidden
    }

@media only screen and (min-width: 800px) {
    .ui_list > li {
        margin-top: .5rem;
        background-color: #fff
    }
}

.ui_list > li > .img {
    text-align: center;
    overflow: hidden
}

    .ui_list > li > .img > a {
        display: block
    }

.ui_list > li > .content > .extcon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: .25rem
}

@media only screen and (max-width: 800px) {
    .ui_list > li {
        padding: 1rem 0rem;
        border-bottom: .0625rem solid #ddd
    }

        .ui_list > li > .content > .extcon {
            display: none
        }
}

.ui_list > li > .content > .extcon > .meta {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .ui_list > li > .content > .extcon > .meta > .block {
        margin-right: .5rem;
        color: #999;
        font-size: 14px;
        font-size: .875rem;
        line-height: 1.71
    }

        .ui_list > li > .content > .extcon > .meta > .block:last-child {
            margin-right: 0
        }

        .ui_list > li > .content > .extcon > .meta > .block.name, .ui_list > li > .content > .extcon > .meta > .block.user_img {
            display: none
        }

            .ui_list > li > .content > .extcon > .meta > .block.name > a {
                color: #999;
                font-size: 12px;
                font-size: .75rem
            }

                .ui_list > li > .content > .extcon > .meta > .block.name > a:hover {
                    color: #e5724f
                }

        .ui_list > li > .content > .extcon > .meta > .block.tool {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end
        }

            .ui_list > li > .content > .extcon > .meta > .block.tool > a {
                margin-left: .625rem
            }

                .ui_list > li > .content > .extcon > .meta > .block.tool > a:first-child {
                    margin-left: 0
                }

.ui_list > li.ad {
    display: block
}

    .ui_list > li.ad > .ui_adblock {
        margin: 0
    }

.ui_list > li.ad_container > .yap-loaded {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%
}

    .ui_list > li.ad_container > .yap-loaded > a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .ui_list > li.ad_container > .yap-loaded > a > .img {
            position: relative
        }

        .ui_list > li.ad_container > .yap-loaded > a > .text > h3 {
            vertical-align: middle
        }

    .ui_list > li.ad_container > .yap-loaded > div:nth-last-child(2) {
        left: 0 !important;
        right: auto !important
    }

    .ui_list > li.ad_container > .yap-loaded > div:last-child {
        font-size: 9px !important;
        font-size: .5625rem !important;
        color: #999 !important;
        font-weight: 400;
        line-height: 1
    }

        .ui_list > li.ad_container > .yap-loaded > div:last-child b, .ui_list > li.ad_container > .yap-loaded > div:last-child span {
            opacity: 0
        }

.ui_pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 1.875rem 0rem
}

    .ui_pagination > .txt {
        margin-right: .625rem;
        font-size: 14px;
        font-size: .875rem;
        line-height: 1.14;
        color: #999
    }

    .ui_pagination > .list {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        overflow: hidden
    }

@media only screen and (min-width: 800px) {
    .ui_pagination > .list {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.ui_pagination > .list > li {
    text-align: center;
    margin: .3125rem
}

@media only screen and (max-width: 800px) {
    .ui_pagination > .list > li {
        margin: .125rem
    }
}

.ui_pagination > .list > li:first-child {
    margin-left: 0
}

.ui_pagination > .list > li:last-child {
    margin-right: 0
}

.ui_pagination > .list > li > a, .ui_pagination > .list > li > span {
    display: block;
    padding: 0rem 1rem;
    min-width: 2.5rem;
    height: 2.5rem;
    line-height: 2.5rem;
    color: #999;
    background-color: #fff;
    font-size: 20px;
    font-size: 1.25rem
}

    .ui_pagination > .list > li.cur > a, .ui_pagination > .list > li.cur > span, .ui_pagination > .list > li > a:hover {
        color: #fff;
        text-decoration: none;
        background-color: #515e73
    }

.ui_pagination > .list > li.next > a, .ui_pagination > .list > li.previous > a {
    position: relative;
    text-indent: -999em;
    width: 2.5rem
}

    .ui_pagination > .list > li.next > a:before, .ui_pagination > .list > li.previous > a:before {
        position: absolute;
        top: 1.0625rem
    }

    .ui_pagination > .list > li.previous > a:before {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        content: "";
        width: .625rem;
        height: .625rem;
        border-style: solid;
        border-color: inherit;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transform: rotate(315deg);
        -ms-transform: rotate(315deg);
        transform: rotate(315deg);
        -webkit-transform-origin: 33.3% 33.3%;
        -ms-transform-origin: 33.3% 33.3%;
        transform-origin: 33.3% 33.3%;
        border-width: .125rem 0rem 0rem .125rem;
        left: 1rem
    }

    .ui_pagination > .list > li.next > a:before {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        *vertical-align: auto;
        zoom: 1;
        *display: inline;
        content: "";
        width: .625rem;
        height: .625rem;
        border-style: solid;
        border-color: inherit;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transform: rotate(315deg);
        -ms-transform: rotate(315deg);
        transform: rotate(315deg);
        -webkit-transform-origin: 33.3% 33.3%;
        -ms-transform-origin: 33.3% 33.3%;
        transform-origin: 33.3% 33.3%;
        border-width: 0rem .125rem .125rem 0rem;
        right: 1.0625rem
    }

.wrap, .wrap .grid {
    -webkit-box-sizing: border-box
}

.wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 100vh;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    box-sizing: border-box;
    background: url(/images/themes/lookforward/bg_patten.jpg)
}

    .wrap > .wrap_header {
        background-color: #fff;
        padding-top: 2rem
    }

        .wrap > .wrap_header > .top {
            -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
            order: 1;
            width: 100%
        }

            .wrap > .wrap_header > .top > .container {
                position: relative
            }

        .wrap > .wrap_header > .bottom {
            -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
            order: 2;
            width: 100%
        }

        .wrap > .wrap_header > .top > .container > .logo {
            text-align: center
        }

            .wrap > .wrap_header > .top > .container > .logo > a {
                display: -moz-inline-stack;
                display: inline-block;
                vertical-align: middle;
                *vertical-align: auto;
                zoom: 1;
                *display: inline;
                width: 15rem;
                height: 5.6875rem;
                background-image: url(/images/themes/lookforward/logo.png);
                background-position: center center;
                background-repeat: no-repeat;
                background-size: contain
            }

                .wrap > .wrap_header > .top > .container > .logo > a > img {
                    display: none
                }

                .wrap > .wrap_header > .top > .container > .logo > a > .txt {
                    display: none;
                    font-size: 18px;
                    font-size: 1.125rem;
                    font-family: Georgia;
                    font-weight: 700;
                    text-transform: uppercase;
                    color: #fff
                }

        .wrap > .wrap_header > .bottom {
            margin-top: 1.5rem;
            background-image: -webkit-gradient(linear,left bottom,left top,from(#e88f64),to(#cb6647));
            background-image: -webkit-linear-gradient(bottom,#e88f64,#cb6647);
            background-image: linear-gradient(to top,#e88f64,#cb6647)
        }

            .wrap > .wrap_header > .bottom > .container > .nav > .list {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center
            }

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header {
        padding-top: 1.125rem
    }

        .wrap > .wrap_header > .top {
            padding: 0rem 1rem
        }

            .wrap > .wrap_header > .top > .container > .logo > a {
                width: 9.875rem;
                height: 3.75rem
            }

        .wrap > .wrap_header > .bottom {
            margin-top: 1rem
        }

            .wrap > .wrap_header > .bottom > .container {
                padding: 0rem 1rem
            }

                .wrap > .wrap_header > .bottom > .container > .nav > .list {
                    -webkit-box-pack: start;
                    -ms-flex-pack: start;
                    justify-content: flex-start
                }
}

.wrap > .wrap_header > .bottom > .container > .nav > .list > li {
    margin-left: 2rem;
    padding: 1.125rem 0rem
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header > .bottom > .container > .nav > .list > li {
        padding: .8125rem 0rem;
        margin-left: .9375rem
    }
}

.wrap > .wrap_header > .bottom > .container > .nav > .list > li:first-child {
    margin-left: 0
}

.wrap > .wrap_header > .bottom > .container > .nav > .list > li > a {
    position: relative;
    font-size: 22px;
    font-size: 1.375rem;
    display: block;
    color: #fff;
    line-height: 1.2
}

    .wrap > .wrap_header > .bottom > .container > .nav > .list > li > a:after {
        position: absolute;
        left: 0;
        bottom: -.25rem;
        content: '';
        width: 100%;
        height: .125rem;
        background: #fff;
        -webkit-transform: scale(0,1);
        -ms-transform: scale(0,1);
        transform: scale(0,1);
        -webkit-transition: -webkit-transform .3s;
        transition: -webkit-transform .3s;
        transition: transform .3s;
        transition: transform .3s,-webkit-transform .3s;
        -webkit-transform-origin: right top;
        -ms-transform-origin: right top;
        transform-origin: right top
    }

.wrap > .wrap_header > .bottom > .container > .nav > .list > li.cur > a:after, .wrap > .wrap_header > .bottom > .container > .nav > .list > li:hover > a:after {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1)
}

.wrap > .wrap_header > .top > .container > .ui_nav {
    position: absolute;
    bottom: 0;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header > .bottom > .container > .nav > .list > li > a {
        font-size: 16px;
        font-size: 1rem;
        line-height: 1.5
    }

    .wrap > .wrap_header > .top > .container > .ui_nav {
        display: none
    }
}

.wrap > .wrap_header > .top > .container > .ui_nav > li > a {
    display: block;
    color: #fff
}

@media only screen and (min-width: 800px) {
    .wrap > .wrap_header > .top > .container > .ui_nav > li > a > .ui_icon {
        width: 2.1875rem;
        height: 2.1875rem;
        background-color: #507bbf;
        padding: .3125rem;
        border-radius: .3125rem
    }

    .wrap .grid > .main .ui_adblock {
        max-width: 46.8125rem
    }
}

.wrap > .wrap_header > .top > .container > .ui_nav > li > a.ui_btn {
    padding: .625rem;
    font-size: 14px;
    font-size: .875rem;
    font-weight: 600;
    color: #fff
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header > .top > .container > .ui_nav > li > a > .ui_icon {
        width: .9375rem;
        height: .9375rem
    }

    .wrap > .wrap_header > .top > .container > .ui_nav > li > a.ui_btn {
        padding: .375rem .3125rem;
        font-size: 12px;
        font-size: .75rem;
        font-weight: 400
    }
}

.wrap > .wrap_header > .top > .container > .ui_nav > li > a.ui_btn > .ui_icon {
    padding: 0;
    background-color: none;
    width: 1.5rem;
    height: 1.5rem
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header > .top > .container > .ui_nav > li > a.ui_btn > .ui_icon {
        width: .75rem;
        height: .75rem
    }
}

.wrap > .wrap_header > .top > .container > .ui_nav > li.search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .wrap > .wrap_header > .top > .container > .ui_nav > li.search:before {
        margin-right: 1.25rem;
        height: 1.3125rem;
        width: .0625rem;
        background-color: #ddd;
        content: ""
    }

.wrap > .wrap_container {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-top: 1rem
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_header > .top > .container > .ui_nav > li.search:before {
        display: none
    }

    .wrap > .wrap_container {
        margin-top: 0
    }

    .wrap .grid > .main {
        width: 100%
    }
}

.wrap .grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box
}

    .wrap .grid > .main {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .wrap .grid > .sidebar {
        margin-left: 1rem;
        width: 20.9375rem;
        padding: 2rem 1.125rem;
        background-color: #fff
    }

@media only screen and (max-width: 800px) {
    .wrap .grid > .sidebar {
        display: none;
        margin: 0rem 1rem;
        width: 100%
    }
}

.wrap .grid > .sidebar > .fbpage > .title {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1.2;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

    .wrap .grid > .sidebar > .fbpage > .title:before {
        margin-right: .625rem;
        width: 2.75rem;
        height: 2.5rem;
        background-image: url(/images/themes/lookforward/bg_fbpage.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
        content: ""
    }

.wrap .grid > .sidebar > .recommend > .content > .ui_list > li.ad_container > .yap-loaded > a > .img, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .img {
    width: 33%;
    margin-right: .625rem
}

@media only screen and (min-width: 800px) {
    .wrap .grid > .sidebar > .recommend > .content > .ui_list > li.ad_container > .yap-loaded > a > .img, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .img {
        width: 33%
    }

    .wrap .grid > .sidebar > .recommend > .content > .ui_list > li.ad_container > .yap-loaded > a > .text, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .content {
        padding: 0rem
    }
}

.wrap .grid > .sidebar > .recommend > .content > .ui_list > li.ad_container > .yap-loaded > a > .text > h3, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .content > .title > a {
    line-height: 1.5;
    font-size: 16px;
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 4.5rem;
    height: auto;
    font-weight: 400
}

.wrap .grid > .sidebar > .recommend > .content > .ui_list > li.ad_container > .yap-loaded > a > .text > .desc, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .content > .con, .wrap .grid > .sidebar > .recommend > .content > .ui_list > li > .content > .extcon {
    display: none
}

.wrap .grid > .sidebar > .recommend > .content > .ui_list > li {
    margin: 0;
    padding: .625rem 0rem;
    border-bottom: .0625rem solid #ddd
}

.wrap > .wrap_footer {
    margin-top: 2rem;
    padding: 1rem 0rem;
    background-color: #515e73
}

    .wrap > .wrap_footer .block > .title {
        margin-bottom: .625rem;
        font-size: 16px;
        font-size: 1rem;
        line-height: 1.31
    }

    .wrap > .wrap_footer .block > .content {
        font-size: 12px;
        font-size: .75rem;
        color: #999
    }

    .wrap > .wrap_footer > .top > .container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .wrap > .wrap_footer > .top > .container > .copyright {
            font-size: 16px;
            font-size: 1rem;
            color: #fff;
            font-weight: 500
        }

        .wrap > .wrap_footer > .top > .container > .ui_nav {
            margin-left: 1.25rem
        }

@media only screen and (max-width: 800px) {
    .wrap > .wrap_footer {
        padding: 1rem
    }

        .wrap > .wrap_footer > .top > .container > .copyright {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
            text-align: center
        }

        .wrap > .wrap_footer > .top > .container > .ui_nav {
            margin-top: .5rem;
            margin-left: 0
        }

            .wrap > .wrap_footer > .top > .container > .ui_nav > li {
                margin-bottom: .5rem
            }
}

.wrap > .wrap_footer > .top > .container > .ui_nav > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 1.5rem
}

    .wrap > .wrap_footer > .top > .container > .ui_nav > li:first-child {
        margin-left: 0
    }

    .wrap > .wrap_footer > .top > .container > .ui_nav > li > a {
        font-size: 16px;
        font-size: 1rem;
        color: #fff;
        font-weight: 500
    }

        .wrap > .wrap_footer > .top > .container > .ui_nav > li > a:hover {
            color: #e5724f
        }

.wrap > .wrap_footer > .bottom {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width: 800px) {
    .wrap > .wrap_footer > .bottom {
        width: 100%;
        margin-top: 1.5rem
    }
}

.wrap > .wrap_footer > .bottom > .container > .block > .title {
    display: none;
    color: #ccc
}

.wrap > .wrap_footer > .bottom > .container > .block > .content {
    font-size: 12px;
    font-size: .75rem;
    color: #ccc
}