/* Minification failed. Returning unminified contents.
(725,35): run-time error CSS1046: Expect comma, found '0'
(725,39): run-time error CSS1046: Expect comma, found '/'
(1337,29): run-time error CSS1046: Expect comma, found '253'
(1337,36): run-time error CSS1046: Expect comma, found ')'
(1338,41): run-time error CSS1046: Expect comma, found '77'
(1338,47): run-time error CSS1046: Expect comma, found '/'
(2150,36): run-time error CSS1046: Expect comma, found '0'
(2150,40): run-time error CSS1046: Expect comma, found '/'
(2927,35): run-time error CSS1046: Expect comma, found '0'
(2927,39): run-time error CSS1046: Expect comma, found '/'
(6682,45): run-time error CSS1046: Expect comma, found '0'
(6682,49): run-time error CSS1046: Expect comma, found '/'
(6863,35): run-time error CSS1046: Expect comma, found '0'
(6863,39): run-time error CSS1046: Expect comma, found '/'
 */
/* Minification failed. Returning unminified contents.
(151,174): run-time error CSS1046: Expect comma, found '0'
(151,178): run-time error CSS1046: Expect comma, found '/'
(432,146): run-time error CSS1046: Expect comma, found '0'
(432,150): run-time error CSS1046: Expect comma, found '/'
(593,35): run-time error CSS1046: Expect comma, found '0'
(593,39): run-time error CSS1046: Expect comma, found '/'
(2323,37): run-time error CSS1046: Expect comma, found '0'
(2323,41): run-time error CSS1046: Expect comma, found '/'
 */
@charset "UTF-8";

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, th, td, input, select, textarea, button {
    margin: 0;
    padding: 0
}

fieldset, img {
    border: 0 none
}

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

dl, ul, ol, menu, li {
    list-style: none
}

blockquote, q {
    quotes: none
}

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

input, textarea, button {
    border: 0 none;
    background-color: transparent;
    -webkit-appearance: none;
    vertical-align: top
}

select, button {
    cursor: pointer
}

select {
    border: 0 none;
    vertical-align: top
}

textarea {
    border: 1px solid #e0e0e0
}

input::-ms-clear {
    display: none
}

button span {
    position: relative
}

body, h1, h2, h3, h4, th, td, input, select, textarea, button {
    font-size: 12px;
    font-weight: 400;
    color: #000;
    line-height: 1.5;
    letter-spacing: -0.2px;
}

p, strong, em, span {
    letter-spacing: -0.2px
}
/* 170825 공통으로 추가 */
a {
    color: #000;
    text-decoration: none
}

button, a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    outline: 0;
}

img {
    vertical-align: top
}

address, caption, cite, code, dfn, em, var {
    font-style: normal;
    font-weight: normal
}

header, main, aside, article, footer {
    display: block
}

table {
    width: 100%;
    border-collapse: collapse
}

caption {
    display: block;
    height: 0px;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    margin-top: 0;
    color: transparent;
    visibility: hidden
}

* {
    font-family: 'Spoqa Han Sans Neo';
}

html, body {
    width: 100vw;
    overflow-x: hidden;
    overflow-y: auto;
}

.blind {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: auto;
    clip: rect(0,0,0,0);
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0
}

.of_h {
    overflow: hidden
}

.ta_r {
    text-align: right
}

.ta_c {
    text-align: center
}

.mg_auto {
    float: none !important;
    margin: 0 auto !important
}

.mg_0 {
    margin: 0 !important
}

.fw_bold {
    font-weight: bold
}

.color_ff0000 {
    color: #ff0000
}

.color_0068b7 {
    color: #0C17A2
}

.mt5 {
    margin-top: 5px
}

.mt10 {
    margin-top: 10px
}

.mt12 {
    margin-top: 12px
}

.mt15 {
    margin-top: 15px
}

.mt20 {
    margin-top: 20px
}

.mt30 {
    margin-top: 30px
}

.mt40 {
    margin-top: 40px
}

.mt50 {
    margin-top: 50px
}

.mt60 {
    margin-top: 60px
}

.mt70 {
    margin-top: 70px
}

.mt80 {
    margin-top: 80px
}

.mt90 {
    margin-top: 90px
}

.mb100 {
    margin-bottom: 100px
}

.mb650 {
    margin-bottom: 650px
}

.pt80 {
    padding-top: 80px
}

.pt90 {
    padding-top: 90px
}

.pb165 {
    padding-bottom: 165px
}

/* skip */
.skip {
    position: absolute;
    left: 0;
    top: -100px
}

    .skip:active, .skip:focus {
        top: 0;
        right: 0;
        z-index: 1000;
        background-color: #000;
        color: #fff;
        font-size: 18px;
        line-height: 3em;
        text-align: center
    }

/* form */
input[type="radio"],
input[type="checkbox"] {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    clip: rect(0,0,0,0);
    border: 0;
    vertical-align: top
}

.rdo_box {
    display: inline-block;
    position: relative;
    padding-left: 20px;
    margin-right: 25px;
}

    .rdo_box label {
        margin-left: 5px;
        font-size: 20px;
        color: #222;
        vertical-align: middle;
        cursor: pointer;
    }

        .rdo_box label:before {
            content: "";
            display: inline-block;
            position: absolute;
            left: 0;
            top: 50%;
            width: 18px;
            height: 18px;
            margin-top: -11px;
            border-radius: 100%;
            border: 1px solid #ccc;
            background: #fff
        }

    .rdo_box input[type="radio"]:checked + label:after {
        content: '';
        display: inline-block;
        position: absolute;
        left: 5px;
        top: 9px;
        width: 10px;
        height: 10px;
        border-radius: 100%;
        background-color: #333
    }

.year_subject_search .chk_box label {
    font-size: 20px;
    color: #222;
    vertical-align: middle;
    cursor: pointer;
}

    .year_subject_search .chk_box label:before {
        content: "";
        display: inline-block;
        position: absolute;
        left: 0;
        top: 50%;
        width: 14px;
        height: 14px;
        margin-top: -9px;
        border: 1px solid #ccc;
        background: #fff;
    }

.year_subject_search .chk_box input[type="checkbox"]:checked + label:after {
    content: '\2714';
    display: inline-block;
    position: absolute;
    left: 3px;
    top: 6px;
    font-size: 12px
}

.year_subject_search .chk_box.w60 {
    width: 60px
}

.year_subject_search .chk_box.hot label {
    color: #0C17A2
}

.sel_box {
    display: inline-block;
    position: relative;
    border: 1px solid #ccc;
    box-sizing: border-box;
    background-color: #fff;
    background-image: url(../images/common/select_arrow2.png);
    background-position: 100% 50%;
    background-repeat: no-repeat
}

    .sel_box label {
        position: absolute;
        left: 15px;
        top: 0;
        color: #666;
        font-size: 18px
    }

    .sel_box select {
        width: 100%;
        height: 100%;
        padding-left: 15px;
        background-color: transparent;
        outline: none;
        color: #666;
        font-size: 18px;
        vertical-align: top;
        opacity: 0;
        filter: alpha(opacity=0) /*IE 8*/;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none /* 네이티브 외형 감추기 */;
    }

/* button */
.btn_golist {
    position: absolute;
    bottom: 0;
    right: 0;
    display: inline-block;
    padding: 16px 37px 14px;
    border: 1px solid #000;
    color: #222;
    font-size: 18px
}

.btn_type01 {
    display: inline-block;
    padding: 16px 37px 14px;
    border: 1px solid #000;
    color: #222;
    font-size: 18px
}

.btn_more {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 10px;
    border: 1px solid #ccc;
    color: #666;
    font-size: 13px
}

.btn_type03 {
    width: 145px;
    margin-left: 10px;
    border: 1px solid #ccc;
    background: #f5f5f5;
    color: #333333;
    font-size: 14px;
    line-height: 38px
}

/* layout */
.wrap {
    min-width: 1200px
}

.main_container {
    overflow: hidden;
    min-width: 1200px;
    width: 100%;
    height: 818px;
    padding-top: 170px;
    background-image: url(../images/main/main_bg.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover
}

.container {
    padding: 70px 0 0px;
    min-height: calc(100vh - 170px);
}

    .container .inner {
        position: relative;
        min-width: 1000px;
        width: 1000px;
        margin: 0 auto;
    }

        .container .inner:after {
            display: block;
            clear: both;
        }

/** temp **/
/*서브페이지 타이틀*/
.tit_wrap {
    position: relative;
    height: 206px;
}

    .tit_wrap h2 { /* padding-top: 70px; */ /* font-family:"spoqa han sans"; */
        font-size: 30px;
        color: #000;
        font-weight: bold;
    }

    .tit_wrap p {
        padding-top: 5px;
        font-family: "spoqa han sans";
        font-size: 18px;
        color: #555;
    }

    .tit_wrap:after {
        position: absolute;
        left: 50%;
        bottom: -1px;
        margin-left: -100px;
        width: 200px;
        height: 3px;
        background: #4f89b7;
    }

    .tit_wrap.simple {
        border: none
    }

        .tit_wrap.simple:after {
            content: none
        }
/*탭*/
.tab_warp {
    margin-top: 60px
}

    .tab_warp .tab_list {
        border-bottom: 1px solid #d7d7d7
    }

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

        .tab_warp .tab_list li {
            float: left;
            width: 158px;
            height: 58px;
            line-height: 58px;
            border-top: 1px solid #d7d7d7;
            border-right: 1px solid #d7d7d7;
            background: #f7f7f7;
            color: #666;
            font-size: 20px;
            text-align: center
        }

            .tab_warp .tab_list li:first-child {
                border-left: 1px solid #d7d7d7
            }

            .tab_warp .tab_list li.active {
                position: relative;
            }

                .tab_warp .tab_list li.active a {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    padding-bottom: 1px;
                    background: #fff;
                }

            .tab_warp .tab_list li a {
                display: block
            }

            .tab_warp .tab_list li.active a {
                font-weight: bold;
                color: #0C17A2;
                font-size: 20px
            }
/*토탈*/
.total {
    font-size: 14px;
    width: 1000px;
    display: block;
    margin: auto;
    text-align: right;
}

    .total strong {
        font-weight: normal;
    }
/*페이징*/
.paging {
    height: 130px;
    margin-top: 60px;
    text-align: center;
}

    .paging a {
        display: inline-block;
        width: 36px;
        height: 26px;
        padding: 10px 0 0;
        color: #222;
        font-size: 18px;
        line-height: 17px;
        vertical-align: top;
        border: 1px solid #fff;
        background: #fff;
        border-radius: 9px;
        margin-right: 4px;
    }

        .paging a.on {
            color: #fff;
            border: 1px solid #0C17A2;
            text-decoration: none;
            background: #0C17A2;
        }

    .paging .btn {
        display: inline-block;
        width: 36px;
        height: 36px;
        vertical-align: top;
        *vertical-align: 12px
    }

        .paging .btn a {
            overflow: hidden;
            display: block;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            font-size: 0;
            line-height: 0;
            border: 0;
            background: url(../images/board/ico_paging.png) no-repeat;
            vertical-align: top;
        }

    .paging .first {
    }

        .paging .first a {
            background-position: 0 0;
        }

    .paging .prev {
        margin-right: 8px;
        margin-left: 3px;
    }

        .paging .prev a {
            background-position: -36px 0;
        }

    .paging .next {
        margin-left: 8px;
        margin-right: 3px;
    }

        .paging .next a {
            background: #fff;
            padding: 10px 0 0;
            font-size: 18px;
            line-height: 17px;
            height: 26px;
        }

    .paging .last {
    }

        .paging .last a {
            background-position: -108px 0;
        }

.paging_btn_section {
    position: relative;
}

    .paging_btn_section .pbs_btn {
        position: absolute;
        left: 0;
        top: -10px;
    }
/*검색*/
.search_list {
    position: absolute;
    right: 0;
    top: -50px;
    width: 270px;
    height: 27px;
    padding: 7px 37px 4px 14px;
    border-radius: 11px;
    background: #fff;
}


    .search_list input {
        border: none;
        width: 245px;
        font-family: "spoqa han sans";
        font-size: 15px;
        color: #222;
        focus: none;
        outline: none;
        height: 23px;
    }

    .search_list button {
        position: absolute;
        right: 0;
        top: -1px;
        width: 40px;
        height: 40px;
    }

        .search_list button img {
            vertical-align: middle;
        }

.search_sorting_list {
    position: relative;
    margin: 70px 0 30px;
    font-size: 0;
    text-align: center;
}

    .search_sorting_list .sel_box {
        width: 105px;
        height: 40px;
        margin-right: 9px;
        line-height: 40px;
        vertical-align: middle
    }

        .search_sorting_list .sel_box label,
        .search_sorting_list .sel_box select {
            font-size: 15px;
            color: #222
        }

.search_list {
    display: inline-block;
    zoom: 1;
    *display: inline;
    position: relative;
    left: 0;
    top: 0;
    width: 926px;
    padding-right: 60px;
    vertical-align: middle;
    box-shadow: 0px 1px 9px rgb(0 0 0 / 6%);
    box-sizing: content-box;
}

.search_sorting_list .search_list input {
    width: 100%;
}

.search_list_right {
    left: 255px;
    width: 671px;
}

.search_list_left {
    width: 671px;
}
/*etc*/
.comment {
    display: block;
    color: #666;
    font-size: 18px;
    word-break: keep-all
}
/*테이블*/
.table_list {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}

    .table_list table {
        width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
    }

    .table_list thead tr th {
        padding: 16px 0;
        border-bottom: 1px solid #d7d7d7;
        color: #000;
        font-family: "spoqa han sans";
        font-size: 18px;
        line-height: 23px;
        text-align: center;
        font-weight: normal;
        vertical-align: middle;
    }

    .table_list tbody tr td {
        padding: 16px 4px;
        border-bottom: 1px solid #d7d7d7;
        color: #666;
        font-family: "spoqa han sans";
        font-size: 18px;
        line-height: 23px;
        text-align: center;
        vertical-align: middle;
    }

    .table_list tbody tr .notice {
        color: #0C17A2;
        font-weight: bold;
    }

    .table_list .tit {
        padding-left: 10px;
        padding-right: 10px;
        text-align: left;
    }

        .table_list .tit a {
            display: block;
            overflow: hidden;
            height: 22px;
            color: #666;
            white-space: nowrap;
            text-overflow: ellipsis;
            text-align: left;
        }

    .table_list tbody tr:last-child td {
        border-bottom: none;
    }
/*댓글 review_write*/
.review_write {
    background: #efefef;
    padding: 60px 0;
    margin-top: 60px;
}

    .review_write textarea {
        margin-left: 80px;
        background: #fff;
        border: 1px solid #000;
        height: 54px;
        width: 868px;
        line-height: 22px;
        padding: 10px;
        font-family: "spoqa han sans";
        font-size: 14px;
        resize: none
    }

        .review_write textarea::placeholder {
            padding: 18px 0 0 20px;
            font-family: "spoqa han sans";
            font-size: 22px
        }

    .review_write a {
        display: inline-block;
        background: #0C17A2;
        width: 161px;
        height: 56px;
        margin-left: 8px;
        padding-top: 20px;
        color: #fff;
        font-family: "spoqa han sans";
        font-size: 22px;
        text-align: center;
    }
/*댓글 review_list*/
.review_wrap {
    padding-top: 55px;
}

    .review_wrap .review_total {
        font-family: "spoqa han sans";
        font-size: 20px;
        color: #222;
    }

        .review_wrap .review_total strong {
            color: #0C17A2;
            font-weight: normal;
        }

    .review_wrap .review_list {
        margin-top: 15px;
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
    }

        .review_wrap .review_list li {
            position: relative;
            padding: 20px 215px 20px 40px;
            border-bottom: 1px solid #d7d7d7;
        }

            .review_wrap .review_list li:last-child {
                border: none;
            }

            .review_wrap .review_list li p {
                font-family: "spoqa han sans";
                font-size: 18px;
                color: #222;
            }

            .review_wrap .review_list li span {
                font-family: "spoqa han sans";
                font-size: 17px;
                color: #333;
            }

            .review_wrap .review_list li em {
                display: block;
                padding-top: 5px;
                font-family: "spoqa han sans";
                font-size: 14px;
                color: #666;
            }

            .review_wrap .review_list li .btn {
                position: absolute;
                right: 37px;
                top: 50%;
                margin-top: -16px;
            }

                .review_wrap .review_list li .btn a {
                    margin-left: 5px;
                    display: inline-block;
                    text-align: center;
                    width: 58px;
                    line-height: 30px;
                    border: 1px solid #ccc;
                    font-family: "spoqa han sans";
                    font-size: 14px;
                    color: #333;
                }

/* header */
.header {
    position: fixed;
    z-index: 99999;
    width: 100%;
    height: 70px;
    background-color: #fff;
}
    /*z-index:100;*/
    .header .inner {
        position: relative;
        width: 100vw;
        margin: 0 auto;
        max-width: 1920px;
    }

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

    .header .utill_wrap {
        position: relative;
        background-color: #f5f5f8
    }

    .header .gnb_wrap .logo {
        position: absolute;
        top: 12px;
        right: 285px;
        width: 120px;
        z-index: 10;
    }

    .header .logo a {
        display: block
    }

        .header .logo a img {
            height: 50px;
        }

    .header .utill {
        position: absolute;
        right: 20px;
        top: 12px;
    }

        .header .utill:after { /* content:''; */
            display: block;
            clear: both;
        }

        .header .utill li {
            float: left;
            position: relative;
            margin-left: 16px;
            padding: 13px 0px 12px
        }

            .header .utill li:after { /* content:''; */
                position: absolute;
                left: -10px;
                top: 50%;
                width: 4px;
                height: 4px;
                margin-top: -2px;
                border-radius: 100%;
                background-color: #9a9b9c;
            }

            .header .utill li:first-child:after {
                content: none
            }

        .header .utill a {
            display: inline;
            position: relative;
            margin: 0 24px;
            font-family: "Spoqa Han Sans Neo",sans-serif;
            font-size: 16px;
            letter-spacing: -2px;
        }

    .header .gnb_wrap {
        position: relative;
        border-bottom: 1px solid #ddd;
        height: 70px;
    }

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

        .header .gnb_wrap:before {
            content: '';
            display: none
        }

        .header .gnb_wrap.on {
            border-bottom: 1px solid #bcbcbc
        }

            .header .gnb_wrap.on:after {
                content: '';
                display: block;
                position: absolute;
                left: 0;
                bottom: -300px;
                z-index: 100;
                width: 100%;
                height: 298px;
                border-bottom: 1px solid #bcbcbc;
                background-color: #fff;
            }

        .header .gnb_wrap .gnb {
            position: absolute;
            width: 1400px;
            height: 21px;
            top: 23px;
            left: 44px;
        }

            .header .gnb_wrap .gnb:after {
                content: '';
                display: block;
                clear: both
            }

            .header .gnb_wrap .gnb > li {
                float: left;
                position: relative;
            }

                .header .gnb_wrap .gnb > li > a {
                    display: inline;
                    position: relative;
                    margin: 0 40px;
                    font-family: "Spoqa Han Sans Neo",sans-serif;
                    font-size: 16px;
                    letter-spacing: -2px;
                }

                    .header .gnb_wrap .gnb > li > a i {
                        display: block;
                        width: 2px;
                        height: 4px;
                        margin: 20px auto -1px;
                        -webkit-transition: width 1s;
                        -moz-transition: width 1s;
                        -o-transition: width 1s;
                        transition: width 1s;
                        opacity: 0;
                        vertical-align: bottom;
                    }

                .header .gnb_wrap .gnb > li .sub_menu {
                    display: none;
                    position: absolute;
                    top: 40px;
                    left: 40px; /* right:19px; */
                    bottom: 0;
                    z-index: 100000;
                }

                    .header .gnb_wrap .gnb > li .sub_menu li:first-child a {
                        padding-top: 27px
                    }

                    .header .gnb_wrap .gnb > li .sub_menu a {
                        display: block;
                        position: relative;
                        padding-top: 11px;
                        font-family: "spoqa han sans",sans-serif;
                        color: #666;
                        font-size: 15px;
                        min-width: 135px;
                    }

    .header .btn_search_open {
        position: absolute;
        right: 0;
        top: 50%;
        z-index: 100;
        width: 23px;
        height: 22px;
        margin-top: -18px;
        background: url(../images/common/btn_search_open.png) no-repeat 0 0;
        text-indent: -9999px
    }

    .header .all_search_wrap {
        position: relative;
        min-width: 1200px;
        width: 1200px;
        margin: -125px auto 0
    }

        .header .all_search_wrap .all_search_area {
            display: none;
            position: relative;
            z-index: 200;
            width: 932px;
            height: 124px;
            margin-left: 268px;
            background-color: #fff
        }

            .header .all_search_wrap .all_search_area .btn_search_close {
                position: absolute;
                right: 0;
                top: 50%;
                width: 29px;
                height: 28px;
                margin-top: -14px;
                background: url(../images/common/btn_search_close.png) no-repeat 0 0;
                text-indent: -9999px
            }

            .header .all_search_wrap .all_search_area .all_search_box {
                position: absolute;
                right: 0;
                top: 37px;
                width: 928px;
                height: 52px
            }

                .header .all_search_wrap .all_search_area .all_search_box:after {
                    content: '';
                    display: block;
                    clear: both
                }

                .header .all_search_wrap .all_search_area .all_search_box .inr {
                    float: left;
                    position: relative;
                    width: 588px;
                    border: 2px solid #0C17A2
                }

                    .header .all_search_wrap .all_search_area .all_search_box .inr label {
                        position: absolute;
                        left: 28px;
                        top: 11px;
                        font-family: "spoqa han sans",sans-serif;
                        color: #777;
                        font-size: 18px
                    }

                    .header .all_search_wrap .all_search_area .all_search_box .inr input {
                        width: 100%;
                        height: 48px;
                        padding: 0 81px 0 27px;
                        box-sizing: border-box;
                        font-family: "spoqa han sans",sans-serif;
                        color: #777;
                        font-size: 18px;
                        line-height: 48px
                    }

                    .header .all_search_wrap .all_search_area .all_search_box .inr .btn_search {
                        position: absolute;
                        right: 0;
                        top: 0;
                        width: 54px;
                        height: 48px;
                        background: url(../images/common/btn_input_search.jpg) no-repeat 0 0;
                        text-indent: -9999px
                    }

                .header .all_search_wrap .all_search_area .all_search_box .btn_detail_search {
                    width: 57px;
                    height: 52px;
                    margin-left: 6px;
                    border: 1px solid #045999;
                    background-color: #fff;
                    font-family: "spoqa han sans",sans-serif;
                    color: #045999;
                    font-size: 14px;
                    line-height: 15px;
                    text-align: center
                }

/* footer */
.footer {
    height: 250px !important; /* padding:41px 0 42px; */ /* border-top:1px solid #d9d9d9; */
    background: #333;
}

    .footer .inner {
        position: relative;
        width: 1200px;
        margin: 0 auto;
        text-align: center
    }

    .footer .btn_top {
        position: absolute;
        top: -42px;
        right: 0;
        display: block;
        width: 60px;
        height: 60px;
        background: #0C17A2 url(../images/common/btn_top.png) no-repeat 14px 19px;
        text-indent: -9999px
    }

    .footer .info_menu {
        width: 450px;
        margin: 0 auto
    }

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

        .footer .info_menu li {
            float: left;
            position: relative;
            margin: 17px 0 17px 22px
        }

            .footer .info_menu li:first-child {
                margin-left: 0
            }

            .footer .info_menu li:after {
                content: '';
                position: absolute;
                left: -13px;
                top: 50%;
                width: 3px;
                height: 3px;
                border-radius: 100%;
                background-color: #c7c7c7
            }

            .footer .info_menu li:first-child:after {
                content: none
            }

        .footer .info_menu a {
            display: block;
            font-family: "spoqa han sans",sans-serif;
            color: #666;
            font-size: 15px
        }

    .footer .address {
        padding-top: 22px;
        text-align: center;
    }

        .footer .address span {
            display: inline-block;
            position: relative;
            margin-left: 26px;
            font-family: "spoqa han sans",sans-serif;
            color: #666;
            font-size: 15px
        }

            .footer .address span:first-child {
                margin-left: 0
            }

            .footer .address span:before {
                content: '';
                position: absolute;
                left: -16px;
                top: 50%;
                width: 1px;
                height: 13px;
                margin-top: -6px;
                background-color: #d4d4d4
            }

            .footer .address span:first-child:before {
                content: none
            }

    .footer .copyright {
        margin-top: 7px;
        font-family: "Verdana",sans-serif;
        color: #9f9f9f;
        font-size: 13px;
        font-weight: 200;
        text-align: center
    }

/* main */
.main_cont {
    width: 1200px;
    height: 100%;
    margin: 20px auto 0;
    text-align: center
}

    .main_cont .main_title {
        display: block;
        width: 615px;
        margin-left: 367px;
        font-family: "KoPub Batang",serif;
        font-weight: 300;
        font-size: 54px;
        letter-spacing: -8px;
        opacity: 0
    }

    .main_cont .search_box {
        position: relative;
        width: 873px;
        margin: 43px 0 0 0px;
        padding: 27px 83px 27px 44px;
        border-radius: 5px;
        background: rgb(253 253 253);
        box-shadow: 0px 3px 13px rgb(80 77 77 / 16%);
    }

        .main_cont .search_box label {
            position: absolute;
            left: 48px;
            top: 27px;
            font-family: "spoqa han sans",sans-serif;
            font-size: 22px;
            cursor: text;
            letter-spacing: -2px
        }

        .main_cont .search_box input {
            position: relative;
            width: 100%;
            border: none;
            box-sizing: border-box;
            font-family: "spoqa han sans",sans-serif;
            font-size: 22px;
            letter-spacing: -2px;
            outline: none;
        }

        .main_cont .search_box .btn_search {
            position: absolute;
            right: 39px;
            top: 15px;
            padding: 13px 10px;
            text-indent: -9999px
        }

            .main_cont .search_box .btn_search span {
                display: block;
                width: 29px;
                height: 28px;
                background: url(../images/main/ico_srh.png) no-repeat 0 0;
                text-indent: -9999px
            }

    .main_cont .btn_login {
        display: inline-block;
        margin-top: 32px;
        padding: 6px 33px;
        border-bottom: 1px solid #000;
        background: url(../images/main/spot.png) no-repeat 99% 100%;
        font-family: "spoqa han sans",sans-serif;
        font-size: 20px
    }

/* visual */
.visual {
    height: 198px;
    border-top: 1px solid #000;
    background: url(../images/common/sub_visual_bg_2.jpg) no-repeat 50% 50%;
    background-size: cover;
    text-indent: -9999px
}

/* location */
.location_area {
    height: 50px;
    border-top: 1px solid #cfcfcf;
    border-bottom: 1px solid #cfcfcf;
    background-color: #f7f7f7
}

    .location_area .inner {
        height: 100%
    }

    .location_area .btn_home {
        position: absolute;
        left: 0;
        top: -1px;
        z-index: 50;
        width: 52px;
        height: 52px;
        background: url(../images/common/ico_home.jpg) no-repeat 0 0;
        text-indent: -9999px
    }

    .location_area .btn_location_search {
        position: absolute;
        right: 0;
        top: -1px;
        z-index: 50;
        width: 52px;
        height: 52px;
        background: url(../images/common/btn_location_search.jpg) no-repeat 0 0;
        text-indent: -9999px
    }

    .location_area .location {
        position: absolute;
        left: 52px;
        top: 0
    }

        .location_area .location.on .location_list {
            display: block
        }

        .location_area .location .btn_location_open {
            width: 200px;
            border-right: 1px solid #cfcfcf;
            color: #555;
            font-family: "spoqa han sans",sans-serif;
            font-size: 18px;
            line-height: 50px;
            text-align: left;
            text-indent: 20px
        }

            .location_area .location .btn_location_open:after {
                content: '';
                position: absolute;
                right: 13px;
                top: 50%;
                width: 11px;
                height: 6px;
                margin-top: -3px;
                background: url(../images/common/arrow_location.png) no-repeat 0 0
            }

        .location_area .location .location_list {
            display: none;
            position: absolute;
            left: -1px;
            top: 50px;
            z-index: 50;
            width: 199px;
            border: 1px solid #cfcfcf
        }

            .location_area .location .location_list li {
                border-top: 1px solid #cfcfcf
            }

                .location_area .location .location_list li:first-child {
                    border-top: none
                }

            .location_area .location .location_list a {
                display: block;
                padding: 12px 0;
                background-color: #fff;
                color: #666;
                font-size: 14px;
                text-indent: 20px
            }

        .location_area .location + .location {
            width: 153px
        }

            .location_area .location + .location .btn_location_open {
                width: 100%
            }

            .location_area .location + .location .location_list {
                width: 152px
            }

/** 시요일 스쿨이란 **/
/* 시스쿨 소개 - p.intro_School */
/*공통*/
.tit_style02 {
    text-align: center
}

    .tit_style02 h2:before {
        content: '';
        display: block;
        position: absolute;
        top: -23px;
        left: 50%;
        width: 26px;
        height: 15px;
        margin-left: -13px;
        background: url(../images/sub/bull01.png) no-repeat
    }

    .tit_style02 h2 {
        position: relative;
        margin-top: 23px;
        font-family: "KoPubBatang_B";
        color: #010101;
        font-size: 48px
    }

    .tit_style02 p {
        font-family: "KoPubBatang_L";
        color: #4f89b7;
        font-size: 28px
    }
/*170928 수정->확인,추가하기*/
.intro_school_box.container {
    padding-bottom: 0
}

.intro_school_box .section01 {
    height: 563px;
    background: #fafafa
}

    .intro_school_box .section01 .cont_wrap {
        margin: 68px 0 0 127px
    }

    .intro_school_box .section01 .recommend_slider {
    }

        .intro_school_box .section01 .recommend_slider li {
        }

            .intro_school_box .section01 .recommend_slider li:after {
                content: '';
                display: block;
                clear: both
            }

            .intro_school_box .section01 .recommend_slider li div {
                float: left
            }

            .intro_school_box .section01 .recommend_slider li .img_wrap {
            }

            .intro_school_box .section01 .recommend_slider li .txt_wrap {
                max-width: 720px;
                margin-left: 45px;
                padding: 40px;
                border-radius: 10px;
                background: #fff
            }

                .intro_school_box .section01 .recommend_slider li .txt_wrap p {
                    color: #222;
                    font-size: 24px
                }

                .intro_school_box .section01 .recommend_slider li .txt_wrap span {
                    display: block;
                    margin-top: 7px;
                    color: #999;
                    font-size: 20px
                }

.recommend_slider .bx-controls {
    margin-top: 33px
}

.recommend_slider .bx-pager {
    text-align: center;
    margin-left: -127px
}

    .recommend_slider .bx-pager .bx-pager-item {
        display: inline-block;
        margin: 0 2px
    }

        .recommend_slider .bx-pager .bx-pager-item a {
            display: block;
            width: 12px;
            height: 12px;
            border: 2px solid #222;
            border-radius: 50%;
            background: #fafafa;
            text-indent: -9999px
        }

            .recommend_slider .bx-pager .bx-pager-item a.hover,
            .recommend_slider .bx-pager .bx-pager-item a.active {
                border: 3px solid #222;
                border-radius: 50%;
                background: #222;
                text-indent: -9999px
            }

.recommend_slider .bx-controls-direction {
    font-size: 0;
}

.intro_school_box .section02 {
    position: relative;
    height: 895px;
    background: url(../images/sub/bg_section02.jpg) no-repeat;
}

    .intro_school_box .section02 .cont_wrap {
        margin: 135px 0 0 135px
    }

        .intro_school_box .section02 .cont_wrap strong {
            color: #000;
            font-size: 55px;
            letter-spacing: -0.4px
        }

        .intro_school_box .section02 .cont_wrap p {
            color: #444;
            font-size: 28px;
            letter-spacing: -0.6px
        }

.intro_school_box .section03 {
    position: relative;
    height: 1095px
}

    .intro_school_box .section03 .inner {
        background: url(../images/sub/bg_section03.png) no-repeat;
        width: 1200px;
    }

    .intro_school_box .section03 .tit_style02 {
        padding-top: 130px
    }

    .intro_school_box .section03 .cont_wrap {
        position: relative
    }

        .intro_school_box .section03 .cont_wrap .functions_list {
            margin-top: 105px
        }

            .intro_school_box .section03 .cont_wrap .functions_list:after {
                content: '';
                display: block;
                clear: both
            }

            .intro_school_box .section03 .cont_wrap .functions_list li {
                float: left;
                width: 400px;
                margin-bottom: 90px
            }

            .intro_school_box .section03 .cont_wrap .functions_list li {
                height: 135px;
                background: url(../images/sub/func_list01.png) no-repeat;
                background-position: 100%
            }

                .intro_school_box .section03 .cont_wrap .functions_list li strong {
                    display: block;
                    padding-right: 140px;
                    color: #010101;
                    font-size: 26px;
                    text-align: right
                }

                .intro_school_box .section03 .cont_wrap .functions_list li p {
                    margin-top: 6px;
                    padding: 0 140px 0 30px;
                    color: #555;
                    font-size: 18px;
                    text-align: right;
                    word-break: keep-all
                }

                .intro_school_box .section03 .cont_wrap .functions_list li.func_r {
                    margin-left: 400px;
                    background-position: 0
                }

                    .intro_school_box .section03 .cont_wrap .functions_list li.func_r strong {
                        padding: 0 30px 0 140px;
                        text-align: left
                    }

                    .intro_school_box .section03 .cont_wrap .functions_list li.func_r p {
                        padding: 0 30px 0 140px;
                        text-align: left
                    }

                .intro_school_box .section03 .cont_wrap .functions_list li.short strong {
                    margin-top: 18px
                }


.intro_school_box .section04 {
    background: #f3f3f3
}

    .intro_school_box .section04 .cont_wrap {
        padding: 60px 0 120px
    }

.intro_school_box .section05 .cont_wrap {
    width: 920px;
    margin: 0 auto
}

.intro_school_box .section05 .table_wrap table {
    border-top: 1px solid #4f89b7
}

    .intro_school_box .section05 .table_wrap table th,
    .intro_school_box .section05 .table_wrap table td {
        border-bottom: 1px solid #cfcfcf;
        border-left: 1px solid #cfcfcf;
        padding: 20px 15px;
        text-align: center
    }

    .intro_school_box .section05 .table_wrap table th {
        font-weight: bold;
        color: #333;
        font-size: 18px
    }

    .intro_school_box .section05 .table_wrap table td {
        color: #666;
        font-size: 18px
    }

    .intro_school_box .section05 .table_wrap table tr td:first-child,
    .intro_school_box .section05 .table_wrap table tr th:first-child {
        border-left: none
    }

.intro_school_box .section06 {
    background: #f9f9f9
}

    .intro_school_box .section06 .input_wrap {
        padding: 85px 88px 0;
        font-size: 0
    }

        .intro_school_box .section06 .input_wrap .input_box:before {
            content: '';
            display: inline-block;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 1px;
            height: 13px;
            background: #000
        }

        .intro_school_box .section06 .input_wrap .input_box {
            display: inline-block;
            position: relative;
            margin-left: 21px;
            font-size: 0
        }

            .intro_school_box .section06 .input_wrap .input_box:after {
                content: '';
                display: inline-block;
                position: absolute;
                bottom: 0;
                right: 0;
                width: 1px;
                height: 13px;
                background: #000
            }

            .intro_school_box .section06 .input_wrap .input_box:first-child {
                margin-left: 0
            }

            .intro_school_box .section06 .input_wrap .input_box label {
                position: absolute;
                left: 15px;
                top: 7px;
                color: #666;
                font-size: 22px;
                letter-spacing: 0px;
                cursor: text
            }

        .intro_school_box .section06 .input_wrap input[type="text"] {
            position: relative;
            height: 48px;
            padding: 0 15px;
            border-bottom: 1px solid #000;
            font-size: 22px
        }

        .intro_school_box .section06 .input_wrap #iqName {
            width: 273px
        }

        .intro_school_box .section06 .input_wrap #iqSchool {
            width: 319px
        }

        .intro_school_box .section06 .input_wrap #iqTel {
            width: 300px
        }

        .intro_school_box .section06 .input_wrap .textarea_box {
            display: block;
            position: relative
        }

            .intro_school_box .section06 .input_wrap .textarea_box label {
                position: absolute;
                left: 15px;
                top: 62px;
                color: #666;
                font-size: 22px;
                letter-spacing: 0px;
                cursor: text
            }

        .intro_school_box .section06 .input_wrap textarea {
            position: relative;
            width: 992px;
            height: 179px;
            margin-top: 40px;
            padding: 21px 15px;
            border: 1px solid #000;
            font-size: 22px
        }

    .intro_school_box .section06 .btn_type05 {
        display: block;
        width: 220px;
        height: 60px;
        margin: 40px auto 0;
        border-radius: 32px;
        background: #222;
        color: #fff;
        font-size: 18px
    }


/*p공지사항 뷰 - p.intro_notice_view.html*/
.notice_view_box {
    margin-top: 70px
}

.notice_view {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    color: #222
}

    .notice_view .title_area {
        padding: 37px 130px;
        background: #f8f8f8
    }

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

        .notice_view .title_area strong {
            float: left;
            font-size: 24px
        }

        .notice_view .title_area .date {
            float: right;
            font-size: 18px
        }

    .notice_view .cont_area {
        padding: 60px 130px;
        border-top: 2px solid #d7d7d7;
        font-size: 18px
    }
/*p.이벤트게시판 리스트 - intro_event_list.html*/
.event_list {
    position: relative;
    padding-top: 40px;
}

    .event_list ul {
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
    }

        .event_list ul li {
            position: relative;
            padding: 20px 20px 20px 240px;
            border-bottom: 1px solid #d7d7d7;
        }

            .event_list ul li:last-child {
                border: none;
            }

            .event_list ul li img {
                position: absolute;
                left: 80px;
                top: 20px;
            }

            .event_list ul li dl {
                min-height: 100px
            }

                .event_list ul li dl dt {
                    font-family: "spoqa han sans";
                    font-size: 18px;
                    color: #222;
                    display: block;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                }

                .event_list ul li dl dd {
                    font-family: "spoqa han sans";
                }

                .event_list ul li dl .con {
                    padding-bottom: 5px;
                    font-size: 18px;
                    color: #555;
                }

                .event_list ul li dl .day {
                    font-size: 18px;
                    color: #555;
                }
/*p.이벤트게시판 뷰 - info_event_view.html*/
.event_view {
    position: relative;
    padding-top: 40px;
}

    .event_view .con {
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
        text-align: center;
        padding: 60px 0;
    }

    .event_view .btn_wrap {
        padding-top: 20px;
    }

        .event_view .btn_wrap a {
            display: inline-block;
            width: 138px;
            text-align: center;
            line-height: 58px;
            font-family: "spoqa han sans";
            font-size: 18px;
            border: 1px solid #000;
        }
/* 수능모의평가기출시 */
.cast_plot_box .select_quest {
    margin-top: 70px
}

.select_quest {
    margin-bottom: 20px;
}

    .select_quest .sub_inner {
        width: 980px;
    }

    .select_quest .inr {
        float: left;
        display: block;
        width: 50%;
        padding-left: 120px;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

        .select_quest .inr > strong {
            position: absolute;
            left: 0;
            top: 7px;
            font-size: 24px;
            vertical-align: middle;
        }

        .select_quest .inr:last-child {
            padding-left: 170px;
        }

            .select_quest .inr:last-child strong {
                left: 50px;
            }

    .select_quest .sel_box {
        width: 320px;
        height: 50px;
        line-height: 50px
    }

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

.term_search {
    background-color: #efefef;
    padding: 40px 0;
}

    .term_search .sub_inner {
        width: 980px;
    }

    .term_search .sel_box {
        width: 115px;
        height: 40px;
        line-height: 40px
    }

        .term_search .sel_box label {
            color: #222
        }

        .term_search .sel_box select {
            height: 40px;
            color: #222;
            line-height: 40px
        }

    .term_search em {
        display: inline-block;
        margin: 0 3px;
        font-size: 20px;
        color: #222;
        vertical-align: middle;
    }

.btn_area {
    text-align: center;
    margin-top: 40px
}

    .btn_area a {
        display: inline-block;
        height: 60px;
        line-height: 60px;
        padding: 0 72px;
        margin: 0 4px;
        font-size: 22px;
        color: #666;
        border: 1px solid #ccc;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

        .btn_area a.btn_blue {
            background-color: #0C17A2;
            border: 1px solid #0C17A2;
            color: #fff;
        }

        .btn_area a.btn_search {
            padding: 0 30px;
        }

            .btn_area a.btn_search:before {
                content: "";
                display: inline-block;
                margin-right: 10px;
                width: 19px;
                height: 24px;
                background: url(../images/theme/btn_icon.png);
                background-position: 0 -60px;
                vertical-align: middle;
            }

/** 교육과정별 시 **/
/*p.curriculun.html*/
.curriculum_box {
    margin-top: 70px
}

/** 교실에서 시 읽기 **/
/* 교실에서 시 읽기 메인 - p.read_main.html */
/*레이아웃*/
.read_main_box {
    background: #fff !important;
}

    .read_main_box .list_title {
        color: #666;
        font-size: 20px;
    }
/*170928 슬라이드*/
.read_slider_area {
    height: 678px;
    background: #f2f5f0;
}

.read_slider {
    width: 1200px;
    height: 498px;
    top: 80px !important;
}
/*171010 171013 -> 폰트사이즈 배율조정 */
.read_slider_area .read_slider li {
    width: 388px;
    height: 498px;
    border-radius: 15px;
    font-size: 12px;
    letter-spacing: -1px;
    box-shadow: 0px 6px 26px rgb(0 0 0 / 10%);
}
    /*슬라이더 폰트사이즈 배율기준점 20171013*/
    .read_slider_area .read_slider li .cont_box .title_area { /*height:80px;*/
        padding: 8.5% 9%;
        background: #fff
    }

        .read_slider_area .read_slider li .cont_box .title_area span {
            font-size: 150%;
        }

        .read_slider_area .read_slider li .cont_box .title_area p {
            font-size: 150%;
            overflow: hidden; /*display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;*/
            height: 27px;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    /*한줄 말줄처리 */ /*font-size:20px*/
    .read_slider_area .read_slider li .cont_box .cont_area {
        padding: 8.5% 9%;
    }

        .read_slider_area .read_slider li .cont_box .cont_area p {
            margin-bottom: 5.7%;
            font-weight: bold;
            color: #333;
            font-size: 20px;
            display: -webkit-box;
            -webkit-line-clamp: 4;
            -webkit-box-orient: vertical;
            text-overflow: ellipsis;
            overflow: hidden; /*display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis*/
            line-height: 30px;
            max-height: 140px;
        }
        /*font-size:28px*/ /*멀티라인체크는 개발단에서 해주세여*/
        .read_slider_area .read_slider li .cont_box .cont_area em {
            display: block;
            color: #333;
            font-size: 150%;
            position: absolute;
            bottom: 12%;
        }

        .read_slider_area .read_slider li .cont_box .cont_area .btn_more {
            display: inline-block;
            border: 1px solid #333;
            color: #222;
            font-size: 125%
        }

/*.read_slider_area .read_slider img{width:100%}*/

.read_slider_area .btn_arrow {
    position: absolute;
    top: 305px !important;
    z-index: 999999;
    width: 50px;
    height: 50px; /* display: none; */
}

    .read_slider_area .btn_arrow.left {
        left: -180px !important;
    }

    .read_slider_area .btn_arrow.right {
        right: -180px !important;
    }

    .search_area {
        padding-top: 20px;
        padding-bottom: 20px;
        background: #f2f5f0;
    }

/*테마별 시 목록*/
.theme_list_area {
    padding: 117px 0 124px;
}

    .theme_list_area .theme_list {
        margin-top: 37px;
    }

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

.theme_list li:nth-child(2n) {
    margin-right: 0;
}

.theme_list_area .theme_list li:nth-child(9) {
    margin: 25px 0 0 0
}

.theme_list li a {
    position: relative;
    display: block;
    height: 80px;
    background: linear-gradient(rgba(247, 247, 247, 0) 0%, #f7f7f7 100%);
}

    .theme_list li a span {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 490px;
        height: 80px;
        font-size: 20px;
        line-height: 30px;
        text-align: right;
        background: linear-gradient( to right, rgba(247, 247, 247, 0) 18%, #f7f7f7 60%);
        color: #333;
    }

    .theme_list li a em {
        font-weight: bold;
        line-height: 80px;
        padding-right: 30px;
        max-width: 280px;
        max-height: 80px;
        overflow: hidden;
        display: inline-block;
    }
/*태그 목록*/
.tag_list_area .tab_style02 {
    overflow: hidden;
    position: relative;
    height: 235px;
    border: 1px solid #d7d7d7
}

    .tag_list_area .tab_style02:after {
        content: '';
        display: block;
        clear: both
    }
    /*.tag_list_area .tab_style02 .tab_list{float:left;border-right:1px solid #d7d7d7}*/
    .tag_list_area .tab_style02 .tab_list {
        position: absolute;
        top: 0;
        left: 0;
        border-right: 1px solid #d7d7d7
    }

        .tag_list_area .tab_style02 .tab_list li {
            width: 198px;
            height: 58px;
            line-height: 58px;
            border-top: 1px solid #d7d7d7
        }

            .tag_list_area .tab_style02 .tab_list li:first-child {
                border-top: none
            }

            .tag_list_area .tab_style02 .tab_list li a {
                width: 100%;
                height: 100%;
                display: block;
                background: #f7f7f7;
                color: #666;
                font-size: 18px;
                text-align: center
            }

            .tag_list_area .tab_style02 .tab_list li.active a {
                position: relative;
                background: #0068b6;
                color: #fff;
                font-size: 20px
            }

                .tag_list_area .tab_style02 .tab_list li.active a:after {
                    content: '';
                    display: block;
                    position: absolute;
                    top: 50%;
                    right: -16px;
                    width: 0;
                    margin-top: -8px;
                    border-top: 8px solid transparent;
                    border-right: 8px solid transparent;
                    border-bottom: 8px solid transparent;
                    border-left: 8px solid #0068b6;
                }

    .tag_list_area .tab_style02 .tab_cont {
        display: none;
        position: absolute;
        top: 0;
        left: 198px;
        width: 700px;
        padding: 13px 150px
    }

        .tag_list_area .tab_style02 .tab_cont.active {
            display: block;
        }

        .tag_list_area .tab_style02 .tab_cont span {
            display: inline-block;
            width: 24.7%;
            margin: 20px 0
        }

            .tag_list_area .tab_style02 .tab_cont span a {
                display: block;
                color: #222;
                font-size: 20px
            }
/*청소년 시선 신간*/
.new_book_area {
    /* height: 748px; */
    padding: 117px 0 100px;
    background: #f2f5f0;
}

    .new_book_area .newbook_list {
        margin-top: 37px
    }

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

        .new_book_area .newbook_list li {
            float: left;
            width: 490px;
            margin-bottom: 50px;
            height: 200px;
        }

            .new_book_area .newbook_list li:after {
                content: '';
                display: block;
                clear: both
            }

            .new_book_area .newbook_list li a {
                display: block
            }

        .new_book_area .newbook_list .thumb_box {
            float: left;
        }

        .new_book_area .newbook_list .cont_box {
            float: left;
            width: 330px;
            padding-left: 20px;
        }

            .new_book_area .newbook_list .cont_box .title {
                font-weight: bold;
                color: #000;
                font-size: 17px;
                padding-bottom: 8px;
            }

            .new_book_area .newbook_list .cont_box .writer {
                display: block;
                margin-top: 2px;
                font-size: 14px;
            }

            .new_book_area .newbook_list .cont_box .info {
                width: 442px;
                height: 24px;
                margin-top: 11px;
                color: #222;
                font-size: 16px;
                font-weight: normal;
                word-break: keep-all;
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis
            }

            .new_book_area .newbook_list .cont_box .content {
                width: 442px;
                height: 72px;
                margin-top: 11px;
                font-weight: lighter;
                color: #666;
                font-size: 15px;
                line-height: 25px;
                word-break: keep-all;
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis
            }

/*p.오늘의 시 - read_today.html*/
.read_today_wrap .search_wrap {
    margin: 70px 0 20px;
    text-align: right
}

    .read_today_wrap .search_wrap .btn_all {
        display: inline-block;
        width: 118px;
        height: 38px;
        border: 1px solid #000;
        line-height: 38px;
        color: #222;
        font-size: 18px;
        text-align: center
    }

    .read_today_wrap .search_wrap .sel_box {
        width: 113px;
        height: 40px;
        margin-left: 9px;
        line-height: 40px
    }

    .read_today_wrap .search_wrap select {
        color: #222;
        font-size: 15px
    }

    .read_today_wrap .search_wrap label {
        color: #222;
        font-size: 15px
    }
/*p.테마별시 - theme.html*/
.tit_wrap + .theme_slider {
    margin-top: 70px
}

.theme_slider {
    background-color: #f5f5f5;
    padding: 65px 0 55px;
}

    .theme_slider .slide {
        text-align: center;
    }

        .theme_slider .slide img {
            width: 149px;
            height: 218px;
        }

        .theme_slider .slide strong {
            display: block;
            font-size: 20px;
            font-weight: bold;
            color: #000;
            margin: 35px 0 0px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .theme_slider .slide span {
            display: block;
            font-size: 18px;
            font-weight: normal;
            color: #0C17A2;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .theme_slider .bx-pager {
        display: none;
    }

    .theme_slider .bx-controls-direction {
        font-size: 0;
    }

        .theme_slider .bx-controls-direction .bx-prev {
            position: absolute;
            left: -90px;
            top: 50%;
            margin-top: -30px;
            width: 60px;
            height: 60px;
            background: url(../images/theme/btn_icon.png);
        }

        .theme_slider .bx-controls-direction .bx-next {
            position: absolute;
            right: -90px;
            top: 50%;
            margin-top: -30px;
            width: 60px;
            height: 60px;
            background: url(../images/theme/btn_icon.png);
            background-position: -60px 0;
        }

.theme_word {
    padding-top: 60px;
    padding-bottom: 60px;
}

    .theme_word .sub_inner {
        background: url(../images/theme/dot.png) repeat-y,url(../images/theme/dot.png) repeat-y,url(../images/theme/dot.png) repeat-y;
        background-position: 300px 0, 600px 0, 900px 0;
    }

    .theme_word dl {
        float: left;
        width: 25%;
    }

        .theme_word dl dt {
            text-align: center;
            height: 83px;
            margin: 0 auto 20px;
            position: relative;
        }

            .theme_word dl dt:before {
                content: "";
                display: block;
                position: absolute;
                left: 0;
                top: 0;
                z-index: 1;
                background: url(../images/theme/theme_word_mask.png);
            }

            .theme_word dl dt img {
                width: 100%;
            }

            .theme_word dl dt i {
                font-size: 30px;
                color: #333;
                position: absolute;
                left: 0;
                top: 0;
            }

                .theme_word dl dt i em {
                    display: table-cell;
                    font-weight: 600;
                    vertical-align: middle;
                }

        .theme_word dl dd {
            width: 1000px;
            padding: 0 0px;
            text-align: left;
        }

            .theme_word dl dd a {
                display: inline-block;
                font-size: 19px;
                color: #222;
                height: 38px;
                line-height: 40px;
                padding: 0 33px;
                margin: 0 9px 20px;
                border-radius: 7px;
                background-color: #fff;
            }

    .theme_word .sub_inner:after {
        content: '';
        display: block;
        clear: both
    }
/*p.청소년 시선 리스트 - read_youth_list.html*/
.youth_list {
    position: relative;
    padding-top: 90px;
}

    .youth_list .search_sorting_list {
        text-align: right;
        margin: 0;
        position: absolute;
        right: 0;
        top: 35px;
    }

    .youth_list .total {
        font-family: "spoqa han sans";
        font-size: 26px;
        padding-bottom: 20px;
    }

        .youth_list .total strong {
            color: #0C17A2;
            font-weight: normal;
        }

    .youth_list ul {
    }

        .youth_list ul li {
            position: relative;
            padding: 40px 20px 30px 170px;
        }

            .youth_list ul li:last-child {
                border: none;
            }

            .youth_list ul li img {
                position: absolute;
                left: 0px;
            }

            .youth_list ul li dl {
                min-height: 202px
            }

                .youth_list ul li dl dt {
                    font-size: 17px;
                    font-weight: 600;
                    color: #222;
                    padding-bottom: 20px;
                    display: block;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                }

                .youth_list ul li dl dd {
                    font-family: "spoqa han sans";
                }

                .youth_list ul li dl .name {
                    font-size: 14px;
                    padding-bottom: 27px;
                }

                .youth_list ul li dl .con {
                    height: 87px;
                    font-size: 14px;
                    color: #888;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-line-clamp: 4;
                    -webkit-box-orient: vertical;
                    text-overflow: ellipsis;
                }

                .youth_list ul li dl .info {
                    font-size: 18px;
                    color: #888;
                }

                    .youth_list ul li dl .info em {
                        font-size: 12px;
                        vertical-align: 2px;
                    }

                .youth_list ul li dl .book_info {
                    font-size: 14px;
                    color: #555;
                    padding-bottom: 10px;
                    word-break: break-all;
                }

                    .youth_list ul li dl .book_info em {
                        font-size: 12px;
                        color: #888;
                        vertical-align: 2px;
                    }
/*p.청소년 시선 상세 - read_youth_view.html*/
.youth_detail_box {
    padding-top: 22px;
}

.book_info_wrap {
    position: relative;
}

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

    .book_info_wrap > div {
        float: left
    }

    .book_info_wrap .info_box {
        margin-left: 40px;
        letter-spacing: -0.2px;
        max-width: 643px;
    }

        .book_info_wrap .info_box .exp {
            font-weight: bold;
            color: #666;
            font-size: 20px;
            line-height: 45px;
        }

        .book_info_wrap .info_box .title {
            display: block;
            font-weight: bold;
            color: #222;
            font-size: 30px;
            float: left;
            margin-right: 20px;
        }

        .book_info_wrap .info_box .author {
            display: block;
            margin-top: 8px;
            color: #222;
            font-size: 20px;
        }

        .book_info_wrap .info_box .info {
            display: block;
            color: #777;
            font-size: 14px;
            margin-top: 8px;
            line-height: 26px;
        }
/*.info_box .bookstore_list{width:504px;margin-top:34px}*/
.info_box .bookstore_list {
    float: right;
    position: absolute;
    top: 0px;
    right: 0;
}

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

    .info_box .bookstore_list li {
        width: 118px;
        margin: 0 0 17px 0;
    }

.book_cont_wrap {
    position: relative;
    padding: 102px 0;
}

    .book_cont_wrap .cont_title {
        margin: 54px 0 0px;
        font-size: 20px;
        font-weight: 500;
    }

        .book_cont_wrap .cont_title:first-child {
            margin-top: 0
        }

        .book_cont_wrap .cont_title + strong {
            font-weight: bold;
            color: #222;
            font-size: 24px
        }

        .book_cont_wrap .cont_title ~ p {
            margin-top: 20px;
            color: #666;
            font-size: 14px;
        }

        .book_cont_wrap .cont_title ~ em {
            display: block;
            margin-top: 30px;
            font-weight: bold;
            color: #666;
            font-size: 20px
        }

            .book_cont_wrap .cont_title ~ em.writer {
                color: #222;
                font-size: 14px;
            }

        .book_cont_wrap .cont_title ~ dl {
            color: #666;
            font-size: 18px
        }

        .book_cont_wrap .cont_title#writer_introduce ~ em {
            margin-top: 14px;
        }

        .book_cont_wrap .cont_title#writer_introduce ~ p {
            margin-top: 3px
        }

    .book_cont_wrap .cont_title2 {
        margin-top: 14px;
        color: #777;
        font-size: 14px;
    }


.today_list {
    padding-top: 50px;
}

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

    .today_list li {
        float: left;
        width: 280px;
        height: 380px;
        margin: 35px 0;
        text-align: center;
        border-radius: 15px;
        margin-right: 80px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
    }

        .today_list li a {
            background: #fff;
            position: relative;
            border-radius: 15px;
            display: block;
            overflow: hidden;
        }

        .today_list li .info_box {
            margin-top: 20px
        }

            .today_list li .info_box .title {
                font-weight: bold;
                color: #000;
                font-size: 20px
            }

            .today_list li .info_box .author {
                display: block;
                color: #0C17A2;
                font-size: 18px
            }

.sijak_list {
    padding-top: 42px;
}

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

.sijak_box {
    float: left;
    width: 235px;
    height: 381px;
    /* box-shadow: 0px 3px 6px rgb(0 0 0 / 10%); */
    margin-bottom: 60px;
    margin-right: 20px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0px 5px 6px rgb(0 0 0 / 10%);
}

    .sijak_box:nth-child(4n) {
        margin-right: 0;
    }

.sijak_list li a {
    display: block
}

.sijak_list li .info_box {
    margin-top: 20px
}

    .sijak_list li .info_box .title {
        font-weight: bold;
        color: #000;
        font-size: 20px
    }

    .sijak_list li .info_box .author {
        display: block;
        color: #0C17A2;
        font-size: 18px
    }

/*시인 정보 리스트 page - poet_info_list_B.html*/
.search_info_wrap {
    position: relative;
    padding-top: 35px;
}

    .search_info_wrap .total {
    }

    .search_info_wrap .search_sorting_list {
        text-align: right;
        margin: 0;
        position: absolute;
        top: 0;
        right: 0
    }

.index_wrap { /* margin:20px 0 10px; */ /* padding:40px 0; */ /* background:#efefef; */
    font-size: 0;
    text-align: center;
}

    .index_wrap.bottom {
        margin-top: 12px;
        padding: 0;
        background: none
    }

    .index_wrap a {
        display: inline-block;
        width: 28px;
        height: 28px;
        line-height: 28px;
        margin-left: 4px;
        border: 1px solid #ccc;
        background: #fff;
        color: #222;
        font-size: 16px;
    }

    .index_wrap .btn_wrap {
        display: table; /* margin-right:16px */
    }

        .index_wrap .btn_wrap a {
            width: 68px;
            margin: 0
        }

            .index_wrap .btn_wrap a.on {
                background: #0C17A2;
                border: 1px solid #0C17A2;
                color: #fff
            }

    .index_wrap span {
        display: none;
    }

        .index_wrap span.active {
            display: inline-block;
        }

        .index_wrap span a.on {
            border: 1px solid #0C17A2
        }

.list_wrap .index {
    color: #000;
    font-size: 20px;
    margin-bottom: 18px;
    display: block;
}

.list_wrap ul {
    margin-left: -20px;
}

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

    .list_wrap ul li {
        float: left;
        width: 235px;
        margin-left: 20px;
        margin-bottom: 50px;
        text-align: center;
    }

        .list_wrap ul li .author {
            display: block;
            margin-top: 20px;
            font-weight: 500;
            color: #222;
            font-size: 20px;
        }

    .list_wrap ul.poet_info_list li a img {
        height: 235px;
        border-radius: 9px;
    }

.list_wrap .view_list_li {
    padding: 20px 0;
    width: 450px;
    height: 58px;
    border-top: 1px solid #707070;
    position: relative;
    text-align: inherit;
    margin-bottom: auto;
    margin-left: 40px;
    padding-left: 10px;
}

    .list_wrap .view_list_li .ellipstext {
        display: inline-block;
        max-width: 80%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

/*시인 정보 리스트 page - poet_info_list_A.html*/
.poet_info_listA_wrap.container {
    padding-bottom: 45px
}

.poet_info_listA_wrap .index_wrap { /* text-align:left */
    position: absolute;
    top: 223px; /* display: none; */
    left: 50%;
    transform: translateX(-50%);
}

    .poet_info_listA_wrap .index_wrap .btn_wrap { /* margin-left:32px; */
        color: #222;
        font-size: 20px;
        text-align: center;
        width: 100%;
    }

        .poet_info_listA_wrap .index_wrap .btn_wrap a { /* width:43px; */
            height: 19px;
            line-height: 19px;
            border: none;
            border-left: 1px solid #dbdbdb;
            background: none;
            display: table-cell;
        }

            .poet_info_listA_wrap .index_wrap .btn_wrap a:first-child {
            }

            .poet_info_listA_wrap .index_wrap .btn_wrap a.on {
                font-weight: bold;
                color: #0C17A2
            }
/* 시인 정보 상세 page - poet_info_detail.html */
.poet_view_box {
    padding-top: 22px;
}

.poem_info_wrap {
    text-align: center;
}

    .poem_info_wrap .author {
        display: block;
        margin-top: 16px;
        font-family: "KoPubBatang_L";
        font-weight: bold;
        color: #222;
        font-size: 24px;
        text-align: center
    }

.poem_cont_wrap {
    position: relative;
    padding: 80px 0px 95px;
}

    .poem_cont_wrap .cont_title {
        margin: 70px 0 2px;
        font-weight: bold;
        font-size: 24px;
    }

        .poem_cont_wrap .cont_title:first-child {
            margin-top: 0
        }

        .poem_cont_wrap .cont_title + strong {
            font-weight: bold;
            color: #222;
            font-size: 24px
        }

        .poem_cont_wrap .cont_title ~ p {
            margin-top: 5px;
            color: #666;
            font-size: 18px
        }

        .poem_cont_wrap .cont_title ~ em {
            display: block;
            margin-top: 30px;
            font-weight: bold;
            color: #666;
            font-size: 20px
        }

            .poem_cont_wrap .cont_title ~ em.writer {
                color: #222;
                font-size: 20px
            }

        .poem_cont_wrap .cont_title ~ dl {
            color: #666;
            font-size: 18px
        }

    .poem_cont_wrap .book_list {
    }

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

        .poem_cont_wrap .book_list li {
            float: left;
            width: 25%;
            padding: 18px 0 30px;
            text-align: left;
        }

            .poem_cont_wrap .book_list li a {
                display: block
            }

            .poem_cont_wrap .book_list li .info_box {
                margin-top: 20px
            }

            .poem_cont_wrap .book_list li .title {
                display: block;
                margin-top: 15px;
                font-weight: bold;
                color: #000;
                font-size: 20px
            }

            .poem_cont_wrap .book_list li .info_box .author {
                display: block;
                color: #0C17A2;
                font-size: 18px
            }

/** **/
/* 교육과정별시 - info_curriculum_list*/
.location_area + .inner > .year_subject_search {
    margin-top: 70px
}

.year_subject_search div {
    margin-bottom: 20px;
}

    .year_subject_search div strong {
        display: inline-block;
        width: 90px;
        font-size: 20px;
        color: #222;
        vertical-align: middle;
    }

.year_subject_search .chk_box {
    display: inline-block;
    position: relative;
    padding-left: 25px;
    width: 105px;
}

.sort_list {
    margin-top: 40px
}

    .sort_list thead tr th.sort {
        cursor: pointer;
    }

        .sort_list thead tr th.sort:after {
            content: "";
            display: inline-block;
            width: 11px;
            height: 6px;
            margin-left: 5px;
            background: url(../images/theme/btn_icon.png);
            background-position: -21px -60px;
            vertical-align: middle;
        }

        .sort_list thead tr th.sort.on:after {
            background-position: -21px -66px;
            vertical-align: middle;
        }

    .sort_list .tit {
        position: relative;
    }

        .sort_list .tit .hint {
            display: none;
            position: absolute;
            left: 0;
            top: 65px;
            border: 1px solid #666;
            padding: 15px 20px;
            font-size: 18px;
            color: #666;
            background-color: #fff;
            z-index: 1;
        }

            .sort_list .tit .hint:before {
                content: "";
                display: block;
                position: absolute;
                left: 50%;
                top: -14px;
                margin-left: -13px;
                width: 26px;
                height: 14px;
                background: url(../images/theme/btn_icon.png);
                background-position: -36px -60px;
            }

            .sort_list .tit .hint strong {
                display: block;
                color: #222;
            }

/** 시스쿨의선택 **/
/* 시스쿨의선택 page - poemschool_choice.html */
.container.choice_poemschool_wrap {
    padding-bottom: 60px
}

.choice_poemschool_box {
    padding-top: 80px;
}

.masonboxafter {
    content: '';
    display: block;
    clear: both
}

.masonbox .item {
    margin-bottom: 40px;
}

.masonbox .item_y {
    margin-bottom: 40px;
    background: url(../../res/images/board/theme_y.png) no-repeat
}

.masonbox .item_b {
    margin-bottom: 40px;
    background: url(../../res/images/board/theme_b.png) no-repeat
}

.masonbox .item .list_box {
    width: 270px;
}
/*border:1px solid #ccc*/
.choice_poemschool_box .masonbox .item .info_box {
    padding: 20px 20px 25px 20px;
}

.masonbox .item .info_box .title {
    font-size: 17px;
    word-break: keep-all;
    display: block;
    height: 60px;
}
/*font-weight:bold;*/
.masonbox .item .info_box .preview {
    height: 65px;
    color: #222;
    font-size: 14px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

    .masonbox .item .info_box .preview.short {
        height: 48px;
        -webkit-line-clamp: 2;
    }

.masonbox .item .info_box span {
    display: block;
    margin-top: 10px;
    color: #666;
    font-size: 14px
}
/*p.시로읽자, 우리역사 - choice_history*/
.choice_history_box {
    margin-top: 80px
}

.history_view .title_area {
    position: relative;
    padding: 0px 0 22px;
}

    .history_view .title_area h3 {
        color: #222;
        font-size: 30px;
        font-weight: 500;
    }

    .history_view .title_area em {
        display: inline-block;
        margin-top: 3px;
        color: #333;
        font-size: 23px
    }

    .history_view .title_area .writing_info {
        margin-top: 20px;
        color: #777;
        font-size: 14px
    }

        .history_view .title_area .writing_info span {
            padding-right: 5px;
        }

            .history_view .title_area .writing_info span:before {
                content: '';
                display: inline-block;
                width: 1px;
                height: 10px;
                padding-left: 7px;
                background: url(../images/sub/bar_dbdbdb.gif) no-repeat
            }

            .history_view .title_area .writing_info span:first-child:before {
                content: none
            }

    .history_view .title_area .zoom {
        position: absolute;
        bottom: 22px;
        right: 0;
        font-size: 0
    }

        .history_view .title_area .zoom button {
            display: inline-block;
            width: 28px;
            height: 28px;
            border: 1px solid #d2d2d2;
            color: #333;
            font-size: 17px
        }

            .history_view .title_area .zoom button:first-child {
                border-right: none;
                color: #666;
                font-size: 12px
            }

/*.history_view .cont_area{padding:30px 0 50px;border-top:1px solid #dbdbdb;border-bottom:1px solid #dbdbdb}*/
.history_view .cont_area:after {
    content: '';
    display: block;
    clear: both
}

.history_view .cont_area > div {
    float: left;
    height: 749px;
    padding: 28px 0 50px;
    border-top: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
}

.history_view .cont_area .current_cont {
    width: 830px;
}

    .history_view .cont_area .current_cont p {
        color: #666;
        font-size: 18px;
        line-height: 1.75;
        word-break: keep-all
    }

    .history_view .cont_area .current_cont .video_wrap {
        margin: 27px 0
    }

    .history_view .cont_area .current_cont em {
        display: inline-block;
        margin: 20px 0 3px;
        font-weight: bold;
        color: #333;
        font-size: 18px
    }

.history_view .cont_area .other_cont {
    width: 830px;
    height: auto;
    border-bottom: none;
}

    .history_view .cont_area .other_cont h4 {
        font-weight: 500;
        font-size: 18px;
    }

    .history_view .cont_area .other_cont .list_box {
        width: 233px;
        height: 299px;
        margin-top: 28px;
        border: 1px solid #707070;
    }

        .history_view .cont_area .other_cont .list_box .img_box { /* height:220px; */ /* line-height:220px; */ /* background:#f6f6f6; */ /* text-align:center; */
        }

            .history_view .cont_area .other_cont .list_box .img_box img {
                vertical-align: middle
            }

        .history_view .cont_area .other_cont .list_box .info_box {
            text-overflow: ellipsis;
            overflow: hidden;
            padding: 20px 20px 25px 20px;
        }

            .history_view .cont_area .other_cont .list_box .info_box .title {
                font-weight: bold;
                font-size: 17px;
            }

            .history_view .cont_area .other_cont .list_box .info_box span {
                display: block;
                margin-top: 2px;
                color: #999;
                font-size: 14px
            }

.history_view .comment_area {
    position: relative;
    padding: 27px 0 35px;
    color: #666;
    font-size: 14px
}

    .history_view .comment_area em {
        padding-right: 5px
    }

        .history_view .comment_area em:before {
            content: '';
            display: inline-block;
            clear: both;
            width: 1px;
            height: 10px;
            padding-left: 7px;
            background: url(../images/sub/bar_dbdbdb.gif) no-repeat
        }

        .history_view .comment_area em:first-child:before {
            content: none
        }

    .history_view .comment_area p {
        padding-right: 350px
    }

    .history_view .comment_area .btn_wrap {
        position: absolute;
        top: 30px;
        right: 0;
        font-size: 0
    }

        .history_view .comment_area .btn_wrap a {
            margin-left: 10px
        }

/** 로그인 **/
/*p.로그인 - login.html*/
.login_wrap {
    width: 848px;
    height: 529px;
    background: #ffffffbb;
    filter: drop-shadow(0px 3px 22px rgba(0, 0, 0, 0.08));
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 48%;
    border-radius: 23px;
    overflow: hidden;
}

    .login_wrap:after { /* content:''; */
        display: block;
        clear: both;
    }

    .login_wrap h3 {
        color: #333;
        font-size: 30px;
        font-weight: bold;
    }

    .login_wrap > div {
        width: 424px;
        float: right;
        padding: 87px 60px 0;
        background: #fff;
        min-height: 530px;
    }

        .login_wrap > div:first-child {
            float: left;
            padding: 200px 60px 0;
            background: none;
        }

    .login_wrap .for_student {
        position: relative
    }

        .login_wrap .for_student:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 1px;
            height: 520px;
        }
    /*background:#ccc*/
    .login_wrap .input_area {
        margin-top: 46px;
    }

    .login_wrap .input_box {
        position: relative
    }

        .login_wrap .input_box input[type="text"],
        .login_wrap .input_box input[type="password"] {
            margin-top: 20px;
            font-size: 16px;
            width: 292px;
            height: 40px;
            background: #f0f0f0;
            padding-left: 10px;
            outline: none;
        }

        .login_wrap .input_box label {
            position: absolute;
            top: 24px;
            left: 15px;
            color: #999;
            font-size: 18px
        }

.btn_type04 {
    width: 302px;
    height: 50px;
    margin-top: 55px;
    background: #0C17A2;
    color: #fff;
    border-radius: 8px;
    font-size: 18px;
    box-shadow: 0px 3px 6px rgba(12, 23, 162, 0.48);
}

.btn_login_area .check_box input {
    position: relative;
    width: 22px;
    height: 22px;
    border: 1px solid #ccc
}

.btn_login_area .check_box {
    position: relative;
    margin-top: 10px;
    color: #666;
    font-size: 18px;
    letter-spacing: 0
}

    .btn_login_area .check_box #remember:checked:after {
        content: '\2714';
        position: absolute;
        top: 2px;
        left: 6px
    }

    .btn_login_area .check_box .forget_pw {
        position: absolute;
        right: 0;
        top: 0
    }

        .btn_login_area .check_box .forget_pw a {
            color: #666;
            font-size: 18px;
            letter-spacing: 0
        }

.btn_join_area .btn_join {
    width: 498px;
    height: 58px;
    margin-top: 48px;
    border: 1px solid #0C17A2;
    color: #0C17A2;
    font-size: 22px
}

.comment {
    display: block;
    color: #666;
    font-size: 18px;
    word-break: keep-all
}
/*p.회원가입완료 - login_join_comp.html*/
.join_comp_wrap .tit_wrap h1 {
    position: relative;
    display: inline-block;
    padding-top: 0;
    margin-top: 70px
}

    .join_comp_wrap .tit_wrap h1:before {
        content: '';
        position: absolute;
        top: -2px;
        left: -27px;
        width: 27px;
        height: 18px;
        background: url(../images/sub/join_comp_dec01.gif) no-repeat
    }

    .join_comp_wrap .tit_wrap h1:after {
        content: '';
        position: absolute;
        top: -2px;
        right: -27px;
        width: 27px;
        height: 18px;
        background: url(../images/sub/join_comp_dec02.gif) no-repeat
    }

.join_comp {
    margin-top: 13px;
    border: 1px solid #d7d7d7;
    text-align: center
}

    .join_comp > div {
        margin: 0 139px
    }

    .join_comp .cont01 {
        height: 495px;
        background: url(../images/sub/join_comp_img01.png) no-repeat 50% 100px
    }

    .join_comp .cont02 {
        height: 590px;
        border-top: 1px solid #d7d7d7;
        background: url(../images/sub/join_comp_img02.png) no-repeat 50% 100px
    }

    .join_comp strong {
        display: block;
        padding-top: 277px;
        color: #151515;
        font-size: 28px
    }

    .join_comp p {
        margin-top: 12px; /*padding-bottom:93px;*/
        color: #666;
        font-size: 22px;
        line-height: 1.636363
    }

.btn_type02 {
    font-size: 0;
    text-align: center
}

    .btn_type02 a {
        display: inline-block;
        width: 408px;
        height: 58px;
        line-height: 58px;
        border: 1px solid #0C17A2;
        font-size: 22px
    }

.btn_type02_1 {
    margin-right: 10px
}

.btn_type02_2 {
    background: #0C17A2;
    ;
    color: #fff
}

/** 가입 **/
/*가입 - 공통*/
.join_common_box .inner {
    margin: 80px auto 373px;
    padding: 40px 0 80px;
    border: 1px solid #dcdcdc
}

.join_agree_wrap, .join_input_wrap {
    width: 830px;
    margin: 0 auto
}

.join_progress {
    margin: 0 auto 50px;
    border: 1px solid #dcdcdc
}

.progress_list {
    width: 100%;
    height: 58px;
    line-height: 58px;
    background: #f9f9f9;
    color: #666;
    font-size: 18px;
    text-align: center;
    letter-spacing: 0.5px
}

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

    .progress_list li {
        position: relative;
        float: left;
        width: 50%
    }

        .progress_list li.current {
            background: #0C17A2;
            color: #fff
        }

        .progress_list li span {
            margin-left: 16px
        }
/*회원가입 이용약관동의 - p.join_agree*/
.join_agree_wrap .chk_box {
    position: relative
}

    .join_agree_wrap .chk_box input:checked + label:after {
        content: '\2714';
        position: absolute;
        top: -3px;
        left: 6px
    }

    .join_agree_wrap .chk_box label:before {
        content: "";
        display: inline-block;
        position: absolute;
        left: 0;
        top: 50%;
        width: 22px;
        height: 22px;
        margin-top: -12px;
        border: 1px solid #ccc;
        background: #fff;
    }

    .join_agree_wrap .chk_box label {
        position: relative;
        padding-left: 31px;
        color: #666;
        font-size: 18px;
        letter-spacing: 0
    }

.join_agree_wrap .term_box {
    overflow-y: scroll;
    height: 367px;
    padding: 25px 30px 20px;
    border: 1px solid #d7d7d7;
    color: #666;
    font-size: 14px;
    line-height: 1.85714
}

    .join_agree_wrap .term_box h2 {
        margin-bottom: 15px;
        color: #000;
        font-size: 18px
    }

    .join_agree_wrap .term_box p {
        margin-bottom: 25px
    }

.join_agree_wrap .btn_wrap a {
    display: inline-block;
    width: 408px;
    height: 58px
}

.join_agree_wrap .progress_list li:first-child:before {
    content: '';
    display: inline-block;
    width: 27px;
    height: 34px;
    background: url(../images/sub/join_progress01_on.png) no-repeat;
    vertical-align: middle
}

.join_agree_wrap .progress_list li:first-child:after {
    content: '';
    position: absolute;
    top: 0;
    right: -56px;
    display: inline-block;
    border-top: 29px solid transparent;
    border-right: 28px solid transparent;
    border-bottom: 29px solid transparent;
    border-left: 28px solid #0C17A2
}

.join_agree_wrap .progress_list li:last-child:before {
    content: '';
    display: inline-block;
    width: 36px;
    height: 32px;
    background: url(../images/sub/join_progress02.png) no-repeat;
    vertical-align: middle
}
/*가입정보 입력 -p.join_input*/
.join_input_wrap .progress_list li:first-child:before {
    content: '';
    display: inline-block;
    width: 27px;
    height: 34px;
    background: url(../images/sub/join_progress01.png) no-repeat;
    vertical-align: middle
}

.join_input_wrap .progress_list li:first-child:after {
    content: '';
    position: absolute;
    z-index: 9;
    top: 0;
    right: -56px;
    display: inline-block;
    border-top: 29px solid transparent;
    border-right: 28px solid transparent;
    border-bottom: 29px solid transparent;
    border-left: 28px solid #f9f9f9
}

.join_input_wrap .progress_list li:last-child:before {
    content: '';
    display: inline-block;
    width: 36px;
    height: 32px;
    background: url(../images/sub/join_progress02_on.png) no-repeat;
    vertical-align: middle
}

.input_table_wrap {
    padding-top: 26px
}

    .input_table_wrap em {
        display: block;
        margin-bottom: 5px;
        font-size: 18px
    }

    .input_table_wrap .star_txt {
        display: block;
        padding-bottom: 15px;
        color: #333;
        font-size: 14px;
        text-align: right
    }

        .input_table_wrap .star_txt em {
            display: inline-block;
            margin-right: 4px;
            color: #e32c63;
            vertical-align: middle;
            *display: inline;
            zoom: 1
        }

    .input_table_wrap .input_table {
        border-top: 1px solid #000
    }

.input_table input[type="text"] {
    width: 648px;
    padding: 0 15px;
    height: 38px;
    line-height: 38px;
    border: 1px solid #d9d9d9;
    font-size: 18px
}

.input_table input[type="number"] {
    width: 648px;
    padding: 0 15px;
    height: 38px;
    line-height: 38px;
    border: 1px solid #d9d9d9;
    font-size: 18px
}

.input_table input[type="password"] {
    width: 648px;
    padding: 0 15px;
    height: 38px;
    line-height: 38px;
    border: 1px solid #d9d9d9;
    font-size: 18px
}

.input_table caption {
    padding-bottom: 15px;
    font-weight: 600;
    font-size: 22px;
    text-align: left
}

.input_table th {
    border-bottom: 1px solid #d7d7d7;
    background: #fafafa;
    text-align: left;
    color: #222;
    font-size: 16px;
    text-indent: 20px
}

.input_table td {
    border-bottom: 1px solid #d7d7d7;
    color: #666;
    font-size: 14px
}

.input_table .td_box {
    padding: 10px;
    text-align: left;
    font-size: 0
}

    .input_table .td_box .td_box_row {
        position: relative
    }

    .input_table .td_box span {
        display: inline-block;
        font-size: 15px
    }

.input_table input[type="text"].ip_email1 {
    width: 158px
}

.input_table input[type="text"].ip_email2 {
    width: 268px
}

.input_table input[type="text"].ip_school {
    width: 493px
}

.input_table input[type="text"].ip_tel {
    width: 128px
}

    .input_table input[type="text"].ip_tel + span {
        width: 22px;
        height: 44px;
        line-height: 44px;
        text-align: center
    }

.input_table input[type="text"].ip_tel_confirm {
    width: 493px
}

    .input_table input[type="text"].ip_tel_confirm + label {
        position: absolute;
        top: 8px;
        left: 16px;
        color: #999;
        font-size: 18px;
        cursor: text;
    }

.input_table .td_box span.mark_at {
    width: 35px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 18px
}

.input_table input[type="number"].ip_tel {
    width: 128px
}

    .input_table input[type="number"].ip_tel + span {
        width: 22px;
        height: 44px;
        line-height: 44px;
        text-align: center
    }

.input_table .rdo_box {
    display: inline-block;
    position: relative;
    padding: 8px 0 8px 20px;
    margin-right: 25px;
}

    .input_table .rdo_box label {
        margin-left: 11px;
        font-size: 18px;
        color: #222;
        vertical-align: middle;
        cursor: pointer;
    }

        .input_table .rdo_box label:before {
            content: "";
            display: inline-block;
            position: absolute;
            left: 0;
            top: 50%;
            width: 24px;
            height: 24px;
            margin-top: -11px;
            border-radius: 100%;
            border: 1px solid #ccc;
            background: #fff
        }

    .input_table .rdo_box input[type="radio"]:checked + label:after {
        content: '';
        display: inline-block;
        position: absolute;
        left: 7px;
        top: 16px;
        width: 12px;
        height: 12px;
        border-radius: 100%;
        background-color: #333
    }

.input_table .chk_box {
    position: relative
}

    .input_table .chk_box input:checked + label:after {
        content: '\2714';
        position: absolute;
        top: -3px;
        left: 6px
    }

    .input_table .chk_box label:before {
        content: "";
        display: inline-block;
        position: absolute;
        left: 0;
        top: 50%;
        width: 22px;
        height: 22px;
        margin-top: -12px;
        border: 1px solid #ccc;
        background: #fff;
    }

    .input_table .chk_box input[type="checkbox"]:checked + label:after {
        content: '\2714';
        display: inline-block;
        position: absolute;
        left: 8px;
        top: 1px;
        font-size: 12px
    }

    .input_table .chk_box label {
        position: relative;
        padding-left: 31px;
        color: #666;
        font-size: 18px;
        letter-spacing: 0;
        cursor: pointer
    }

.input_table .btn_type03 {
    font-size: 18px
}

/** 고객 센터 **/
/*이용약관 - p.cs_terms.html */
.terms_box {
}

    .terms_box h2 {
        padding: 64px 0 13px;
        font-family: "spoqa han sans";
        font-size: 24px
    }

    .terms_box .inr_box {
        padding: 8px 38px 60px;
        /* border: 1px solid #d7d7d7; */
        background: #fff;
    }

    .terms_box .terms_list {
        color: #222;
        font-size: 16px;
        line-height: 26px;
    }

        .terms_box .terms_list .chapter {
            display: block;
            margin-top: 30px;
            font-weight: 800;
            font-size: 24px;
        }

        .terms_box .terms_list em {
            display: block;
            margin-top: 10px;
            font-weight: bold;
            line-height: 49px;
            font-size: 18px;
        }

        .terms_box .terms_list p {
        }

        .terms_box .terms_list .indent_list {
            margin-left: 20px
        }

            .terms_box .terms_list .indent_list .indent2_list {
                margin-left: 20px
            }

    .terms_box .comment {
        display: block;
        margin-top: 50px;
        color: #222;
        font-size: 16px;
    }
/*개인정보보호정책 - p.cs_policy.html*/
/* 개인정보취급방침 */
.policy_wrap {
}

    .policy_wrap h2 {
        padding: 64px 0 13px;
        font-family: "spoqa han sans";
        font-size: 24px
    }

    .policy_wrap .inr_box {
        padding: 38px;
        /* border: 1px solid #d7d7d7; */
        background: #fff;
        /* border-radius: 8px; */
    }

    .policy_wrap p.text1 {
        font-family: "spoqa han sans";
        color: #222;
        font-size: 16px;
        line-height: 26px;
    }

    .policy_wrap ol.ol_list {
    }

        .policy_wrap ol.ol_list li {
            font-family: "spoqa han sans";
            color: #222;
            font-size: 16px;
            line-height: 26px;
        }

        .policy_wrap ol.ol_list > li {
            margin-top: 35px
        }

            .policy_wrap ol.ol_list > li:first-child {
                margin-top: 0
            }

            .policy_wrap ol.ol_list > li > strong {
                font-size: 18px;
                line-height: 49px;
            }

            .policy_wrap ol.ol_list > li > ol {
                padding-left: 29px
            }

        .policy_wrap ol.ol_list p.text2 {
            padding-left: 48px
        }

        .policy_wrap ol.ol_list > li > ol > li p.text2 + ol {
            padding-left: 73px
        }

            .policy_wrap ol.ol_list > li > ol > li p.text2 + ol + p.text2 {
                margin-top: 18px
            }

            .policy_wrap ol.ol_list > li > ol > li p.text2 + ol + p.text2 {
                margin-top: 18px
            }

        .policy_wrap ol.ol_list > li > ol ul {
            padding-left: 24px
        }

            .policy_wrap ol.ol_list > li > ol ul > li {
                position: relative
            }

            .policy_wrap ol.ol_list > li > ol ul.bul01 > li:before {
                content: '';
                display: inline-block;
                position: absolute;
                top: 8px;
                left: 6px;
                width: 4px;
                height: 4px;
                margin-top: 2px;
                background: #222;
                border-radius: 100%
            }

    .policy_wrap p.text_list + ol {
        margin-top: 51px
    }

    .policy_wrap .comment {
        display: inline-block;
        color: #222;
        font-size: 18px
    }

.privacy_table_wrap {
    margin-top: 41px
}

    .privacy_table_wrap table {
        border-top: 2px solid #333;
        border-bottom: 2px solid #333
    }

        .privacy_table_wrap table th {
            padding: 14px 0;
            border-left: 1px solid #555;
            background-color: #f2f2f2;
            font-family: "spoqa han sans";
            font-weight: 500;
            color: #222;
            font-size: 18px;
            text-align: center
        }

            .privacy_table_wrap table th:first-child {
                border-left: none
            }

        .privacy_table_wrap table td {
            padding: 14px 25px;
            border-top: 1px solid #555;
            border-left: 1px solid #555;
            font-family: "spoqa han sans";
            font-weight: 300;
            color: #222;
            font-size: 18px
        }

            .privacy_table_wrap table td:first-child {
                border-left: none
            }

            .privacy_table_wrap table td.text_center {
                text-align: center
            }
/*문의하기 - p.cs_inquiry.html*/
.inquiry_box {
}

    .inquiry_box .input_wrap {
        padding: 85px 0 0;
        font-size: 0;
    }

        .inquiry_box .input_wrap .input_box:before { /* content:''; */
            display: inline-block;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 1px;
            height: 13px;
            background: #000;
        }

        .inquiry_box .input_wrap .input_box {
            display: inline-block;
            position: relative;
            margin-left: 21px;
            font-size: 0
        }

            .inquiry_box .input_wrap .input_box:after { /* content:''; */
                display: inline-block;
                position: absolute;
                bottom: 0;
                right: 0;
                width: 1px;
                height: 13px;
                background: #000;
            }

            .inquiry_box .input_wrap .input_box:first-child {
                margin-left: 0
            }

            .inquiry_box .input_wrap .input_box label {
                position: absolute;
                left: 15px;
                top: 7px;
                color: #666;
                font-size: 22px;
                letter-spacing: 0px;
                cursor: text
            }

        .inquiry_box .input_wrap input[type="text"], input[type="email"] {
            position: relative;
            height: 48px;
            padding: 0 15px;
            border-radius: 8px;
            width: 202px;
            font-size: 16px;
            background: #fff;
            border: 1px solid #e0e0e0;
        }

        .inquiry_box .input_wrap #iqName {
            width: 273px
        }

        .inquiry_box .input_wrap #iqSchool {
            width: 319px
        }

        .inquiry_box .input_wrap #iqTel {
            width: 300px
        }

        .inquiry_box .input_wrap .textarea_box {
            display: block;
            position: relative
        }

            .inquiry_box .input_wrap .textarea_box label {
                position: absolute;
                left: 15px;
                top: 62px;
                color: #666;
                font-size: 22px;
                letter-spacing: 0px;
                cursor: text
            }

        .inquiry_box .input_wrap textarea {
            position: relative;
            width: 1000px;
            height: 258px;
            margin-top: 40px;
            padding: 21px 15px;
            font-size: 16px;
            box-sizing: border-box;
            background: #fff;
            border-radius: 8px;
        }

.btn_type05 {
    display: block;
    width: 220px;
    height: 60px;
    margin: 40px auto 0;
    background: #222;
    color: #fff;
    font-size: 18px
}

/** layer popup **/
.layer_popup {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1000;
    width: 100%
}

    .layer_popup .dim {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.6
    }

    .layer_popup .pop_wrap {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2000;
        width: 501px;
        margin-left: -281px;
        padding: 30px 30px 130px;
        background-color: #fff
    }

        .layer_popup .pop_wrap .pop_title {
            display: block;
            padding-bottom: 20px;
            border-bottom: 1px solid #000;
            font-family: "spoqa han sans";
            font-weight: 400;
            font-size: 28px;
            letter-spacing: -2px
        }

        .layer_popup .pop_wrap .btn_wrap {
            position: absolute;
            bottom: 40px;
            left: 0;
            width: 100%;
            text-align: center
        }

            .layer_popup .pop_wrap .btn_wrap .btn_confirm {
                width: 150px;
                height: 50px;
                background-color: #0C17A2;
                color: #fff;
                font-size: 18px;
                line-height: 50px
            }

            .layer_popup .pop_wrap .btn_wrap .btn_cancel {
                width: 180px;
                height: 50px;
                border: 1px solid #0C17A2;
                background-color: #fff;
                color: #0C17A2;
                font-size: 18px;
                line-height: 50px
            }

            .layer_popup .pop_wrap .btn_wrap .btn_send {
                width: 180px;
                height: 50px;
                margin-left: 7px;
                background-color: #0C17A2;
                color: #fff;
                font-size: 18px;
                line-height: 50px
            }

        .layer_popup .pop_wrap .info_list li {
            position: relative;
            margin-top: 6px;
            padding-left: 9px;
            color: #666;
            font-size: 14px;
            line-height: 23px
        }

            .layer_popup .pop_wrap .info_list li:before {
                content: '';
                position: absolute;
                left: 0;
                top: 7px;
                width: 3px;
                height: 3px;
                border-radius: 100%;
                background-color: #666
            }
/* 아이디 확인 */
.pop_id_confirm p {
    padding-top: 35px;
    font-family: "spoqa han sans";
    font-size: 26px;
    text-align: center
}
/* 비밀번호 재설정 */
.pop_pw_re .input_box {
    position: relative
}

    .pop_pw_re .input_box input[type="text"] {
        position: relative;
        width: 100%;
        height: 48px;
        margin-top: 10px;
        padding: 0 15px;
        border: 1px solid #ccc;
        font-family: "spoqa han sans";
        font-size: 18px;
        box-sizing: border-box
    }

    .pop_pw_re .input_box input[type="password"] {
        position: relative;
        width: 100%;
        height: 48px;
        margin-top: 10px;
        padding: 0 15px;
        border: 1px solid #ccc;
        font-family: "spoqa han sans";
        font-size: 18px;
        box-sizing: border-box
    }

    .pop_pw_re .input_box label {
        position: absolute;
        top: 24px;
        left: 16px;
        font-family: "spoqa han sans";
        color: #999;
        font-size: 18px
    }

    .pop_pw_re .input_box + .info_list {
        margin-top: 11px
    }

/*** 시보기 ***/
/** 표지 p.see_cover.html **/
.see_box {
    background: #efefef
}
/*.see_inner{height:100%;padding:0 50px 0 30px;}*/

.see_header {
    height: 78px;
    padding: 0 24px;
    background: #333;
    position: fixed;
    z-index: 2;
    width: 100vw;
    box-shadow: 0px 0px 7px #d3d3d3;
    top: 0;
}

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

    .see_header .see_logo {
        float: left;
        margin-top: 23px
    }

    .see_header .see_util {
        float: right;
        margin-top: 20px
    }

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

        .see_header .see_util li {
            float: left
        }

            .see_header .see_util li a {
                display: block;
                padding: 10px 20px;
                color: #fff;
                font-size: 14px
            }

.see_container {
    position: relative;
    background: #efefef
}

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

    .see_container .see_side_area {
        position: fixed;
        top: 78px;
        left: 0;
        width: 320px;
        background: #fff;
        box-shadow: 0px 0px 7px #d3d3d3;
        height: calc(100vh - 78px);
        overflow: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

        .see_container .see_side_area::-webkit-scrollbar {
            display: none;
        }

        .see_container .see_side_area .info_box {
            padding: 30px
        }

            .see_container .see_side_area .info_box:after {
                content: '';
                display: block;
                clear: both
            }

            .see_container .see_side_area .info_box > div {
                float: left
            }

            .see_container .see_side_area .info_box .img_wrap {
            }

            .see_container .see_side_area .info_box .text_wrap {
                margin-left: 18px;
                color: #666;
                font-size: 15px
            }

                .see_container .see_side_area .info_box .text_wrap .title {
                    max-width: 160px;
                    margin-bottom: 45px;
                    font-weight: bold;
                    color: #333;
                    font-size: 20px
                }

                .see_container .see_side_area .info_box .text_wrap .author {
                    display: block;
                    max-width: 160px
                }

                .see_container .see_side_area .info_box .text_wrap .publisher {
                    display: block;
                    max-width: 160px
                }

        .see_container .see_side_area .menu_list {
            padding-bottom: 124px;
            border-top: 1px solid #ccc
        }

            .see_container .see_side_area .menu_list > li > a {
                display: block;
                padding: 20px 30px;
                font-weight: bold;
                color: #333;
                font-size: 20px
            }

            .see_container .see_side_area .menu_list > li.active > a {
                background: #b3b3b3;
                color: #fff
            }

            .see_container .see_side_area .menu_list .sub_list {
            }

                .see_container .see_side_area .menu_list .sub_list li a {
                    display: block;
                    padding: 20px 60px
                }

                .see_container .see_side_area .menu_list .sub_list li.active a {
                    background: #b3b3b3;
                }

                .see_container .see_side_area .menu_list .sub_list li a {
                    color: #666;
                    font-size: 18px
                }

    .see_container .see_view_area {
        padding-left: 320px
    }

        .see_container .see_view_area .info_box {
            padding: 15px 30px;
            border-bottom: 1px solid #e1e1e1;
            background: #f7f7f7;
            display: none;
        }

            .see_container .see_view_area .info_box:after {
                content: '';
                display: block;
                clear: both
            }

            .see_container .see_view_area .info_box .btn_wrap {
                float: left
            }

            .see_container .see_view_area .info_box .info_menu_list {
                float: right
            }

                .see_container .see_view_area .info_box .info_menu_list:after {
                    content: '';
                    display: block;
                    clear: both
                }

                .see_container .see_view_area .info_box .info_menu_list > li {
                    float: left
                }

                    .see_container .see_view_area .info_box .info_menu_list > li a {
                        display: block;
                        padding: 13px 20px;
                        font-size: 18px
                    }

        .see_container .see_view_area .cont_box {
        }

            .see_container .see_view_area .cont_box .img_wrap {
                padding-top: 303px;
                text-align: center
            }

.btn_type06 {
    display: block;
    width: 150px;
    height: 50px;
    line-height: 50px;
    padding: 0 32px;
    background: #0C17A2;
    text-align: center
}

    .btn_type06 a {
        display: block;
        color: #fff;
        font-size: 18px
    }
/** 시보기 공통 **/
.see_container .see_view_area .cont_box .paper_inner {
    max-width: 1080px;
    height: auto;
    margin: 150px auto;
    padding: 100px 60px 60px;
    background: #fff;
}

    .see_container .see_view_area .cont_box .paper_inner .title_wrap {
        padding-bottom: 23px;
        border-bottom: 1px solid #dbdbdb
    }

    .see_container .see_view_area .cont_box .paper_inner .contents_wrap {
        padding: 27px 0
    }

        .see_container .see_view_area .cont_box .paper_inner .contents_wrap.simple {
            padding: 0
        }
    /** 저자소개 p.see_author.html **/
    .see_container .see_view_area .cont_box .paper_inner .title_wrap .title {
        font-family: "KoPubBatang_M";
        color: #222;
        font-size: 40px
    }

.see_container .see_view_area .cont_box.author_box .paper_inner .title_wrap .writer {
    display: block;
    font-family: "KoPubBatang_L";
    color: #666;
    font-size: 22px
}

    .see_container .see_view_area .cont_box.author_box .paper_inner .title_wrap .writer em {
        color: #333
    }

        .see_container .see_view_area .cont_box.author_box .paper_inner .title_wrap .writer em:before {
            content: '';
            display: inline-block;
            width: 1px;
            height: 17px;
            margin-right: 6px;
            background: #dbdbdb
        }

.see_container .see_view_area .cont_box.author_box .paper_inner .contents_wrap p {
    font-family: "KoPubBatang_L";
    color: #666;
    font-size: 22px;
    line-height: 1.875;
    word-break: keep-all
}

.see_container .see_view_area .cont_box.author_box .paper_inner .contents_wrap .source {
}
/** 목차 p.see_index.html **/
.see_container .see_view_area .cont_box.index_box .paper_inner .contents_wrap {
    font-family: "KoPubBatang_M"
}

    .see_container .see_view_area .cont_box.index_box .paper_inner .contents_wrap .comment {
        margin-top: 18px;
        color: #333;
        font-size: 24px
    }

    .see_container .see_view_area .cont_box.index_box .paper_inner .contents_wrap .anthology_tit {
        display: block;
        margin-top: 30px;
        font-weight: normal;
        color: #333;
        font-size: 22px
    }

    .see_container .see_view_area .cont_box.index_box .paper_inner .contents_wrap .anthology_list {
        padding-bottom: 10px;
        font-family: "KoPubBatang_L";
        color: #666;
        font-size: 22px
    }

        .see_container .see_view_area .cont_box.index_box .paper_inner .contents_wrap .anthology_list li {
            margin: 10px 0
        }
/** 목차뷰 p.see_view.html **/
.see_container .see_view_area .cont_box.view_box .paper_inner .contents_wrap .poem_tit {
    font-family: "KoPubBatang_L";
    color: #000;
    font-size: 36px
}

.see_container .see_view_area .cont_box.view_box .paper_inner .contents_wrap .poem_body {
    margin-top: 88px;
    font-family: "KoPubBatang_L";
    color: #333;
    font-size: 22px;
    line-height: 1.7
}

/*사이트맵*/
.layer_popup {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1000;
    width: 100%
}

    .layer_popup .dim {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.6
    }

    .layer_popup .pop_wrap02 {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2000;
        width: 1200px;
        margin-left: -600px; /*padding:30px 30px 130px;*/
        background-color: #fff
    }

        .layer_popup .pop_wrap02 .site_list {
            padding: 45px 60px 76px;
            box-sizing: border-box
        }

            .layer_popup .pop_wrap02 .site_list > li {
                position: relative;
                width: 257px; /*height:74px;line-height:74px;*/
                margin-top: 45px; /*padding-left:10px;*/
                padding: 18px 0 18px 10px;
                border-top: 2px solid #0069b7;
                color: #0069b7;
                font-size: 26px;
                letter-spacing: 0.4px
            }

                .layer_popup .pop_wrap02 .site_list > li > .depth2_list {
                    position: absolute;
                    top: -2px;
                    left: 296px;
                    width: 755px; /*height:74px;line-height:74px;padding-left:18px;*/
                    padding: 24px 0 24px 18px;
                    border-top: 2px solid #d8d8d8
                }

                    .layer_popup .pop_wrap02 .site_list > li > .depth2_list:after {
                        content: '';
                        display: block;
                        clear: both
                    }

                    .layer_popup .pop_wrap02 .site_list > li > .depth2_list li {
                        position: relative
                    }

                        .layer_popup .pop_wrap02 .site_list > li > .depth2_list li:before {
                            content: '';
                            position: absolute;
                            top: 50%;
                            left: 0;
                            width: 5px;
                            height: 5px;
                            margin-top: -3px;
                            border-radius: 50%;
                            background: #333
                        }

                    .layer_popup .pop_wrap02 .site_list > li > .depth2_list li {
                        float: left;
                        margin: 0 0 10px 62px;
                        padding-left: 8px;
                        color: #333;
                        font-size: 18px
                    }

                        .layer_popup .pop_wrap02 .site_list > li > .depth2_list li:first-child {
                            margin-left: 0
                        }

        .layer_popup .pop_wrap02 .btn_sitemap_close {
            position: absolute;
            right: 0;
            top: -45px;
            width: 33px;
            height: 33px;
            background: url(../images/common/btn_sitemap_close.png) no-repeat 0 0;
            text-indent: -9999px
        }

/*추가*/
.btn_more {
    background: url(../images/board/btn_more.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.btn_more_today {
    width: 35px;
    height: 30px;
    border: 1px solid #333;
    padding: 10px 5px 0 5px;
    display: inline-block;
    margin-top: 4px;
}

.btn_collapse {
    background: url(../images/board/btn_collapse.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.btn_base {
    width: 150px;
    padding: 4px 0;
    background: #0C17A2;
    font-size: 18px;
    font-weight: 400;
    color: #fff;
    line-height: 50px;
    text-align: center;
    vertical-align: middle;
}



.like_off {
    background: url(../images/common/like_off.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.like_on {
    background: url(../images/common/like_on.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.scrape_off {
    background: url(../images/common/scrape_off.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.like_on {
    background: url(../images/common/like_on.png) no-repeat 0 0;
    width: 30px;
    height: 30px;
    border: none;
}

.sitemap {
    width: 1000px;
    margin: auto;
    height: 470px;
    padding: 87px 0 100px;
}

    .sitemap div {
        width: 150px;
        height: 340px;
        float: left;
        margin-right: 20px;
    }

    .sitemap strong {
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        color: #666;
        margin-bottom: 20px;
        display: block;
    }

    .sitemap span {
        font-weight: 300;
        font-size: 16px;
        line-height: 32px;
        text-align: left;
        display: block;
    }

    .sitemap div:nth-child(6) {
        margin-right: 0;
    }

    .sitemap div:nth-child(n+7) {
        height: 130px;
    }

.new_book_area .newbook_list li:nth-child(2n-1) {
    margin-right: 20px;
}



.tit_wrap .inner {
    padding-top: 46px;
}

.tit_wrap h3 {
    font-size: 14px;
    font-weight: bold;
}

.poet_info_listA_wrap .index_wrap .btn_wrap a:last-child {
    /* display: none; */
    border-right: 1px solid #dbdbdb;
}

.poet_info_listA_wrap .content {
    background: #f7f7f7;
}

.tit_wrap .inner {
    padding-top: 46px;
}

.tit_wrap h3 {
    font-size: 14px;
    font-weight: bold;
}

.poet_info_listA_wrap .index_wrap .btn_wrap a:last-child {
    /* display: none; */
    border-right: 1px solid #dbdbdb;
}

.list_wrap {
    margin-top: 78px;
}

.contents {
    background: #f7f7f7;
    min-height: 70vh;
}

.choice_poemschool_box li img {
    width: 235px;
    transform: translate(-1px, -1px);
}

.choice_poemschool_box .masonbox {
    display: inline-block
}

    .choice_poemschool_box .masonbox .item {
        width: 233px;
        border: 1px solid #707070;
        left: 0px;
        top: 0px;
        float: left;
        margin-right: 20px;
    }

        .choice_poemschool_box .masonbox .item:nth-child(4n) {
            margin-right: 0px;
        }

    .choice_poemschool_box .masonbox .list_box {
        width: 235px;
        /*height: 354px;*/
        height: auto;
    }

.today_list .cont_box {
    height: 380px;
    text-align: left;
}

    .today_list .cont_box > div:first-child {
        padding: 20px;
        height: 50px;
        color: #fff;
        font-size: 17px;
    }

    .today_list .cont_box .cont_area {
        font-size: 16px;
        padding: 20px;
    }

        .today_list .cont_box .cont_area p:nth-child(1) {
            font-weight: 500;
            line-height: 1.8;
        }

        .today_list .cont_box .cont_area p:nth-child(2) {
            position: absolute;
            bottom: 50px;
        }

.theme_contents .inner {
    display: block;
}

.theme_contents .masonbox {
    display: inline-block;
}

.theme_list {
    display: inline-block;
}

    .theme_list li {
        background: linear-gradient(rgba(247, 247, 247, 0) 0%, #f7f7f7 100%);
        float: left;
        width: 490px;
        margin-right: 20px;
        margin-bottom: 20px;
        border-radius: 8px;
        overflow: hidden;
        height: 80px;
    }

        .theme_list li:nth-child(2n) {
            margin-right: 0;
        }

.theme_contents {
    padding-top: 85px;
    background: #efefef;
}

    .theme_contents .theme_list li:nth-child(6n) {
        margin-bottom: 48px;
    }

ul.view_list_ul {
    width: 660px;
    margin-left: 340px;
    /* margin: 0; */
}

li.view_list_li {
    padding: 20px 0;
    height: 58px;
    border-top: 1px solid #707070;
    position: relative;
}

.subcontent_title {
    font-size: 20px;
    display: block;
    margin-bottom: 5px;
}

span.content_title {
    font-size: 14px;
    color: #707070;
}

li.view_list_li:last-child {
    border-bottom: 1px solid #707070;
}

.view_list_box {
    padding: 22px 0 80px;
}

.gobacklink {
    margin-bottom: 64px;
    display: inline-block;
    font-size: 14px;
}

.book_info_wrap > div.img_box {
    box-sizing: border-box;
}

.info_box .bookstore_list li:last-child {
    margin: 0;
}

.book_cont_wrap .cont_title2 a {
    color: #333;
    height: 38px;
    display: block;
    font-size: 16px;
    line-height: 38px;
}



.newbtn_base {
    width: 160px;
    margin-right: 15px;
    height: 50px;
    font-size: 18px;
    padding: 2px;
    border-radius: 7px;
    background: #0C17A2;
    box-shadow: 0px 3px 6px rgba(12, 23, 162, 0.48);
    line-height: 47px;
}

button#friend {
}

.newbtn_base2 {
    background: #F7F7F7;
    border: 1px solid rgba(12, 23, 162, 0.24);
    box-shadow: 0px 3px 6px rgba(12, 23, 162, 0.29);
    width: 160px;
    margin-right: 15px;
    height: 50px;
    font-size: 18px;
    padding: 2px;
    border-radius: 7px;
    color: #0C17A2;
    line-height: 47px;
    box-sizing: border-box;
    display: block;
}

.today_list li:nth-child(3n) {
    margin-right: 0;
}

.playbtn {
    display: block;
    float: right;
    margin-top: -23px;
    margin-right: 20px;
}

.history_view {
    width: 830px;
    background: #fff;
    padding: 55px 85px;
}

.poet_view_box .poem_info_wrap img {
    border-radius: 14px;
    width: 235px;
    height: 235px;
}

.sijaknav {
    width: 1000px;
    height: 70px;
    margin: auto;
    padding: 51px 0 50px;
    background: none;
    line-height: 53px;
    font-size: 20px;
    color: #333;
}

    .sijaknav li {
        width: 490px;
        height: 53px;
        border-radius: 15px;
        background: #fff;
        color: #333;
        box-sizing: border-box;
    }

        .sijaknav li.current {
            background: #fff;
            color: #333;
            z-index: 2;
            line-height: 52px;
            border: 1px solid #707070;
        }

            .sijaknav li.current::after {
                content: "";
                transform: rotate(270deg) translateY(-50%);
                position: absolute;
                top: 50px;
                left: 50%;
                width: 0px;
                height: 0px;
                border-top: 11px solid transparent;
                border-right: 20px solid #707070;
                border-bottom: 11px solid transparent;
            }

.sijak_box .cont_box {
    border: 1px solid #fff;
    text-align: left;
    height: 381px;
    background: white;
    border-radius: 15px;
}

.sijak_box .cont_area {
    font-size: 14px;
    padding: 22px 15px 0;
    height: 256px;
}

    .sijak_box .cont_area > p {
        font-weight: bold;
        font-size: 17px;
        display: block;
    }

    .sijak_box .cont_area > div {
        white-space: pre-line;
        max-height: 231px;
        -webkit-line-clamp: 10;
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

    .sijak_box .cont_area .likes {
        text-align: right;
        position: absolute;
        bottom: 67px;
        right: 15px;
    }

.sijak_box_books {
    margin-right: 80px;
    width: 280px;
    float: left;
    margin-bottom: 60px;
}

    .sijak_box_books .sijak_book_cover {
        border: 1px solid;
        height: 380px;
        position: relative;
        text-align: center;
        color: black;
        background: #f2f2f2;
        overflow: hidden
    }

        .sijak_box_books .sijak_book_cover img {
            width: 100%;
            height: auto
        }

        .sijak_box_books .sijak_book_cover > div {
            bottom: 0;
            color: black;
            position: absolute;
            text-align: left;
            height: 80px;
            width: 100%;
            background: #fff;
            border-top: 1px solid;
        }

            .sijak_box_books .sijak_book_cover > div > span {
                font-size: 20px;
                display: block;
                padding: 11px 15px;
                line-height: 30px;
            }

                .sijak_box_books .sijak_book_cover > div > span > input {
                    font-size: 20px;
                    display: block;
                    line-height: 30px;
                    padding: 11px 15px;
                    width: 100%;
                    height: 80px;
                    box-sizing: border-box;
                }

    .sijak_box_books:nth-child(3n) {
        margin-right: 0;
    }

.createcontentcover .createbox .inputspan {
    font-size: 14px;
    line-height: 36px;
    display: block;
}

.createcontentcover .createbox #file_input {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
}

.createcontentcover .createbox .fakeinput {
    width: 470px;
    color: #999;
}

.createbox {
    width: 280px;
    height: 382px;
    position: relative;
    float: right;
}

.createsubcontent .createbox {
    width: 660px;
    margin: auto;
    float: none;
    height: auto;
}

    .createsubcontent .createbox span {
        font-size: 16px;
        line-height: 53px;
        margin-top: 10px;
    }

    .createsubcontent .createbox #subcontenttitle {
        width: 100%;
        height: 48px;
        padding: 0 15px;
        border-radius: 8px;
        font-size: 16px;
        background: #fff;
        border: 1px solid #e0e0e0;
    }

    .createsubcontent .createbox #subcontenttext {
        width: 100%;
        height: 307px;
        background: #fff;
        font-size: 16px;
        resize: vertical;
        line-height: 32px;
        border-radius: 8px;
        padding: 21px 15px;
        margin-top: 40px;
    }

    .createsubcontent .createbox #taginfo {
        width: 100%;
        height: 48px;
        padding: 0 15px;
        border-radius: 8px;
        font-size: 16px;
        background: #fff;
        border: 1px solid #e0e0e0;
        margin: 40px 0 20px;
    }

.mobilebiggertxt {
    display: none;
}

.header_m {
    display: none;
}

.sijak_list .cclistbtn {
    margin-bottom: 48px;
}

.sijak_authorli img {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 130px;
    height: 130px;
    max-width: 130px;
    border-radius: 50%;
}

.sijak_authorli {
    height: 170px;
}

    .sijak_authorli > a > div {
        height: 170px;
        position: relative;
        text-align: left;
        color: black;
        border-bottom: 1px solid #ccc;
    }

.history_view .cont_area .other_cont .list_box {
    float: left;
    margin-right: 20px;
    box-sizing: content-box;
}

    .history_view .cont_area .other_cont .list_box .img_box img {
        width: 235px;
    }

.preheader {
    margin-top: 60px;
}

.see_container .sijak_box_books {
    width: 220px;
    float: none;
    margin: auto;
}

    .see_container .sijak_box_books > .sijak_book_cover {
        border: 1px solid;
        height: 300px;
        position: relative;
        text-align: center;
        color: black;
        background: #f2f2f2;
        overflow: hidden;
    }

    .see_container .sijak_box_books .sijak_book_cover > div {
        bottom: 0;
        color: black;
        position: absolute;
        text-align: left;
        height: 64px;
        width: 100%;
        background: #fff;
        border-top: 1px solid;
    }

    .see_container .sijak_box_books .sijak_book_cover span {
        display: none;
    }

    .see_container .sijak_box_books .see_desc {
        text-align: right;
        margin-top: 10px;
    }

.see_header .backbutton {
    width: 70px;
    display: block;
    height: 60px;
    padding-top: 28px;
    position: absolute;
}

.mokcha, .mokcha_on {
    display: none;
}

.search_list_order > div {
    border: none;
    width: 245px;
    font-family: "spoqa han sans";
    font-size: 15px;
    color: #222;
    outline: none;
    line-height: 23px;
    height: 23px;
}

.search_list_order {
    left: 0;
    width: 161px;
    position: absolute;
    top: 35px;
    background: url(/res/images/common/sortway.svg) no-repeat center right 8px;
    background-color: #fff;
}

.book_info_wrap .info_box .btn_wrap_div {
    bottom: 0;
    position: absolute;
}

.createbox .photobtn {
    display: block;
    width: 44px;
    height: 44px;
    background: url(/res/images/common/photobtn.svg) no-repeat center;
    z-index: 90;
    position: absolute;
    left: 225px;
    top: 12px;
}

.createcontentcover .newbtn_base2 {
    margin-bottom: 45px;
}

.createcontentcover .subcontent_title {
    line-height: 58px;
}

.createcontentcover h4 {
    color: #333;
    font-size: 30px;
    font-weight: 600;
    line-height: 50px;
}

.createcontentcover h5 {
    color: #333;
    font-size: 16px;
    font-weight: 300;
    line-height: 39px;
    margin-top: 8px;
}

.book_cont_wrap #book_index, .book_cont_wrap #book_index_on {
    position: relative;
    height: 40px;
    line-height: 40px;
    margin-top: 0;
}

    .book_cont_wrap #book_index::after {
        content: "";
        transform: rotate(270deg) translateY(-50%);
        position: absolute;
        top: 13px;
        left: 62px;
        width: 0px;
        height: 0px;
        border-top: 6px solid transparent;
        border-right: 10px solid #333;
        border-bottom: 6px solid transparent;
    }

    .book_cont_wrap #book_index_on::after {
        content: "";
        transform: rotate(90deg) translateY(-50%);
        position: absolute;
        top: 12px;
        left: 51px;
        width: 0px;
        height: 0px;
        border-top: 6px solid transparent;
        border-right: 10px solid #333;
        border-bottom: 6px solid transparent;
    }

.book_cont_wrap #book_index, .book_cont_wrap #book_toc br {
    display: none;
}

.createcontentcover ul.view_list_ul {
    margin: 0;
}

@media screen and (max-width: 1630px) {
    #stc_player_controller {
        height: 10px;
    }

    .mokcha {
        display: block;
        width: 50px;
        font-weight: bold;
        font-size: 18px;
        height: 60px;
        line-height: 60px;
        margin: auto;
        position: relative;
    }

    .see_header .mokcha::after {
        content: "";
        transform: rotate(270deg) translateY(-50%);
        position: absolute;
        top: 24px;
        left: 46px;
        width: 0px;
        height: 0px;
        border-top: 6px solid transparent;
        border-right: 10px solid #333;
        border-bottom: 6px solid transparent;
    }

    .mokcha_on {
        display: none;
        width: 50px;
        font-weight: bold;
        font-size: 18px;
        height: 60px;
        line-height: 60px;
        margin: auto;
        position: relative;
    }

    .see_header .mokcha_on::after {
        content: "";
        transform: rotate(90deg) translateY(-50%);
        position: absolute;
        top: 24px;
        left: 46px;
        width: 0px;
        height: 0px;
        border-top: 6px solid transparent;
        border-right: 10px solid #333;
        border-bottom: 6px solid transparent;
    }

    .see_header .backbutton {
        height: 40px;
        padding-top: 18px;
    }

    .see_container .sijak_box_books {
        margin: 0;
    }

    .preheader {
        display: none;
    }

    .see_header {
        height: 60px;
        box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.16);
    }

    .see_container .see_side_area {
        top: 60px;
        box-shadow: none;
        width: 100vw;
        height: 164px;
    }

        .see_container .see_side_area .info_box {
            height: 164px;
            padding: 24px;
            box-sizing: border-box;
        }

        .see_container .see_side_area .menu_list {
            display: none
        }

            .see_container .see_side_area .menu_list > li:nth-child(3) {
                background: #f7f7f7;
            }

    .see_container .sijak_box_books > .sijak_book_cover {
        height: 116px;
        float: left;
        width: 84px;
    }

    .see_container .sijak_box_books .sijak_book_cover > div {
        height: 25px;
    }

    .see_container .see_view_area {
        padding: 0;
        margin-top: 270px;
    }

    .sijak_box_books {
        margin-bottom: 0;
        float: l;
    }

    .see_container .see_view_area .cont_box .paper_inner {
        padding: 37px 24px;
        max-width: 100vw;
        margin: 0;
    }

    .see_container .sijak_box_books .see_desc {
        float: left;
        text-align: left;
        margin-left: 16px;
        margin-top: 0;
    }
}

@media screen and (max-width: 1450px) {
    .read_slider_area .btn_arrow {
        display: none;
    }

    .wrap {
        min-width: auto;
    }

    .header {
        display: none;
    }

    .see_container .header {
        display: block !important;
    }

    .header_m {
        position: fixed;
        z-index: 99999;
        width: 100%;
        height: 60px;
        background-color: #fff;
        display: block;
        box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.16);
    }

        .header_m .sub_menu {
            display: none;
            width: 100%;
            left: 0;
            position: fixed;
            height: 540px;
            background: #fff;
            top: 60px;
        }

        .header_m > ul li > a {
            font-weight: 500;
            font-size: 16px;
        }

        .header_m > ul {
            display: none;
            height: 460px;
            position: fixed;
            top: 56px;
            width: 100%;
            padding-top: 7px;
        }

            .header_m > ul li {
                padding: 12px 24px;
            }

        .header_m > a {
            margin: 0;
            height: 24px;
            width: 50%;
            display: block;
            padding: 18px;
            padding-left: 22px;
        }

    .thintext {
        font-weight: 100 !important;
    }

    .header_m .hamburger, .header_m .hamburger_out {
        float: right;
        margin-right: 24px;
        margin-top: -40px;
    }

    .header_m .hamburger_out {
        display: none;
        margin-top: -39px;
    }

    .container {
        padding: 60px 0 0px;
    }

    .header_m .sub_menu li {
        text-align: right;
    }

    .header_m .sub_menu .backbutton {
        width: 70px;
        display: block;
        height: 40px;
        padding-top: 18px;
        position: absolute;
    }

    .header_m .sub_menu .backbutton .backarrow {
        display: block;
        margin-left: 24px;
    }

    .main_cont  {
        width: 94%;
        max-width: 492px;
    }

    .main_cont .search_box {
        margin: 0;
        padding: 17px 83px 17px 44px;
        width: 100%;
        box-sizing: border-box;
    }
     
    .main_cont .search_box label {
        top: 19px;
        left: 26px;
        font-size: 20px;
    }
    
    .main_cont .search_box .btn_search {
        top: 6px;
        right: 18px;
    }
}

@media screen and (max-width: 1200px) {
    .createbox {
        float: none;
        margin-bottom: 70px;
        width: 235px;
        margin: 0 auto 70px;
    }

        .createbox .photobtn {
            left: 179px;
        }

        .createbox .newbtn_base {
            width: 235px !important;
        }

    .createcontentcover ul.view_list_ul, .createcontentcover .newbtn_base2 {
        margin: auto;
    }

    .createcontentcover h4, .createcontentcover h5 {
        text-align: center;
    }

    ul.view_list_ul {
        width: 100%;
        margin: 50px 0;
        max-width: 660px;
        margin-top: 40px !important;
    }

    .theme_list li a span {
        background: linear-gradient( to right, rgba(247, 247, 247, 0) 18%, #fff 60%);
    }

    .youth_list ul li {
        padding: 40px 0px 30px 170px;
    }

        .youth_list ul li dl dt {
            white-space: normal;
            word-break: break-all;
        }

    #book_toc, #book_index {
        /* display: none; */
    }

    .gobacklink {
        width: 70px;
        display: block;
        height: 40px;
        margin-bottom: 24px;
        background: url(http://10.211.55.3:3401/res/images/common/backarrow.png) no-repeat 0px center;
        color: transparent;
    }

    .read_slider_area {
        height: 590px;
        padding-top: 38px;
        width: 100vw;
    }

    .inner {
        width: 100vw;
        padding: 0 24px;
        min-width: auto;
    }

    .container .inner {
        width: 100vw;
        padding: 0 24px;
        min-width: auto;
    }

    ul#carousel {
        width: 827px;
        margin: auto;
        height: 360px;
    }

    .read_slider_area .read_slider li {
        float: left;
        margin-right: 34px;
    }

    div {
        box-sizing: border-box;
    }

    .read_slider_area .inner {
        overflow-x: scroll;
        min-width: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

        .read_slider_area .inner::-webkit-scrollbar {
            display: none;
        }

    .read_slider_area .read_slider li {
        width: 253px;
        height: 343px;
        overflow: hidden;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
        position: relative;
    }

        .read_slider_area .read_slider li:last-child {
            margin-right: 0px !important;
        }

        .read_slider_area .read_slider li .cont_box .title_area {
            padding: 18px 20px;
        }

            .read_slider_area .read_slider li .cont_box .title_area span, .read_slider_area .read_slider li .cont_box .title_area p {
                font-size: 16px;
                line-height: 25px;
                height: 25px;
                display: block;
            }

        .read_slider_area .read_slider li .cont_box .cont_area p {
            font-size: 16px;
            line-height: 22px;
            font-weight: 400;
        }

        .read_slider_area .read_slider li .cont_box .cont_area em {
            width: 210px;
            font-size: 16px;
            line-height: 25px;
        }

    .mobilebiggertxt {
        display: block;
        font-size: 50px;
        line-height: 60px;
        margin-bottom: 41px;
    }

    .theme_list_area {
        background: #f7f7f7;
        padding: 0;
    }

    .theme_list li {
        margin-right: 0px;
    }

    .read_main_box .theme_list li:nth-child(n+6) {
        display: none;
    }

    .read_main_box .list_title {
        font-size: 18px;
        font-weight: 500;
        color: #333;
    }

    .new_book_area {
        padding: 26px 0 0px;
    }

        .new_book_area .newbook_list li {
            width: calc(100vw - 48px);
        }

        .new_book_area .newbook_list .cont_box {
            max-width: 250px;
            width: calc(100vw - 200px);
        }

    .sitemap {
        display: none;
    }

    .footer {
        width: 100vw;
    }

        .footer .inner {
            width: 100vw;
        }

    .theme_list_area .theme_list, .new_book_area .newbook_list {
        max-width: 490px;
        margin: 20px auto 0;
        display: block;
    }

    .theme_list_area .inner, .new_book_area .inner, .theme_contents .inner {
        max-width: 538px;
    }

    .search_list {
        width: calc(100vw - 122px);
    }

    .youth_list .search_list {
        position: initial;
    }

    .poet_info_listA_wrap .index_wrap .btn_wrap a {
        border: none !important;
    }

    .poet_info_listA_wrap .index_wrap .btn_wrap a {
        font-size: 20px;
    }

        .poet_info_listA_wrap .index_wrap .btn_wrap a:last-child {
            display: none;
        }

    .tit_wrap {
        height: 167px;
    }

    .total {
        width: calc(100vw - 48px);
    }

    .poet_info_listA_wrap .index_wrap {
        top: 189px;
    }

    .search_info_wrap .search_sorting_list {
        position: relative;
    }

    .tit_wrap {
        padding-top: 26px;
    }

    .list_wrap ul {
        margin: 0;
    }

        .list_wrap ul li {
            width: 50%;
            margin-left: 0;
            margin-bottom: 20px;
            text-align: left;
        }

            .list_wrap ul li .author {
                float: left;
                padding-left: 20px;
                line-height: 50px;
                margin-top: 0;
                font-size: 18px;
                width: calc(100% - 68px);
                overflow: auto;
                height: 50px;
                word-break: keep-all;
            }

        .list_wrap ul.poet_info_list li a img {
            height: 48px;
            float: left;
        }

    .list_wrap {
        margin-top: 26px;
    }

    .poet_info_listA_wrap.container {
        padding-bottom: 0;
    }

    .choice_poemschool_box .masonbox .item:nth-child(4n) {
        margin-right: 20px;
    }

    .choice_poemschool_box .masonbox {
        width: 745px;
        display: inline-block;
        margin-left: 50%;
        transform: translateX(-50%);
    }

        .choice_poemschool_box .masonbox .item:nth-child(3n) {
            margin-right: 0px;
        }

        .choice_poemschool_box .masonbox .item:nth-child(4n) {
            margin-right: 20px;
        }

    .today_list ul {
        width: 900px;
        display: inline-block;
        margin-left: 50%;
        transform: translateX(-50%);
    }

    .today_list li {
        margin-right: 30px;
    }

    .today_list .cont_box > div:first-child {
        box-sizing: content-box;
    }

    .theme_word dl dd {
        width: calc(100vw - 48px);
    }

    .sijaknav {
        width: calc(100vw - 48px);
        max-width: 745px;
        padding: 36px 0;
    }

        .sijaknav li {
            width: calc(50% - 10px); /* width: 50%; */
        }

    .read_today_wrap .search_list {
        max-width: 671px;
        left: 50%;
        transform: translateX(-50%);
        top: -55px;
        margin-top: 40px;
    }

    .sijak_list ul, .poem_cont_wrap {
        width: 745px;
        display: inline-block;
        margin-left: 50%;
        transform: translateX(-50%);
    }

    li.sijak_box:nth-child(4n) {
        margin-right: 20px;
    }

    .sijak_box_books .sijak_book_cover {
        height: 320px;
    }

    .sijak_box_books, .poem_cont_wrap .book_list a {
        width: 235px;
        margin-right: 20px;
        margin-bottom: 46px;
    }

    .poem_cont_wrap .book_list a {
        height: 460px;
    }

    .sijak_box_books .sijak_book_cover > div {
        height: 68px;
    }

        .sijak_box_books .sijak_book_cover > div > span {
            font-size: 16px;
            line-height: 24px;
            padding: 10px 12px;
        }

    .sijak_list .cclistbtn {
        display: block;
        margin: 0 auto 48px;
    }

    .poem_cont_wrap .book_list li img, .poem_cont_wrap .book_list li {
        width: 235px;
    }

    li.sijak_box:nth-child(3n), .poem_cont_wrap .book_list a:nth-child(3n) {
        margin-right: 0;
    }

    .poem_cont_wrap .book_list a {
        display: block;
        float: left;
    }

    .book_info_wrap > div.img_box {
        float: none;
        margin-left: 50%;
        transform: translateX(-50%);
        width: fit-content;
    }

    .book_info_wrap .info_box {
        margin-left: 50%;
        transform: translateX(-50%);
        height: 308px;
        margin-top: 40px;
        width: 745px;
        max-width: 745px;
    }

    .book_cont_wrap {
        max-width: 745px;
        transform: translateX(-50%);
        margin-left: 50%;
        width: 745px;
    }

    .info_box .bookstore_list {
        display: block;
        position: relative;
        float: none;
        margin: 20px 0;
    }

        .info_box .bookstore_list li {
            float: left;
            margin-right: 38px;
        }

    .newbtn_base {
        background: #0c17ae;
        margin: 0;
    }

    .book_cont_wrap {
        padding-top: 70px;
    }

    .btn_wrap_div {
        position: relative !important;
        text-align: center;
    }

    .book_info_wrap .info_box {
        height: auto;
        padding-bottom: 50px;
        border-bottom: 1px solid #ccc;
    }

        .book_info_wrap .info_box .exp {
            display: block;
            clear: both;
        }

    .history_view {
        width: calc(100vw - 48px);
        padding: 40px 24px;
    }

        .history_view .cont_area .current_cont {
            width: 100%;
        }

        .history_view .cont_area .other_cont {
            width: 100%;
        }
}

@media screen and (max-width: 966px) {
    .today_list li:nth-child(3n) {
        margin-right: 30px;
    }

    .today_list li:nth-child(2n) {
        margin-right: 0px;
    }

    .today_list ul {
        width: 590px;
    }
}

@media screen and (max-width: 884px) {
    ul#carousel {
        width: 860px;
    }
}

@media screen and (max-width: 774px) {
    .book_cont_wrap, .book_info_wrap .info_box, .choice_poemschool_box .masonbox, .sijak_list ul, .sijaknav, .poem_cont_wrap {
        max-width: 490px;
    }

    .read_today_wrap .search_list {
        max-width: 416px;
    }

    .choice_poemschool_box .masonbox .item:nth-child(3n), .sijak_list li.sijak_box:nth-child(3n), .sijak_box_books:nth-child(3n), .poem_cont_wrap .book_list a:nth-child(3n) {
        margin-right: 20px;
    }

    .choice_poemschool_box .masonbox .item:nth-child(2n), .sijak_list li.sijak_box:nth-child(2n), .sijak_box_books:nth-child(2n), .poem_cont_wrap .book_list a:nth-child(2n) {
        margin-right: 0;
    }

    .sijak_authorli img {
        width: 70px;
        height: 70px;
    }

    .sijak_authorli {
        height: 100px;
    }

        .sijak_authorli > a > div {
            height: 100px;
        }

    .info_box .bookstore_list li {
        margin-right: 68px;
    }
}

@media screen and (max-width: 644px) {
    .today_list ul {
        width: 280px;
    }

    .today_list li {
        margin-top: 0px;
    }
}

@media screen and (max-width: 540px) {
    .youth_list ul li dl .con {
        display: none;
    }

    .paging a {
        margin-bottom: 6px;
    }

    .choice_poemschool_box .masonbox .item:nth-child(n), .sijak_list li.sijak_box:nth-child(n), .sijak_box_books:nth-child(n), .book_list a:nth-child(n) {
        float: none;
        margin-right: 0;
        margin-bottom: 30px;
    }

    .choice_poemschool_box .masonbox, .sijak_list ul, .poem_cont_wrap {
        width: 235px;
    }

        .choice_poemschool_box .masonbox .list_box {
            height: auto;
        }

    .sijak_authorli {
        width: calc(100vw - 48px);
        margin-left: 118px;
        transform: translateX(-50%);
    }

    .book_info_wrap .info_box .title {
        margin-right: 0;
    }

    .info_box .bookstore_list li {
        margin: 0;
        width: 117px;
    }

    .info_box .bookstore_list {
        margin-bottom: 30px;
    }

    .book_info_wrap .info_box {
        max-width: calc(100vw - 48px);
    }

    .book_cont_wrap {
        max-width: calc(100vw - 48px);
    }
}

@media screen and (max-width: 538px) {
    .theme_list li a {
        width: calc(100vw - 48px);
    }

    .theme_list li {
        width: calc(100vw - 48px);
        height: 80px;
        overflow: hidden;
    }

        .theme_list li a span {
            font-size: 16px;
            width: calc(100vw - 48px);
        }

    .history_view {
        width: 100vw;
        margin-left: -24px;
        margin-top: -148px;
    }

    .poet1 {
        max-width: calc(100vw - 48px);
    }
}

@media screen and (max-height: 750px), (max-width: 882px) {
    .login_wrap {
        width: 100vw;
        height: auto;
        filter: none;
        position: relative;
        overflow: visible;
        transform: none;
        top: unset;
        left: unset;
        background: #ffffffcc;
        border-radius: 0px;
    }

        .login_wrap > div:nth-child(2) {
            padding: 26px calc(50vw - 151px);
            width: 100vw;
            min-height: 452px !important;
            box-shadow: 0px -9px 13px rgb(0 0 0 / 9%);
            border-radius: 22px 22px 0px 0px;
        }

    .login_bigwrap {
        height: auto !important;
    }

    .login_wrap > div:first-child {
        float: left;
        padding: 51px 0;
        background: none;
        width: 302px;
        margin: auto;
        min-height: 184px;
    }

    .login_wrap > div {
        float: none !important;
    }

        .login_wrap > div:first-child > img {
            display: none;
        }
}

@media (hover:hover) {
    .btn_base:hover {
        cursor: pointer;
    }

    .link:hover {
        color: #0C17A2;
    }

    .book_cont_wrap .cont_title2 a:hover {
        color: #0C17A2;
        background-color: #eee;
    }

    a:hover {
        text-decoration: none
    }

    .paging a:hover {
        color: #0C17A2;
        border: 1px solid #0C17A2;
        text-decoration: none
    }

    .table_list tbody tr:hover td {
        background: #f8f8f8;
    }

    .header .gnb_wrap .gnb > li:hover > a:before {
        left: 50%;
        bottom: 1px;
        z-index: 200;
        width: 12px;
        height: 9px;
        margin-left: -6px;
        background: url(../images/common/arrow_gnb.jpg) no-repeat 0 0;
    }

    .header .gnb_wrap .gnb > li:hover i {
        width: 100%;
        opacity: 1
    }

    .header .gnb_wrap .gnb > li .sub_menu a:hover {
        color: #0C17A2;
    }

    .location_area .location .location_list li:hover a {
        position: relative;
        background-color: #f7f7f7;
        color: #333
    }

        .location_area .location .location_list li:hover a:after {
            content: '';
            position: absolute;
            right: 13px;
            top: 50%;
            width: 5px;
            height: 9px;
            margin-top: -5px;
            background: url(../images/common/arrow_location_sub.png) no-repeat 0 0
        }

    .event_list ul li:hover {
        background: #f8f8f8;
    }

    .tag_list_area .tab_style02 .tab_cont span a:hover {
        font-weight: bold;
        color: #0C17A2;
        text-decoration: underline
    }

    .youth_list ul li:hover {
        background: #f8f8f8;
    }

    .sort_list .tit:hover a {
        color: #0C17A2;
        text-decoration: underline;
    }

    .sort_list .tit:hover .hint {
        display: inline-block;
    }

    .header .gnb_wrap .gnb > li:hover > .sub_menu {
        display: block;
    }

    .header .gnb_wrap .gnb > li:hover > a {
        color: #0C17A2;
    }

    .book_cont_wrap #book_index:hover, .book_cont_wrap #book_index_on:hover {
        color: #0C17A2;
        background-color: #eee;
        cursor: pointer;
    }

    .createbox .photobtn:hover {
        cursor: pointer;
    }
}

.login_bigwrap {
    height: calc(100vh - 170px);
    background: url(/res/images/main/main_bg.jpg) no-repeat center top;
    background-size: calc(100vh *2.1);
    background-size: cover;
}

.login_wrap div {
    box-sizing: border-box !important;
}




.today_list ul li a img {
    max-width: 149px;
    max-height: 218px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.theme_slider .slide img {
    max-width: 149px;
    max-height: 218px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.youth_list ul li img {
    max-width: 149px;
    max-height: 218px;
    border: 1px solid #ccc;
}

.see_coverimg {
    max-width: 80px;
    border: 0px solid black;
}

.list_wrap .view_oldpoemlist_li {
    padding: 20px 0;
    width: 450px;
    height: 58px;
    border: 1px solid #d9d9d9;
    position: relative;
    text-align: inherit;
    margin-bottom: 20px;
    margin-left: 40px;
    padding-left: 20px;
    border-radius: 8px;
    background: linear-gradient(90deg,#e7e7e7, #ffffff);
    box-shadow: 0px 3px 6px rgb(0 0 0 / 10%);
}


    .view_oldpoemlist_li .ellipstext {
        display: inline-block;
        max-width: 80%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }


.today_list ul li a img {
	max-width: 149px;
	max-height: 218px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.theme_slider .slide img {
	max-width: 149px;
	max-height: 218px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.youth_list ul li img {
	max-width: 149px;
	max-height: 218px;
	border: 1px solid #ccc;
}

.see_coverimg {
	max-width: 80px;
	border: 0px solid black;
}