/* 피시 화면 크기 (992px 이상) */
@media (min-width: 901px) {
    .search_btn{
        display: none;
    }
    .icon_menu{
        display: none;
    }
    .top_head_logo{
        display: none;
    }
    .join_login_btn{
        display: none;
    }
    .m_bottom_tel{
        display: none;
    }

    .toon_list .row > div.list_item:first-child,
    .toon_list .row > div.list_item:nth-child(6n+1) { /* 6번째 요소가 첫 번째 요소가 되는 경우 고려 */
        padding-left: 0;
    }

    .toon_list .row > div.list_item:last-child,
    .toon_list .row > div.list_item:nth-child(6n) { /* 6번째 요소가 마지막 요소가 되는 경우 고려 */
        padding-right: 0;
    }

    .toon_list .row > div.list_item{
        padding-left:4px;
        padding-right:4px;

    }

    .view_bottom  i{
        font-size: 1.4rem;
    }
}


/* 모바일 화면 크기 (767px 이하) */
@media (max-width: 900px) {
    /* 여기에 모바일에 대한 스타일을 추가하세요 */
    .wrapper{
        padding-bottom: 100px;
    }
    .container_full{
        padding:0px 2px;
        margin-top:50px;
    }
    .pc_w{
        max-width: 100%;
    }
    .main-header{
        border-bottom: 0px;
        height: 145px;
        min-height: 145px;
    }
    .head_con_box{
        max-width: 100%;
        padding:16px;
        font-size: 1.5rem;
        display: flex;
        align-items: center;
        justify-content:space-between;
    }

    .icon_menu{
        order:1;
        width: 33px;
    }
    .icon_menu a {
        color:#000;
    }
    .top_head_logo{
        order:2;
        text-align: center;
    }
    .user_btn{
        order:3;
        padding-left: 0px;
        margin: 0px;
    }
    .head_con_box  a.icon_btn{
        width:30px;
        font-size: 1.5rem;
    }
    .head_con_box  a.icon_btn > span{
        display: none;
    }
    .join_btn {
        display: none;
    }
    .head_con_box {

    }
    .top_head_logo img{
        width: 50%;
    }


    .search_tab{
        display: block;
    }
    .head_con_search{
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        align-content: stretch;
        flex-wrap: wrap;
        flex-direction: row;
        width: 100%;
    }
    .head_con_search >div{
        width: 95%;
        margin-top:14px;

    }
    .notice_tab{
        display:block;

    }
    .head_con_search >div.notice_tab div{
        font-size:0.9rem;
        text-align: center;
        padding-left:0px;
    }
    .head_con_search >div.notice_tab div > i{

        margin-right: 5px;
    }


    .head_con_2{
        width: 270px;
        height: 100vh;
        background-color: #fff;
        position: absolute;
        left: -270px;
        transition: all 0.5s ease;
    }
    .head_con_menu {
        width: 270px;
        height: 100vh;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: flex-start;
        background-color: #f5f5f5;
    }

    .head_con_menu .menu {
        display: flex;
        flex-direction: column;
        margin-top:20px;
    }

    .head_con_menu .menu div{
        margin-left: 15px;
    }

    .head_con_menu .logo{
        display: none;
        padding: 10px;
    }

    .show_m_menu{
        z-index: 99;
        left: 0px;
        transition: all 0.5s ease;
    }


    .head_con_menu .logo img {
        max-width: 50%;
        margin: 0 auto;
        display: block;
    }

    .head_con_menu .menu > div > a{
        background: none;
    }
    .join_login_btn{
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top:35px;
    }

    .join_login_btn a{
        border: 0px;
        background-color: #f1d45f;
        padding: 10px 0px;
        text-align: center;
        border-radius: 7px;
        padding:7px 22px;
    }
    .join_login_btn a:first-child{
        margin-right: 15px;
    }
    .join_login_btn a >i{
        position: relative;
        top: -2px;
    }

    .type_category{
        padding-top: 0px;
        width: 100%;
        height: auto;
    }
    .type_category > div{
        height: 50px;
    }
    .type_category > div:first-child{
        border-left: 0px;
    }
    .type_category > div:last-child{
        border-right: 0px;
    }
    .type_category > div > a{
        font-size: 1.2rem;
    }
    .day_category1{
        display: flex;
        flex-direction: row;
        align-content: space-around;
        justify-content: space-between;
    }
    .day_category{
        padding-top: 18px;
        width: 100%;

    }

    .day_category > button{
        width: auto;
        height: 40px;
        font-size: 1rem;
        margin: 0px;
        padding: 5px 10px;
    }
    .list_search {
        width: 100%;

        padding: 0px 10px;
    }

    .toon_list{
        width: 100%;
        font-size: 0.8em;
        /* padding: 0px 5px; */
    }

    .toon_list .row > div.list_item{
        padding-left:2px;
        padding-right:2px;

    }

    .item_content button{
        padding:7px 10px;
        width: auto;
    }
    .list_item > div.item_box > p.item_title{
        padding:8px 2px;
        overflow: hidden; /* 넘치는 부분을 숨기기 */
        white-space: nowrap; /* 강제로 줄바꿈 방지 */
        text-overflow: ellipsis;
    }
    .item_category >p{
        overflow: hidden; /* 넘치는 부분을 숨기기 */
        white-space: nowrap; /* 강제로 줄바꿈 방지 */
        text-overflow: ellipsis;
    }
    .item_category{
        width: 100%;
    }
    .list_item > div.item_box {
        height: auto;
    }

    .content_detail {
        margin-top:0px;
    }

    .toon_sum_img > img{
        max-height: 240px;
        min-height: auto;

    }
    .contetn_data{
        max-width: 100%;
        text-align: center;

    }
    .contetn_data > h2{
        text-align: center;
        font-size: 2rem;
        margin-bottom: 10px;
    }
    .contetn_data > span{
        font-size: 1.2rem;
        border-radius: 2px;
    }
    .contetn_data > p{

    }
    .sum_img_btn{
        text-align:center;
    }
    .list_h_btn{
        display: none;
    }
    .tit_bar {
        width: 100%;
        justify-content: center;
        margin-top:0px;
    }
    .toon_book_mark{
        display: none;
    }
    .toon_view{
        padding: 15px 0px;
    }

    .view_bottom{
        width: 100%;
        position: relative;
        height: 60px;
    }

    .next_pre{
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .view_list_btn{
        position: absolute;
        top:70px;
        width: 100%;
        text-align: center;
    }
    .view_list_btn button{
        padding:10px 35px;
        font-size: 1rem;
    }
    .footer{
        height: 60px;
        background-image: url("/public/assets/img/bottom_tel.png") ; /* 이미지 경로를 적절히 변경하세요 */
    background-size: 100% 100%; /* 가로 및 세로 크기를 100%로 설정 */
    background-repeat: no-repeat; /* 이미지 반복을 방지 */
    }
    .m_bottom_tel{
        font-size: 2rem;
        line-height: 60px;
        text-align: right;
        padding-right: 10px;
        color: #f9e562;
    }

    .footer > div.logo_box{
        display: none;
    }
    .footer > div.bottom_menu{
        display: none;
    }

    .notice_head_bar {
        height: 54px;
        justify-content: space-between;
    }

    .notice_reg_date{
        display: none;
    }
    .notice_list .card-body tbody tr td:first-child{
        padding-left: 5px;
    }
    .page_link{
        width: 20px;
        height: 20px;
        line-height: 20px;
    }
    .hn_pagination > ul{
        padding-left: 0px;
    }
    .notice_view_tit{
        height: 50px;

    }
    .notice_view_tit h1{
        font-size: 1.2rem;
    }

    .notice_tail{
        flex-direction: column;
    }

    .notice_tail a{
        margin-top:20px;
        border-bottom: 1px solid #bcbcbc;
    }
}