@charset "utf-8";
/* PC */
@media screen and (min-width: 1025px) and (max-width: 1199px) {
    /****************************************
    01. common style
    ****************************************/
    .contents {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 20px 80px !important;
        box-sizing: border-box !important;
    }

    .book-card-grid {
        gap: 18px !important;
    }
}

/* tablet */
@media (min-width: 768px) and (max-width: 1024px) {
    /****************************************
    01. common style
    ****************************************/
    .contents {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px 60px !important;
        box-sizing: border-box !important;
    }

    /* breadcrumb-area 태블릿 반응형 배너 */
    .breadcrumb-area {
        min-height: 120px;
        padding: 30px 24px;
        box-sizing: border-box;
    }
    .breadcrumb-area .inner-wrap {
        width: 100% !important;
    }
    .breadcrumb-banner-wrap .sub-title {
        font-size: 24px;
    }

    .contents h3 {
        height: 90px;
        line-height: 90px;
        font-size: 26px;
        margin: 0 0 30px;
    }
    .board-detail .post-title-row .post-title {
                height: auto;
    }
    /* 도서 필터 영역 태블릿 반응형 */
    .book-filter-container {
        margin: 0 0 30px;
        gap: 16px;
    }

    .book-filter-container .filter-row {
        gap: 16px;
    }

    .book-filter-container .book-list-btn,
    .book-list-btn {
        display: flex !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .book-filter-container .book-list-btn .btn,
    .book-list-btn .btn {
        flex: 1 1 0 !important;
        width: 25% !important;
        min-width: 0 !important;
        padding: 10px 10px 8px !important;
    }

    .book-filter-container .book-list-btn .btn i,
    .book-list-btn .btn i {
        font-size: 18px !important;
        margin-bottom: 4px !important;
    }

    .book-filter-container .book-list-btn .btn span,
    .book-list-btn .btn span {
        font-size: 12px !important;
    }

    .book-filter-container .book-list-tab,
    .book-list-tab {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        width: 100% !important;
        justify-content: flex-start !important;
    }

    .book-filter-container .book-list-tab > li,
    .book-list-tab > li {
        flex: 1 1 calc(25% - 8px) !important;
        max-width: calc(25% - 6px) !important;
        width: calc(25% - 8px) !important;
        margin: 0 !important;
    }

    .book-filter-container .book-list-tab > li > a,
    .book-list-tab > li > a {
        width: 100% !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 8px 6px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    /* 도서 카드 그리드 태블릿 (3열) */
    .book-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px !important;
        margin-bottom: 30px !important;
    }

    .book-card-item {
        min-width: 0 !important;
        padding: 0 !important;
    }

    .book-card-item .card-cover-wrap {
        height: 190px !important;
        margin-bottom: 0 !important;
    }

    .book-card-item .card-cover-wrap .book-cover-img {
        max-height: 160px !important;
    }

    .book-card-item .card-info-wrap {
        padding: 14px !important;
    }

    .article .section .book-card-item .card-title,
    .book-card-item .card-title {
        font-size: 14px !important;
        height: 40px !important;
        line-height: 1.4 !important;
        -webkit-line-clamp: 2 !important;
    }

    .book-card-item .price-member strong {
        font-size: 17px !important;
    }

    .book-card-item .btn-cart,
    .book-card-item .btn-buy,
    .book-card-item .badge-soldout {
        height: 36px !important;
        font-size: 13px !important;
    }

    .book-card-item .btn-cart-icon {
        width: 38px !important;
        height: 38px !important;
        font-size: 15px !important;
    }
}

/* phone ~ 767px */
@media screen and (max-width: 767px) {
    /****************************************
    01. common style
    ****************************************/

    /* contents */
    .contents {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px 50px !important;
        box-sizing: border-box !important;
    }
     #contents {
    margin-top: 20px;
    min-height: 500px;
}
     .contents h3 {
        height: 20px;
        margin: 0 0 20px;
        font-size: 19px;
    }
        .book-info-area .book-info .book-title {
                    height: 40px;
        }
    /* article */
    .article {
    }
        .article .section {
            
        }
            .article .section h4 {
                 margin: 33px 0 20px;
                line-height: 1.1;
                font-size: 18px;
                font-weight: bold;
                color: #0b3290;
            }

            .article .section h5 {
                margin: 30px 0 20px;
                line-height: 1.1;
                font-size: 18px;
            }

            /* table style */
            .article .section .table {
                border-bottom: 1px solid #dee2e6;
            }

    /*******************************************************************
	    includes style
    ******************************************************************* */
    /* subspot-area */
    .subspot-area {
        height: 80px;
        border: 0;
        background: #fff url(../images/bg/bg_main_highlight_01.jpg) center bottom no-repeat;
        background-size: cover;
    }
        .subspot-area h3 {
            height: 80px;
        }
        .subspot-area h2 {
            margin: 0;
        }
            .subspot-area h2 .title1 {
                margin: 0 0 8px;
                padding-top: 20px;
                padding-right: 20px;
                font-size: 12px;
            }
            .subspot-area h2 .title2 {
                padding-right: 20px;
                font-weight: 500;
                font-size: 21px;
            }

    /* breadcrumb-area 모바일 반응형 배너 */
    .breadcrumb-area {
        height: auto !important;
        min-height: 100px !important;
        line-height: normal !important;
        padding: 24px 16px !important;
        margin-bottom: 24px !important;
        border-bottom: 0 !important;
        display: block !important;
    }
    .breadcrumb-area .inner-wrap {
        width: 100% !important;
        padding: 0 !important;
    }
    .breadcrumb-banner-wrap {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        width: 100% !important;
    }
    .breadcrumb-banner-wrap .sub-title-area {
        width: 100% !important;
    }
    .breadcrumb-banner-wrap .sub-title {
        font-size: 20px !important;
        line-height: 1.3 !important;
    }
    .breadcrumb-banner-wrap .sub-desc {
        font-size: 13px !important;
        margin-top: 4px !important;
        line-height: 1.4 !important;
    }
    .breadcrumb-banner-wrap .breadcrumb-nav {
        width: 100% !important;
        display: none;
    }
    .breadcrumb-area ul {
        display: inline-flex !important;
        flex-wrap: wrap !important;
        padding: 6px 12px !important;
        border-radius: 20px !important;
        gap: 4px 0 !important;
    }
    .breadcrumb-area ul li {
        font-size: 12px !important;
        color: rgba(255, 255, 255, 0.8) !important;
    }

    /*******************************************************************
	    도서안내
    ******************************************************************* */
    .book-list {
        margin: 20px 0 50px;
    }

        .book-list > li {
            display: block;
            float: left;
            width: 176px;
            margin: 0 20px 0 0;
        }

            .book-list > li:last-child {
                margin: 0;
            }

            .book-list > li span.cover {
                display: block;
                width: 176px;
                height: 240px;
                margin: 0 0 10px;
                border: 1px solid #dfdfdf;
                background-color: #eee;
            }

            .book-list > li span.title {
                display: block;
                width: 176px;
                text-align: center;
            }

            .book-list > li a.btn {
                display: block;
                width: 100%;
                margin: 8px 0 0;
                text-align: center;
                color: #333;
                border: 1px solid #dfdfdf;
                background-color: #fafafa;
            }

                .book-list > li a.btn:hover {
                    color: #2669a3;
                    border: 1px solid #2669a3;
                    background-color: #fff;
                }

    .label-book {
        position: relative;
        top: -4px;
        display: inline-block;
        margin: 0;
        padding: 4px 6px 3px;
        text-align: center;
        line-height: 1;
        font-weight: normal !important;
        font-size: 11px;
        color: #fff;
        border-radius: 2px;
        background-color: #ccc;
    }

    .order-check-area .label-book {
        top: 0;
        margin-right: 2px;
    }

    .cart-area .label-book {
        top: 0;
        margin-right: 2px;
    }

    .label-book.ebook {
        background-color: #FF8080;
    }

    .label-book.pbook {
        background-color: #0A82E4;
    }

    a.book-title {
        display: block;
        margin: 0;
        font-weight: bold;
        color: #183680;
    }

        a.book-title:hover {
            display: block;
            margin: 0;
            color: #0A82E4;
        }


    p.more-info {
        margin: 10px 0 0 !important;
    }

        p.more-info a {
            padding: 2px 6px;
            text-align: center;
            font-size: 12px;
            color: #33f;
            border: 1px solid #ccc;
            border-radius: 2px;
        }

        p.more-info.pbook a {
            color: #0F85E0;
            border: 1px solid #0F85E0;
        }

        p.more-info.ebook a {
            color: #FE7F81;
            border: 1px solid #FE7F81;
        }

        p.more-info a i {
            margin: 0 0 0 5px;
        }


    .book-info .label-book {
        top: 0;
    }

    .book-info li.more-info {
        margin: 0 0 40px !important;
        list-style: none !important;
    }

        .book-info li.more-info a {
            padding: 2px 6px;
            text-align: center;
            font-size: 12px;
            color: #33f;
            border: 1px solid #ccc;
            border-radius: 2px;
        }

        .book-info li.more-info.pbook a {
            color: #0F85E0;
            border: 1px solid #0F85E0;
        }

        .book-info li.more-info.ebook a {
            color: #FE7F81;
            border: 1px solid #FE7F81;
        }

        .book-info li.more-info a i {
            margin: 0 0 0 5px;
        }

    /*******************************************************************
	도서구입
******************************************************************* */
    .grid {
        margin: 0 0 20px;
        border-collapse: collapse;
        width: 960px;
        border-top: 2px solid #444;
        border-bottom: 1px solid #444;
    }

        .grid th {
            padding: 10px 0;
            text-align: center;
            vertical-align: middle;
            font-size: 13px;
            color: #333;
            border-bottom: 1px solid #bdbdbd;
        }

        .grid td {
            border-bottom: 1px solid #dfdfdf;
            padding: 10px 0;
            vertical-align: middle;
        }

        .grid tr:last-child td {
            border-bottom: 0;
        }

    .head {
        background-color: #f3f3f3;
        font-weight: bold;
        color: #FFF;
    }

    .alt {
        background-color: #fafafa;
        color: #000;
    }

    .grid tfoot td {
        padding: 10px 0;
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        color: #de5344;
        border-top: 1px solid #ccc;
    }

    .grid tfoot td {
        background-color: #f8f8f8;
    }

        .grid tfoot td * {
            margin: 0 5px;
        }

        .grid tfoot td a {
            text-decoration: none;
            color: #4d4d4d;
        }

            .grid tfoot td a:hover {
                color: #de5344;
            }

    .list-info {
        margin: 10px 0 20px;
    }

    .grid .btn-order {
        width: 80px;
        height: 25px;
        margin: 3px 0;
        padding: 0;
        line-height: 24px;
        font-size: 12px;
        border-radius: 2px;
    }


    .col1 {
        width: 150px;
        text-align: center;
        font-size: 16px;
    }

    .col2 {
        width: auto;
        text-align: left;
    }

    .col3 {
        width: 120px;
        text-align: center;
    }

    .col4 {
        width: 120px;
        text-align: center;
    }

    .col5 {
        width: 140px;
        text-align: center;
    }

    .col6 {
        width: 120px;
        text-align: center;
    }

    /* 도서 목록 영역 모바일 */
    .book-card-list-area {
        margin: 15px 0 30px;
    }

    /* 도서 카드 그리드 모바일 반응형 (2열) */
    .book-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
        margin-bottom: 24px !important;
    }

    .book-card-item {
        min-width: 0 !important;
        padding: 0 !important;
        border-radius: 8px !important;
        overflow: hidden !important;
    }

    .book-card-item .card-cover-wrap {
        height: 160px !important;
        margin-bottom: 0 !important;
        border-radius: 0 !important;
    }

    .book-card-item .card-cover-wrap .book-cover-img {
        max-height: 135px !important;
        max-width: 90% !important;
    }

    .book-card-item .card-info-wrap {
        padding: 12px 10px !important;
    }

    .book-card-item .card-badge {
        gap: 4px !important;
        margin-bottom: 4px !important;
    }

    .book-card-item .card-badge .label-book {
        font-size: 10px !important;
        padding: 2px 6px !important;
        line-height: 1.2 !important;
    }

    .article .section .book-card-item .card-title,
    .book-card-item .card-title {
        font-size: 13px !important;
        line-height: 1.35 !important;
        height: 35px !important;
        min-height: 35px !important;
        max-height: 35px !important;
        margin: 0 0 4px 0 !important;
        -webkit-line-clamp: 2 !important;
    }

    .book-card-item .card-author {
        font-size: 11px !important;
        margin: 0 0 6px 0 !important;
    }

    .book-card-item .card-more-info {
        margin: 0 0 8px 0 !important;
    }

    .book-card-item .card-more-info a {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }

    .book-card-item .card-footer-wrap {
        padding-top: 8px !important;
        border-top: 1px dashed #dbe3eb !important;
        flex-direction: column !important;
        min-width: 0 !important;
        gap: 0 !important;
    }

    .book-card-item .price-box {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        margin-bottom: 8px !important;
    }

    .book-card-item .price-origin {
        font-size: 11px !important;
        text-decoration: line-through !important;
    }

    .book-card-item .price-member {
        font-size: 12px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .book-card-item .price-member strong {
        font-size: 15px !important;
    }

    .book-card-item .price-member .discount-rate {
        font-size: 10px !important;
        padding: 1px 5px !important;
        margin-left: 0 !important;
    }

    .book-card-item .action-box {
        gap: 6px !important;
        width: 100% !important;
    }

    .book-card-item .btn-cart,
    .book-card-item .btn-buy,
    .book-card-item .badge-soldout {
        height: 32px !important;
        font-size: 12px !important;
    }

    .book-card-item .btn-cart-icon {
        width: 32px !important;
        height: 32px !important;
        font-size: 12px !important;
        flex-shrink: 0 !important;
    }

    .book-list-area table.grid tr th:nth-child(6),
    .book-list-area table.grid tr td:nth-child(6) {
        display: none;
    }

    /* 도서 필터 모바일 반응형 */
    .book-filter-container {
        margin: 10px 0 20px !important;
        gap: 12px !important;
    }

    .book-filter-container .filter-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }


    .book-filter-container .filter-content {
        width: 100% !important;
        padding-bottom: 0 !important;
        overflow: visible !important;
    }

    /* 1행: 도서 유형 세그먼트 버튼 (앱 스타일 4등분 균등 분할) */
    .book-filter-container .book-list-btn,
    .book-list-btn {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .book-filter-container .book-list-btn .btn,
    .book-list-btn .btn {
        flex: 1 1 0 !important;
        width: 25% !important;
        min-width: 0 !important;
        padding: 9px 4px 7px !important;
        height: auto !important;
        line-height: normal !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .book-filter-container .book-list-btn .btn i,
    .book-list-btn .btn i {
        font-size: 16px !important;
        margin-bottom: 3px !important;
    }

    .book-filter-container .book-list-btn .btn span,
    .book-list-btn .btn span {
        font-size: 11px !important;
        font-weight: 600 !important;
        letter-spacing: -0.5px !important;
        white-space: nowrap !important;
    }

    /* 2행: 도서 분야 알약 탭 (가로 스크롤 스와이프 칩 스타일) */
    .book-filter-container .book-list-tab,
    .book-list-tab {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        gap: 6px !important;
        margin: 0 -16px !important;
        padding: 4px 16px 8px 16px !important;
        width: calc(100% + 32px) !important;
        box-sizing: border-box !important;
    }

    .book-filter-container .book-list-tab::-webkit-scrollbar,
    .book-list-tab::-webkit-scrollbar {
        display: none !important;
    }

    .book-filter-container .book-list-tab > li,
    .book-list-tab > li {
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .book-filter-container .book-list-tab > li > a,
    .book-list-tab > li > a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        padding: 6px 14px !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        border-radius: 20px !important;
        line-height: 1.3 !important;
        box-sizing: border-box !important;
    }

    .book-info-area .book-info .btn-purchase .btn.btn-success,
    .book-info-area .book-info .btn-purchase .btn.btn-primary {
        margin-top:10px;
        width: 100%;
    }
    /*******************************************************************
	    게시판
    ******************************************************************* */
    .board {
    }

    /* 게시판 목록 반응형 */
    .tb-notice.tb-list {
        min-width: 580px;
        width: 100%;
        border-top: 2px solid #1e60d5;
    }

    .board .col1 {
        width: 60px;
        font-size: 13px;
    }

    .board .col2 {
        width: auto;
        font-size: 14px;
        padding-left: 12px;
    }

    .board .col2 a.link {
        font-size: 14px;
    }

    .board .col3 {
        width: 55px;
    }

    .board .col4 {
        width: 65px;
        font-size: 12px;
    }

    .board .col5 {
        width: 95px;
        font-size: 12px;
    }

    /*******************************************************************
	    게시판 상세 반응형
    ******************************************************************* */
    .board-detail {
    }

    #board_view.tb-notice {
        width: 100%;
        min-width: 0;
        border-top: 2px solid #1e60d5;
    }

    #board_view th {
        width: 85px;
        min-width: 80px;
        padding: 12px 8px;
        font-size: 13px;
    }

    #board_view td {
        padding: 12px 14px;
        font-size: 13px;
    }

    #board_view tbody tr:first-child td {
        padding: 15px 14px;
        font-size: 16px;
    }
    .section.order-check-area  #board_view tbody  .form-control {
      width: auto;
    }
    #board_view .link {
        padding: 6px 12px;
        font-size: 12px;
    }

    .article.board-detail .section .table td.article-text,
    #board_view td.article-text {
        padding: 24px 16px !important;
        font-size: 14px;
        min-height: 180px;
    }

    /* view-page list area */
    .list-button-area {
        flex-direction: column;
        gap: 16px;
        margin-top: 25px;
    }

    .list-area {
        width: 100%;
        float: none;
        margin: 0;
    }

    .list-button-area .prev-list,
    .list-button-area .next-list {
        width: 100%;
        min-height: 44px;
    }

    .list-button-area .title {
        width: 78px;
        min-width: 78px;
        min-height: 44px;
        padding: 0 8px;
        font-size: 12px;
    }

    .list-button-area .con-text {
        padding: 0 12px;
        font-size: 13px;
    }

    .list-btn-area {
        float: none;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .list-btn-area a,
    .list-btn-area a.button {
        width: 100%;
        min-width: 130px;
        min-height: 42px;
        height: 42px;
        padding: 0 24px;
        font-size: 14px;
        border-radius: 8px;
    }

    .paging {
        gap: 4px;
        margin: 25px 0 15px;
    }

    .paging > .current,
    .paging > a {
        min-width: 32px;
        height: 32px;
        padding: 0 8px;
        font-size: 13px;
        border-radius: 6px;
    }

    /*******************************************************************
	비회원주문조회
******************************************************************* */
    .order-check-area .col1 {
        width: 10%;
        text-align: center;
    }

    .order-check-area .col2 {
        width: 10%;
        text-align: center;
    }

    .order-check-area .col3 {
        width: 15%;
        text-align: center;
    }

    .order-check-area .col4 {
        width: 20%;
        text-align: center;
    }

    .order-check-area .col5 {
        width: 10%;
        text-align: center;
    }

    .order-check-area .col6 {
        width: 10%;
        text-align: center;
    }

    .order-check-area .col7 {
        width: auto;
        text-align: center;
    }

    .terms-area {
    }

        .terms-area .terms {
            overflow-y: scroll;
            width: 100%;
            height: 200px;
            margin: 0 0 10px;
            padding: 20px;
            border: 1px solid #dfdfdf;
            border-radius: 4px;
        }

    .captcha {
        width: 300px;
        margin: 5px 0 0;
    }

    /*******************************************************************
    도서 상세정보
******************************************************************* */
    .book-detail-area {
        padding-bottom: 30px;
        border-bottom: 1px solid #dfdfdf;
    }

    /* book-info-area */
    .book-info-area {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
        width: 100%;
    }

        .book-info-area .book-cover {
            flex: none;
            width: 100%;
            margin: 0;
            padding: 30px 20px;
            border-radius: 8px;
        }

            .book-info-area .book-cover img {
                display: block;
                max-width: 180px;
                width: 100%;
                height: auto;
                margin: 0 auto;
            }

        .book-info-area .book-info {
            margin: 0 ;
        }

            .book-info-area .book-info .book-title {
                font-size: 20px;
            }

            .book-info-area .book-info .book-info-box {
                padding: 16px 18px;
                margin-bottom: 0px;
            }

                .book-info-area .book-info .book-info-box ul li {
                    font-size: 14px;
                }

                .book-info-area .book-info .book-info-box ul li .info-tit {
                    flex: 0 0 70px;
                    font-size: 13px;
                }

                .book-info-area .book-info .book-info-box ul li .info-val {
                    font-size: 14px;
                }

            .book-info-area .book-info .btn-purchase {
                margin: 0;
            }

    /* book-detail */
    .book-detail {
        float: none;
        width: 100%;
        margin: 30px 0 25px;
        padding-left: 0;
    }

    .book-detail-tabs .tab-btn {
        height: 46px;
        font-size: 15px;
        padding: 0 10px;
    }

    .book-detail-contents .book-tab-pane {
        padding: 25px 10px 30px;
    }

    .book-detail .detail-body-text {
        font-size: 14px;
        line-height: 1.75;
    }

    .book-detail .detail-body-text strong,
    .book-detail .detail-body-text b {
        font-size: 15px;
    }

    .book-detail .detail-empty-text {
        padding: 40px 15px;
        font-size: 14px;
    }

    .book-detail .detail-empty-text i {
        font-size: 24px;
        margin-bottom: 10px;
    }

    /*delivery-fee-box*/
    .delivery-fee p {
        margin: 0 0 10px !important;
        padding-left: 15px;
        text-indent: -15px;
    }

    .delivery-fee-box {
        background-color: #effcfe;
        border: 1px solid #d6f6fc;
    }

        .delivery-fee-box p {
            margin: 0 0 10px !important;
            padding-left: 15px;
            text-indent: -15px;
        }

        .delivery-fee-box table {
            background-color: #fff;
        }
}

/* phone ~ 360px */
@media screen and (max-width: 360px) {
    /****************************************
    01. common style
    ****************************************/
    .contents {
        padding: 0 12px 40px !important;
    }

    .book-card-item .card-cover-wrap {
        height: 135px !important;
        margin-bottom: 0 !important;
    }

    .book-card-item .card-cover-wrap .book-cover-img {
        max-height: 115px !important;
    }

    .book-card-item .card-info-wrap {
        padding: 0px !important;
    }
    .book-card-item.horizontal-item .card-title a {
         overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    }
    .article .section .book-card-item .card-title,
    .book-card-item .card-title {
        font-size: 12px !important;
        height: auto !important;
        min-height: auto !important;
        max-height: auto !important;
        line-height: 1.3 !important;
       
    }

    .book-card-item .price-member strong {
        font-size: 13px !important;
    }

    .book-card-item .btn-cart,
    .book-card-item .btn-buy,
    .book-card-item .badge-soldout {
        height: 30px !important;
        font-size: 11px !important;
    }

    .book-card-item .btn-cart-icon {
        width: 30px !important;
        height: 30px !important;
        font-size: 12px !important;
    }

    .book-filter-container .book-list-btn .btn,
    .book-list-btn .btn {
        padding: 8px 2px 6px !important;
    }

    .book-filter-container .book-list-btn .btn span,
    .book-list-btn .btn span {
        font-size: 10px !important;
    }
}

@media print {
}

/* ==========================================================================
   도서 목록 가로형 레이아웃 반응형 (bookList)
   ========================================================================== */

/* 태블릿 (1024px 이하) */
@media screen and (max-width: 1024px) {
    .book-list-layout {
        gap: 24px;
    }

    .book-filter-container {
        width: 200px;
    }

    .book-card-item.horizontal-item {
        gap: 18px;
    }

    .book-card-item.horizontal-item .card-action-wrap {
        width: 130px;
    }
}

/* 태블릿 세로 및 소형 화면 (991px 이하, 단 561px 이상 태블릿에서는 하위 카테고리 항상 노출) */
@media screen and (max-width: 991px) {
    .book-list-layout {
        flex-direction: column !important;
        gap: 20px !important;
        margin: 10px 0 30px !important;
    }

    .book-filter-container {
        width: 100% !important;
        background-color: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 14px 16px;
        box-sizing: border-box;
    }

    .book-category-nav .cat-list {
        gap: 6px;
    }

    .book-category-nav .cat-btn {
        padding: 10px 14px;
        font-size: 14.5px;
    }

    .book-category-nav .subcat-container {
        display: block !important;
        padding: 12px 14px;
        background-color: #f8fafc;
        border-left: 3px solid #0046ad;
        border-radius: 0 0 6px 6px;
        margin-top: 4px;
    }

    .book-category-nav .subcat-list {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
        gap: 10px 14px !important;
    }

    .book-list-main-wrap {
        width: 100% !important;
    }
}

/* 모바일 (560px 이하) : 클릭된 .cat-item.active 시에만 subcat-container 노출 및 모바일 도서 카드 적용 */
@media screen and (max-width: 560px) {
    .book-filter-container {
        padding: 10px 12px !important;
    }

    .book-category-nav .cat-btn {
        padding: 9px 12px !important;
        font-size: 14px !important;
    }

    /* 모바일(560px 이하)에서만 활성화된 대분류(.cat-item.active)의 하위 카테고리만 노출 */
    .book-category-nav .subcat-container {
        display: none !important;
        padding: 10px 12px !important;
    }

    .book-category-nav .cat-item.active .subcat-container {
        display: block !important;
    }

    .book-category-nav .subcat-list {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px 10px !important;
    }

    .book-category-nav .filter-text {
        font-size: 12.5px !important;
    }

    .book-category-nav .filter-count {
        font-size: 11px !important;
    }

    /* 상단 헤더 영역 */
    .book-list-main-header {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: flex-end !important;
        padding-bottom: 12px !important;
        margin-bottom: 10px !important;
        gap: 8px !important;
    }

    .book-list-main-header .list-title-wrap {
        display: flex !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    .book-list-main-header .current-cat-title {
        font-size: 18px !important;
        line-height: 1.2 !important;
    }

    .book-list-main-header .subcat-badge-wrap {
        gap: 4px !important;
    }

    .book-list-main-header .subcat-badge {
        font-size: 11px !important;
        padding: 2px 7px !important;
    }

    .book-list-main-header .search-keyword-badge {
        font-size: 11px !important;
        padding: 2px 7px !important;
    }

    .book-list-main-header .list-count-wrap {
        font-size: 12.5px !important;
        flex-shrink: 0 !important;
    }

    /* 도서 카드 리스트 (모바일: 표지 상단 중앙 정렬 + 정보 중단 좌측 정렬 + 하단 5:5 버튼) */
    .book-card-item.horizontal-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 24px 0 !important;
        gap: 16px !important;
    }

    .book-card-item.horizontal-item .card-cover-wrap {
        width: 100% !important;
        height: auto !important;
        padding: 10px 0 16px 0 !important;
        flex-shrink: 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .book-card-item.horizontal-item .card-cover-wrap .cover-link {
        width: 116px !important;
        height: 164px !important;
        display: block !important;
    }

    .book-card-item.horizontal-item .card-info-wrap {
        width: 100% !important;
        flex: none !important;
        min-width: 0 !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 0 !important;
    }

    .book-card-item.horizontal-item .card-badge-row {
        margin-bottom: 8px !important;
    }

    .book-card-item.horizontal-item .card-badge-category {
        font-size: 12px !important;
        padding: 3px 10px !important;
    }

    .book-card-item.horizontal-item .card-title {
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.4 !important;
        margin: 0 0 6px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-align: left !important;
    }

    .book-card-item.horizontal-item .card-title a {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: #1e293b !important;
    }

    .book-card-item.horizontal-item .card-meta {
        font-size: 13px !important;
        color: #64748b !important;
        margin: 0 0 10px 0 !important;
        line-height: 1.4 !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        text-align: left !important;
    }

    .book-card-item.horizontal-item .card-price-area {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 3px !important;
        margin-bottom: 4px !important;
    }

    .book-card-item.horizontal-item .price-origin-line {
        font-size: 12.5px !important;
        gap: 5px !important;
    }

    .book-card-item.horizontal-item .price-final {
        font-size: 18px !important;
        font-weight: 800 !important;
    }

    .book-card-item.horizontal-item .card-action-wrap {
        width: 100% !important;
        flex: none !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 10px !important;
        margin-top: 8px !important;
    }

    .book-card-item.horizontal-item .btn-buy,
    .book-card-item.horizontal-item .btn-cart,
    .book-card-item.horizontal-item .badge-soldout {
        flex: 1 1 0 !important;
        width: auto !important;
        height: 42px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
    }
    .paging a, .paging strong, .paging span {
        min-width: 28px !important;
        height: 28px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        margin: 0 1px !important;
    }
}

/* 초소형 모바일 (380px 이하) */
@media screen and (max-width: 380px) {
    .book-category-nav .subcat-list {
        grid-template-columns: 1fr !important;
        gap: 6px 0 !important;
    }

    .book-card-item.horizontal-item .card-cover-wrap .cover-link {
        width: 108px !important;
        height: 154px !important;
    }

    .book-card-item.horizontal-item .card-title {
        font-size: 15px !important;
    }

    .book-card-item.horizontal-item .card-meta {
        font-size: 12px !important;
    }

    .book-card-item.horizontal-item .price-final {
        font-size: 17px !important;
    }

    .book-card-item.horizontal-item .btn-buy,
    .book-card-item.horizontal-item .btn-cart,
    .book-card-item.horizontal-item .badge-soldout {
        height: 40px !important;
        font-size: 13.5px !important;
    }
}