#tem {
    font-family: "NanumBarunGothic", 나눔바른고딕, "Malgun Gothic", "맑은 고딕", Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #666;
    line-height: 20px;
}

#tem {
    position: relative;
    margin: 0 auto;
    max-width: 940px;
}

    #tem > div {
        position: relative;
        max-width: 940px;
    }

        #tem > div img {
            width: 100%;
        }

    #tem #title_area {
        margin-bottom: 5%;
    }

    #tem #con {
        height: auto;
        margin: 0 7%;
    }

        #tem #con .line {
            position: relative;
            width: 100%;
            height: 2px;
            margin: 30px 0;
            background-color: #ffdf3b;
            font-size: 0;
            line-height: 0;
            overflow: hidden;
            text-indent: -10000px;
        }

        #tem #con .bold {
            font-weight: bold;
        }

        #tem #con .dark {
            color: #333;
        }

        #tem #con .red {
            color: #ed3232;
        }

        #tem #con .blue {
            color: #1c80cf;
        }

        #tem #con .violet {
            color: #8f42a9;
        }

        #tem #con h4 {
            color: #000;
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 20px;
        }

    #tem ul {
        margin-bottom: 20px;
        margin-left: 3%;
    }

    #tem dl {
        margin-left: 30px;
    }

    #tem dt {
        color: #1c80cf;
        font-size: 16px;
        font-weight: bold;
        margin-top: 20px;
        margin-bottom: 15px;
    }

    #tem dl .marginleft {
        margin-left: 6%;
    }

    #tem h1,
    #tem h2,
    #tem h3,
    #tem h4,
    #tem p {
        position: relative;
        margin: 0;
        padding: 0;
    }

    #tem .hidden {
        font-size: 0;
        margin: 0;
        padding: 0;
        width: 0;
        height: 0;
        visibility: hidden;
    }

body,
.ui-page-theme-a {
    background-color: #454b54 !important;
}

.bbs-end {
    display: none;
    height: 5px;
    background-color: #ececec;
    border-bottom: 1px solid #cbcbcb;
}

.list-space {
    -webkit-box-flex: 1;
}

.ui-title-area {
    -webkit-box-flex: 1;
    line-height: 17px;
}

.ui-comment-group {
    display: -webkit-box;
    -webkit-box-pack: center;
    width: 36px;
    height: 16px;
    margin-left: 5px;
    background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/img_comment_bg.png) right 0 / 36px 16px no-repeat;
}

.content-comment {
    font-size: 10px;
    font-weight: normal;
    color: #fff;
    line-height: 16px;
    padding-left: 2px;
}

.content-category {
    font-weight: normal;
    color: #3d60aa;
    margin-right: 10px;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0px, 0, 0);
    transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.swiper-container-free-mode > .swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0; /*width:100%;height:100%;*/
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
}

.search-container {
    background: #dedede;
}

.type-top {
    position: relative;
    height: 5px;
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    background-color: #f5f5f5;
    z-index: 9999;
}

.weapon-type {
    position: relative;
    overflow: hidden;
    height: 155px;
    padding-left: 26px;
    background-repeat: no-repeat;
    background-size: 26px 45px;
    background-position: left center;
}

.type-01 {
    background-color: #004f99;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon1.png);
}

.type-02 {
    background-color: #273ea9;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon2.png);
}

.type-03 {
    background-color: #008d64;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon3.png);
}

.type-04 {
    background-color: #9f35ae;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon4.png);
}

.type-05 {
    background-color: #613fb2;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon5.png);
}

.type-06 {
    background-color: #b4412e;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon6.png);
}

.type-07 {
    background-color: #9c5218;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon7.png);
}

.type-08 {
    background-color: #59790d;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/icon_weapon9.png);
}

.btn-listscroll-x > div {
    position: absolute;
    left: 0;
    top: 0;
    width: 26px;
    height: 155px;
    background: transparent;
}

.btn-weapon-object > div {
    position: relative;
    display: -webkit-box;
    width: 135px;
    height: 155px;
    background-color: #fff;
}

    .btn-weapon-object > div > div:first-child {
        position: relative;
        width: 134px;
        height: 155px;
    }

.obj-border-right {
    position: relative;
    width: 1px;
    height: 155px;
    background-color: #cdcdcd;
}

.weapon-title-group {
    position: relative;
    display: -webkit-box;
    -webkit-box-align: center;
    height: 28px;
    padding: 0 5px;
}

    .weapon-title-group .weapon-title {
        position: relative;
        -webkit-box-flex: 1;
        color: #222;
        font-size: 13px;
        font-weight: bold;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        white-space: nowrap;
        letter-spacing: -1px;
    }

    .weapon-title-group .content-comment {
        position: relative;
        display: -webkit-box;
        -webkit-box-pack: center;
        -webkit-box-align: center;
        width: 36px;
        height: 16px;
        margin-left: 5px;
        font-size: 11px;
        font-weight: normal;
        color: #000;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/img_comment_bg.png) no-repeat;
        background-size: 36px 16px;
    }

.weapon-image-group {
    padding: 0 5px;
}

    .weapon-image-group .weapon-image {
        width: 122px;
        height: 54px;
        border: 1px solid #cdcdcd;
        background-color: #fff;
        background-image: url(https://file.nexon.com/NxFile/download/FileDownloader.aspx?oidFile=5125188799348867707), url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/img_item_bg.png);
        background-repeat: no-repeat;
        background-size: 118px 40px, 118px 50px;
        background-position: center center, center center;
    }

.weapon-mode-group {
    padding: 5px 8px;
}

    .weapon-mode-group > div:first-child {
        font-size: 10px;
        font-weight: bold;
        letter-spacing: -1px;
        color: #548700;
        margin-bottom: 3px;
    }

    .weapon-mode-group .weapon-mode {
        font-size: 11px;
        color: #444;
        font-weight: normal;
        letter-spacing: -1px;
        line-height: 13px;
        border-left: 1px dashed #cdcdcd;
        padding-left: 5px;
        margin-left: 26px;
    }

#listetc {
    display: none;
    width: 0;
    height: 0;
}

.cso-item {
    padding: 10px;
    max-width: 590px;
}

    .cso-item caption {
        display: none;
    }

    .cso-item table {
        border-collapse: collapse;
        border-spacing: 0;
        font-size: 12px;
        color: #4e5568;
        font-weight: 400;
        text-align: center;
    }

    .cso-item .top_item h4 {
        height: 40px;
        line-height: 40px;
        font-weight: normal;
        color: #4e5568;
        font-size: 16px;
        padding-left: 94px;
        background: url(https://ssl.nexon.com/s2/game/cso/cso2018/contents/IR_item_v0926.png) 0 0 / 91px 1085px no-repeat;
        margin: 30px 0 10px 0;
    }

        .cso-item .top_item h4.item1 {
            margin-top: 14px;
            background-position: 0 0;
        }

        .cso-item .top_item h4.item2 {
            background-position: 0 -97px;
        }

        .cso-item .top_item h4.item3 {
            background-position: 0 -201px;
        }

        .cso-item .top_item h4.item4 {
            background-position: 0 -311px;
        }

        .cso-item .top_item h4.item5 {
            background-position: 0 -422px;
        }

        .cso-item .top_item h4.item6 {
            background-position: 0 -526px;
        }

        .cso-item .top_item h4.item7 {
            background-position: 0 -981px;
        }

        .cso-item .top_item h4.item8 {
            background-position: 0 -981px;
        }

        .cso-item .top_item h4.item9 {
            background-position: 0 -981px;
        }

        .cso-item .top_item h4.item10 {
            background-position: 0 -981px;
        }

        .cso-item .top_item h4.item11 {
            background-position: 0 -981px;
        }

    .cso-item .bingo {
        padding-top: 16px;
    }

    .cso-item .auction h4 {
        height: 30px;
        line-height: 28px;
        font-weight: normal;
        color: #4e5568;
        font-size: 16px;
        padding-left: 44px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/IR_grade.png) 0 0 / 34px 30px no-repeat;
        margin: 30px 0 10px 0;
    }

        .cso-item .auction h4:first-child {
            margin-top: 14px;
        }

    .cso-item .luckyweapon h4 {
        height: 40px;
        line-height: 40px;
        font-weight: normal;
        color: #4e5568;
        font-size: 16px;
        padding-left: 94px;
        background: url(https://ssl.nexon.com/s2/game/cso/cso2018/contents/IR_item_v1017_3BDAF921.png) 0 0 / 91px 1085px no-repeat;
        margin: 30px 0 10px 0;
    }

        .cso-item .luckyweapon h4:first-child {
            margin-top: 14px;
        }

        .cso-item .luckyweapon h4.item5 {
            background-position: 0 -1025px;
        }

        .cso-item .luckyweapon h4.item6 {
            background-position: 0 -972px;
        }

    .cso-item .basic {
        position: relative;
        width: 100%;
        height: auto;
        border-top: 1px solid #bec2cd;
        border-bottom: 1px solid #bec2cd;
        padding-top: 2px;
    }

        .cso-item .basic table th {
            color: #fff;
            padding: 7px 0 9px 0;
            margin-bottom: 2px;
            font-weight: normal;
            background: #858b9b url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/table_th.png) 0 bottom / 1px 2px repeat-x;
        }

        .cso-item .basic table td {
            border-top: 1px solid #bec2cd;
            border-right: 1px solid #bec2cd;
            padding: 10px 0;
            vertical-align: middle;
        }

            .cso-item .basic table td.item {
                border-right: 0;
                line-height: 23px;
                text-align: left;
                padding: 10px 20px 10px 20px;
                box-sizing: border-box;
                word-break: keep-all;
            }

            .cso-item .basic table td:last-child {
                border-right: 0;
            }

    .cso-item .cautions {
        margin-top: 30px;
        background: url(https://ssl.nexon.com/s2/game/cso/cso2018/contents/ico_notice.png) 12px 50%/ 78px 20px no-repeat;
        padding-left: 110px;
        min-height: 20px;
        font-size: 11px;
        color: #4e5568;
        font-weight: normal;
    }

    .cso-item .icon_gucc {
        position: relative;
        width: 100%;
        height: 50px;
        margin: 20px 0 10px 0;
    }

        .cso-item .icon_gucc img {
            position: absolute;
            width: 50px;
            height: 50px;
            right: 0;
        }

.no-list {
    width: 100%;
    height: 155px;
    padding-left: 20px;
    display: -webkit-box;
    -webkit-box-align: center;
    color: #999;
}

.cso_info {
    position: relative;
    max-width: 640px;
}

    .cso_info img {
        max-width: 100%;
        display: block;
    }

    .cso_info .btn-info-01 {
        position: absolute;
        display: block;
        left: 3.13%;
        top: 25.18%;
        width: 48.75%;
        height: 1.73%;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/info/info_01_05.gif) 0 0 / 100% 100% no-repeat;
    }

/*GMTalk 컨텐츠*/
#be span {
    font-weight: bold;
    color: #ed0000;
}

    #be span.tit {
        font-size: 14px;
    }

.content-mobile {
    position: relative;
    width: 10px;
    height: 13px;
    margin-right: 5px;
    background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/icon_mobile.png) no-repeat;
    background-size: 10px 13px;
    display: none;
}

.ui-write-group {
    display: -webkit-box;
    -webkit-box-align: center;
    margin-right: 10px;
}

.ui-info-group {
    display: -webkit-box;
    -webkit-box-align: center;
    height: 16px;
    line-height: 16px;
    font-size: 9px;
    font-weight: normal;
    color: #8d93a1 !important;
}

.ui-class-group {
    display: -webkit-box;
    -webkit-box-align: center;
    max-width: 620px;
    line-height: 16px;
    font-size: 12px;
    font-weight: normal;
    color: #555;
}

.content-gm {
    margin-right: 10px;
    width: 60px;
    height: 15px;
    background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/img_writer_gm.png) no-repeat;
    background-size: 60px 15px;
}
/*.content-level {width:27px;height:19px;background-image:url(https://ssl.nexon.com/S2/Game/CSO/CSO2012/icon/ico_grade_44.gif);background-repeat:no-repeat;background-size:27px 19px;margin-right:5px;}*/
.content-level {
    color: #454b53;
    margin-right: 5px;
}

.content-writer {
    color: #8d93a1 !important;
}

.content-date,
.content-start-date {
    margin-right: 5px;
}

.content-start-date,
.content-end-date {
    margin-left: 5px;
}

.content-new {
    display: none;
    width: 10px;
    height: 11px;
    background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/ico_new.png) center center / 10px 10px no-repeat;
}

.ui-count-group,
.ui-join-group,
.ui-recommend-group {
    display: -webkit-box;
    margin-left: 10px;
}

    .ui-count-group > div:first-child,
    .ui-join-group > div:first-child,
    .ui-recommend-group > div:first-child {
        margin-right: 5px;
    }

    .ui-join-group > div:last-child {
        margin-left: 2px;
    }

.content-recommend {
    color: #98a1b4;
}

#page-list .content-title {
    -webkit-box-flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    white-space: nowrap;
    font-weight: normal;
    color: #4d5467;
}

#page-list .list-bbs-class .content-title {
    font-weight: normal;
    color: #5b7f06;
}

#page-list .ui-title-group {
    display: -webkit-box;
    -webkit-box-align: center;
    height: 32px;
}

#page-read .ui-title-group {
    display: -webkit-box;
    padding: 8px 0;
}

#page-read .weapon-title-group {
    display: -webkit-box;
    -webkit-box-align: center;
    padding: 8px 0;
}

#page-read .content-mobile {
    top: 2px;
}

#page-read .weapon-title {
    line-height: 25px;
    font-size: 15px;
    -webkit-box-flex: 1;
    font-weight: normal;
    color: #222;
    word-break: break-all;
    letter-spacing: -1px;
}

#page-read .content-title {
    -webkit-box-flex: 1;
    font-weight: normal;
    color: #4d5467;
    word-break: break-all;
}

#page-read .weapon-category {
    width: 54px;
    height: 19px;
    margin-right: 5px;
    background-image: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/category_weapon1.png);
    background-repeat: no-repeat;
    background-size: 54px 19px;
}

#page-list .list-bbs-map {
    padding: 0 10px 15px 10px;
}

    #page-list .list-bbs-map > div {
        display: -webkit-box;
        margin-top: 10px;
    }

        #page-list .list-bbs-map > div > div:first-child,
        #page-list .list-bbs-map > div > div:last-child {
            position: relative;
            -webkit-box-flex: 1;
            display: -webkit-box;
            -webkit-box-pack: center;
        }

        #page-list .list-bbs-map > div > div:nth-child(2) {
            width: 10px;
        }

    #page-list .list-bbs-map a > div {
        position: relative;
        visibility: hidden;
    }

        #page-list .list-bbs-map a > div > img {
            max-width: 100%;
        }

            #page-list .list-bbs-map a > div > img:last-child {
                position: absolute;
                left: 0;
                top: 0;
            }

#page-read .bul_arr {
    font-size: 12px;
    font-weight: normal;
    color: #5b7f06;
    background: url(https://ssl.nexon.com/s2/game/cso/cso2012/sub/ico.png) 0 -230px no-repeat;
    padding-left: 20px;
    margin: 20px 0 8px 0;
}

#page-read .pading_left20 {
    padding-left: 20px;
}

#page-read .bottom40 {
    margin-bottom: 40px;
}

#page-read .map_list li {
    padding-left: 20px;
    font-weight: normal;
}

#page-read ul {
    clear: both;
    list-style: none;
}

#page-read .map_list li ul li {
    padding-left: 5px;
    font-weight: normal;
}

.bbs-search .ui-corner-all,
.sort-category .ui-corner-all {
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
}

.bbs-search .ui-btn,
.bbs-search .ui-body-inherit,
.sort-category .ui-btn {
    background-color: #fff !important;
}

    .bbs-search .ui-btn span,
    .sort-category .ui-btn span {
        font-weight: normal;
    }

.bbs-search .ui-shadow-inset {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.list-area-1 {
    display: -webkit-box;
    padding: 5px 10px;
    border-bottom: 1px solid #cbcbcb;
    background-color: #fff;
}

.read-bbs-community .ui-title-area > div:nth-child(2) {
    height: 20px;
    margin-bottom: 4px;
}

.list-bbs-community .ui-thumbnail {
    width: 100px;
    height: 62px;
    margin-right: 10px;
    background-size: 100% 100%;
    background-color: #eee;
}

.list-area-2 {
    padding: 5px 10px 15px 10px;
    border-bottom: 1px solid #cbcbcb;
}

.list-bbs-poll .list-area-2 {
    padding-bottom: 8px;
}

.read-bbs-event .list-area-2 {
    padding: 5px 10px;
}

#page-list .list-area-2 .ui-title-group {
    height: 22px;
    margin-top: 5px;
}

.list-bbs-event .ui-thumbnail {
    min-width: 320px;
    max-width: 382px;
    margin-top: 10px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url(https://file.nexon.com/NxFile/download/FileDownloader.aspx?oidFile=3945193182412668990), url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/img_event_thumb.png);
}

    .list-bbs-event .ui-thumbnail img {
        display: block;
        margin: 0;
        padding: 0;
        width: 100%;
    }

#page-list .list-bbs-class .ui-thumbnail {
    width: 205px;
    height: 120px;
    margin-top: 10px;
    background-repeat: no-repeat;
    background-size: 205px 120px;
    background-image: url(https://file.nexon.com/NxFile/download/FileDownloader.aspx?oidFile=3972267595389730817);
}

#page-list .list-bbs-map .ui-thumbnail {
    width: 205px;
    height: 120px;
    margin-top: 10px;
    background-repeat: no-repeat;
    background-size: 205px 120px;
    background-image: url(https://file.nexon.com/NxFile/download/FileDownloader.aspx?oidFile=3972267595389730817);
}

/*리스트검색*/
#page-list .bbs-search {
    position: relative;
    display: -webkit-box;
    height: 30px;
    background-color: #f3f3f3;
    padding: 15px 10px;
}

    #page-list .bbs-search .space-bar {
        width: 5px;
        height: 32px;
    }

    #page-list .bbs-search .btn-search > div {
        width: 45px;
        height: 32px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/btn_search_confirm.png) no-repeat;
        background-size: 45px 32px;
    }

    #page-list .bbs-search > div:nth-child(3) {
        -webkit-box-flex: 1;
    }

/*무기이름검색*/
#page-list .weapon-search-area {
    position: relative;
    display: -webkit-box;
    -webkit-box-align: center;
    height: 88px;
}

    #page-list .weapon-search-area .arrow-left > div {
        width: 20px;
        height: 70px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/btn_weaponsearch_left.png) no-repeat;
        background-size: 20px 70px;
    }

#page-list .weapon-name-search {
    -webkit-box-flex: 1;
    padding: 0 10px;
}

    #page-list .weapon-name-search > div:first-child {
        position: relative;
        height: 20px;
        font-size: 12px;
        font-weight: normal;
        color: #222;
    }

    #page-list .weapon-name-search > div:last-child {
        position: relative;
        display: -webkit-box;
        -webkit-box-align: center;
    }

    #page-list .weapon-name-search .btn-search > div {
        margin-left: 5px;
        width: 45px;
        height: 32px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/btn_search_confirm.png) no-repeat;
        background-size: 45px 32px;
    }

#search-input {
    -webkit-box-flex: 1;
}

#page-list .weapon-sort-area {
    position: relative;
    display: -webkit-box;
    -webkit-box-align: center;
    height: 88px;
}

    #page-list .weapon-sort-area > div {
        position: relative;
        display: -webkit-box;
        -webkit-box-align: center;
        -webkit-box-flex: 1;
        padding: 0 10px;
    }

        #page-list .weapon-sort-area > div > div {
            -webkit-box-flex: 1;
        }

        #page-list .weapon-sort-area > div > a > div {
            margin-left: 5px;
            width: 45px;
            height: 68px;
            background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/btn_sort_search.png) no-repeat;
            background-size: 45px 68px;
        }

    #page-list .weapon-sort-area .arrow-right > div {
        width: 20px;
        height: 70px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/info/btn_weaponsearch_right.png) no-repeat;
        background-size: 20px 70px;
    }

    #page-list .weapon-sort-area .ui-btn {
        text-align: left;
    }

/*분류메뉴*/
.sub-2depth {
    display: -webkit-box;
    -webkit-box-pack: start;
    background-color: #fff;
    border-bottom: 5px solid #d0d2d4;
    padding-left: 4px;
}

    .sub-2depth a {
        display: -webkit-box;
        -webkit-box-align: center;
        height: 36px;
        font-size: 13px;
        font-weight: normal;
        color: #888 !important;
        margin: 0 10px;
    }

        .sub-2depth a.btn-on {
            color: #3063d1 !important;
        }

    .sub-2depth .ui-space {
        -webkit-box-flex: 1;
    }

#page-list .sort-select {
    display: -webkit-box;
    padding: 8px 10px 8px 10px;
    border-bottom: 1px solid #d0d2d4;
}

    #page-list .sort-select .sort-title {
        line-height: 31px;
        margin-right: 10px;
        letter-spacing: -1px;
    }

    #page-list .sort-select .space-width {
        -webkit-box-flex: 1;
    }

    #page-list .sort-select a div {
        height: 25px;
        line-height: 25px;
        padding-left: 30px;
        color: #222;
        margin-left: 12px;
        letter-spacing: -1px;
    }

    #page-list .sort-select .ico-table {
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/btn_view_table.png) no-repeat;
        background-size: 25px 50px;
        background-position-y: -25px;
    }

    #page-list .sort-select .ico-list {
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/btn_view_list.png) no-repeat;
        background-size: 25px 50px;
        background-position-y: -25px;
    }

    #page-list .sort-select a.btn-on div {
        color: #4b7600;
        background-position-y: 0px;
    }

#page-list .case-menu {
    border-bottom: 1px solid #cbcbcb;
    padding: 14px 10px 12px 10px;
}

#page-list .chapter-group {
    position: relative;
}

#page-list .chapter-title {
    position: relative;
    display: -webkit-box;
    -webkit-box-pack: start;
    width: 100%;
    height: 28px;
    background-color: #f0f0f0;
    font-size: 12px;
    font-weight: normal;
    line-height: 28px;
}

    #page-list .chapter-title > div:first-child {
        position: relative;
        width: 4px;
        height: 100%;
        background-color: #7ca42e;
        margin-right: 5px;
    }

    #page-list .chapter-title > div:nth-child(2) {
        position: relative;
        margin-right: 5px;
        color: #989898;
    }

    #page-list .chapter-title > div:last-child {
        position: relative;
        color: #466416;
    }

#page-list .chapter-group ul {
    position: relative;
    width: 95%;
    height: 40px;
    font-size: 12px;
    padding: 10px 0 0 0;
    clear: both;
}

#page-list .chapter-group li {
    position: relative;
    float: left;
    display: -webkit-box;
    -webkit-box-align: center;
}

    #page-list .chapter-group li a div {
        margin: 0 8px;
        font-weight: normal;
        letter-spacing: -1px;
        color: #444;
        margin-bottom: 5px;
    }

    #page-list .chapter-group li .chapter-menu-bar {
        width: 1px;
        height: 8px;
        background-color: #b7b7b7;
        margin-bottom: 5px;
    }

/*분류메뉴*/
.sub-3depth {
    padding: 20px 10px 0 10px;
}

    .sub-3depth > div {
        position: relative;
        display: -webkit-box;
    }

        .sub-3depth > div:last-child {
            padding-bottom: 3px;
            border-bottom: 1px solid #cdcdcd;
        }

        .sub-3depth > div > div {
            display: -webkit-box;
            -webkit-box-pack: center;
            width: 25%;
            height: 25px;
        }

            .sub-3depth > div > div.btn-on {
                background-image: url(https://ssl.nexon.com/S2/Game/Ca/2014/mobile/intro/img_tab_l.jpg), url(https://ssl.nexon.com/S2/Game/Ca/2014/mobile/intro/img_tab_r.jpg), url(https://ssl.nexon.com/S2/Game/Ca/2014/mobile/intro/img_tab_bg.jpg);
                background-repeat: no-repeat, no-repeat, repeat-x;
                background-size: 5px 25px, 5px 25px, 1px 25px;
                background-position: left top, right top, left top;
                width: 25%;
                height: 25px;
            }

            .sub-3depth > div > div.btn-off {
                background-image: url(https://ssl.nexon.com/S2/Game/Ca/2014/mobile/intro/img_tab_n.jpg);
                background-repeat: no-repeat;
                background-size: 1px 9px;
                background-position: right center;
                width: 25%;
                height: 25px;
            }

            .sub-3depth > div > div > a > div {
                display: -webkit-box;
                -webkit-box-pack: center;
                -webkit-box-align: center;
                height: 25px;
                font-size: 12px;
                font-weight: normal;
                color: #666;
                letter-spacing: -1px;
            }

            .sub-3depth > div > div.btn-on > a > div {
                color: #fff;
            }

.tab-content {
    display: none;
}

#content-1 {
    display: block;
}

/*예외적용*/
.list-notice .list-area-1 {
    background-color: #daf7fb;
}

.list-notice .content-category {
    color: #0d484d;
}

.list-bbs-event .content-category {
    color: #3d60aa;
}

.msg-nomore {
    height: 32px;
    display: -webkit-box;
    -webkit-box-pack: end;
    -webkit-box-orient: vertical;
    -webkit-box-align: center;
    font-size: 13px;
    font-weight: normal;
    color: #9f9f9f;
    font-size: 13px;
    font-weight: normal;
    color: #9f9f9f;
}

.list-more-area {
    height: 52px;
    display: -webkit-box;
    -webkit-box-pack: end;
    -webkit-box-orient: vertical;
    -webkit-box-align: center;
}

    .list-more-area > a > div {
        width: 196px;
        height: 32px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/btn-list-more.png) no-repeat;
        background-size: 196px 32px;
    }

.space-list-bottom {
    height: 40px;
}

.read-content {
    min-height: 100px;
    padding: 12px 10px 32px 10px;
    color: #666;
    line-height: 18px;
    font-size: 12px;
    word-break: break-all;
}

.read-recommend {
    position: relative;
    display: -webkit-box;
    -webkit-box-pack: end;
    margin-top: 10px;
    margin-right: 10px;
}

    .read-recommend .content-recommend {
        width: 34px;
        height: 25px;
        line-height: 25px;
        padding: 0 6px 0 60px;
        text-align: center;
        font-size: 11px;
        font-weight: normal;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/btn_recommend.png) no-repeat;
        background-size: 100px 25px;
    }

.ui-char-info-group {
    position: relative;
    -webkit-box-flex: 1;
}

    .ui-char-info-group > div {
        display: -webkit-box;
    }

        .ui-char-info-group > div:nth-child(1) {
            -webkit-box-align: center;
            height: 23px;
            border-bottom: 1px solid #8e8e8e;
        }

    .ui-char-info-group .content-ladder {
        width: 18px;
        height: 16px;
        background-size: 18px 16px;
        background-repeat: no-repeat;
        margin-right: 4px;
    }

    .ui-char-info-group .content-level {
        width: 18px;
        height: 16px;
        background-size: 18px 16px;
        background-repeat: no-repeat;
        margin-right: 4px;
    }

    .ui-char-info-group .content-writer {
        position: relative;
        line-height: 17px;
        height: 17px;
        top: 0px;
        left: 0px;
        color: #666;
        font-weight: normal;
        text-shadow: none;
        font-size: 11px;
        padding-right: 8px;
        width: auto;
    }

    .ui-char-info-group > div:nth-child(2) {
        height: 20px;
        border-bottom: 1px solid #cbcbcb;
        font-size: 11px;
    }

    .ui-char-info-group > div:nth-child(3) {
        position: absolute;
        width: 100%;
        height: 56px;
        left: 0px;
        top: 24px;
        font-size: 11px;
    }

        .ui-char-info-group > div:nth-child(3) > div {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-box-align: center;
            -webkit-box-flex: 1;
        }

            .ui-char-info-group > div:nth-child(3) > div > div:first-child {
                display: -webkit-box;
                -webkit-box-align: center;
                height: 21px;
                color: #888;
            }

            .ui-char-info-group > div:nth-child(3) > div:nth-child(1) > div:last-child,
            .ui-char-info-group > div:nth-child(3) > div:nth-child(2) > div:last-child {
                display: -webkit-box;
                -webkit-box-align: center;
                height: 35px;
            }

            .ui-char-info-group > div:nth-child(3) > div:nth-child(3) > div:last-child {
                display: -webkit-box;
                -webkit-box-pack: center;
                -webkit-box-orient: vertical;
                -webkit-box-align: center;
                height: 35px;
            }

                .ui-char-info-group > div:nth-child(3) > div:nth-child(3) > div:last-child > div {
                    display: -webkit-box;
                    -webkit-box-align: center;
                }

                    .ui-char-info-group > div:nth-child(3) > div:nth-child(3) > div:last-child > div:last-child {
                        color: #888;
                    }

                        .ui-char-info-group > div:nth-child(3) > div:nth-child(3) > div:last-child > div:last-child > div:nth-child(2) {
                            margin-right: 4px;
                        }

/*코멘트*/
.area-comment-set {
    min-height: 100px;
    padding-bottom: 50px;
    margin-top: 20px;
}

    .area-comment-set .toggle-comment {
        background-color: #a9b3c1;
    }

    .area-comment-set .btn-comment-toggle > div {
        display: -webkit-box;
        -webkit-box-align: center;
        height: 38px;
        padding: 0 10px;
        color: #3b4c6d;
        font-size: 14px;
        font-weight: normal;
        letter-spacing: -1px;
    }

        .area-comment-set .btn-comment-toggle > div > div > div {
            display: -webkit-box;
            -webkit-box-align: center;
        }

        .area-comment-set .btn-comment-toggle > div > div:nth-child(1) {
            display: -webkit-box;
        }

            .area-comment-set .btn-comment-toggle > div > div:nth-child(1) > div:nth-child(1) {
                width: 15px;
                margin-right: 5px;
                background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/icon_cmt.png) 0 center / 15px 13px no-repeat;
            }

            .area-comment-set .btn-comment-toggle > div > div:nth-child(1) > div:nth-child(2) {
                margin-right: 4px;
            }

    .area-comment-set .btn-comment-toggle .area-comment {
        display: -webkit-box;
        color: #3b4c6d !important;
    }

    .area-comment-set .content-comment {
        font-size: 14px;
        color: #3b4c6d !important;
    }

    .area-comment-set .btn-comment-toggle > div > div:nth-child(2) {
        -webkit-box-flex: 1;
    }

    .area-comment-set .btn-comment-toggle > div > div:nth-child(3) {
        display: -webkit-box;
        -webkit-box-align: center;
    }

        .area-comment-set .btn-comment-toggle > div > div:nth-child(3) > div:nth-child(1) {
            width: 12px;
            height: 12px;
            overflow: hidden;
            margin-right: 5px;
            background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/icon_cmt_arrow.png) no-repeat;
            background-size: 12px 26px;
        }

    .area-comment-set .input-logout {
        border-bottom: 1px solid #cbcbcb;
        padding: 15px;
        display: -webkit-box;
        font-size: 12px;
        color: #4e5568;
    }

        .area-comment-set .input-logout > div:nth-child(1) {
            display: -webkit-box;
            -webkit-box-align: center;
            height: 23px;
        }

        .area-comment-set .input-logout > div:nth-child(2) {
            -webkit-box-flex: 1;
        }

    .area-comment-set .btn-cmt-auth > div {
        width: 60px;
        height: 23px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/common/btn_cmt_auth.png) no-repeat;
        background-size: 60px 23px;
    }

    .area-comment-set .input-login {
        border-bottom: 1px solid #cbcbcb;
        padding: 12px 15px 15px 15px;
    }

        .area-comment-set .input-login > div:last-child {
            display: -webkit-box;
            margin-top: 5px;
        }

        .area-comment-set .input-login .content-writer {
            font-size: 11px;
        }

        .area-comment-set .input-login > div:last-child > div:nth-child(1) {
            -webkit-box-flex: 1;
        }

        .area-comment-set .input-login > div:last-child > div:nth-child(2) {
            width: 5px;
        }

        .area-comment-set .input-login .btn-cmt-confirm > div {
            width: 45px;
            height: 32px;
            background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/btn_cmt_confirm.png) 0 0 / 100% 100% no-repeat;
        }

    .area-comment-set .comment-list > div {
        border-bottom: 1px solid #cbcbcb;
        padding: 12px 15px;
    }

    .area-comment-set .comment-list .ui-write-group {
        margin-right: 0px;
    }

#page-read .area-comment-set .comment-list .content-mobile {
    top: 0px;
}

.area-comment-set .comment-list > div > div:nth-child(1) {
    display: -webkit-box;
    -webkit-box-align: center;
    margin-bottom: 5px;
}

    .area-comment-set .comment-list > div > div:nth-child(1) > div:nth-child(2) {
        -webkit-box-flex: 1;
    }

.area-comment-set .comment-list .btn-cmt-delete {
    display: none;
}

    .area-comment-set .comment-list .btn-cmt-delete > div {
        width: 14px;
        height: 14px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/btn_cmt_delete.png) no-repeat;
        background-size: 14px 14px;
    }

.area-comment-set .comment-list .content-date {
    margin-left: 10px;
    color: #888;
}

.area-comment-set .comment-list .content-content {
    line-height: 18px;
    font-size: 12px;
    color: #222;
    word-break: break-all;
}

.area-comment-set .comment-more {
    padding-top: 15px;
    display: -webkit-box;
    -webkit-box-pack: center;
}

    .area-comment-set .comment-more .btn-comment-more > div {
        width: 180px;
        height: 33px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/btn_cmt_more.png) 0 0 / 100% 100% no-repeat;
    }

/*글쓰기*/
#page-write .area-write {
    min-height: 150px;
    padding: 15px;
}

#page-write .write-type {
    line-height: 22px;
    border-bottom: 1px solid #b2b2b2;
    font-size: 15px;
    font-weight: normal;
}

#page-write .write-title {
    display: -webkit-box;
    height: 42px;
    padding-top: 10px;
}

    #page-write .write-title .space-width {
        width: 5px;
    }

    #page-write .write-title > div:last-child {
        -webkit-box-flex: 1;
    }

    #page-write .write-title .write-content {
        margin-bottom: 10px;
    }

#page-write .write-caution {
    display: -webkit-box;
    height: 35px;
    line-height: 37px;
    border-bottom: 1px solid #b2b2b2;
    font-size: 11px;
    color: #666;
    margin-bottom: 5px;
}

    #page-write .write-caution > div:first-child {
        width: 4px;
        height: 6px;
        margin: 14px 5px 0px 10px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/img_write_arrow.png) no-repeat;
        background-size: 4px 6px;
    }

#page-write .write-confirm {
    display: -webkit-box;
    -webkit-box-pack: end;
    margin-bottom: 40px;
}

#page-write .btn-write-confirm div {
    width: 70px;
    height: 34px;
    background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/btn_write_confirm.png) 0 0 / 100% 100% no-repeat;
}

#page-list .focus-on .content-category {
    color: #db4b4b;
}

#page-read .focus-on .content-title {
    -webkit-box-flex: 1;
    color: #ff5d00;
}

#page-read .read-title > div {
    border-bottom: 1px solid #d9d9d9;
    padding: 2px 10px 0px 10px;
    background-color: #fff;
}

#page-read .read-title .area-poll-title {
    display: -webkit-box;
    line-height: 18px;
    padding: 12px 0;
    font-size: 13px;
    font-weight: normal;
    border-bottom: 1px dashed #eaeaea;
}

    #page-read .read-title .area-poll-title > div:first-child {
        width: 40px;
        min-height: 38px;
        background: url(https://ssl.nexon.com/S2/Game/CSO/mobile/2018/bbs/icon_q.png) no-repeat;
        background-size: 40px 38px;
        background-position: left center;
    }

    #page-read .read-title .area-poll-title > div:last-child {
        -webkit-box-flex: 1;
        min-height: 33px;
        display: -webkit-box;
        -webkit-box-align: center;
    }

#page-read .read-title .area-poll-title-info {
    display: -webkit-box;
    height: 24px;
    line-height: 24px;
    font-size: 11px;
    font-weight: normal;
    color: #666;
}

#page-read .read-title .area-poll-date {
    display: -webkit-box;
    margin-bottom: 5px;
}

    #page-read .read-title .area-poll-date div {
        margin-right: 5px;
    }

#page-read .read-title .title-space {
    -webkit-box-flex: 1;
}

#page-read .read-title .area-join {
    display: -webkit-box;
}

    #page-read .read-title .area-join > div:first-child {
        margin-right: 5px;
    }

    #page-read .read-title .area-join > div:last-child {
        margin-left: 2px;
    }

/*게임정보 서브메뉴*/
.sub-info-menu {
    padding: 10px;
}

    .sub-info-menu > div {
        border: 2px solid #9ebe48;
    }

    .sub-info-menu .menu-top,
    .sub-info-menu .menu-bottom {
        display: -webkit-box;
        -webkit-box-align: center;
        height: 31px;
    }

    .sub-info-menu .btn-sub-1depth {
        height: 30px;
        -webkit-box-flex: 1;
        display: -webkit-box;
        -webkit-box-pack: center;
        -webkit-box-align: center;
        background-color: #f3f3f3;
    }

    .sub-info-menu .menu-top .btn-sub-1depth {
        border-bottom: 1px solid #ddd;
    }

    .sub-info-menu .menu-bottom .btn-sub-1depth {
        border-top: 1px solid #ddd;
    }

    .sub-info-menu .menu-top .btn-sub-1depth.btn-on {
        border-bottom: 1px dashed #ddd;
        background-color: #fff;
    }

    .sub-info-menu .menu-bottom .btn-sub-1depth.btn-on {
        border-top: 1px dashed #ddd;
        background-color: #fff;
    }

    .sub-info-menu .btn-sub-1depth > a > div {
        width: 58px;
        letter-spacing: -1px;
        font-size: 11px;
        text-align: center;
        color: #555;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        white-space: nowrap;
    }

    .sub-info-menu .btn-sub-1depth.btn-on > a > div {
        color: #000;
    }

    .sub-info-menu .info-menu-bar {
        width: 1px;
        height: 100%;
        background-color: #ddd;
    }

    .sub-info-menu .menu-sub {
        padding: 10px;
    }

        .sub-info-menu .menu-sub > div {
            display: none;
        }

            .sub-info-menu .menu-sub > div > div {
                height: 18px;
                display: -webkit-box;
            }

    .sub-info-menu .btn-sub-2depth {
        -webkit-box-flex: 1;
        display: -webkit-box;
        -webkit-box-pack: center;
        -webkit-box-align: center;
    }

        .sub-info-menu .btn-sub-2depth > div {
            width: 73px;
        }

        .sub-info-menu .btn-sub-2depth > a > div {
            width: 73px;
            letter-spacing: -1px;
            font-size: 11px;
            text-align: left;
            color: #666;
            font-weight: normal;
        }

        .sub-info-menu .btn-sub-2depth.btn-on > a > div {
            font-weight: normal;
            text-decoration: underline;
            color: #5b7f06;
        }

.btn-tab-area {
    padding: 12px 10px;
    display: -webkit-box;
    -webkit-box-pack: start;
}

    .btn-tab-area a > div {
        display: -webkit-box;
        -webkit-box-align: center;
        -webkit-box-pack: center;
        width: 65px;
        height: 30px;
        font-size: 11px;
        color: #555;
        font-weight: normal;
        border: 1px solid #cdcdcd;
        background-color: #f3f3f3;
    }

    .btn-tab-area a.btn-on > div {
        width: 65px;
        height: 31px;
        font-size: 11px;
        color: #5b7f06;
        font-weight: normal;
        border-bottom: none;
        background-color: #fff;
    }

    .btn-tab-area > div {
        width: 3px;
        height: 31px;
        border-bottom: 1px solid #cdcdcd;
    }

        .btn-tab-area > div:last-child {
            -webkit-box-flex: 1;
            height: 31px;
            border-bottom: 1px solid #cdcdcd;
        }

.btn-tab2-area {
    padding: 12px 10px;
    display: -webkit-box;
    -webkit-box-pack: start;
}

    .btn-tab2-area a > div {
        display: -webkit-box;
        -webkit-box-align: center;
        -webkit-box-pack: center;
        height: 30px;
        font-size: 11px;
        color: #555;
        font-weight: normal;
        border: 1px solid #cdcdcd;
        background-color: #f3f3f3;
        letter-spacing: -1px;
    }

    .btn-tab2-area a:nth-child(1) > div {
        width: 88px;
    }

    .btn-tab2-area a:nth-child(3) > div {
        width: 126px;
    }

    .btn-tab2-area a:nth-child(5) > div {
        width: 54px;
    }

    .btn-tab2-area a.btn-on > div {
        height: 31px;
        font-size: 11px;
        color: #5b7f06;
        font-weight: normal;
        border-bottom: none;
        background-color: #fff;
    }

    .btn-tab2-area > div {
        width: 3px;
        height: 31px;
        border-bottom: 1px solid #cdcdcd;
    }

        .btn-tab2-area > div:last-child {
            -webkit-box-flex: 1;
            height: 31px;
            border-bottom: 1px solid #cdcdcd;
        }

.tip-area {
    padding: 10px;
    margin: 10px;
    font-size: 9px;
    letter-spacing: -1px;
    color: #666;
    background-color: #f3f3f3;
    line-height: 16px;
    border: 1px solid #e1e1e1;
}

.read-content .MsoNormal font span a {
    display: inline-block;
}

.cso_guide {
    position: relative;
}

.guide-top {
    display: -webkit-box;
    padding: 30px 10px 0 10px;
}

    .guide-top a {
        position: relative;
        display: block;
        box-sizing: border-box;
        border: 1px solid #232534;
        -webkit-box-flex: 1;
    }

    .guide-top div {
        width: 100%;
        height: 38px;
        display: -webkit-box;
        -webkit-box-pack: center;
        -webkit-box-align: center;
        box-sizing: border-box;
        border: 2px solid #fff;
        background: #232534 url(https://lwi.nexon.com/cso/mobile/m_guide_icon1.png) center center / 74px 30px no-repeat;
        font-size: 0;
        line-height: 0;
        overflow: hidden;
        text-indent: -10000px;
    }

    .guide-top a:first-child {
        margin-right: 2px;
    }

    .guide-top a:last-child {
        margin-left: 2px;
    }

        .guide-top a:last-child div {
            background-image: url(https://lwi.nexon.com/cso/mobile/m_guide_icon2.png);
        }

.guide-menu {
    padding: 0px 10px;
    margin: 25px 0;
}

.guide-menu-top {
    border: 1px solid #b3b6bb;
    border-left: none;
    border-right: none;
    background: #fff;
}

    .guide-menu-top h2 {
        padding: 8px 15px;
        background: #b3b6bb;
        color: #fff;
        font-size: 14px;
        font-weight: normal;
        letter-spacing: -1px;
        margin: 2px 0;
    }

.guide-menu-body {
    position: relative;
    display: -webkit-box;
    -webkit-box-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #505569;
    border-bottom: 1px solid #b3b6bb;
}

.guide-menu-title {
    display: -webkit-box;
    -webkit-box-align: center;
    padding: 15px;
    width: 80px;
    height: 100%;
    letter-spacing: -1px;
}

.guide-menu-button {
    -webkit-box-flex: 1;
    padding: 10px 15px;
    border-left: 1px solid #b3b6bb;
}

    .guide-menu-button a {
        display: inline-block;
        width: 82px;
        margin: 2px 0px;
        text-align: center;
        padding: 8px;
        font-size: 13px;
        letter-spacing: -1px;
        font-weight: normal;
        color: #4e5567 !important;
        vertical-align: middle;
        word-break: keep-all;
    }

        .guide-menu-button a.active {
            color: #fff !important;
            background-color: #232534;
            border-radius: 7px;
        }

.guide-content-title {
    padding: 10px 0 8px 12px;
    margin: 0 15px;
    border-bottom: 1px solid #b3b6bb;
    background: url(https://lwi.nexon.com/cso/mobile/m_guide_icon3.png) left center / 5px 7px no-repeat;
    font-size: 18px;
    letter-spacing: -1px;
}

.guide-qs-text {
    display: block;
    font-size: 15px;
    color: #333;
    line-height: 26px;
    word-break: break-all;
    padding: 10px 15px;
    min-height: 200px;
}

.guide-bottom {
    margin-top: 30px;
}

.guide-bottom-start {
    background: #eee url(https://lwi.nexon.com/cso/mobile/m_guide_icon4.png) 6px center / 18px 18px no-repeat;
    font-size: 13px;
    margin: 0 15px;
    border-radius: 50px;
    padding: 0 3px 0 30px;
    display: -webkit-box;
    -webkit-box-pack: start;
    -webkit-box-align: center;
    width: 310px;
    height: 28px;
    color: #4e5568;
}

    .guide-bottom-start em {
        font-style: normal;
    }

.guide-bottom-center {
    display: -webkit-box;
    -webkit-box-align: center;
    padding: 12px 15px 20px 15px;
    font-size: 11px;
    letter-spacing: -1px;
    color: #3e7ad0;
    max-width: 415px;
}

    .guide-bottom-center p {
        -webkit-box-flex: 1;
    }

    .guide-bottom-center a {
        display: block;
        margin-left: 10px;
        width: 72px;
        height: 19px;
        font-size: 0;
        line-height: 0;
        overflow: hidden;
        text-indent: -10000px;
        background: url(https://lwi.nexon.com/cso/mobile/m_guide_icon5.png) left center / 72px 19px no-repeat;
    }

.guide-bottom-end {
    display: -webkit-box;
    -webkit-box-pack: end;
    margin: 0 15px;
    border-top: 1px solid #b3b6bb;
    padding: 12px 0;
}

    .guide-bottom-end a {
        display: block;
        margin-left: 10px;
        width: 135px;
        height: 42px;
        font-size: 0;
        line-height: 0;
        overflow: hidden;
        text-indent: -10000px;
        background: url(https://lwi.nexon.com/cso/mobile/m_guide_icon6.png) left center / 135px 42px no-repeat;
    }

.guide-content-top {
    border: 1px solid #b3b6bb;
    border-left: none;
    border-right: none;
    background: #fff;
    margin: 0 15px;
    border-top: none;
}

    .guide-content-top h2 {
        padding: 12px 15px;
        color: #292535;
        font-size: 15px;
        font-weight: normal;
        letter-spacing: -1px;
        margin: 3px 0;
        background: #d4d4d4 url(https://lwi.nexon.com/cso/mobile/m_guide_icon7.png) left center / 42px 42px no-repeat;
        text-indent: 38px;
    }

/* 게시판 검색(클래스 월페이퍼 페이지 검색어 자동완성 기능 추가) */
#page-list .bbs-search.search_auto_keyword {
    height: 32px;
}

.search_auto_keyword .select-search {
    height: 32px;
    background-color: #fff !important;
}

    .search_auto_keyword .select-search select {
        width: 100%;
        min-width: 60px;
        height: 100%;
        appearance: none;
        -o-appearance: none;
        -moz-appearance: none;
        -webkit-appearance: none;
        -webkit-border-radius: 0;
        font-family: inherit;
        font-size: 12px;
        line-height: 1;
        color: #4e5568;
        padding: 0 32px 0 10px;
        border: 1px solid #363848;
        box-sizing: border-box;
        background: url("https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/ico_search.png") calc(100% - 5px) 55% #fff no-repeat;
        background-size: 22px auto;
    }

.search_auto_keyword .searchInput {
    position: relative;
    height: 32px;
    border: 1px solid #000;
    box-sizing: border-box;
    background: #fff;
}

    .search_auto_keyword .searchInput input {
        display: block;
        width: 100%;
        height: 100%;
        padding: 0 10px;
        background: transparent;
        border: none;
        box-sizing: border-box;
    }

.search_auto_keyword .keyword_list {
    position: absolute;
    top: 30px;
    left: 0px;
    width: 100%;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: #2f3142;
    box-sizing: border-box;
    background: #fff;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: max-height linear 300ms;
    z-index: 5;
}

    .search_auto_keyword .keyword_list.open {
        max-height: 1000%;
        border-top: 1px solid #2f3142;
    }

    .search_auto_keyword .keyword_list li {
        height: 40px;
        font-size: 13px;
        line-height: 40px;
    }

        .search_auto_keyword .keyword_list li em {
            font-weight: 600;
            font-style: normal;
        }

        .search_auto_keyword .keyword_list li a {
            display: block;
            width: 100%;
            height: 100%;
            padding: 0 24px;
            box-sizing: border-box;
            font-family: inherit;
            font-size: inherit;
            font-weight: 400;
            color: inherit;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            word-break: break-all;
        }

            .search_auto_keyword .keyword_list li a:hover {
                background: #dfdfdf;
            }

.sorting {
    display: flex;
    gap: 8px;
    width: calc(100% - 20px);
    margin: 24px auto 0;
    font-family: "맑은 고딕", "malgun gothic", "AppleGothicNeoSD", "Apple SD 산돌고딕 Neo", "Microsoft NeoGothic", "Droid sans", sans-serif;
}

.sorting .ui-select {
    min-width: 105px;
}

.sorting .ui-select span {
    text-align: left;
}

.sorting select {
    width: auto;
    min-width: 105px;
    height: 33px;
    padding: 0 16px;
    appearance: none;
    -o-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    font-family: inherit;
    font-size: 12px;
    line-height: 1;
    color: #4e5568;
    padding: 0 32px 0 10px;
    border: 1px solid #c5c7cf;
    box-sizing: border-box;
    background: url("https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/ico_search.png") calc(100% - 5px) 55% #fff no-repeat;
    background-size: 22px auto;
}

    .sorting select option {
        background: #fff;
    }

/* 클래스 월페이퍼 */
.wrap_wallpaper {
    font-family: "맑은 고딕", "malgun gothic", "AppleGothicNeoSD", "Apple SD 산돌고딕 Neo", "Microsoft NeoGothic", "Droid sans", sans-serif;
    padding: 15px 10px;
}

    .wrap_wallpaper .wallpaperList {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(1, 1fr);
        grid-column-gap: 8px;
        grid-row-gap: 32px;
    }

        .wrap_wallpaper .wallpaperList .box {
            background: #fff;
            min-width: 0;
        }

        .wrap_wallpaper .wallpaperList .imageArea {
            position: relative;
            display: flex;
            align-items: top;
            justify-content: center;
            aspect-ratio: 100 / 110;
            background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/bg_logo.png") 50% 50% #888 no-repeat;
            background-size: 70% auto;
            overflow: hidden;
        }

            .wrap_wallpaper .wallpaperList .imageArea .ico_new {
                position: absolute;
                top: 0;
                left: 0;
                z-index: 1;
            }

            .wrap_wallpaper .wallpaperList .imageArea .image {
                width: 100%;
                height: auto;
                cursor: pointer;
            }

                .wrap_wallpaper .wallpaperList .imageArea .image img {
                    width: 100%;
                    height: auto;
                    transition: all 0.5s ease-in-out;
                }

            .wrap_wallpaper .wallpaperList .imageArea .btn_like {
                position: absolute;
                bottom: 16px;
                right: 16px;
                width: 36px;
                height: 36px;
                border-radius: 100%;
                border: none;
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_heart_off.png") 50% 50% rgba(15, 15, 15, 0.8) no-repeat;
                background-size: 18px auto;
                overflow: hidden;
                z-index: 1;
                text-indent: -9999px;
                transition: background linear 200ms;
            }

                .wrap_wallpaper .wallpaperList .imageArea .btn_like.on {
                    background-image: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_heart_on.png");
                }

        .wrap_wallpaper .wallpaperList .textArea {
            margin-top: 16px;
        }

            .wrap_wallpaper .wallpaperList .textArea .name {
                display: flex;
                flex-direction: row-reverse;
                justify-content: flex-end;
                gap: 8px;
            }

                .wrap_wallpaper .wallpaperList .textArea .name .type {
                    display: inline-block;
                    width: 30px;
                    height: 24px;
                    text-indent: -9999px;
                }

                .wrap_wallpaper .wallpaperList .textArea .name .type_tr {
                    background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/type_tr2.jpg");
                }

                .wrap_wallpaper .wallpaperList .textArea .name .type_ct {
                    background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/type_ct2.jpg");
                }

                .wrap_wallpaper .wallpaperList .textArea .name h4 {
                    width: calc(100% - 40px);
                    max-width: 100%;
                    font-family: inherit;
                    font-size: 15px;
                    line-height: 24px;
                    font-weight: 600;
                    letter-spacing: -1px;
                    color: #4e5568;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                }

            .wrap_wallpaper .wallpaperList .textArea .count {
                display: flex;
                gap: 12px;
                margin-top: 10px;
            }

                .wrap_wallpaper .wallpaperList .textArea .count li {
                    font-family: inherit;
                    font-size: 12px;
                    line-height: 14px;
                    color: #a7aab6;
                }

                    .wrap_wallpaper .wallpaperList .textArea .count li.download {
                        background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_download.png") 0 50% no-repeat;
                        background-size: auto 14px;
                        padding-left: 16px;
                    }

                    .wrap_wallpaper .wallpaperList .textArea .count li.like {
                        background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_like.png") 0 50% no-repeat;
                        background-size: auto 14px;
                        padding-left: 14px;
                    }

                    .wrap_wallpaper .wallpaperList .textArea .count li span {
                    }

            .wrap_wallpaper .wallpaperList .textArea .btn_download {
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 8px;
                width: 100%;
                height: 42px;
                margin-top: 18px;
                border: 1px solid #c5c7cf;
                box-sizing: border-box;
                cursor: pointer;
            }

                .wrap_wallpaper .wallpaperList .textArea .btn_download svg {
                    width: 18px;
                    height: 18px;
                    fill: none;
                }

                    .wrap_wallpaper .wallpaperList .textArea .btn_download svg path {
                        fill: #4e5568;
                    }

                .wrap_wallpaper .wallpaperList .textArea .btn_download span {
                    font-size: 14px;
                    color: #4e5568;
                }

    .wrap_wallpaper .spinner {
        display: block;
        margin-top: 65px;
    }

        .wrap_wallpaper .spinner img {
            margin: 0 auto;
            display: block;
        }

/* 월페이퍼 레이어 팝업 */
#wallpaperLayerPopup {
    display: none;
    position: relative;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    font-family: "맑은 고딕", "malgun gothic", "AppleGothicNeoSD", "Apple SD 산돌고딕 Neo", "Microsoft NeoGothic", "Droid sans", sans-serif;
    z-index: 999999;
    background: rgba(0, 0, 0, 0.9);
}

    #wallpaperLayerPopup .layerPopupContents {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        min-width: 360px;
        max-width: 656px;
        transform: translate(-50%, -50%);
    }

    #wallpaperLayerPopup .titleArea {
        position: relative;
        width: calc(100% - ((50px + 11px) * 2));
        height: 66px;
        margin: 0 auto;
        padding: 12px 16px;
        box-sizing: border-box;
        background: #282d3c;
    }

        #wallpaperLayerPopup .titleArea .title {
            display: flex;
            align-items: center;
            gap: 8px;
            min-height: 20px;
        }

            #wallpaperLayerPopup .titleArea .title .ico_new {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 20px;
                overflow: hidden;
            }

            #wallpaperLayerPopup .titleArea .title h4 {
                width: calc(100% - 80px);
                font-size: 18px;
                line-height: 1;
                font-weight: 600;
                color: #fff;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
            }

        #wallpaperLayerPopup .titleArea .update {
            font-family: inherit;
            font-size: 14px;
            line-height: 1;
            color: #a7aab6;
            margin-top: 6px;
        }

        #wallpaperLayerPopup .titleArea .type {
            position: relative;
            position: absolute;
            right: 12px;
            top: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 30px;
            height: 24px;
            text-indent: -9999px;
            box-sizing: border-box;
            transform: translateY(-50%);
            transition: all 300ms linear;
        }

            #wallpaperLayerPopup .titleArea .type.type_ct {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/type_ct1.jpg") 50% 50% no-repeat;
            }

            #wallpaperLayerPopup .titleArea .type.type_tr {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/type_tr1.jpg") 50% 50% no-repeat;
            }

    #wallpaperLayerPopup .swiper {
        width: calc(100% - ((50px + 11px) * 2));
        aspect-ratio: 100 / 140;
        background: url("https://ssl.nexon.com/S2/Game/CSO/mobile/images/common/img_logo.png") 50% 50% #282d3c no-repeat;
        background-size: 160px auto;
    }

    #wallpaperLayerPopup .swiper-wrapper .swiper-slide {
        position: relative !important;
        width: auto;
        height: 100%;
        box-sizing: border-box;
        aspect-ratio: 100 / 140;
    }

    #wallpaperLayerPopup .swiper-wrapper .cycle-carousel-wrap {
        width: 100%;
        aspect-ratio: 100 / 140;
    }

    #wallpaperLayerPopup .swiper-wrapper .swiper-slide .btn_download {
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        width: 20%;
        max-width: 80px;
        aspect-ratio: 1/1;
        transform: translate(-50%, -50%);
        cursor: pointer;
    }

        #wallpaperLayerPopup .swiper-wrapper .swiper-slide .btn_download img {
            width: 100%;
            height: auto;
        }

    #wallpaperLayerPopup .swiper-wrapper .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    #wallpaperLayerPopup .sliderButton {
        position: absolute;
        top: 50%;
        left: 50%;
        display: flex;
        justify-content: space-between;
        // width: calc(100% + ((50px + 11px) * 2));
        width: 100%;
        transform: translate(-50%, calc(-50% - 55px));
    }

        #wallpaperLayerPopup .sliderButton button[class^="swiper-button-"] {
            position: static;
            display: block;
            width: 50px;
            height: 50px;
            margin: 0;
            text-indent: -9999px;
            border: none;
        }

        #wallpaperLayerPopup .sliderButton .swiper-button-prev {
            background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/button/btn_sliderPrev_off.jpg") 50% 50% no-repeat;
            background-size: 100% auto;
        }

        #wallpaperLayerPopup .sliderButton .swiper-button-next {
            background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/button/btn_sliderNext_off.jpg") 50% 50% no-repeat;
            background-size: 100% auto;
        }

    #wallpaperLayerPopup .utilButton {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-top: 15px;
    }

        #wallpaperLayerPopup .utilButton .button {
            position: relative;
            display: flex;
            align-items: center;
            padding: 10px;
            background: none;
            cursor: pointer;
            border: none;
            margin: 0 7px;
        }

            #wallpaperLayerPopup .utilButton .button:not(.btn_like)::before {
                position: absolute;
                top: 13px;
                left: -7px;
                display: block;
                content: "";
                width: 1px;
                height: 14px;
                background: #535353;
            }

            #wallpaperLayerPopup .utilButton .button i {
                display: block;
                width: 20px;
                height: 20px;
                margin-right: 4px;
                text-indent: -9999px;
            }

            #wallpaperLayerPopup .utilButton .button span[class^="txt_"] {
                display: block;
                font-family: inherit;
                font-size: 15px;
                color: #a7aab6;
            }

            #wallpaperLayerPopup .utilButton .button.btn_like i {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_heart_off.png") 0 50% no-repeat;
                background-size: 20px auto;
            }

            #wallpaperLayerPopup .utilButton .button.btn_like.on i {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/icon/ico_heart_on.png") 0 50% no-repeat;
            }

            #wallpaperLayerPopup .utilButton .button.btn_download i {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/button/btn_download_off.png") 0 50% no-repeat;
                background-size: 100% auto;
            }

            #wallpaperLayerPopup .utilButton .button.btn_copy i {
                background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/button/btn_linkCopy_off.png") 0 50% no-repeat;
                background-size: 100% auto;
            }

            #wallpaperLayerPopup .utilButton .button.btn_copy span[class^="txt_"] {
                font-family: "Noto Sans KR", Malgun Gothic, Dotum, sans-serif;
                font-size: 12px;
                font-weight: 600;
            }

    #wallpaperLayerPopup .btn_layerPopupClose {
        position: absolute;
        top: 12px;
        right: 12px;
        width: 48px;
        height: 48px;
        background: url("https://sht-vod.dn.nexoncdn.co.kr/cso/images/mobile/wallpaper/button/btn_layerClose_off.png") 50% 50% no-repeat;
        text-indent: -9999px;
        border: none;
        cursor: pointer;
    }