@charset 'utf-8';


/* Reset CSS
    Eric Meyer's v1.0 | 20080212(http://meyerweb.com/eric/tools/css/reset/)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

ul, ol {
    margin: 0;
    padding: 0;
}

body {
    line-height: 1;
    font-size: 14px
}

a {
    font-size: 14px;
}

table {
    /*background: #fff;*/
}

ol, ul {
    list-style: none;
}

/*select {
    width: 150px;
    padding: .5em .5em;
    font-family: inherit;
    background-color: #fff;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #000;
}*/

select::-ms-expand {
    display: none;
}

.orange {
    color: #FF9C20;
}


blockquote, q {
    quotes: none;
}

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

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}

del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
    border-top: 2px solid #301100;
    border-bottom: 1px solid #eee;
}

.view table {
    border-bottom: none;
}

    .view table strong {
        font-size: 24px;
        font-weight: 600;
        color: #111;
    }

thead {
    display: none;
}

/* png 24*/
.png24 {
    tmp: expression(setPng24(this));
}

/* // Reset CSS */

body .jmxa-join a {
    line-height: normal;
}
/* ie8 header bug */

body {
    background-color: #ffffff;
    color: #111;
    font-family: Tahoma,Verdana,Arial,Apple-Gothic,sans-serif,Dotum;
}

ol, ul {
    list-style: none;
}

address, em {
    font-style: normal;
}

img {
    border: 0;
    vertical-align: top;
}

fieldset {
    position: relative;
    border: 0;
}

legend {
    position: absolute;
    top: 0;
    left: -2010em;
    width: 1px;
    height: 1px;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
}

button {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    *overflow: visible;
    color: #898989;
    font-size: 0.75rem;
    /*font-family: Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;*/
}

    button::-moz-focus-inner {
        border: 0;
        padding: 0;
    }

    button img {
        *position: relative;
    }

input:focus {
    outline: none;
}

input {
    color: #383838;
    font-size: 1rem;
    font-family: Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
}

    input[type='file'] {
        background-color: #FFF;
    }

select {
    font-size: 0.75rem;
    font-family: Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
}

textarea {
    color: #383838;
    font-size: 0.75rem;
    font-family: Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
}

/*table {table-layout:fixed;} editor use */
hr {
    display: none;
}

a:link {
    color: #111111;
    text-decoration: none;
}

a:visited {
    color: #683e26;
    text-decoration: none;
}

a:hover {
    color: #FF9C20;
    text-decoration: underline;
}

a:active {
    color: #683e26;
    text-decoration: none;
}

/* Hides from IE-mac \*/ * html .xb {
    height: 1%;
}
    /* End hide from IE-mac */
    #gnav:after, #developer .contset:after, #content:after,
    .bbs .view .share:after, .bbs .view .handlers:after, .bbs .view .lead:after, .bbs .comments .write:after, .bbs .comments ul li .setter:after,
    .signedin .details .exp:after, .charcard .chan:after, .charcard .sect:after, .charcard .ranking .chart dd:after, .charcard .info .exp:after, .charcard .chars:after, #weapons-each-header .type:after,
    .xb:after, .subject:after, .bbs .view .handlers:after, .tab ul:after, .poll .thumbnail:after, .down-site ul li:after, .graphic ul li:after, .graphic ul li .logo:after, .screenshots-area .title-area:after, .screenshots-area .thumbnail:after,
    .interface-list li:after, .minimap-area:after, .guide-list:after, .tamer-area ul:after, .ietm-area .digivice:after, .search:after, .mytamer-area:after,
    .tab-area:after {
        clear: both;
        display: block;
        height: 0;
        font-size: 0;
        line-height: 0;
        content: '.';
        visibility: hidden;
    }

/* Element Hide */
#content h2, #extra .guide h2, .bbs .panel-author dt,
.charcard .panel-cw .tit, .guide-area h2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
}

.setter {
    width: 100%;
}

.align-r {
    text-align: right
}

.align-l {
    text-align: left
}

.align-c {
    text-align: center
}

.point {
    color: #ee2e13;
}


#JMX-Angel {
    z-index: 999 !important;
}

body #JMX-Angel .jmxa-contset {
    width: 980px !important;
    margin: 0 auto !important;
}

body #JMX-Closer .jmxc-contset {
    width: 980px !important;
    margin: 0 auto !important;
}


.alt-body .vis-enhancing {
    background-repeat: no-repeat;
    background-position: center top;
}

.ch-common .key {
    background-image: url('../../_images/us/common/h1_common.jpg');
}

.ch-common .vis-enhancing {
    /*background-image: url('../../_images/us/common/vis_common.jpg');*/
}

.ch-main .key {
    background-image: url('../../_images/us/common/h1_main.jpg');
}

.ch-main .vis-enhancing {
    background-image: url('../../_images/us/common/vis_main.jpg');
}

h2 {
    margin: 0 0 .5em;
    font-size: 2em;
}

h3 {
    color: #C1B087;
    font-size: 16px;
}

.youtube-logo {
    position: relative;
    top: -41px;
    left: 89px;
    display: none;
}

#header {
    position: relative;
    z-index: 5;
    width: 980px;
    min-height: 255px;
    _height: 255px;
    margin: 0 auto;
    padding: 0 18px 25px;
    background: url('../../_images/us/common/bg_header.jpg') no-repeat center bottom;
    display: none;
}

    #header h1 a {
        display: block;
        width: 213px;
        height: 145px;
        text-decoration: none;
    }

    #header h1 span {
        display: block;
        position: relative;
        z-index: -1;
        width: 213px;
        height: 145px;
        color: #FFF;
        font-size: 4em;
    }

    #header .key {
        min-height: 150px;
        _height: 150px;
        padding: 50px 60px 0;
        background-repeat: no-repeat;
        background-position: center top;
    }

    #header .banner {
        position: absolute;
        right: 40px;
        top: 65px;
        width: 628px;
        height: 110px;
    }

#gnav {
    position: relative;
    min-height: 55px;
    _height: 55px;
    z-index: 7;
}

    #gnav li {
        position: relative;
        float: left;
        width: 163px;
        height: 55px;
        zoom: 1;
    }

        #gnav li a {
            display: block;
            height: 55px;
            background: #16130E url('../../_images/us/common/gnav.jpg') no-repeat left top;
        }

        #gnav li.chan-news {
            width: 164px;
        }

        #gnav li.chan-support {
            width: 164px;
        }

        #gnav li.chan-news a {
            background-position: left top;
        }

        #gnav li.chan-guide a {
            background-position: -164px top;
        }
        /*#gnav li.chan-ranking a { background-position:-245px top; }
#gnav li.chan-guild a { background-position:-367px top; }*/
        #gnav li.chan-download a {
            background-position: -327px top;
        }

        #gnav li.chan-itemmall a {
            background-position: -490px top;
        }

        #gnav li.chan-community a {
            background-position: -653px top;
        }

        #gnav li.chan-support a {
            background-position: -816px top;
        }


        #gnav li.chan-news a.cur, #gnav li.chan-news a.hover:link, #gnav li.chan-news a.hover:active, #gnav li.chan-news a.hover:hover, #gnav li.chan-news a.hover:visited {
            background-position: left -55px;
        }

        #gnav li.chan-guide a.cur, #gnav li.chan-guide a.hover:link, #gnav li.chan-guide a.hover:active, #gnav li.chan-guide a.hover:hover, #gnav li.chan-guide a.hover:visited {
            background-position: -164px -55px;
        }
        /*#gnav li.chan-ranking a.cur,#gnav li.chan-ranking a.hover:link,#gnav li.chan-ranking a.hover:active,#gnav li.chan-ranking a.hover:hover,#gnav li.chan-ranking a.hover:visited { background-position:-245px -55px; }
#gnav li.chan-guild a.cur,#gnav li.chan-guild a.hover:link,#gnav li.chan-guild a.hover:active,#gnav li.chan-guild a.hover:hover,#gnav li.chan-guild a.hover:visited { background-position:-367px -55px; }*/
        #gnav li.chan-download a.cur, #gnav li.chan-download a.hover:link, #gnav li.chan-download a.hover:active, #gnav li.chan-download a.hover:hover, #gnav li.chan-download a.hover:visited {
            background-position: -327px -55px;
        }

        #gnav li.chan-itemmall a.cur, #gnav li.chan-itemmall a.hover:link, #gnav li.chan-itemmall a.hover:active, #gnav li.chan-itemmall a.hover:hover, #gnav li.chan-itemmall a.hover:visited {
            background-position: -490px -55px;
        }

        #gnav li.chan-community a.cur, #gnav li.chan-community a.hover:link, #gnav li.chan-community a.hover:active, #gnav li.chan-community a.hover:hover, #gnav li.chan-community a.hover:visited {
            background-position: -653px -55px;
        }

        #gnav li.chan-support a.cur, #gnav li.chan-support a.hover:link, #gnav li.chan-support a.hover:active, #gnav li.chan-support a.hover:hover, #gnav li.chan-support a.hover:visited {
            background-position: -816px -55px;
        }

        #gnav li.chan-news ul {
            left: 0;
        }

        #gnav li.chan-news .ground {
            left: -10px;
        }

        #gnav li.chan-support ul {
            right: 10px;
            left: auto;
        }

        #gnav li.chan-support .ground {
            right: -10px;
            left: auto;
        }

        #gnav li a span {
            display: block;
            position: absolute;
            z-index: -1;
            height: 55px;
            font-size: 19px;
            font-weight: bold;
            text-align: center;
        }

        #gnav li ul {
            display: none;
            position: absolute;
            top: 56px;
            left: -30px;
            width: 178px;
            min-height: 120px;
            _height: 120px;
            padding: 18px 7px 19px;
        }

            #gnav li ul li {
                float: none;
                width: auto;
                height: auto;
                margin-left: 19px;
                padding-left: 6px;
                background: url('../../_images/us/common/side_menu_dot.gif') no-repeat left 11px !important;
            }

                #gnav li ul li a {
                    display: inline-block;
                    background: none;
                    width: auto;
                    height: auto;
                    padding-right: 10px;
                    font-size: 12px;
                    line-height: 22px;
                    font-weight: bold;
                    white-space: nowrap;
                }

                    #gnav li ul li a:hover {
                        width: auto;
                        background: url('../../_images/us/common/side_menu_hover.gif') no-repeat right 7px !important;
                        color: #cc0000;
                        text-decoration: none;
                    }

        #gnav li .ground {
            position: absolute;
            top: 46px;
            left: -40px;
            display: none;
            width: 222px;
            height: 238px;
            background: url('../../_images/us/common/gnav_submenu.png') no-repeat left bottom;
        }

/*#gnav ul li { background:url('../../_images/us/common/gnav_bul_normal.gif') no-repeat 100% 9px; font-size:12px; font-weight:normal; text-align:left;}
#gnav ul li.hover {background:url('../../_images/us/common/gnav_bul_hover.gif') no-repeat 100% 9px;}
#gnav ul a {padding:5px 10px 8px;}
#gnav a {display:block; padding:11px;}
#gnav a:link, #gnav a:visited, #gnav a:hover, #gnav a:active {color:#C9BEA2; text-decoration:none;}/

/* Basic code - don't modify
#gnav li {position:relative;}
#gnav a {display:block;}
#gnav ul {display:none; position:absolute;}
#gnav ul a {zoom: 1; *vertical-align:top;}
#gnav ul li {float:none; width:auto; min-height:1em; _height:1em;}
#gnav ul ul {top: 0;}*/

/* Essentials - configure this
#gnav ul ul {left:120px;}
#gnav .chan-news ul {left:0;}
#gnav .chan-news ul ul {left:120px;}
#gnav .chan-guide ul {width:151px;}
#gnav .chan-download ul {width:131px;}
#gnav .chan-support ul {width:133px;}
#gnav .in-prep ul {width:127px;}*/

/* Everything else is theming
#gnav li ul a:link, #gnav li ul a:visited {color:#AAA28F;}
#gnav li.hover a:link, #gnav li.hover a:visited, #gnav li.hover a:hover, #gnav li.hover a:active {color:#D59908;}
#gnav li.hover ul a:link, #gnav li.hover ul a:visited {color:#AAA28F;}
#gnav li.hover ul a.hover:hover, #gnav li.hover ul a.hover:active {color:#C29018;}
#gnav ul { top:25px; border:1px solid #1D1C1C;}
#gnav ul li {border-top:1px solid #4E4A44;}
#gnav ul li.first {border-top-width:0;}
*/

#developer {
    width: 100%;
    margin: 0 auto;
    background: url('../../_images/us/common/dev_bg_middle.gif') repeat-y center top;
    background: #fff;
}

    #developer .contbottom {
        min-height: 500px;
        background: #FBFBFB;
        /*background: url('../../_images/us/common/dev_bg_top.jpg') no-repeat center top;*/
    }

    #developer .contset {
        position: relative;
        max-width: 1200px;
        /*min-height: 500px;*/
        padding: 0 30px 45px;
        margin: 0 auto;
        /*background: url('../../_images/us/common/dev_bg_bottom.gif') no-repeat left bottom;*/
    }

#footer {
    padding: 50px 0;
    /*background: #ffecbb url('../../_images/us/common/body_bg_bottom.jpg') no-repeat 50% top;*/
    background: #fff;
}

    #footer .contset {
        max-width: 1006px;
        margin: 0 auto;
        padding-bottom: 39px;
        /*background: #ffecbb url('../../_images/us/common/body_bg_bottom.jpg') no-repeat 50% top;*/
        font-size: 0;
        line-height: 0;
    }

        #footer .contset .familysite {
            font-size: 0;
            line-height: 0;
            display: flex;
            justify-content: center;
        }

            #footer .contset .familysite a {
                margin-right: 16px;
                display: inline;
            }

        #footer .contset address {
            display: flex;
            padding-top: 25px;
            justify-content: center;
        }


#dev-col-setter {
    /*float: right;
    margin-left: -315px;*/
}

#membership {
    position: relative;
    float: left;
    width: 308px;
    min-height: 220px;
    _height: 220px;
}

#content {
    position: relative;
    min-height: 1em;
    _height: 1em;
    /*margin-left: 318px;*/
    padding: 30px 0px;
}

#extra {
    position: relative;
    float: left;
    clear: left;
    width: 308px;
}

.silk_chare {
    margin-top: 9px;
}

.agreement {
    margin-top: 10px;
}

    .agreement span {
        display: block;
        font-size: 14px;
        margin-bottom: 5px;
    }

    .agreement a, .agreement a:link, .agreement a:active, .agreement a:hover, .agreement a:visited {
        display: block;
        min-height: 38px;
        height: 38px;
        padding: 9px 0 10px 113px;
        background: url('../../_images/us/common/sc_useagreement_bg.gif') no-repeat left top;
        color: #ffd012;
        font-weight: bold;
        font-size: 20px;
        text-decoration: none;
    }

.facebook-area {
    margin-top: 10px;
    padding: 15px 0;
    min-height: 257px;
    _height: 257px;
    background: url('../../_images/us/common/extra_bg.gif') no-repeat left bottom;
}

    .facebook-area .title-area {
        margin: -15px 0 0 0;
        padding: 13px 13px 0;
        min-height: 29px;
        _height: 29px;
        background: url('../../_images/us/common/extra_bg.gif') no-repeat left top;
        font-size: 17px;
        font-weight: normal;
    }

    .facebook-area .facebook {
        padding: 0px 7px 7px 7px;
        zoom: 1;
    }

.sns {
    position: relative;
    margin-top: 10px;
    padding: 13px 15px 15px 19px;
    _padding-top: 15px;
    min-height: 91px;
    _height: 91px;
    background: url('../../_images/us/common/extra_bg.gif') no-repeat left bottom;
}

    .sns .title-area {
        margin: -15px -15px 0 -19px;
        padding: 15px 15px 0 19px;
        min-height: 29px;
        _height: 29px;
        background: url('../../_images/us/common/extra_bg.gif') no-repeat left top;
    }

        .sns .title-area h2 {
            font-size: 17px;
            line-height: 18px;
            font-weight: normal;
            background: url('../../_images/us/common/side_subject_bg.gif') no-repeat right 50%;
        }

            .sns .title-area h2 span {
                height: 10px;
                padding-right: 10px;
                background: #fff url('../../_images/us/common/side_subject_line.gif') no-repeat right 50%;
            }

    .sns span.txt {
        position: absolute;
        left: 173px;
        bottom: 21px;
        display: inline-block;
        width: 121px;
        font-weight: bold;
        word-break: break-all;
        word-wrap: break-word;
    }

    .facebook-area h2, .sns .title-area h2 {
        font-size: 17px;
        font-weight: normal;
        line-height: 21px;
        background: url('../../_images/us/common/side_subject_bg.gif') no-repeat right 50%;
    }

        .facebook-area h2 span, .sns .title-area h2 span {
            height: 10px;
            padding-right: 10px;
            background: #fff9e9 url('../../_images/us/common/side_subject_line.gif') no-repeat right 50%;
        }

.guide-area {
    position: relative;
    margin-top: 6px;
}

    .guide-area li {
        background: url('../../_images/us/common/guide_bg.gif') no-repeat left bottom;
    }

        .guide-area li a {
            display: block;
            height: 49px;
            padding: 20px 0 0 138px;
            line-height: 49px;
            background: url('../../_images/us/common/guide_partnermon.jpg') no-repeat 54px top;
        }

            .guide-area li a:link, .guide-area li a:visited, .guide-area li a:hover, .guide-area li a:active {
                text-decoration: none;
                color: #720700;
                font-size: 17px;
            }

        .guide-area li.support a {
            padding-top: 8px;
            background-position: 54px -70px;
        }

#side {
    position: relative;
    clear: left;
    float: left;
    width: 308px;
    margin-top: 10px;
    /*background: url('../../_images/us/common/side_menu_bg.gif') no-repeat left bottom;*/
}

.side-menu .title-area {
    min-height: 50px;
    _height: 50px;
    padding: 0 14px 5px 15px;
    background: url('../../_images/us/common/side_menu_bg.gif') no-repeat right top;
}

.side-menu h2 {
    color: #720700;
    font-size: 20px;
    font-family: Arial;
    line-height: 40px;
    background: url('../../_images/us/common/side_menu_titlebg.gif') no-repeat right 50%;
}

    .side-menu h2 span {
        height: 10px;
        padding-right: 10px;
        margin-right: 10px;
        background: url('../../_images/us/common/side_menu_titleline.gif') no-repeat right 50%;
    }

.side-menu ul {
    padding: 0 14px 17px 15px;
}

    .side-menu ul li {
        background: url('../../_images/us/common/side_menu_line.gif') no-repeat left top;
    }

        .side-menu ul li.first {
            background: none;
        }

        .side-menu ul li a {
            display: block;
            height: 37px;
            padding-left: 25px;
            background: url('../../_images/us/common/side_menu_dot.gif') no-repeat 17px 17px;
            font-weight: bold;
            font-size: 14px;
            color: #2d0000;
            line-height: 35px;
        }

            .side-menu ul li a, .side-menu ul li a:link, .side-menu ul li a:active, .side-menu ul li a:visited {
                color: #2d0000;
                text-decoration: none;
            }

        .side-menu ul li.cur {
            background: none;
            margin-bottom: -2px;
        }

            .side-menu ul li.cur a {
                height: 35px;
                background: url('../../_images/us/common/side_menu_cur.gif') no-repeat left top;
            }

                .side-menu ul li.cur a, .side-menu ul li.cur a:link, .side-menu ul li.cur a:active, .side-menu ul li.cur a:visited {
                    color: #960d00;
                }

/* gauge-area */
#gauge-area {
    position: absolute;
    z-index: 5;
    right: -102px;
    top: 56px;
}

.gauge {
    width: 67px;
    height: 600px;
    padding: 12px 26px 26px 27px;
    background: url('../../_images/us/common/gauge_bg.jpg') no-repeat left top;
}

    .gauge .bar-area {
        overflow: hidden;
        width: 67px;
        height: 430px;
    }

        .gauge .bar-area ul {
            float: left;
            width: 20px;
            margin-top: -29px;
            padding-left: 18px;
        }

            .gauge .bar-area ul li {
                margin-top: 63px;
                color: #860000;
                font-size: 9px;
                font-weight: bold;
            }

    .gauge .bar {
        float: left;
        position: relative;
        width: 10px;
        height: 370px;
        margin: 33px 0 0 6px;
    }

        .gauge .bar span {
            display: block;
            position: absolute;
            bottom: 0;
            width: 10px;
            background: url('../../_images/us/common/gauge_bar.gif') no-repeat left bottom;
        }

            .gauge .bar span span {
                position: static;
                bottom: auto;
                display: block;
                padding-top: 3px;
                background: url('../../_images/us/common/gauge_bar.gif') no-repeat left top;
            }

    .gauge .click-here {
        clear: both;
        text-align: center;
        padding-bottom: 12px;
    }

        .gauge .click-here a {
            display: block;
            padding: 8px 0 16px;
            background: url('../../_images/us/common/gauge_more.gif') no-repeat 50% bottom;
        }

            .gauge .click-here a, .gauge .click-here a:link, .gauge.click-here a:visited, .gauge .click-here a:hover, .gauge .click-here a:active {
                font-size: 11px;
                font-weight: bold;
                color: #feba14;
                text-align: center;
                text-decoration: none;
            }

/* quick menu */
#abc {
    position: absolute;
    top: 300px;
    left: 998px;
    z-index: 10;
}
/* quick menu */
#quick {
    position: absolute;
    z-index: 1;
    left: 998px !important;
    top: 470px;
    width: 68px;
    height: 114px;
    margin-left: 10px;
}

    #quick a {
        display: block;
        width: 68px;
        height: 114px;
        background: url('../../_images/us/common/top.png') no-repeat left top;
        *background-image: url('../../_images/us/common/top.gif');
    }

    #quick span {
        display: block;
        position: absolute;
        z-index: -1;
        width: 28px;
        height: 64px;
        padding: 26px 20px;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
    }



/* membership */
#membership .agreement {
    position: relative;
    margin-bottom: -2px;
}

.cute-signin {
    width: 287px;
    min-height: 110px;
    _height: 110px;
    margin-bottom: -17px;
    padding: 10px 8px 0 13px;
    background: #fff9e9 url('../../_images/us/common/signin_bg.gif') no-repeat left top;
}

    .cute-signin fieldset {
        position: static;
        border: 0;
        padding: 0;
    }

    .cute-signin .cont {
        min-height: 59px;
        _height: 59px;
        margin-right: 82px;
        padding: 0 3px 0 2px;
        margin-bottom: 22px;
    }

        .cute-signin .cont label {
            position: absolute;
            top: 0;
            left: 0;
            width: 113px;
            padding: 0 8px;
            color: #ffffff;
            font-size: 9px;
            line-height: 25px;
        }

        .cute-signin .cont br {
            display: none;
        }

        .cute-signin .cont .each {
            position: relative;
        }

    .cute-signin .id {
        position: relative;
        margin-bottom: 3px;
    }

    .cute-signin .password {
        position: relative;
    }

    .cute-signin .val, .cute-signin .val span {
        display: block;
    }

        .cute-signin .val span {
            min-height: 22px;
            _height: 22px;
        }

        .cute-signin .val input {
            width: 190px;
            height: 22px;
            *margin: -1px 0;
            padding: 0 5px;
            border: 0;
            background: url('../../_images/us/common/signin_input.gif') no-repeat left top;
            color: #fff;
            font-size: 12px;
            line-height: 22px;
        }

    .cute-signin .submit {
        float: left;
        width: 82px;
        margin-left: -82px;
    }

        .cute-signin .submit button {
            width: 82px;
            height: 47px;
            color: #fff;
            font-size: 9px;
            font-weight: bold;
            vertical-align: top;
        }

    .cute-signin .help {
        clear: both;
        min-height: 28px;
        _height: 28px;
        margin-left: -2px;
        padding: 0 2px 0 3px;
        background: url('../../_images/us/common/signin_help_bg.gif') no-repeat left top;
    }

        .cute-signin .help .facebook {
            position: absolute;
            top: 161px;
            left: 7px;
            width: 227px;
            height: 25px;
        }

        .signedin .help:after,
        .signedin-cs .help:after,
        .signedin-cs .silk-area:after,
        .cute-signin .help:after {
            clear: both;
            display: block;
            height: 0;
            font-size: 0;
            line-height: 0;
            content: '.';
            visibility: hidden;
        }

        .signedin .help li,
        .signedin-cs .help li,
        .cute-signin .help li {
            float: left;
            _display: inline;
            font-size: 12px;
            padding-left: 8px;
        }

        .cute-signin .help .sign-up .bar {
            margin-right: 8px;
            padding-left: 8px;
            width: 2px;
            background: url('../../_images/us/common/signin_help_line.gif') no-repeat right 50%;
            zoom: 1;
            min-height: 28px;
            _height: 28px;
            *vertical-align: middle;
        }

        .signedin .help a,
        .signedin-cs .help a,
        .cute-signin .help a {
            width: auto;
            min-height: 28px;
            _height: 28px;
            padding-right: 7px;
            line-height: 28px;
            *vertical-align: middle;
            background: url('../../_images/us/common/signin_help_bul.gif') no-repeat right 50%;
        }

        .signedin .help .account,
        .signedin-cs .help .account,
        .cute-signin .help .find {
            padding-right: 8px;
            background: url('../../_images/us/common/signin_help_line.gif') no-repeat right 50%;
            zoom: 1;
        }

        .signedin .help a:link, .signedin .help a:visited, .signedin .help a:hover, .signedin .help a:active,
        .signedin-cs .help a:link, .signedin-cs .help a:visited, .signedin-cs .help a:hover, .signedin-cs .help a:active,
        .cute-signin .help a:link, .cute-signin .help a:visited, .cute-signin .help a:hover, .cute-signin .help a:active {
            color: #960d00;
            text-decoration: none;
            font-weight: bold;
            font-size: 12px;
            font-family: Arial;
        }


/* signedin */
.signedin {
    width: 268px;
    min-height: 105px;
    _height: 105px;
    padding: 15px 25px 0 15px;
    background: #fff9e9 url('../../_images/us/common/signin_bg.gif') no-repeat left top;
}

    .signedin h2 {
        margin: 0 0 7px 18px;
        _margin-bottom: 6px;
        font-size: 0;
        line-height: 0;
    }

    .signedin .greeting {
        height: 40px;
        margin-bottom: 15px;
        background: url('../../_images/us/common/signedin_bg.gif') no-repeat left top;
        text-align: center;
    }

        .signedin .greeting .nickname {
            display: inline-block;
            padding: 14px 0;
            color: #fff;
        }

    .signedin .help, .signedin-cs .help {
        width: 205px;
        min-height: 27px;
        _height: 27px;
        padding-right: 6px;
        background: url('../../_images/us/common/signin_help_bg.gif') no-repeat right top;
        zoom: 1;
    }

        .signedin .help ul, .signedin-cs .help ul {
            margin-left: -2px;
            display: inline-block;
            width: 199px;
            padding-left: 6px;
            background: url('../../_images/us/common/signin_help_bg.gif') no-repeat left top;
        }

        .signedin .help .account {
            padding-left: 14px;
            padding-right: 23px;
            margin-right: 14px;
        }

    .signedin .nick-txt {
        margin: 5px 0 11px 18px;
        font-size: 10px;
        color: #960d00;
        line-height: 1.2;
    }

/* signedin-cs */
.signedin-cs {
    width: 268px;
    min-height: 105px;
    _height: 105px;
    padding: 15px 25px 0 15px;
    background: #fff9e9 url('../../_images/us/common/signin_bg.gif') no-repeat left top;
}

    .signedin-cs h2 {
        width: 262px;
        margin: -1px 0 6px 8px;
        font-size: 15px;
        color: #960d00;
        line-height: 1.2;
        font-weight: normal;
        word-break: break-all;
        word-wrap: break-word;
    }

        .signedin-cs h2 strong {
            font-size: 15px;
            color: #5c0800;
            font-weight: bold;
        }

    .signedin-cs .silk-area {
        margin-bottom: 12px;
        zoom: 1;
        margin-left: -5px;
    }

        .signedin-cs .silk-area .silk {
            float: left;
            margin-left: 5px;
        }

        .signedin-cs .silk-area .info, .signedin-cs .silk-area .info span {
            position: relative;
            display: inline-block;
            height: 40px;
            margin: 0;
            border: 0;
            background: url('../../_images/us/common/signedin_bg.gif') no-repeat left top;
            padding-bottom: 1px;
            _padding-bottom: 0;
            color: #e6e6e6;
            font-size: 12px;
            line-height: 16px;
            font-weight: bold;
            font-family: Tahoma, Arial, Sans-serif;
            text-align: center;
            text-decoration: none !important;
            white-space: nowrap;
            vertical-align: middle;
        }

            .signedin-cs .silk-area .info span {
                left: 3px;
                overflow: visible;
                height: 27px;
                padding: 13px 8px 1px 7px;
                background-position: right top;
                *vertical-align: top;
            }

            .signedin-cs .silk-area .info span {
                width: 250px;
            }

                .signedin-cs .silk-area .info span em {
                    margin-right: 2px;
                    padding-right: 6px;
                    background: url('../../_images/us/common/signedin_bg_line.gif') no-repeat right 3px;
                }

                .signedin-cs .silk-area .info span em {
                    margin-right: 12px;
                    padding-right: 16px;
                }

        .signedin-cs .silk-area .pre-info, .signedin-cs .silk-area .pre-info span {
            color: #ffd012;
        }

    .signedin-cs .help {
        width: auto;
    }

        .signedin-cs .help ul {
            width: auto;
        }

        .signedin-cs .help li {
            padding-left: 10px;
            padding-right: 10px;
            background: url('../../_images/us/common/signin_help_line.gif') no-repeat left 50%;
            zoom: 1;
        }

            .signedin-cs .help li.account {
                padding-left: 14px;
                padding-right: 13px;
                background: none;
            }

            .signedin-cs .help li.signout {
                padding-right: 0;
            }

/** mytamer-tooltip **/
#mytamer-tooltip {
    position: absolute;
    left: 260px;
    top: -80px;
    z-index: 2000;
}

.mytamer-tooltip {
    display: none;
    width: 380px;
    height: auto;
    padding: 3px;
    border: 7px solid #5d0000;
    background-color: #fff1d0;
}

    .mytamer-tooltip .tamer-view {
        border: 1px solid #ceb0ac;
    }

        .mytamer-tooltip .tamer-view h1 {
            padding-left: 9px;
            height: 30px;
            background-color: #f1cb8d;
            font-size: 14px;
            color: #683e26;
            line-height: 30px;
            vertical-align: middle;
        }

    .mytamer-tooltip .tamer-info {
        padding: 0 11px 5px;
        background-color: #f8e5c6;
    }

    .mytamer-tooltip h2 {
        position: static;
        overflow: auto;
        left: auto;
        top: auto;
        width: auto;
        height: 20px;
        margin: 0;
        padding: 10px 0 0 9px;
        background: url('../../_images/us/guild/bul_tamer.gif') no-repeat left 13px;
        font-size: 12px;
        color: #dd7800;
        line-height: 1.2;
        vertical-align: middle;
    }

.mytamer-area {
    padding: 5px;
    background-color: #fff2db;
    border: 1px solid #ceb0ac;
    zoom: 1;
}

    .mytamer-area .img-area {
        float: left;
        display: inline-block;
        width: 55px;
        height: 55px;
        margin-right: 5px;
        padding: 5px;
        background: url('../../_images/us/guild/bg_tamer.gif') no-repeat left top;
        vertical-align: top;
    }

    .mytamer-area ul {
        float: left;
        width: 200px;
        margin-top: 3px;
        font-size: 11px;
    }

        .mytamer-area ul li {
            padding: 0 0 4px 13px;
            *padding-bottom: 2px;
            background: url('../../_images/us/common/bbs_bul.gif') no-repeat 3px 3px;
        }

            .mytamer-area ul li em {
                display: inline-block;
                width: 71px;
                margin-right: 2px;
                background: url('../../_images/us/guild/guild_line.gif') no-repeat right 1px;
                color: #dd7800;
            }

            .mytamer-area ul li span {
                color: #683e26;
            }

            .mytamer-area ul li.partner span {
                color: #a88f81;
            }

.mytamer-area {
    padding: 5px;
    background-color: #fff2db;
    border: 1px solid #ceb0ac;
    zoom: 1;
}

.select-tamer {
    padding: 3px;
    background-color: #fff1d0;
    border: 1px solid #ceb0ac;
    vertical-align: middle;
}

    .select-tamer .tit {
        display: inline-block;
        padding: 5px 6px 5px 8px;
        background-color: #dd7800;
        font-size: 11px;
        color: #fff;
        vertical-align: middle;
    }

    .select-tamer select {
        width: 255px;
        border: 1px solid #ceb0ac;
        font-size: 11px;
        color: #683E26;
        vertical-align: middle;
    }

/* btn-area */
.mytamer-tooltip .tamer-view .btn-area {
    margin-top: 5px;
    text-align: center;
}

    .mytamer-tooltip .tamer-view .btn-area .btn-ga {
        margin-right: 30px;
    }

    .mytamer-tooltip .tamer-view .btn-area .btn-ga, .mytamer-tooltip .tamer-view .btn-area a {
        background-image: url('../../_images/us/guild/bg_btn_close.gif');
        height: 20px;
        line-height: 20px;
        font-size: 11px;
        color: #ffecbb;
        padding-bottom: 1px;
    }

    .mytamer-tooltip .tamer-view .btn-area a {
        left: 25px;
        padding-left: 0;
    }


/* Content Title Area */
.subject {
    /*background: #fff url('../../_images/us/common/content_subject_bg.gif') repeat-x right 30px;*/
}

.time {
    background-image: url('../../_images/us/ranking/time_bg.gif');
    width: 600px;
    height: 20px;
    line-height: 20px;
    margin-top: 10px;
    margin-bottom: 20px;
}

    .time strong {
        padding-left: 28px;
        color: #c36a27;
        font-size: 11px;
    }

.subject .tit,
.subject h3 {
    margin-top: 70px;
    line-height: 1.2;
    color: #000;
    text-align: center;
    font-size: 50px;
    font-weight: bold;
    margin-bottom: 45px;
    word-break: break-all;
}

.sign-in h3 {
    margin-top: 0;
}

.subject .point {
    color: #dd7800;
}

.subject .cur {
    padding-left: 11px;
    font-size: 11px;
    line-height: 1.2;
    margin-bottom: 30px;
    /*background: #fff url('../../_images/us/common/content_subject_line.gif') no-repeat left 50%;*/
    letter-spacing: 1px;
    color: rgba(0,0,0,0.2);
}

    .subject .cur em {
        color: #111111;
        font-weight: bold;
        font-size: 14px;
    }

.hide {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    color: transparent;
}


/* Buttons */
.btn-yellow,
.btn-facebook,
.btn-gray, .btn-gray button,
.btn-bing-ga,
.btn-ga,
.btn-ga button, .btn-ga input {
    cursor: pointer;
    position: relative;
    display: inline-block;
    margin: 0;
    border: 0;
    font-size: 14px;
    font-weight: bold;
    font-family: Arial, Sans-serif;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
    vertical-align: middle;
    padding: 9px 0px;
    max-width: 100%;
    width: 200px;
    height: 60px;
    line-height: 38px;
    border-radius: 30px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    background: none;
    color: #111;
    border: 2px solid #111;
}



    .btn-ga:hover, .btn-bing-ga:hover {
        background-position: 0% 100%;
        transform: translate(0px, -3px );
    }

        .btn-bing-ga:hover a {
            text-decoration: none;
        }

    .btn-yellow a, .btn-yellow button, .btn-gray a, .btn-gray button, .btn-facebook a, .btn-bing-ga a, .btn-ga a, .btn-ga button, .btn-ga input {
        left: 1px;
        overflow: visible;
        padding: 0 11px 1px 10px;
        background-position: right top;
        cursor: pointer;
        *vertical-align: top;
    }

        .btn-ga a:link,
        .btn-ga a:hover,
        .btn-ga a:active,
        .btn-ga a:visited {
            color: #111;
            text-decoration: none;
        }

.btn-write {
    padding: 0 20px;
    height: 44px;
    line-height: 40px;
    display: flex;
    align-items: center;
    width: 120px;
    justify-content: center;
    margin-left: auto;
    background: #fbfbfb;
}

    .btn-write svg {
        position: absolute;
        top: 12px;
        left: 17px;
    }

    .btn-write a {
        width: 100%;
        display: block;
        padding-left: 28px;
    }

.btn-bing-ga {
    /*height: 37px;
    background-position: left -200px;*/
}

    .btn-bing-ga a {
        /*height: 37px;
        padding-left: 20px;
        padding-right: 20px;
        background-position: right -200px;
        line-height: 37px;*/
    }

.btn-yellow {
    background-position: left -50px;
}

    .btn-yellow a {
        padding-left: 15px;
        padding-right: 15px;
        background-position: right -25px;
        color: #5d0000;
    }

.btn-gray {
    background-position: left -238px;
}

    .btn-gray button,
    .btn-gray a {
        padding-left: 20px;
        padding-right: 20px;
        background-position: right -238px;
        color: #fff;
        font-weight: bold;
        line-height: 25px;
        height: 50px;
    }

.btn-facebook {
    background-position: left -263px;
}

    .btn-facebook a {
        margin-left: 25px;
        padding-left: 20px;
        padding-right: 20px;
        background-position: right -263px;
    }

.btn-facebook {
    background-position: left -263px;
}

    .btn-facebook a {
        margin-left: 25px;
        padding-left: 20px;
        padding-right: 20px;
        background-position: right -263px;
    }

.btn-list, .btn-list a, .btn-list button, .btn-list input {
    background-position: left top;
}

    .btn-list a, .btn-list button, .btn-list input {
        background-position: right top;
    }

.handlers .btn-list a, .handlers .btn-list button, .handlers .btn-list input {
    width: 50px;
}

.handlers .btn-write a, .handlers .btn-write button, .handlers .btn-write input,
.handlers .btn-delete a, .handlers .btn-delete button, .handlers .btn-delete input,
.handlers .btn-edit a, .handlers .btn-edit button, .handlers .btn-edit input {
}

.btn-prev, .btn-next {
    cursor: pointer;
    border: 1px solid;
    position: relative;
}

    .btn-prev img {
        position: absolute;
        left: 22px;
        top: 17px;
    }

    .btn-next img {
        position: absolute;
        right: 22px;
        top: 17px;
    }

    .btn-next, .btn-next a, .btn-next button, .btn-prev input {
    }

        .btn-prev:hover, .btn-next:hover {
        }

        .btn-prev a:link, .btn-prev a:hover, .btn-prev a:active, .btn-prev a:visited, .btn-next a:link, .btn-next a:hover, .btn-next a:active, .btn-next a:visited {
            color: #111;
            background: none;
        }

        .btn-next a, .btn-next button, .btn-next input {
        }


.btn-good {
    background-position: left -50px;
    color: #5d0000;
}

    .btn-good a, .btn-good button, .btn-good input {
        background-position: right -25px;
        color: #5d0000;
    }

        .btn-good a:link, .btn-good a:hover, .btn-good a:active, .btn-good a:visited {
            color: #5d0000;
            text-decoration: none;
        }

/*Buttons Align */
.btn-left {
    text-align: left;
    margin-top: 20px;
}

.btn-center {
    margin-top: 15px;
    text-align: center;
}

.btn-right {
    text-align: right;
    margin-top: 30px;
}

.fbox:after {
    display: block;
    content: '';
    clear: both;
}

.fr {
    float: right
}

.fl {
    float: left
}

.sign-content .btn-bing-ga {
    padding: 8px 22px;
    width: auto;
}
/* BBS list */
.bbs .list { /*margin-bottom:30px;*/
    padding-bottom: 11px;
    margin-top: 20px;
    /*background: url('../../_images/us/common/bbs_end_bg.gif') no-repeat left bottom;*/
    width: 100%;
    overflow: scroll;
}

    .bbs .list table {
        width: 100%;
        /*table-layout: fixed;
        min-width:600px;*/
    }

.bbs.faq .list table {
    table-layout: fixed;
    min-width: 600px;
}

.bbs .list th {
    padding: 14px 0;
    /*background: #ffae0c url('../../_images/us/common/bbs_highlight_bg.gif') no-repeat -10px 50%*/;
    color: #111;
    vertical-align: middle;
    /*background: rgb(255,218,45);
        background: linear-gradient(180deg, rgba(255,218,45,1) 0%, rgba(255,167,4,1) 48%);*/
    font-size: 14px;
    text-align: center;
    background: none;
}

    .bbs .list th div {
        padding-left: 2px;
    }

.bbs .list td {
    padding: 24px 14px;
    border-top: 1px solid #ebebeb;
    color: #686764;
    text-align: center;
    vertical-align: middle;
    word-break: break-all;
    word-wrap: break-word;
}

.bbs .list.myqna td:first-child {
    width: 100px;
}

.bbs .list.myqna td:nth-child(2) {
    width: 110px;
}

.bbs .list.myqna td:nth-child(3) {
    text-align: left
}

.bbs .list.myqna td:last-child {
    width: 110px;
}

.bbs .list.myqna td:nth-last-child(2) {
    width: 157px;
}

.bbs .list th.subj {
    text-align: left;
}

    .bbs .list th.subj div {
        padding-left: 0px;
    }

.bbs .list .subj {
    padding: 20px;
    font-size: 12px;
    text-align: left;
}

    .bbs .list .subj a.bul {
        /*padding-left: 17px;*/
        /*background: url('../../_images/us/common/bbs_bul.gif') no-repeat left 50%;*/
    }

    .bbs .list .subj .comments {
        font-size: 11px;
    }

    .bbs .list .subj .new {
        margin: 0 0 -1px;
        *margin-top: 2px;
        vertical-align: top;
    }

    .bbs .list .subj .question {
        margin-right: 7px;
        color: #dd7800;
    }

.bbs .list .author, .bbs .list .regdate {
    font-size: 16px;
    color: #111;
}

.bbs .list .views {
    font-size: 14px;
    color: #000;
}

.bbs .list .category {
    text-align: left;
}

.mode * {
    width: 110px;
    height: 35px;
    line-height: 35px;
    border-radius: 21px;
    font-size: 0.75rem;
    font-weight: bold;
    color: #333333;
    background: #F3F3F3;
    text-align: center;
}


.bbs .list .rate {
    text-align: left;
}

.bbs .list .notice01 td, .bbs .list .notice02 td, .list-item.notice01 {
    background-color: #F6F6F6;
}

    .bbs .list .notice01 .subj a, .bbs .list .notice01 .subj a:link, .bbs .list .notice01 .subj a:visited, .bbs .list .notice01 .subj a:active, .bbs .list .notice01 .subj a:hover, .list-item.notice01 a {
        color: #111;
    }

.bbs .list .notice02 .subj a, .bbs .list .notice02 .subj a:link, .bbs .list .notice02 a:visited, .bbs .list .notice02 .subj a:active, .bbs .list .notice02 .subj a:hover {
    color: #683e26;
    font-weight: bold;
}

.list-item a:link {
    color: #111 !important;
}

.list-item a:visited {
    color: #8c8c8c
}

.list-item a:hover {
    color: #FF9C20
}

.bbs .list .open {
    background-position: 0 50%;
    background-size: cover;
    width: 30%
}

    .bbs .list .open div {
        background-image: none;
        text-align: center;
    }

.bbs .list .close {
    background-position: 100% 50%;
    background-size: cover;
}

.bbs .list th.category span.mode {
    margin-left: 8px;
}

.bbs .list th .mode,
.bbs .list th .mode span {
    background-image: url('../../_images/us/common/bbs_progress.gif');
}

    .bbs .list th .mode,
    .bbs .list th .mode span {
        background-image: url('../../_images/us/common/bbs_progress.gif');
    }

.bbs .list .nodata td {
    height: 30px;
}

.bbs .btn-closer {
    margin-right: 12px;
    text-align: right;
}

/* BBS  view */
.bbs .view .info table {
    width: 100%;
}

.bbs .view .info .subj, .bbs .view .info .subj { /*padding:16px 0 12px;*/
    padding: 16px 0;
    padding-left: 16px;
    /*background: url('../../_images/us/common/bbs_highlight_bg.gif') no-repeat right bottom;*/
    border-bottom: 1px solid #DBDBDB;
    text-align: left;
    font-size: 15px;
    color: #111;
    line-height: 1.5;
    border-top: 2px solid;
}

.bbs .view .d-v-info {
    display: flex;
    gap: 20px;
    height: 46px;
    align-items: center;
    justify-content: flex-end;
    margin-right: 15px;
}


.bbs .view .info .subj div {
    padding: 16px 0;
    padding-left: 16px;
    border-bottom: 1px solid #DBDBDB;
    border-top: 2px solid #2d0000;
    text-align: left;
    font-size: 15px;
    color: #2d0000;
    line-height: 1.5;
}

.bbs .view .info .sub-wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 16px;
    position: relative;
}

    .bbs .view .info .sub-wrap > div {
        display: flex;
        gap: 10px;
    }

        .bbs .view .info .sub-wrap > div > div {
            display: flex;
        }

            .bbs .view .info .sub-wrap > div > div > div {
                position: unset;
            }

.bbs .view .info .sub-title {
    text-align: right;
    color: #111111;
    font-weight: bold
}



.bbs .view .info .subj strong {
    font-size: 18px;
}

.bbs .view .info .subj th {
    width: 16px;
    font-size: 5px;
}

    .bbs .view .info .subj th div {
        width: 16px;
        z-index: -1;
        position: relative;
    }

.bbs .view .info th, .bbs .view .info td {
    padding: 12px 0 10px;
    font-size: 14px;
}

.bbs .view .info th {
    color: #a88f81;
}

    .bbs .view .info th:first-child {
        padding-left: 12px;
        padding-right: 10px;
    }

    .bbs .view .info th > div {
        text-align: right;
        color: #111111;
    }

.bbs .view .info td.share {
    margin: -11px 0 -5px;
}

    .bbs .view .info td.share img {
        margin-right: 2px;
    }

.bbs .view .info td {
    color: #dd7800;
}

    .bbs .view .info td > div {
        width: 72px;
        text-align: right;
        margin-right: 20px;
        margin-left: 10px;
        color: #111111;
    }

    .bbs .view .info td.author > div {
        width: 100%;
    }

.bbs .view .subj .question {
    margin-right: 7px;
    color: #dd7800;
}

.bbs .view .note {
    width: 100%;
    _overflow-x: auto;
    padding: 20px 15px 38px;
    line-height: 16px;
    word-break: break-all;
    word-wrap: break-word;
    overflow: scroll;
    border-bottom: 1px solid #111;
}

    .bbs .view .note img {
        max-width: 100%;
    }

    .bbs .view .note p {
        width: 100%;
        margin-top: 13px;
        color: #111;
    }

        .bbs .view .note p strong {
            color: #db4c4c;
            display: block;
        }

        .bbs .view .note p .fiximg {
            max-width: 570px;
        }

.bbs .view .handlers {
    min-height: 1em;
    margin-top: 15px;
    *zoom: 1;
}

    .bbs .view .handlers .func {
        display: flex;
        grid-gap: 6px;
        justify-content: space-between;
        flex-wrap: wrap;
    }

        .bbs .view .handlers .func > div {
            display: flex;
            grid-gap: 6px;
            flex-wrap: wrap;
        }

        .bbs .view .handlers .func > *, .bbs .view .handlers .ctrl > * {
        }


    .bbs .view .handlers .ctrl {
        float: right;
    }

.bbs .view .mode {
    margin-right: 8px;
}

.bbs > .view {
    padding-bottom: 50px;
    width: 100%;
    overflow: scroll;
}


.bbs.board .view .info, .bbs.board .view .note {
    min-width: auto;
}

.balloon {
    padding-left: 5px;
}

    .balloon, .balloon em {
        position: relative;
        display: inline-block;
        height: 18px;
        margin: 0;
        border: 0;
        background: url('../../_images/us/common/share_balloon.gif') no-repeat right top;
        color: #333;
        font-size: 9px;
        font-weight: bold;
        line-height: 18px;
        font-weight: bold;
        font-family: Arial, Sans-serif;
        letter-spacing: 1px;
        text-align: center;
        text-decoration: none !important;
        white-space: nowrap;
        vertical-align: middle;
    }

        .balloon em {
            right: 5px;
            overflow: visible;
            padding: 0 5px 0 14px;
            background-position: left top;
            cursor: pointer;
            *vertical-align: top;
        }


/*.mode span {
    display: block;
    width: fit-content;
    padding: 0 10px;
    height: 21px;
    line-height: 21px;
    color: #fff;
    font-size: 8px;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 10px;
}*/

.news-item.mode, .mode span {
    display: block;
}

.mode {
    margin-right: 10px;
}

    .mode span {
        overflow: visible;
    }


    .mode.waiting span {
        background: #0063E5;
        color: #fff;
    }

    .mode.prog span {
        background: #F89027;
        color: #fff;
    }


.closed span {
}

.waiting span {
    background: #0063E5
}

.bbs .view .mode span {
    margin-bottom: 10px;
}

.bbs .view .progress,
.bbs .view .progress span {
    background: #F89027;
    display: block;
    width: 90px;
    font-weight: normal;
    width: 110px;
    height: 30px;
    line-height: 30px;
    border-radius: 21px;
    font-size: 0.75rem;
    font-weight: bold;
    color: #fff;
    margin-bottom: 10px;
}

.bbs .view .closed,
.bbs .view .closed span {
    margin-bottom: 10px;
}

.bbs .view .waiting,
.bbs .view .waiting span {
    background: #0063E5
}

/* BBS  Comments */
.bbs .comments .write {
    width: auto; /*min-height:70px; _height:70px;*/
    padding-top: 0;
    background: #fff;
    padding: 50px 40px;
    border: 1px solid #EBEBEB;
}

.setter comment-write {
    display: block !important
}

.bbs .comments .comment-num {
    line-height: 1.2;
    background: #fff;
    font-size: 20px;
}

.bbs .comments .write textarea {
    overflow: auto;
    width: 100%;
    height: 160px;
    padding: 10px 15px;
    background-color: #fff;
    border: 1px solid #C5C5C5;
    color: #683e26;
    line-height: 16px;
}

.bbs .comments .write .note {
    display: block;
    overflow: visible;
    min-height: 1em;
    _height: 1em;
    margin-bottom: 0;
    margin-right: 96px;
    _margin-right: 73px;
    padding: 0 11px 0 0;
    _padding-right: 34px;
    background: none;
    border-bottom-width: 0;
    width: 100%;
}

.bbs .comments .write .submit {
    width: 130px;
    display: block;
    margin-left: auto;
    margin-right: 14px;
}

.comment-wrap {
    grid-gap: 18px;
}

.bbs .comments .write .submit input {
    width: 100%;
    height: 40px;
    padding: 0;
    border: 0;
    color: #fff;
    font-size: 14px;
    font-family: Arial;
    font-weight: bold;
    cursor: pointer;
    margin: 20px auto;
    border-radius: 23px;
    border: 1px solid #C5C5C5;
    background: none;
    color: #222;
}

.bbs .comments .write .note strong {
    display: block;
    height: 16px;
    margin: 3px 0px 0 0;
    font-size: 11px;
    color: #FF9C20;
    text-align: right;
}

.bbs .comments .list {
    margin: 0px;
    padding-bottom: 0;
    background: none;
}

.bbs .comments ul {
    margin-bottom: 10px;
    border: 1px solid #EBEBEB;
}

    .bbs .comments ul li .setter {
        min-height: 35px;
        _height: 35px;
        background-color: #fff;
        font-size: 11px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        grid-gap: 10px;
    }

    .bbs .comments ul li {
        padding: 50px;
        background: #fff;
    }

        .bbs .comments ul li .regdate {
            color: #C5C5C5;
            font-size: 12px;
        }

        .bbs .comments ul li .note {
            position: relative;
            clear: both;
            line-height: 16px;
            word-break: break-all;
            word-wrap: break-word;
            background: #fff;
        }

            .bbs .comments ul li .note p {
                margin-right: 41px;
            }

            .bbs .comments ul li .note .del {
                position: absolute;
                right: 14px;
                top: 0%;
                vertical-align: top;
                ic-close
            }

                .bbs .comments ul li .note .del .ic-close {
                    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23111' class='bi bi-x-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm3.354 4.646L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 1 1 .708-.708z'/%3E%3C/svg%3E");
                    display: block;
                    height: 20px;
                    width: 20px;
                }

                .bbs .comments ul li .note .del img {
                    display: inline-block;
                    *padding: 2px 2px 0 2px;
                }

.bbs .comments .btn-right {
    padding: 9px 0;
    display: none;
}

    .bbs .comments .btn-right .sign-comment {
        float: left;
        margin-top: 2px;
        padding-left: 24px;
        text-align: left;
        color: #683e26;
        background: url('../../_images/us/common/bbs_bul.gif') no-repeat 14px 5px;
        line-height: 1.2;
        display: none;
    }

        .bbs .comments .btn-right .sign-comment strong {
            text-decoration: underline;
        }

    .bbs .comments .btn-right .btn-comment {
        margin-right: 13px;
        margin-top: 20px;
    }

.bbs .comments .pagex {
    margin-top: 29px;
}

.bbs .comments .pagex-line {
    margin-top: 0;
    padding-top: 29px;
}

.btn-comment, .btn-comment a, .btn-comment button, .btn-comment input {
    color: #5d0000;
}

    .btn-comment a, .btn-comment button, .btn-comment input {
    }

    .btn-comment * {
        color: #ffecbb;
    }

    .btn-comment a:link, .btn-comment a:hover, .btn-comment a:active, .btn-comment a:visited {
        color: #111;
    }

/* BBS  Write */
.bbs .write {
    width: 100%;
}

    .bbs .write .info .subj {
        border-top: 2px solid #111;
    }

    /*.bbs .write table {
        table-layout: fixed;
        width:100%;
    }

    .bbs .write .info .subj th, .bbs .write .info .subj td {
        padding: 6px 0 6px;
        font-size: 11px;
        text-align: left;
    }

    .bbs .write .info .subj th {
        width: 200px;
        font-size: 11px;
        vertical-align: middle;
    }

        .bbs .write .info .subj th div {
            padding-left: 14px;
        }*/

    .bbs .write .info .val-subj {
        width: 100%;
        padding: 0px 10px;
        height: 50px;
        background: #EBEBEB;
        margin: 25px auto;
    }

    .bbs .write .info .attach th, .bbs .write .info .attach td {
        padding: 6px 0 6px;
        font-size: 11px;
        text-align: left;
        vertical-align: middle;
    }

    .bbs .write .info .attach th {
        width: 200px;
        font-size: 11px;
        color: #a88f81;
    }

        .bbs .write .info .attach th div {
            padding-left: 14px;
        }

    .bbs .write .info .val-attach {
        width: 100%;
        padding: 0px 10px;
        color: #c1c1c0;
        font-size: 11px;
        height: 50px;
        background: #EBEBEB;
        margin: 0px auto;
    }

button.trigger {
    border: 1px solid #C5C5C5;
    height: 50px;
    padding: 0 45px;
    border-radius: 7px;
    font-weight: bold;
    color: #111;
}
/*fanart*/
.browse-wrap {
    display: flex;
    gap: 8px;
    margin-right: 8px;
    flex-wrap: wrap;
}

    .browse-wrap .result {
        width: 50%;
    }
/*makefriends*/
.attach-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 8px;
}

    .attach-wrap .setter {
        width: auto;
    }

.bbs .write .attach .select {
}

.bbs .write .attach .txt {
    margin-top: 10px;
    color: #0063E5;
}

.bbs .write .note {
    min-height: 362px;
    _height: 362px;
    padding: 38px 0 0;
    /*background: url('../../_images/us/common/bbs_end_bg.gif') no-repeat left bottom;*/
    word-break: break-all;
    word-wrap: break-word;
}

    .bbs .write .note table {
        table-layout: auto;
    }

    .bbs .write .note p {
        margin-top: 13px;
    }

        .bbs .write .note p strong {
            color: #db4c4c;
            display: block;
        }

.bbs .write .handlers {
    margin-top: 30px;
}

    .bbs .write .handlers .func {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .bbs .write .handlers .ctrl {
        float: right;
    }


/* Page Explorer */
.pagex {
    margin: 29px 0 16px;
    text-align: center
}

    .pagex a, .pagex strong, .pagex span {
        display: inline-block;
        _position: relative;
        margin-right: -6px;
        padding: 3px 14px 2px 9px;
        /*background: url('../../_images/us/common/pagex_sepr.gif') no-repeat -14px 2px;*/
        color: #111;
        font-size: 16px;
        line-height: normal;
        text-decoration: none !important;
        line-height: 1;
        vertical-align: middle;
    }

        .pagex a img, .pagex span img {
            border: none;
            vertical-align: middle;
            width: 34px;
        }

    .pagex strong {
        color: #111 !important;
    }

    .pagex a:hover, .pagex a:active, .pagex a:focus {
    }

    .pagex .prev, .pagex .prev10, .pagex .next, .pagex .next10 {
        position: relative;
        top: -1px;
        padding: 2px 6px 1px;
        background-image: none;
        font-size: 11px;
    }

    .pagex .prev {
        margin-right: 1px;
        margin-left: -10px;
    }

    .pagex .prev10 {
        margin-right: 3px;
    }

    .pagex .next {
        margin-left: 8px;
        margin-right: -10px;
    }

    .pagex .next10 {
        margin-left: 3px;
    }

    .pagex .first {
        background: none;
    }

/* search */
.search {
    margin: 0 auto;
    text-align: center;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    grid-gap: 5px;
}

    .search .conditions {
        display: inline-block;
        min-height: 30px;
    }

    .search .keyword {
        display: inline-block;
        max-width: 170px;
        width: 40%;
        height: 30px;
        vertical-align: top;
        line-height: 21px;
        box-sizing: inherit;
        background: transparent;
        border: none;
        border-bottom: 2px solid;
        border-radius: 0;
    }

.bbs .search .submit, .bbs .search .submit input {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 30px;
    margin: 0;
    border: 0;
    padding-bottom: 1px;
    _padding-bottom: 0;
    color: #000;
    font-size: 14px;
    line-height: 24px;
    font-weight: bold;
    font-family: Arial, Sans-serif;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
    vertical-align: top;
    transition: all 0.3s;
    background: transparent url('../../_images/us/common/ic_search.png') no-repeat 0 0;
    background-position: center;
    /*background: linear-gradient( 0deg, #ffd954, #fd740f);
    box-shadow: 0px 2px 10px 5px rgb(0 0 0 / 5%);
    background-size: 200% 200%;
    -webkit-transition: background-position 0.3s;
    -moz-transition: background-position 0.3s;
    -ms-transition: background-position 0.3s;
    -o-transition: background-position 0.3s;
    transition: background-position 0.3s;*/
    padding: 0px 10px;
    border-bottom: 2px solid;
    margin-left: -5px;
}

    .bbs .search .submit:hover {
    }

    .bbs .search .submit input {
        left: 1px;
        overflow: visible;
        padding: 0 11px 1px 10px;
        background-position: right top;
        cursor: pointer;
        *vertical-align: top;
    }

/**
	sexy-combo 2.1.3 : http://code.google.com/p/sexy-combo/
	This is the base structure, a skin css file is also needed
*/
/*wrapper of all elements*/


div.combo {
    position: relative;
    left: 0px;
    top: 0px;
    background-color: #fff;
}
/*text input*/
.combo input {
    position: absolute;
}
/*icon*/
.combo div.icon {
    position: absolute;
}
/*list wrapper*/
.combo div.list-wrapper {
    position: absolute;
    overflow: hidden;
    /*we should set height and max-height explicitly*/
    height: 156px;
    max-height: 156px;
    /*should be always at the top*/
    z-index: 99999;
}
/*"drop-up" list wrapper*/
.combo div.list-wrapper-up {
}
/*dropdown list*/
.combo ul {
}
/*dropdown list item*/
.combo li {
    min-height: 14px;
    _height: 14px;
}
    /*active (hovered) list item*/
    .combo li.active {
    }

.combo .visible {
    display: block;
}

.combo .invisible {
    display: none;
}
/*used when emptyText config opt is set. Applied to text input*/
.combo input.empty {
}

/**
	sexy-combo 2.1.3 : http://code.google.com/p/sexy-combo/
	This is the default skin.
*/
div.sexy {
    width: 130px;
    height: 30px;
    *margin-top: -2px;
    padding: 0;
    white-space: nowrap;
    background: none;
}

    div.sexy input {
        left: 0px;
        top: 0px;
        width: 130px;
        height: 30px;
        margin: 0;
        padding: 0px;
        font: normal 11px Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
        border: none;
        border-bottom: 2px solid;
        line-height: 21px;
        color: #111;
        vertical-align: middle;
        font-weight: bold;
        font-size: 16px;
        background: none;
        border-radius: 0;
    }

    div.sexy div.icon {
        top: 4px;
        right: 0px;
        width: 21px;
        height: 21px;
        border: 0;
        background: transparent url('../../_images/us/common/select_icon.png') no-repeat 0 0;
        cursor: pointer;
        background-position: center;
    }

    div.sexy div.list-wrapper {
        left: 0px;
        top: 30px;
        width: 130px;
        padding: 0;
        margin: 0;
        background-color: #fff;
        border: 1px solid #301100;
        bottom: auto;
        text-align: left;
    }

    div.sexy div.list-wrapper-up {
        top: auto;
        bottom: 21px;
    }

    div.sexy ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
        height: auto;
    }

    div.sexy li {
        padding: 10px;
        color: #999;
        font: normal 11px/1.4 Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
        cursor: pointer;
        margin: 0;
    }

        div.sexy li span {
            font-size: 14px;
        }

        div .sexy li.active {
            background-color: #eee;
            color: #111;
        }
    /*for IE*/
    div.sexy a, div.sexy a:visited, div.sexy a:active {
        display: block;
        width: 100%;
        width: 67px;
        text-decoration: none;
        font: normal 11px Tahoma,Verdana,Arial,Apple-Gothic,sans-serif;
        color: #83604c;
        cursor: pointer;
        margin: 0;
        height: 20px;
    }

    div.sexy input.empty {
        color: gray;
    }

a.to-highlight:hover {
    background-color: #ffecbb;
}

div.list-wrapper.visible {
    max-height: max-content;
    height: auto;
}

/* box-area */
.box-area {
    width: 100%;
    /*background: url('../../_images/us/common/box_bg_bottom.gif') no-repeat left bottom;*/
}

    .box-area div {
        /*background: url('../../_images/us/common/box_bg_middle.gif') repeat-y left top;*/
    }

        .box-area div .box {
            width: 100%;
            padding-top: 6px;
            /*background: url('../../_images/us/common/box_bg_top.gif') no-repeat left top;*/
        }



/* tab-area */
.tab-area {
    display: flex;
    justify-content: center;
    height: 56px;
    overflow: scroll;
    /*-ms-overflow-style: none; /* IE and Edge */
    /*scrollbar-width: none; /* Firefox */*/
}

    .tab-area::-webkit-scrollbar {
        justify-content: flex-start;
    }


@media (max-width: 834px) {
    .bbs .view .handlers .func {
        justify-content: flex-end;
    }

    .bbs .list tbody th.open {
        display: block;
        width: 100%;
        border-right: 1px solid #f2d8b2;
    }

    .bbs .list td.close {
        display: block;
        padding: 20px;
    }
}

.tab-area li {
    min-width: 200px;
    height: 54px;
    background: url('../../_images/us/common/bg_tab03.gif') no-repeat -200px top;
}

    .tab-area li a {
        display: flex;
        height: 40px;
        align-items: center;
        justify-content: center;
        color: #111;
        font-size: 15px;
        font-weight: normal;
        font-family: Arial;
        line-height: 16px;
        text-align: center;
        vertical-align: middle;
        text-decoration: none;
        padding: 0 10px;
    }

        .tab-area li a:link, .itemmall-tab li a:hover, .itemmall-tab li a:active, .itemmall-tab li a:visited {
            color: #111;
            text-decoration: none;
        }


    .tab-area li.cur a, .itemmall-tab li.cur a:link, .itemmall-tab li.cur a:hover, .itemmall-tab li.cur a:active, .guild-tab li.cur:visited {
        color: #fff;
        font-weight: bold;
    }

.tab-count02 li {
    width: 20%;
    /*background: url('../../_images/us/common/bg_tab02.gif') no-repeat -300px top;*/
    /*background: linear-gradient( 180deg, rgba(255,210,43,1) 0%, rgba(255,169,7,1) 100%);*/
    text-align: center;
    background: #F0F0F0;
    color: #111;
    border-radius: 30px;
}

    .tab-count02 li.cur {
        background: linear-gradient( 180deg, rgba(211,77,45,1) 0%, rgba(194,39,18,1) 100%);
        background: #FF9C20;
    }

    .tab-count02 li a {
        width: 100%;
        height: 100%;
    }

.tab-count04 li {
    width: 150px;
    background: url('../../_images/us/common/bg_tab04.gif') no-repeat -150px top;
}

    .tab-count04 li a {
        width: 150px;
    }

.tab-count05 li {
    width: 120px;
    background: url('../../_images/us/common/bg_tab05.gif') no-repeat -120px top;
}

    .tab-count05 li a {
    }

.tab-count06 li {
    width: 100px;
    background: url('../../_images/us/common/bg_tab06.gif') no-repeat -100px top;
}

    .tab-count06 li a {
        width: 100px;
    }

.tab-count07 li {
    width: 86px;
    background: url('../../_images/us/common/bg_tab07.gif') no-repeat -170px -54px;
}

    .tab-count07 li a {
        width: 86px;
    }

    .tab-count07 li.size {
        width: 85px;
        background: url('../../_images/us/common/bg_tab07.gif') no-repeat -85px -54px;
    }

    .tab-count07 li.cursize {
        width: 85px;
        background-position: left top !important;
        color: #ffebbb !important;
    }

        .tab-count07 li.cursize a, .guild-tab li.cursize a:link, .guild-tab li.cursize a:hover, .guild-tab li.cursize a:active, .guild-tab li.cursize:visited {
            color: #ffebbb !important;
        }

    .tab-count07 li.cur {
        background-position: -170px top !important;
        color: #ffebbb !important;
    }

    .tab-count07 li.size a {
        width: 85px;
    }

    .tab-count07 li.row a {
        height: 49px;
        padding-top: 5px;
    }

/* Attach File */
.widget-attach {
    padding: 30px 30px 15px;
    background-color: #FFF;
    color: #898989;
}

    .widget-attach .lead {
        margin-bottom: 15px;
        font-size: 11px;
    }

    .widget-attach .field {
        position: relative;
        _height: 1em;
        margin-bottom: 20px;
        padding-right: 180px;
    }

    .widget-attach .val {
        width: 100%;
    }

    .widget-attach .ga {
        padding-top: 12px;
        border-top: 1px solid #E6E6E6;
    }

    .widget-attach .msg-help {
        top: -8px;
        right: -7px;
        left: auto;
        width: 142px;
    }

        .widget-attach .msg-help .arrow {
            top: 13px;
        }

        .widget-attach .msg-help .note {
            padding-left: 0;
            background-image: none;
            font-size: 11px;
            line-height: 1.2;
        }

    .widget-attach .msg-help-wrong .status {
        background-position: -63px -57px;
    }

/* select-wrap */
.select-wrap {
    width: 240px;
    position: relative;
    right: 0;
    top: 0;
    color: #7f7f7f;
    background-color: #fff;
}

    .select-wrap .select-title {
        position: relative;
        width: 100%;
        height: 40px;
        padding: 0px 10px;
        padding-left: 20px;
        text-align: left;
        font-size: 12px;
        color: #111;
        border: 1px solid #111;
        box-sizing: border-box;
        font-size: 16px;
        font-weight: normal;
    }

.user-agreement .select-wrap .select-title {
    margin: 0;
}

.select-wrap .select-title:after {
    content: '';
    display: inline-block;
    position: absolute;
    right: 6px;
    top: 8px;
    width: 21px;
    height: 21px;
    background: transparent url('../../_images/us/common/select_icon_mo.png') no-repeat 0 0;
    background-position: center;
}

.select-wrap .select-list {
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    top: 40px;
    line-height: 1.5;
    font-size: 13px;
    background-color: #fff;
    height: 0;
    -webkit-transition: all .25s ease-out;
    transition: all .25s ease-out;
    z-index: 10;
}

.select-wrap.active .select-list {
    height: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    border: 1px solid #111;
}

.select-wrap .select-list a {
    display: block;
    padding: 5px 10px;
    font-size: 12px;
    color: #999;
}

    .select-wrap .select-list a:hover {
        background-color: #eee;
    }

.select-wrap .select-list li a {
    border: none;
}

/* box */
.box {
    position: relative;
    margin-top: 15px;
    margin-bottom: 10px;
    padding: 20px 32px;
    background: #eee;
    /*border: 1px solid #999;*/
}

    .box .bg-r {
        display: block;
        position: absolute;
        width: 4px;
        height: 4px;
        background: url('../../_images/us/common/bg-radius.gif') no-repeat;
        z-index: 2;
    }

    .box .tl {
        top: -1px;
        left: -1px;
        background-position: 0 0;
    }

    .box .tr {
        top: -1px;
        right: -1px;
        background-position: -4px 0;
    }

    .box .bl {
        bottom: -1px;
        left: -1px;
        background-position: 0 -4px;
    }

    .box .br {
        bottom: -1px;
        right: -1px;
        background-position: -4px -4px;
    }

    .box .form-group {
        margin: 17px 0 0;
    }

        .box .form-group:first-of-type {
            margin-top: 0;
        }

        .box .form-group .input-group {
            width: 100%;
            max-width: 320px;
        }

.bg_extend .box .form-group input[type="text"],
.bg_extend .box .form-group input[type="password"] {
    max-width: 320px;
    width: 100%;
    height: 35px;
}

.form-group input[type="text"],
.form-group input[type="password"] {
    min-width: 403px;
    height: 50px;
}

@media (max-width: 530px) {
    .form-group input[type="text"],
    .form-group input[type="password"] {
        min-width: 100%;
    }
}


.box .form-group .help-txt {
    margin-top: 9px;
    font-size: 11px;
    color: #ae9888;
    font-weight: normal;
    line-height: 15px;
}

.box .form-group.security .form-validation {
    position: relative;
    padding-left: 188px;
}

.box .form-group .security-code {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 178px;
    height: 64px;
    background: gray;
}

.bg_extend .box .form-group.security input[type="text"],
.bg_extend .box .form-group.security input[type="password"] {
    width: 230px;
}

.inbox {
    position: relative;
    background: #ffffff;
}

    .inbox .bg-r {
        display: block;
        position: absolute;
        width: 4px;
        height: 4px;
        background: url('../../_images/us/common/bg-radius2.gif') no-repeat;
        z-index: 2;
    }

    .inbox .tl {
        top: -1px;
        left: -1px;
        background-position: 0 0;
    }

    .inbox .tr {
        top: -1px;
        right: -1px;
        background-position: -4px 0;
    }

    .inbox .bl {
        bottom: -1px;
        left: -1px;
        background-position: 0 -4px;
    }

    .inbox .br {
        bottom: -1px;
        right: -1px;
        background-position: -4px -4px;
    }

    .inbox ol {
        margin-left: 0;
        padding-left: 0;
        counter-reset: li;
    }

        .inbox ol li {
            position: relative;
            margin: 10px 0 0 2em;
            padding: 4px 8px;
            list-style: none;
        }

            .inbox ol li:first-child {
                margin-top: 0;
            }

/*.inbox ol li:before {
                    position: absolute;
                    top: 4px;
                    left: -8px;
                    z-index: 1;
                    content: counter(li)'.';
                    counter-increment: li;
                    font-weight: bold;
                }*/

.bul-pill {
    display: block;
    margin-bottom: 10px;
    /*padding-left: 12px;
    background: url('../../_images/us/common/pill_bul.png') no-repeat left 6px;*/
    font-size: 16px;
    color: #000;
    font-weight: bold;
}

.txt-validation {
    color: #ee2e13;
    font-size: 12px;
    font-weight: bold
}

.txt-complete {
    color: #0076e4;
    font-size: 12px;
    font-weight: bold
}

#developer.bg_extend {
    /*background: url('../../_images/us/common/dev_bg_middle_extend.gif') repeat-y center top;*/
}

    #developer.bg_extend .contbottom {
        /*background: url('../../_images/us/common/dev_bg_top_extend.jpg') no-repeat center top;*/
    }

    #developer.bg_extend .contset {
        max-width: 916px;
        width: 100%;
        padding: 30px 10px 45px;
        /*background: url('../../_images/us/common/dev_bg_bottom_extend.gif') no-repeat left bottom;*/
    }

h4 {
    margin-bottom: 10px;
    /*background: url('../../_images/us/common/subtit-bul.gif') no-repeat 0 1px;*/
    font-size: 18px;
    font-weight: bold;
    color: #000;
}

.item-area h4 {
    margin-top: 38px;
    margin-bottom: 10px;
    /*padding-left: 21px;
    background: url('../../_images/us/common/subtit-bul.gif') no-repeat 0 0px;*/
    padding-left: 0;
    background: none;
    font-size: 18px;
    font-weight: bold;
    color: #301100;
}

h4 .small {
    font-size: 14px;
}

.help-txt {
    line-height: 18px;
    color: #111;
}

input[type="text"],
input[type="password"],
textarea {
    padding: 0 10px;
    border: none;
    vertical-align: top;
    box-sizing: border-box;
    background: #F3F3F3;
}

.comment {
    line-height: 2;
    font-size: 1rem;
}

.dot-list {
    margin-bottom: 25px;
    padding-bottom: 25px;
    max-width: 857px;
    margin: 0 auto;
}

    .dot-list li {
        position: relative;
        margin-top: 15px;
        padding-left: 8px;
        font-size: 14px;
        line-height: 1.3;
    }

        .dot-list li:first-child {
            margin-top: 0;
        }

    /*.dot-list li:before {
                position: absolute;
                top: 5px;
                left: 0;
                display: block;
                content: '';
                width: 3px;
                height: 3px;
                background: #683e26;
            }*/

    .dot-list a {
        text-decoration: underline;
        font-weight: bold;
    }

.tmp-tab {
    width: 100%;
    font: 0/0 a;
}

    .tmp-tab li,
    .tmp-tab li a {
        position: relative;
        display: inline-block;
        height: 54px;
        margin: 0;
        border: 0;
        background: url('../../_images/us/common/bg-tmp-tab.png') no-repeat;
        padding-bottom: 1px;
        _padding-bottom: 0;
        color: #9e4807;
        font-size: 1rem;
        line-height: 13px;
        font-weight: bold;
        font-family: Arial, Sans-serif;
        text-align: center;
        text-decoration: none !important;
        white-space: nowrap;
        vertical-align: middle;
    }

    .tmp-tab li {
        height: 54px;
        background-position: left -55px;
    }

        .tmp-tab li a {
            width: 100%;
            height: 54px;
            margin-left: 5px;
            background-position: right -55px;
            line-height: 44px;
        }

        .tmp-tab li.active {
            background-position: left 0;
        }

            .tmp-tab li.active a {
                background-position: right 0;
                color: #ffebbb;
            }

                .tmp-tab li.active a:after {
                    position: absolute;
                    bottom: 5px;
                    left: 50%;
                    content: '';
                    display: block;
                    width: 15px;
                    height: 12px;
                    margin-left: -7px;
                    background: url('../../_images/us/common/bg-tmp-tab-tail.png') no-repeat 0 0;
                    z-index: 1;
                }

.box .form-group .security-code {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 178px;
    height: 64px;
    background: gray;
}

.box .form-group.name .input-group input {
    width: 204px;
    margin-left: 10px;
}

    .box .form-group.name .input-group input:first-of-type {
        margin-left: 0;
    }

.box .form-validation {
    font: 0/0 aria;
    display: flex;
    flex-direction: row;
    grid-gap: 10px;
    flex-direction: column;
    margin-bottom: 15px;
}

@media (max-width: 830px) {
    .box .form-validation {
        flex-direction: column;
    }

    #frmSendMail .box .form-validation, #frmResetPW .box .form-validation {
        height: 130px;
    }
}

.box .form-validation .icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    /*background-image: url('../../_images/us/common/form-validation-bul.jpg');*/
    background-image: url('../../_images/us/common/ic-error.png');
    overflow: hidden;
    vertical-align: top
}

.box .form-validation .data {
    display: none;
}
.box .form-validation .data.no-data {
    display: block;
}

.box .form-validation .data .icon {
    margin: 0 5px 0 4px;
    background-position: 0 0;
    background-position: 0 -30px;
}

.box .form-validation .data .notice-validation {
    display: none;
}

.box .form-validation .no-data .icon {
    background-position: 0 0;
}

.box .form-validation .no-data .notice-validation {
    display: inline-block;
    min-height: 30px;
    height: auto;
    background: url('../../_images/us/common/bg_notice_s_validation.png') no-repeat 0 0;
    color: #f3806f;
    font-weight: bold;
    line-height: 2;
    font-size: 0.875rem;
    vertical-align: top;
}

    .box .form-validation .no-data .notice-validation .bg-r {
        display: block;
        position: absolute;
        height: 4px;
        background: url('../../_images/us/common/bg-validation-radius.png') no-repeat;
        z-index: 2;
    }

    .box .form-validation .no-data .notice-validation .tl {
        width: 10px;
        top: 0;
        left: 0;
        background-position: 0 0;
    }

    .box .form-validation .no-data .notice-validation .tr {
        width: 4px;
        top: 0;
        right: 0;
        background-position: -10px 0;
    }

    .box .form-validation .no-data .notice-validation .bl {
        width: 10px;
        bottom: -1px;
        left: 0;
        background-position: 0 -4px;
    }

    .box .form-validation .no-data .notice-validation .br {
        width: 4px;
        bottom: -1px;
        right: 0;
        background-position: -10px -4px;
    }

.bg_extend .box .form-validation .no-data .notice-validation {
    display: inline-block;
    max-width: 280px;
    padding-left: 17px;
    /*background: url('../../_images/us/common/bg_notice_validation.gif') no-repeat 0 0;*/
    color: #f3806f;
    font-weight: bold;
    line-height: 2;
    font-size: 0.875;
    vertical-align: top;
    border-bottom: 0;
    border: 1px solid;
    width: 80%;
    padding: 0 15px;
}

    .bg_extend .box .form-validation .no-data .notice-validation.notice-find-id {
        width: 60%;
    }

#frmSendMail .input-wrap, #frmResetPW .input-wrap {
    width: 50%;
}

@media (max-width: 830px) {
    #frmSendMail .input-wrap, #frmResetPW .input-wrap {
        width: 100%;
    }

    .bbs .view .handlers .func > div {
        display: flex;
        grid-gap: 6px;
        flex-wrap: wrap;
        justify-content: flex-end;
        width: 100%;
    }
}



.bg_extend .box .form-group input[type="text"].find-id {
    max-width: 320px;
    width: 83%;
    height: 29px;
    margin-bottom: 10px;
}



.bg_extend .box .form-validation .no-data .notice-validation .bl {
    bottom: 0;
}

.bg_extend .box .form-validation .no-data .notice-validation .br {
    bottom: 0;
}

.box .form-validation .no-data .notice-validation2 {
    display: inline-block;
    width: auto;
    height: 30px;
    padding-left: 15px;
    background: url('../../_images/us/common/bg_notice_validation.gif') no-repeat 0 0;
    color: #f3806f;
    font-weight: bold;
    line-height: 2;
    font-size: 0.875rem;
    vertical-align: top;
}

    .box .form-validation .no-data .notice-validation2 i {
        display: inline-block;
        width: auto;
        max-width: 250px;
        height: 30px;
        padding: 0 5px 0 0;
        background: url('../../_images/us/common/bg_notice_validation.gif') no-repeat 100% 0;
        font-style: normal;
    }


/* promotion pop up */
.lay-popup-01 {
    position: absolute;
    top: 200px;
    left: 50%;
    width: 892px;
    height: 530px;
    margin-left: -446px;
    padding-bottom: 14px;
    z-index: 9999;
    overflow: hidden;
    background: url('../../_images/us/common/bg_prd_crosspromo.jpg') no-repeat left top;
}

.lay-close-01 {
    position: absolute;
    top: 10px;
    right: 10px;
}

.lay-popup-01.creat-account-01 .btn-area {
    margin: 245px 0 0 310px;
}

.lay-popup-01 #coupon_code {
    padding: 66px 0 0 320px;
    color: #FFF;
    font-size: 3.5em;
}


/* tab */

/*.tab-wrap {
    width: 100%;
    overflow-x: scroll;
    -ms-overflow-style: none;
    /* IE and Edge 
    scrollbar-width: none;
     Firefox 
}

 .tab-wrap ::-webkit-scrollbar {
        display: none;
        Chrome, Safari, Opera
    }
       */

.tab {
    height: 54px;
    padding: 0;
    margin-bottom: 30px;
    display: flex;
    justify-content: flex-start;
    width: 100%;
    grid-gap: 7px;
    position: relative;
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    transition: all 0.2s;
    user-select: none;
    cursor: grabbing;
    cursor: -webkit-grabbing;
}

    .tab.active {
        cursor: grabbing;
        cursor: -webkit-grabbing;
        transform: scale(1.01);
    }


    .tab li {
        width: 17%;
        height: 54px;
        /*background: url('../../_images/us/guide/tab_bg.gif') no-repeat left top;*/
        background: rgb(255,210,43);
        background: linear-gradient(180deg, rgba(255,210,43,1) 0%, rgba(255,169,7,1) 100%);
        text-align: center;
        min-width: 180px;
        background: #F0F0F0;
        color: #111;
        border-radius: 30px;
    }

        .tab li a {
            height: 54px;
            color: #111;
            font-size: 1rem;
            font-weight: normal;
            line-height: 1rem;
            text-align: center;
            vertical-align: middle;
            text-decoration: none;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 0 10px;
            line-height: 1.4
        }

            .tab li a:link, .tab li a:hover, .tab li a:active, .tab li a:visited {
                color: #111;
                text-decoration: none;
            }


        .tab li.cur {
            color: #fff;
            /*
            background-position: left top;
            background: rgb(211,77,45);
            background: linear-gradient( 180deg, rgba(211,77,45,1) 0%, rgba(194,39,18,1) 100%);*/
            background: #FF9C20;
        }

            .tab li.cur a {
                color: #fff;
            }





.use-agreement {
    margin-top: 32px;
}

.use-agreement-chck {
    display: flex;
    justify-content: center
}

    .use-agreement-chck input {
        width: 23px;
        height: 23px;
        margin-right: 8px;
    }


.more {
    display: block;
    cursor: pointer;
    width: 200px;
    height: 60px;
    line-height: 60px;
    margin: 0 auto;
    font-weight: bold;
    color: #111;
    border: 2px solid;
    border-radius: 30px;
    background: #fff;
    /*box-shadow: 0px 2px 10px 5px rgb(0 0 0 / 5%);
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;*/
}

    .more:hover {
        transform: translate(0px, -3px );
    }

.board-list {
    border-top: 2px solid #301100;
}

.list-item {
    display: flex;
    padding: 23px 13px;
    border-bottom: 1px solid #eee;
    align-items: center;
    grid-gap: 10px;
}

    .list-item .subject {
        width: 60%;
        padding: 0;
        font-size: 1rem;
    }

        .list-item .subject a {
            font-size: 1rem;
        }

    .list-item .info {
        width: 40%;
        text-align: right;
        color: #888;
    }

        .list-item .info span {
            margin-left: 20px;
            width: 80px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 0.875rem;
        }

    .list-item .ic-view {
        display: none;
    }


@media (max-width: 768px) {
    .list-item {
        flex-direction: column;
        align-items: flex-start;
    }

        .list-item .subject, .list-item .info {
            width: 100%;
        }

        .list-item .info {
            text-align: left;
            display: flex;
        }

            .list-item .info span.date {
                margin-left: 0px;
            }
}

a.back {
    display: none;
}

.view .ic-view {
    display: none;
}


.views-pc .ic-view {
    display: block;
}

.community .view .ic-view {
    display: inline-block;
}

.ic-write {
    background: url(../../_images/us/common/ic-write.png) no-repeat center;
    width: 20px;
    height: 20px;
}


@media (max-width: 415px) {
    .subject .cur {
        display: none;
    }

    a.back {
        display: block;
        position: absolute;
        left: 11px;
        top: 27px;
    }

    .bbs .view .handlers .func {
        width: 100%;
        flex-direction: column;
    }

        .bbs .view .handlers .func > * {
            width: 100%;
        }

        .bbs .view .handlers .func > div > a > span {
            width: 100%;
        }

    .bbs .list {
        margin-top: 30px;
    }

    .btn-list, .btn-list a, .btn-list button, .btn-list input {
        width: 100%;
    }

    .bbs .view .handlers .ctrl {
        float: none;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .bbs .view .handlers .ctrl > * {
            margin-top: 10px;
            width: 48%;
        }

    .bbs .view .handlers .func > div > a {
        width: 48%;
    }

    .bbs .view .handlers .func > div:last-child > a:last-child {
        width: 100%;
    }

    div.sexy div.icon {
        top: 11px;
        right: 11px;
        width: 21px;
        height: 21px;
        border: 0;
        background: transparent url(../../_images/us/common/select_icon_mo.png) no-repeat 0 0;
        cursor: pointer;
        background-position: center;
    }

    div.sexy div.list-wrapper {
        top: 46px;
        width: 100%;
    }

    .bbs .view .info .subj, .bbs .view .info .subj {
        border-bottom: none;
    }

    .bbs .view .info .subj {
        padding-bottom: 0;
    }

    .bbs .view .d-v-info {
        justify-content: flex-start;
        margin-left: 15px;
        border-bottom: 1px solid #DBDBDB;
    }

    .list-item .info span {
        text-align: left;
    }

    .list-item .info .ic-view {
        margin-right: 5px;
        display: inline-block;
        height: 19px;
    }

    .view .ic-view {
        display: inline-block;
        margin-right: 5px;
        position: unset;
    }

    .views {
        display: flex;
        align-items: center;
    }

    .bbs .comments .write {
        padding: 25px 20px;
    }

    .bbs .comments ul li {
        padding: 20px;
    }

    .bbs .view .handlers .func > div {
        justify-content: center;
    }

    .tab-area {
        justify-content: flex-start;
    }
}


.blind {
    display: none;
}