@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

body, div, span, th, td, li, h1, h2, h3, h4, h5, h6, input, textarea, select, label, p, button {
    font-family: 'Nanum Barun Gothic', 'Apple SD Gothic Neo', '돋움';
    /*font-weight: 300;*/
    /*line-height: 150%;*/
    /*letter-spacing: -0.03rem;*/
}


@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 100;
    src: local('Nanum Barun Gothic UltraLight'), local('NanumBarunGothicUltraLight'), url(../../fonts/NanumBarunGothicUltraLight.eot?#iefix) format('embedded-opentype'), url(../../fonts/NanumBarunGothicUltraLight.woff2) format('woff2'), url(../../fonts/NanumBarunGothicUltraLight.woff) format('woff'), url(../../fonts/NanumBarunGothicUltraLight.ttf) format('truetype');
}

@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 300;
    src: url(../../fonts/NanumBarunGothicLight.eot);
    src: local('Nanum Barun Gothic Light'), local('NanumBarunGothicLight'), url(../../fonts/NanumBarunGothicLight.eot?#iefix) format('embedded-opentype'), url(../../fonts/NanumBarunGothicLight.woff2) format('woff2'), url(../../fonts/NanumBarunGothicLight.woff) format('woff'), url(../../fonts/NanumBarunGothicLight.ttf) format('truetype');
}

@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/NanumBarunGothic.eot);
    src: local('Nanum Barun Gothic'), local('NanumBarunGothic'), url(../../fonts/NanumBarunGothic.eot?#iefix) format('embedded-opentype'), url(../../fonts/NanumBarunGothic.woff2) format('woff2'), url(../../fonts/NanumBarunGothic.woff) format('woff'), url(../../fonts/NanumBarunGothic.ttf) format('truetype');
}

@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/NanumBarunGothicBold.eot);
    src: local('Nanum Barun Gothic Bold'), local('NanumBarunGothicBold'), url(../../fonts/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
    /*url(../fonts/NanumBarunGothicBold.woff2) format('woff2'),*/
    url(../../fonts/NanumBarunGothicBold.woff) format('woff'), url(../../fonts/NanumBarunGothicBold.ttf) format('truetype');
}

.hide{
    display:none !important;
}

#AjaxLoading {
    display: none;
    position: fixed;
    text-align: center;
    vertical-align: middle;
    top: calc( 50% - 48px );
    left: calc( 50% - 48px );
    z-index: 999;
    /*opacity:0.0;*/
    filter: alpha(opacity=100);
}

.thumbnail{

}


/*###################################*/
/*####### Mobile - 핸드폰 -s ########*/
/*###################################*/
@media all and (min-width:1px) and (max-width:768px) {

    /**##### 사이트 레이아웃 -s #####**/
    html, body {
        margin: 0px 0px 0px 0px !important;
        padding: 0px 0px 0px 0px !important;
        height: 100% !important;
    }

    #header {
        position: relative;
        height: 110px;
        z-index: 1;
        background-color: #f5f5f5;
    }

    #wrapper {
        margin: -110px 0 -80px;
        min-height: 100%;
    }

    * html #wrapper {
        height: 100%;
    }

    .alert {
        width:97%;
        margin:0 auto;
        margin-top: 30px;
        display:none;
    }

    .alert-close {
        float: right;
        cursor: pointer;
    }

    #SignalR_msg_wrap {
        position: fixed;
        width: 97%;
        left:5px;
        bottom: 10px;
        z-index: 100;

    }
    .SignalR_msg {
        text-align: center;
        font-size: 12px;
        height: 56px;
        width: 100%;
        padding-top: 10px;
        border: 1px solid #9d9d9d;
        border-radius: 4px;
        margin-top: 5px;
        /*background-color: #e0f3ef;*/
        background-color: rgba(224,243,239,0.9);
        box-shadow: 0px 0px 1px 1px #dedede;
        z-index: 300;
        position: relative;
    }
        .SignalR_msg > div > span {
            position: absolute;
            top: 8px;
            right: 6px;
        }
            .SignalR_msg > div > span > button {
                height: 36px;
                width: 34px;
            }
        .SignalR_msg > div {
            height: 20px;
            text-align: left;
            padding-left: 7px;
        }
            .SignalR_msg > div:last-child {
                width: 65%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .SignalR_msg > div:first-child > a {
                color: #337ab7;
            }
            .SignalR_msg > div:last-child > a {
                color: #000000;
            }

        #myInfo {
            z-index:-1;
            position: relative;
            top: -6px;
            width:100%;
            height: 38px;
            padding:7px 15px 0px 10px;
            font-size: 0px;
            text-align: center;
            background-color: #f5f5f5;
            border: 1px solid #cccccc;
            border-radius:5px;
        }
                #myInfo > div{
                    display:inline-block;
                    font-size:11px;
                    padding:0px 5px 0px 5px;
                }
                #myName{
                    font-weight:700;
                }
                    #myInfo > div > span{
                        color:red;
                    }

                .lv_tag_Layout {
                    display: inline-block;
                    background-repeat: no-repeat;
                    background-position-y: center;
                    background-position-x: center;
                    height: 17px;
                    width: 27px;
                    position:relative;
                    top:5px;
                    margin-right:2px;
                }

                .lv_tag_11 {
                    background: url('/Content/Images/Board/lv_11.svg');
                }

                .lv_tag_22 {
                    background: url('/Content/Images/Board/lv_22.svg');
                }

                .lv_tag_44_1 {
                    background: url('/Content/Images/Board/lv_44_1.svg');
                }

                .lv_tag_48 {
                    background: url('/Content/Images/Board/lv_48.svg');
                }

                .lv_tag_88 {
                    background: url('/Content/Images/Board/lv_88.svg');
                }

                .lv_tag_96 {
                    background: url('/Content/Images/Board/lv_96.svg');
                }

                .lv_tag_192 {
                    background: url('/Content/Images/Board/lv_192.svg');
                }


    #content {
        padding: 130px 0 100px;
    }

    #footer {
        position: relative;
        height: 80px;
        z-index: 1;
        background-color: #242729;
    }
    /**##### 사이트 레이아웃 -e #####**/

    #logo_wrap{
        height:90px;
        width:100%;
        padding-top:17px;
        position:relative;
    }
        #logo {
            background: url('/Content/Images/Shared/logo.svg');
            background-repeat: no-repeat;
            background-position-y: center;
            background-position-x: center;
            width: 100%;
            height: 35px;
            margin-left:-4%;
        }

        #slogan {
            font-size: 12px;
            color: #919191;
            width:100%;
            height:20px;
            text-align:center;
            margin-left:-3%;
            margin-top:4px;
        }

        #btn_search_m{
            position:absolute;
            top:35px;
            left:25px;
            font-size:20px;
            cursor:pointer;
            color:#cccccc;
        }
    #btn_member_m {
        position: absolute;
        top: 35px;
        right:28px;
        font-size: 20px;
        cursor: pointer;
        color: #cccccc;
    }


        #search_wrap {
            display:none;
            background-color:#f5f5f5;
            position:relative;
            top:13px;
            height:40px;
            width:100%;
            margin:0px 0px 0px 0px;
            padding:0px 0px 0px 0px;
            word-spacing:0px;
            font-size:0px;
        }
            #search_wrap > div {
                display:inline-block;
                margin:0px 0px 0px 0px;
                padding:0px 0px 0px 0px;
            }
            #search_wrap > div:first-child{
                width:73%;
            }
            #search_wrap > div:last-child{
                width:27%;
            }
                #search_wrap input {
                    width:90%;
                    float:right;
                }
                #search_wrap button{
                    float:left;
                    margin-left:5px !important;
                }

        #main_search {
        }

        #search_wrap button {
            margin-left: 30px;
            margin-top: -4px;
        }

    #menu_container {
        clear: both;
        height: 40px;
        background-color: #106ff6;
        /*background-color: #8ca9c2;*/
    }
        #menu_wrap {

        }
            #menu{
              width: 100%;
              display: table;
              padding:0px 5px 0px 5px;
            }
                #menu > li {
                    position:relative;
                    left:-5px;
                    font-weight: 100;
                    display: table-cell;
                    width: auto;
                    text-align: center;
                    height: 40px;
                    padding-top: 14px;
                    letter-spacing: -1px;
                    font-size: 11px;
                }
                    #menu > li > a {
                        color: #ffffff;
                    }
                    .menu_sub{
                        display:none;
                    }

        #membership_wrap{
            display:none;
            background-color: #106ff6;
            height:40px;
            width:100%;
            position:absolute;
            top:90px;
            left:0px;
        }
            #membership_wrap > ul{
                /*margin:0 auto;*/
                float:right;
                width:35%;
            }
                #membership_wrap > ul > li {
                    display: inline-block;
                    color: #ffffff;
                    width: 35%;
                    text-align: center;
                    height: 40px;
                    padding-top: 12px;
                    letter-spacing: -1px;
                    font-size: 11px;
                }
                    #membership_wrap > ul > li > a {
                        color: #ffffff;
                    }

    #footer_wraper {
        height: 80px;
        position: relative;
    }

    #footer_logo {
        background: url('/Content/Images/Shared/logo_w.svg');
        background-repeat: no-repeat;
        background-position-y: center;
        background-position-x: center;
        width: 200px;
        height: 25px;
        position: relative;
        top: 16px;
        left: -10px;
    }

    #footer_coppyright {
        color: #ffffff;
        font-size: 12px;
        margin-top:22px;
        margin-left:22px;
    }
}
/*###################################*/
/*####### Mobile - 핸드폰 -e ########*/
/*###################################*/




/*#################################*/
/*######### PC 컴퓨터 -s ##########*/
/*#################################*/
@media all and (min-width:769px) {

/**##### 사이트 레이아웃 -s #####**/
    html, body {
        margin: 0px 0px 0px 0px !important;
        padding: 0px 0px 0px 0px !important;
        height: 100% !important;
    }

    #header {
        position: relative;
        height: 130px;
        z-index: 1;
        background-color: #f5f5f5;
    }

    #wrapper {
        margin: -130px 0 -100px;
        min-height: 100%;
        padding-top:130px;
    }

    * html #wrapper {
        height: 100%;
    }

    .alert {
        display: none;
        margin-top: 10px;
    }
        .alert-close{
            float:right;
            cursor:pointer;
        }

    #SignalR_msg_wrap{
        position:fixed;
        width:400px;
        bottom:10px;
        right:10px;
        z-index:100;
    }
        .SignalR_msg {
            text-align: center;
            font-size: 12px;
            height: 56px;
            width: 400px;
            padding-top: 10px;
            border: 1px solid #9d9d9d;
            border-radius: 4px;
            margin-top: 5px;
            /*background-color: #e0f3ef;*/
            background-color:rgba(224,243,239,0.9);
            box-shadow:0px 0px 1px 1px  #dedede;
            z-index:300;
            position:relative;
        }
            .SignalR_msg > div > span{
                position: absolute;
                top: 8px;
                right:15px;
            }
                .SignalR_msg > div > span > button {
                    height: 36px;
                }
            .SignalR_msg > div {
                height: 20px;
                text-align: left;
                padding-left: 15px;
            }
                .SignalR_msg > div:last-child{
                    width:250px;
                    overflow:hidden ;
                    text-overflow:ellipsis;
                    white-space:nowrap;
                }
                .SignalR_msg > div:first-child > a {
                    color: #337ab7;
                }
                .SignalR_msg > div:last-child>a{
                    color:#000000;
                }

    #content {
        clear:both;
        padding: 0px 0 100px;
        position:relative;
    }

    #footer {
        position: relative;
        height: 100px;
        z-index: 1;
        background-color: #242729;
    }
/**##### 사이트 레이아웃 -e #####**/

    #header_container {
        width: 1000px;
        margin: 0 auto;
        height: 90px;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }
        #logo_wrap {
            height: 90px;
        }
            #logo_wrap > div {
                display: inline-block;
            }
            #logo {
            background: url('/Content/Images/Shared/logo.svg');
                background-repeat: no-repeat;
                background-position-y: center;
                background-position-x: center;
                width: 213px;
                height: 38px;
                margin-top: 24px;
                cursor:pointer;
            }
            #slogan {
                font-size: 12px;
                color: #919191;
                position:relative;
                top:-5px;
                left:6px;
            }
            #search_wrap{
                position:relative;
                right:20px;
                float:right;
                top:28px;

            }
                #search_wrap > div{
                    /*display:inline-block;*/
                    float:left;
                }
                #main_search{
                    width:300px;
                }
                #search_wrap button{
                    margin-left:3px !important;
                    margin-top:0px;
                }
    #btn_search_m, #btn_member_m{
        display:none;
    }

    #menu_container {
        clear: both;
        height: 40px;
        /*background-color: #106ff6;*/
        background-color: #8ca9c2;
        /*-moz-box-shadow: inset 0 0 12px 0px rgba(0,0,0, 0.25);*/
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0,0,0, 0.15);
    }
        #menu_wrap {
            position:relative;
            width: 1000px;
            height: 40px;
            margin: 0 auto;
        }
        #menu_wrap > nav{
            height:40px;
        }
            #menu_wrap > nav > ul{
                position:absolute;
                top:0px;
                left:0px;
            }
                #menu_wrap > nav > ul > li {
                    display:inline-block;
                    color:#ffffff;
                    text-align:center;
                    padding:10px 20px 0px 20px;
                    font-weight:400;
                    cursor:pointer;
                    position:relative;
                }
                    #menu_wrap > nav > ul > li > a {
                        color: #ffffff;
                        /*text-shadow: 3px rgba(0, 0, 0, .8);*/
                    }
                    .menu_sub{
                        z-index:-1;
                        position:absolute;
                        top:35px;
                        left:0px;
                        width:100%;
                        display:none;
                    }
                        .menu_sub > ul {
                            width: 100%;
                            background-color: #ffffff;
                            border: 1px solid #cccccc;
                            border-radius: 7px;
                            padding: 5px 0px 0px 0px;
                        }
                            .menu_sub > ul > li {
                                width:100%;
                                padding:5px 0px 5px 0px;
                                border-bottom:1px dashed #cccccc;
                            }
                            .menu_sub > ul > li:last-child{
                                border-bottom:0px;
                            }
                                .menu_sub > ul > li > a {
                                    font-size:12px;
                                    color:#000000;
                                }

        #membership_wrap{
            position:absolute;
            top:0px;
            right:0px;
        }
            #membership_wrap > ul{

            }
                #membership_wrap > ul > li {
                    display: inline-block;
                    color: #abc8f1;
                    text-align: center;
                    padding: 10px 12px 0px 12px;
                    font-weight: 400;
                    cursor: pointer;
                }
                    #membership_wrap > ul > li > a {
                        color: #e2eaf1;
                    }

    #myInfo {
        z-index:-1;
        position: relative;
        top: -5px;
        right: 0px;
        height: 38px;
        padding:7px 15px 0px 10px;
        font-size: 0px;
        text-align: right;
        background-color: #f5f5f5;
        border: 1px solid #cccccc;
        border-radius:5px;
    }
            #myInfo > div{
                display:inline-block;
                font-size:11px;
                padding:0px 5px 0px 5px;
            }
            #myName{
                font-weight:700;
            }
                #myInfo > div > span{
                    color:red;
                }

            .lv_tag_Layout {
                display: inline-block;
                background-repeat: no-repeat;
                background-position-y: center;
                background-position-x: center;
                height: 17px;
                width: 27px;
                position:relative;
                top:5px;
                margin-right:2px;
            }

            .lv_tag_11 {
                background: url('/Content/Images/Board/lv_11.svg');
            }

            .lv_tag_22 {
                background: url('/Content/Images/Board/lv_22.svg');
            }

            .lv_tag_44_1 {
                background: url('/Content/Images/Board/lv_44_1.svg');
            }

            .lv_tag_48 {
                background: url('/Content/Images/Board/lv_48.svg');
            }

            .lv_tag_88 {
                background: url('/Content/Images/Board/lv_88.svg');
            }

            .lv_tag_96 {
                background: url('/Content/Images/Board/lv_96.svg');
            }

            .lv_tag_192 {
                background: url('/Content/Images/Board/lv_192.svg');
            }





    #content{
        width:1000px;
        margin: 0 auto;
    }


    #footer_wraper{
        width:1000px;
        margin:0 auto;
        height:100px;
        position:relative;
    }
        #footer_logo {
            background: url('/Content/Images/Shared/logo_w.svg');
            background-repeat: no-repeat;
            background-position-y: center;
            background-position-x: center;
            width: 200px;
            height: 25px;
            margin-top: 22px;
            position:absolute;
            top:0px;
            left:0px;
        }
        #footer_coppyright{
            position:absolute;
            right:0px;
            top:20px;
            color:#ffffff;
            font-size:12px;
        }
}
/*#################################*/
/*######### PC 컴퓨터 -e ##########*/
/*#################################*/