.detail_info {
    box-sizing: border-box;
}

.detail_info .content_img {
    width:100%;
}

.page_banner {
    width:100%;
    height:142px;
    background-size:cover;
    border-bottom:1px solid #e6e6e6;
}

.page_banner_title {
    text-align:center;
    font-size:31px;
    font-family: 'NanumBarunGothicBold';
    color:#ffffff;
    padding-top:55px;
}



/* PC */
@media screen and (min-width:1201px) {

    .page_lnb_container {
        border-bottom: 1px solid #e6e6e6;
    }

    .page_lnb_container .container {
        height: 53px;
        overflow: hidden;
    }

    .page_lnb_container .container div {
        position: relative;
        padding: 0 18px;
        width: 140px;
        height: 53px;
        line-height: 53px;
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        background-repeat: no-repeat;
        background-image: url('/res/service/img/sub_common/opt_arr_category_down.png');
        background-position: 90% center;
        cursor: pointer;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
    }
    .page_lnb_container .container div.on {
        background-image: url('/res/service/img/sub_common/opt_arr_category_up.png');
    }

    .page_lnb_container .container div.home {
        border-left: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        width: 53px;
        background: none !important;
        padding: 0 !important;
    }

    .page_lnb_container .container div.bottom {
        margin-bottom: 50px;
    }

    .page_lnb_container .container div.home img {
        vertical-align: middle;
        margin: 0 0 0 14px;
    }

    .page_lnb_container .container div span.selected {
        color: #33599C;
        font-family: 'NanumGothicBold';
    }
    .page_lnb_container .container div select {
        position: absolute;
        left: 0;
        top: 0;
        width: 177px;
        height: 53px;
        opacity: 0;
        padding: 0;
        margin: 0;
        cursor: pointer;
    }

    .detail_info {
        padding: 40px 0;
    }

    .sub_lnb {
        margin: 40px 0;
        padding-top: 1px;
        padding-left: 1px;
        height: 53px;
        border-bottom: 1px solid #002f87;
        overflow: hidden;
    }
    .sub_lnb ul {
        height: 52px;
    }
    .sub_lnb ul li {
        font-size: 14px;
        width: 178px;
        height: 52px;
        line-height: 52px;
        background-color: #f8f8f8;
        border: 1px solid #d5d5d6;
        margin-left: -1px;
        margin-top: -1px;
        float: left;
        text-align: center;
        color: #808080;
        cursor: pointer;

    }
    .sub_lnb ul li.on {
        border: 1px solid #002f87;
        background-color: #002f87;
        color: #ffffff;
        margin-left: -1px;
        margin-top: -1px;
    }




    #site_map .site_map {
        margin-bottom: 70px;
    }

    #site_map .site_tit {
        padding-left: 30px;
        width: 105px;
        height: 32px;
        line-height: 32px;
        color: #ffffff;
        font-size: 17px;
        font-family: 'NanumGothicBold', dotum;
        background-image: url('/res/service/img/sub_common/img_titlebox.png');
        background-repeat: no-repeat;
        margin-bottom: 24px;
    }

    #site_map .sub_tit {
        color: #002f87;
        font-family: 'NanumGothicBold', dotum;
        font-size: 15px;
        margin-bottom: 10px;
        cursor: pointer;
    }
    #site_map .map_box {
        position: relative;
        overflow: hidden;
    }
    #site_map .map_box .line {
        display: inline-block;
        position: absolute;
        width: 1px;
        height: 500px;
        background-color: #ececec;
    }
    #site_map .map_box .line.no1 {
        left: 198px;
    }
    #site_map .map_box .line.no2 {
        left: 400px;
    }
    #site_map .map_box .line.no3 {
        left: 625px;
    }
    #site_map .map_box .line.no4 {
        left: 848px;
    }



    #site_map .map_item_wrapper {
        display:table;
        width:100%;
    }

    #site_map .map_item_container {
        display:table-row;
    }

    #site_map .map_item_child {
        display:table-cell;
        width: 20%;
        padding: 10px 0;
    }
    #site_map .map_item_child.last {
        border-right: none;
        margin-right: 0;
    }
    #site_map .map_item_child ul {
        margin-bottom: 50px;
    }
    #site_map .map_item_child ul li {
        width: 100%;
        height: 27px;
        line-height: 27px;
        font-size: 14px;
        cursor: pointer;
    }
}


/* Tablet */
@media screen and (min-width:768px) and (max-width:1200px) {

    .page_banner {
        height:144px;
    }

    .page_banner_title {
        padding-top:39px;
    }

    .detail_info {
        padding:40px;
    }

    .page_lnb_container {
        border-bottom: 1px solid #e6e6e6;
    }
    .page_lnb_container .container {
        height: 53px;
    }
    .page_lnb_container .container div {
        position: relative;
        padding: 0 18px;
        width: 144px;
        height: 53px;
        line-height: 53px;
        border-right: 1px solid #e6e6e6;
        background-repeat: no-repeat;
        background-image: url('/res/service/img/sub_common/opt_arr_category_down.png');
        background-position: 90% center;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        float: left;
        cursor: pointer;
    }
    .page_lnb_container .container div.on {
        background-image: url('/res/service/img/sub_common/opt_arr_category_up.png');
    }
    .page_lnb_container .container div.home {
        border-left: 1px solid #e6e6e6;
        width: 53px;
        background: none !important;
        padding: 0 !important;
    }
    .page_lnb_container .container div.home img {
        vertical-align: middle;
        margin: 0 0 0 14px;
    }
    .page_lnb_container .container div span.selected {
        color: #33599C;
        font-family: 'NanumGothicBold';
    }
    .page_lnb_container .container div select {
        position: absolute;
        left: 0;
        top: 0;
        width: 177px;
        height: 53px;
        opacity: 0;
        padding: 0;
        margin: 0;
        cursor: pointer;
    }
    .sub_lnb {
        margin: 40px 20px;
        padding-top: 1px;
        padding-left: 1px;
        height: 53px;
        border-bottom: 1px solid #002f87;
        overflow: hidden;
    }
    .sub_lnb ul {
        height: 52px;
    }
    .sub_lnb ul li {
        font-size: 14px;
        width: 16%;
        height: 52px;
        line-height: 52px;
        background-color: #f8f8f8;
        border: 1px solid #d5d5d6;
        margin-left: -1px;
        margin-top: -1px;
        float: left;
        text-align: center;
        color: #808080;
        cursor: pointer;
    }
    .sub_lnb ul li.on {
        border: 1px solid #002f87;
        background-color: #002f87;
        color: #ffffff;
        margin-left: -1px;
        margin-top: -1px;
    }

    #site_map .site_tit {
        position: relative;
        border-bottom: 1px solid #ececec;
        padding-left: 5%;
        width: 95%;
        height: 45px;
        line-height: 45px;
        font-size: 15px;
        font-family: 'NanumGothicBold', dotum;
        cursor: pointer;
    }
    #site_map .site_tit.on {
        padding-left: 5%;
        background-color: #002f87;
        color: #ffffff;
        background-image: url('/res/service/img/sub_common/img_titlebox.png');
        background-repeat: no-repeat;
        background-position: left center;
        background-size: auto 100%;
    }
    #site_map .site_tit span {
        position: absolute;
        left: 0;
        top: 22px;
        width: 17px;
        height: 1px;
        background-color: #4f5256;
    }

    #site_map .sub_tit {
        color: #002f87;
        font-family: 'NanumGothicBold', dotum;
        font-size: 15px;
        margin-bottom: 10px;
        cursor: pointer;
    }
    #site_map .map_box {
        position: relative;
        overflow: hidden;
        background-color: #f8f8f8;
    }
    #site_map .map_box .line {
        position: absolute;
        width: 1px;
        height: 1000px;
        background-color: #ececec;
    }
    #site_map .map_box .line.no1 {
        display: inline-block;
        left: 33%;
    }
    #site_map .map_box .line.no2 {
        display: inline-block;
        left: 66%;
    }
    #site_map .map_box .line.no3 {
        display: none;
    }
    #site_map .map_box .line.no4 {
        display: none;
    }
    #site_map .map_item {
        background-color: #f8f8f8;
    }
    #site_map .map_item_child {
        display: -ms-inline-grid;
        display: inline-grid;
        width: 26%;
        padding: 20px 3%;

    }
    #site_map .map_item_child.middle {
        border-right: none;
        margin-right: 0;
    }
    #site_map .map_item_child ul li {
        width: 100%;
        height: 27px;
        line-height: 27px;
        font-size: 14px;
        cursor: pointer;
    }
}



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

    .page_banner {
        height: 100px;
    }

    .page_banner_title {
        font-size: 24px;
        padding-top: 40px;
    }

    .detail_info {
        padding:20px;
    }

    .page_lnb_container .container div {
        position: relative;
        padding: 0 5%;
        width: 90%;
        height: 53px;
        line-height: 53px;
        border-bottom: 1px solid #e6e6e6;
        background-repeat: no-repeat;
        background-image: url('/res/service/img/sub_common/opt_arr_category_down.png');
        background-position: 95% center;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        cursor: pointer;
    }
    .page_lnb_container .container div.on {
        background-image: url('/res/service/img/sub_common/opt_arr_category_up.png');
    }
    .page_lnb_container .container div span.selected {
        color: #33599C;
        font-family: 'NanumGothicBold';
    }
    .page_lnb_container .container div select {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 53px;
        opacity: 0;
        padding: 0;
        margin: 0;
        cursor: pointer;
    }

    .sub_lnb_select {
        height: 44px;
        position:relative;
        box-sizing: border-box;
        background-color: #002f87;
        margin: 20px 20px 0;
    }
    .sub_lnb_select span {
        height: 44px;
        line-height: 44px;
        display: inline-block;
        color: #ffffff;
        font-size: 13px;
    }

    #site_map .site_tit {
        position: relative;
        border-bottom: 1px solid #ececec;
        padding-left: 5%;
        width: 95%;
        height: 36px;
        line-height: 36px;
        font-size: 15px;
        font-family: 'NanumGothicBold', dotum;
        cursor: pointer;
    }
    #site_map .site_tit.on {
        padding-left: 5%;
        background-color: #002f87;
        color: #ffffff;
        background-image: url('/res/service/img/sub_common/img_titlebox.png');
        background-repeat: no-repeat;
        background-position: left center;
        background-size: auto 100%;
    }
    #site_map .site_tit span {
        position: absolute;
        left: 0;
        top: 17px;
        width: 17px;
        height: 1px;
        background-color: #4f5256;
    }
    #site_map .sub_tit {
        color: #002f87;
        font-family: 'NanumGothicBold', dotum;
        font-size: 14px;
        margin-bottom: 10px;
        cursor: pointer;
    }
    #site_map .map_box {
        position: relative;
        overflow: hidden;
        background-color: #f8f8f8;
        border-bottom: 1px solid #ececec;
    }
    #site_map .map_box .line {
        position: absolute;
        width: 1px;
        height: 1000px;
        background-color: #ececec;
    }
    #site_map .map_box .line.no1 {
        display: inline-block;
        left: 50%;
    }
    #site_map .map_box .line.no2 {
        display: none;
    }
    #site_map .map_box .line.no3 {
        display: none;
    }
    #site_map .map_box .line.no4 {
        display: none;
    }
    #site_map .map_item_child {
        display: -ms-inline-grid;
        display: inline-grid;
        width: 39%;
        padding: 20px 5%;
    }
    #site_map .map_item_child.even {
        border-right: none;
        margin-right: 0;
    }
    #site_map .map_item_child ul li {
        width: 100%;
        line-height: 27px;
        cursor: pointer;
    }
}